/**
 * Webkit specific way of ellipsis last line of a text that is too long to fit its container.
 * Non-webkit browsers will have overflow hidden applied, just not showing the ellipsis.
 */
/**
 * Mixin to use ellipsis for texts if they go beyond their allowed width
 * @param max-width
 */
/**
 * Mixin to generate button states
 * @param color
 * @param bg-color
 * @param border-color
 * @param hover
 * @param active
 */
/**
 * Mixin to use ellipsis for texts if they go beyond their allowed width
 * @param max-width
 */
#base-header, .btn, a.btn, .map-thumb, .loggedout-usp-container .geoleaderboards .map, #serverbrowser-filters, #serverbrowser-filters .box-content, #soldierportraits-container #soldierimage {
  -webkit-user-select: none;
  -moz-user-select: -moz-none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none; }

#base-header .game-bar .dropdown-bar .soldierstats-box .rank .points, #base-header .game-bar .dropdown-bar .soldierstats-box .rank .experience {
  -webkit-user-select: all;
  -moz-user-select: all;
  -ms-user-select: all;
  -o-user-select: all;
  user-select: all; }

#base-header .game-bar .grid-container:before, #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .base-login-bottom:before, .dialog.emblemselect .emblem-items:before, .dialog.soldierselect .soldier-list > li > a:before, #serverbrowser-filters .box-content:before, #server-page > header:before, #server-page-settings dl:before, #server-page-slot-info dl:before, body #base-container #user .profile-info:before, .forum-search-results-item-title:before, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-poster-name:before, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-tags:before, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-poster-enlisted:before, .base-clear:before, .share-widgets:before, #base-header .game-bar .grid-container:after, #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .base-login-bottom:after, .dialog.emblemselect .emblem-items:after, .dialog.soldierselect .soldier-list > li > a:after, #serverbrowser-filters .box-content:after, #server-page > header:after, #server-page-settings dl:after, #server-page-slot-info dl:after, body #base-container #user .profile-info:after, .forum-search-results-item-title:after, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-poster-name:after, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-tags:after, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-poster-enlisted:after, .base-clear:after, .share-widgets:after {
  display: table;
  content: "";
  line-height: 0; }
#base-header .game-bar .grid-container:after, #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .base-login-bottom:after, .dialog.emblemselect .emblem-items:after, .dialog.soldierselect .soldier-list > li > a:after, #serverbrowser-filters .box-content:after, #server-page > header:after, #server-page-settings dl:after, #server-page-slot-info dl:after, body #base-container #user .profile-info:after, .forum-search-results-item-title:after, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-poster-name:after, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-tags:after, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-poster-enlisted:after, .base-clear:after, .share-widgets:after {
  clear: both; }

#serverbrowser %focus-box > .server-filter, #serverbrowser %focus-box > .server-filter, #serverbrowser %focus-box-expandable.collapsed > .collapsed.server-filter {
  background-color: rgba(7, 7, 7, 0.6); }

#serverbrowser %focus-box > .server-filter, #serverbrowser %focus-box-expandable.collapsed > .collapsed.server-filter {
  background-color: rgba(7, 7, 7, 0.5); }

#serverbrowser .server-filter {
  color: #fff;
  position: relative; }
  #serverbrowser %focus-box-expandable > .server-filter {
    padding: 0 16px;
    line-height: 36px; }
  #serverbrowser %focus-box-expandable > .server-filter {
    padding: 16px; }
  #serverbrowser %focus-box-expandable > .server-filter {
    padding: 0 16px; }

#serverbrowser .server-filter.collapsed > header {
  cursor: pointer; }
#serverbrowser .server-filter.collapsed > section, #serverbrowser .server-filter.collapsed > footer {
  display: none; }

body {
  font-family: Arial, sans-serif;
  font-size: 16px; }

h1, h2, h3, h4, h5, h6 {
  margin-bottom: 16px;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }

h1, h2, h3 {
  text-transform: uppercase; }

h1 {
  font-size: 36px;
  line-height: 40px;
  margin-bottom: 8px; }

h2 {
  font-size: 36px;
  line-height: 40px;
  margin-bottom: 8px; }

h3 {
  font-size: 33px;
  line-height: 40px;
  margin-bottom: 8px; }

h4 {
  font-size: 29px;
  line-height: 32px; }

h5 {
  font-size: 23px;
  line-height: 32px;
  margin-bottom: 8px;
  text-transform: uppercase; }

h6 {
  font-size: 18px;
  line-height: 24px;
  text-transform: uppercase; }

strong, b {
  font-weight: bold; }

em, i {
  font-style: italic; }

a {
  text-decoration: none; }
  a:hover {
    text-decoration: underline; }

small {
  font-size: 70%; }

.header-dropdown-active #base-header .game-bar .dropdown-bar {
  box-shadow: 0 0 30px 10px rgba(185, 243, 255, 0.15); }

#base-ajax-loading {
  display: none;
  position: relative;
  top: 3px;
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out; }

.ajax-loading #base-ajax-loading {
  display: inline-block; }
.ajax-loading #base-notices {
  opacity: 0; }

.base-premium #community-bar .game-logo .logo.game-bf3 {
  background-image: url(../base/bf3/header-logo-premium.png);
  width: 170px;
  background-size: 121px;
  background-position: 50% 50%; }

body.premium #base-header .grid-container.premium-bg {
  background: url(../base/bf4/overlay-p.png) no-repeat;
  background-position: 0 -48px;
  width: 992px;
  height: 48px;
  position: relative; }
body.premium #base-header .premium-bg.fade {
  background-position: 0 0;
  -webkit-transition: background-position 1s linear 1s;
  -moz-transition: background-position 1s linear 1s;
  transition: background-position 1s linear 1s; }

body.show-section-select #community-bar .dropdown-bar {
  height: 192px; }
  body.show-section-select #community-bar .dropdown-bar .game-box {
    opacity: 1; }
body.show-section-select #community-bar .outerarrow .arrow {
  margin-top: -9px;
  border-top-color: transparent;
  border-bottom-color: #fff;
  opacity: 0.75; }
body.show-section-select #base-container:before {
  height: 304px; }

#community-bar {
  position: relative;
  background: rgba(8, 13, 16, 0.98); }
  #community-bar .game-logo {
    position: relative;
    z-index: 1;
    display: inline-block; }
    #community-bar .game-logo .ajax-loading-wrapper {
      position: absolute;
      top: 9px;
      right: 100%;
      margin-right: 10px;
      z-index: 0;
      cursor: default; }
    #community-bar .game-logo .logo {
      display: block;
      width: 175px;
      height: 48px;
      background-position: 0 50%;
      background-repeat: no-repeat;
      background-size: 165px; }
      #community-bar .game-logo .logo.game-bf3 {
        background-image: url(../base/bf3/bf3-logo-m.png); }
      #community-bar .game-logo .logo.game-bf4 {
        background-image: url(../base/bf4/header-logo-bf4.png);
        width: 170px; }
        #community-bar .game-logo .logo.game-bf4.premium {
          background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/logos/logo-bf4p-73ab578c.png);
          background-size: 121px;
          background-position: 50% 50%; }
      #community-bar .game-logo .logo.cte {
        background-image: url(../base/bf4/header-logo-bf4-cte.png); }
      #community-bar .game-logo .logo.game-mohw {
        background-image: url(//d34ymitoc1pg7m.cloudfront.net/mohw/mohw-logo-9c9d7e49.png); }
  #community-bar .battlelog-logo {
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    border-right: 0; }
    #community-bar .battlelog-logo .logo {
      display: block;
      width: 95px;
      height: 48px;
      background: url(//d34ymitoc1pg7m.cloudfront.net/common/battlelog-logo-082bd9ee.png) 0 50% no-repeat;
      background-size: contain; }
  #community-bar .user-tools {
    position: absolute;
    top: 0;
    right: 0;
    text-align: left; }
  #community-bar .dropdown-bar {
    background: #151718 url(../common/community-dropdown-bg.png);
    overflow: hidden;
    position: relative;
    height: 0;
    text-align: left;
    -webkit-transition: height 0.2s ease-out;
    -moz-transition: height 0.2s ease-out;
    transition: height 0.2s ease-out; }
    #community-bar .dropdown-bar .grid-container {
      padding: 16px 0;
      text-align: center; }
      #community-bar .dropdown-bar .grid-container .row {
        display: inline-block; }
    #community-bar .dropdown-bar .base-game-selector .game-box {
      opacity: 0; }
  #community-bar .inner-wrapper {
    height: 48px;
    z-index: 3;
    position: relative;
    text-align: center; }
  #community-bar .outerarrow {
    position: absolute;
    top: 20%;
    left: 100%;
    width: 20px;
    height: 30px;
    cursor: pointer; }
    #community-bar .outerarrow .arrow {
      position: absolute;
      top: 50%;
      left: 0%;
      margin-top: -3px;
      margin-left: 4px;
      border: 6px solid transparent;
      border-top-color: #fff;
      opacity: 0.3;
      cursor: pointer;
      -webkit-transition: all 0.1s ease-out, opacity 0;
      -moz-transition: all 0.1s ease-out, opacity 0;
      transition: all 0.1s ease-out, opacity 0;
      -webkit-transform-origin: center 50%;
      -moz-transform-origin: center 50%;
      -ms-transform-origin: center 50%;
      -o-transform-origin: center 50%;
      transform-origin: center 50%; }
      #community-bar .outerarrow .arrow:hover {
        opacity: 0.75; }

#base-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1000; }
  #base-header .alert {
    background: black;
    text-align: center;
    border-bottom: 1px solid #353a3f;
    margin-bottom: 0; }
  #base-header .grid-container {
    position: relative;
    width: 992px; }
  #base-header .game-bar {
    position: relative; }
    #base-header .game-bar .inner-wrapper {
      height: 47px;
      position: relative;
      border-top: 1px solid #353a3f;
      z-index: 1;
      background-image: -webkit-linear-gradient(top, rgba(19, 22, 26, 0.98) 0%, rgba(19, 22, 26, 0.92) 100%);
      background-image: linear-gradient(to bottom, rgba(19, 22, 26, 0.98) 0%, rgba(19, 22, 26, 0.92) 100%); }
    #base-header .game-bar .main-nav {
      position: relative;
      z-index: 2;
      float: left; }
      #base-header .game-bar .main-nav .base-section-menu {
        float: left; }
        #base-header .game-bar .main-nav .base-section-menu > li {
          float: left;
          border-right: 1px solid #353a3f;
          position: relative; }
          #base-header .game-bar .main-nav .base-section-menu > li:first-child {
            border-left: 1px solid #353a3f; }
          #base-header .game-bar .main-nav .base-section-menu > li.nav-home a {
            padding-left: 0; }
            #base-header .game-bar .main-nav .base-section-menu > li.nav-home a .icon-home {
              position: relative;
              top: 2px;
              opacity: 0.75;
              -webkit-transition: opacity 0.1s ease-out;
              -moz-transition: opacity 0.1s ease-out;
              transition: opacity 0.1s ease-out; }
            #base-header .game-bar .main-nav .base-section-menu > li.nav-home a:hover .icon-home {
              opacity: 1; }
          #base-header .game-bar .main-nav .base-section-menu > li.has-dropdown {
            cursor: pointer; }
            #base-header .game-bar .main-nav .base-section-menu > li.has-dropdown:after {
              content: "";
              z-index: 1;
              display: block;
              position: absolute;
              right: 2px;
              bottom: 2px;
              border: 4px solid #fff;
              border-top-color: transparent;
              border-left-color: transparent;
              opacity: 0.1; }
          #base-header .game-bar .main-nav .base-section-menu > li.soldier .profile-soldier-image {
            position: absolute;
            bottom: 0;
            left: 0;
            z-index: 2; }
          #base-header .game-bar .main-nav .base-section-menu > li.soldier .header-soldier-rank {
            height: 64px;
            position: absolute;
            top: -7px;
            left: 28px;
            z-index: 2;
            -webkit-transform: scale(0.75);
            -moz-transform: scale(0.75);
            -ms-transform: scale(0.75);
            -o-transform: scale(0.75);
            transform: scale(0.75); }
          #base-header .game-bar .main-nav .base-section-menu > li.soldier .icon-platform {
            position: absolute;
            bottom: 4px;
            left: 81px;
            z-index: 100;
            line-height: 11px; }
          #base-header .game-bar .main-nav .base-section-menu > li.soldier > a {
            padding-left: 80px; }
          #base-header .game-bar .main-nav .base-section-menu > li.active:not(.nav-home) > a, #base-header .game-bar .main-nav .base-section-menu > li.active:not(.nav-home) > a:hover, #base-header .game-bar .main-nav .base-section-menu > li.active:not(.nav-home).focused > a {
            color: #000;
            background-color: #fff;
            cursor: default;
            background-image: -webkit-linear-gradient(top, #d7d7d7 0%, rgba(215, 215, 215, 0) 50%);
            background-image: linear-gradient(to bottom, #d7d7d7 0%, rgba(215, 215, 215, 0) 50%);
            box-shadow: inset 0 10px 15px 0 rgba(0, 0, 0, 0.2), 0 0 7px 1px rgba(224, 244, 248, 0.3); }
          #base-header .game-bar .main-nav .base-section-menu > li.active.has-dropdown:after {
            border: 4px solid rgba(0, 0, 0, 0.3);
            border-top-color: transparent;
            border-left-color: transparent; }
          #base-header .game-bar .main-nav .base-section-menu > li:not(.nav-home) > a:hover, #base-header .game-bar .main-nav .base-section-menu > li:not(.nav-home).focused > a {
            color: #fff;
            background: #0a0e14; }
          #base-header .game-bar .main-nav .base-section-menu > li > div.feature-disabled {
            cursor: default; }
          #base-header .game-bar .main-nav .base-section-menu > li > div.feature-disabled, #base-header .game-bar .main-nav .base-section-menu > li > a {
            position: relative;
            display: block;
            color: #d5dde5;
            font-size: 16px;
            height: 47px;
            line-height: 47px;
            padding: 0 10px;
            text-decoration: none;
            text-transform: uppercase;
            font-family: Purista, sans-serif;
            font-style: normal;
            font-weight: 400; }
    #base-header .game-bar .dropdown-bar {
      padding: 0;
      position: relative;
      color: #fff;
      z-index: 0;
      overflow: hidden;
      height: 0;
      background-color: #0a0e14;
      -webkit-transition: height 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
      -moz-transition: height 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
      transition: height 0.2s ease-in-out, box-shadow 0.2s ease-in-out; }
      #base-header .game-bar .dropdown-bar a:not(.btn) {
        color: #fff;
        text-decoration: none; }
        #base-header .game-bar .dropdown-bar a:not(.btn):hover {
          text-decoration: underline; }
        #base-header .game-bar .dropdown-bar a:not(.btn)[disabled] {
          color: #666; }
          #base-header .game-bar .dropdown-bar a:not(.btn)[disabled] i {
            opacity: 0.75; }
      #base-header .game-bar .dropdown-bar > .dropdown-content {
        opacity: 0;
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        padding-top: 16px;
        padding-bottom: 10px;
        z-index: 0;
        min-height: 190px;
        -webkit-transition: opacity 0.1s ease-out;
        -moz-transition: opacity 0.1s ease-out;
        transition: opacity 0.1s ease-out; }
        #base-header .game-bar .dropdown-bar > .dropdown-content.active {
          opacity: 1;
          z-index: 1; }
        #base-header .game-bar .dropdown-bar > .dropdown-content .recommended {
          height: 190px; }
      #base-header .game-bar .dropdown-bar section > header {
        cursor: default;
        margin-bottom: 6px; }
        #base-header .game-bar .dropdown-bar section > header h1 {
          font-size: 13px;
          color: #898989;
          line-height: 22px;
          text-transform: uppercase;
          font-family: Purista, sans-serif;
          font-style: normal;
          font-weight: 400; }
        #base-header .game-bar .dropdown-bar section > header + .dropdown-menu {
          margin-top: -11px; }
      #base-header .game-bar .dropdown-bar .dropdown-menu {
        position: relative; }
        #base-header .game-bar .dropdown-bar .dropdown-menu > a, #base-header .game-bar .dropdown-bar .dropdown-menu div {
          display: block;
          margin: 0 0 7px 0;
          padding: 1px 0 0 16px;
          line-height: 31px;
          text-transform: uppercase;
          text-decoration: none;
          font-size: 19px;
          font-family: Purista, sans-serif;
          font-style: normal;
          font-weight: 400;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box; }
          #base-header .game-bar .dropdown-bar .dropdown-menu > a [class^="icon-"], #base-header .game-bar .dropdown-bar .dropdown-menu > a [class*=" icon-"], #base-header .game-bar .dropdown-bar .dropdown-menu div [class^="icon-"], #base-header .game-bar .dropdown-bar .dropdown-menu div [class*=" icon-"] {
            margin-right: 6px; }
        #base-header .game-bar .dropdown-bar .dropdown-menu > a:hover {
          background-color: rgba(255, 255, 255, 0.1);
          text-decoration: none; }
      #base-header .game-bar .dropdown-bar .recommended-servers {
        margin-top: 4px; }
        #base-header .game-bar .dropdown-bar .recommended-servers a:hover {
          text-decoration: none; }
        #base-header .game-bar .dropdown-bar .recommended-servers > header {
          margin-bottom: 8px; }
        #base-header .game-bar .dropdown-bar .recommended-servers:hover > .server {
          opacity: 0.75; }
        #base-header .game-bar .dropdown-bar .recommended-servers > .server {
          height: 42px;
          padding-left: 72px;
          position: relative;
          color: #fff;
          font-size: 12px;
          line-height: 14px;
          margin-bottom: 10px;
          cursor: pointer; }
          #base-header .game-bar .dropdown-bar .recommended-servers > .server:hover {
            opacity: 1; }
          #base-header .game-bar .dropdown-bar .recommended-servers > .server .map-thumb {
            position: absolute;
            top: 0;
            left: 0; }
          #base-header .game-bar .dropdown-bar .recommended-servers > .server .server-name {
            width: 100%;
            font-weight: bold;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            position: relative;
            top: -2px;
            padding-bottom: 1px; }
          #base-header .game-bar .dropdown-bar .recommended-servers > .server .details {
            color: #a8a8a8;
            white-space: nowrap;
            padding-bottom: 2px; }
            #base-header .game-bar .dropdown-bar .recommended-servers > .server .details > span {
              float: left;
              margin-right: 8px;
              overflow: hidden;
              width: 255px;
              text-overflow: ellipsis; }
          #base-header .game-bar .dropdown-bar .recommended-servers > .server .recommend-reason {
            color: #a8a8a8;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap; }
            #base-header .game-bar .dropdown-bar .recommended-servers > .server .recommend-reason em {
              color: #fff;
              font-style: italic; }
      #base-header .game-bar .dropdown-bar .platoons-list:hover .platoon-item {
        opacity: 0.75; }
      #base-header .game-bar .dropdown-bar .platoons-list .platoon-item {
        min-height: 26px;
        margin-bottom: 10px; }
        #base-header .game-bar .dropdown-bar .platoons-list .platoon-item:hover {
          opacity: 1; }
        #base-header .game-bar .dropdown-bar .platoons-list .platoon-item.platoon-invite > a {
          padding-right: 72px; }
        #base-header .game-bar .dropdown-bar .platoons-list .platoon-item.platoon-invite .invite-response-actions {
          width: 62px;
          position: absolute;
          top: 0;
          right: 0; }
          #base-header .game-bar .dropdown-bar .platoons-list .platoon-item.platoon-invite .invite-response-actions .response-button {
            width: 25px;
            height: 26px;
            float: left;
            margin-left: 6px;
            border: 0;
            cursor: pointer; }
          #base-header .game-bar .dropdown-bar .platoons-list .platoon-item.platoon-invite .invite-response-actions.accept {
            background: url(../comcenter/friend-accept-button.png); }
          #base-header .game-bar .dropdown-bar .platoons-list .platoon-item.platoon-invite .invite-response-actions.deny {
            background: url(../comcenter/friend-deny-button.png); }
        #base-header .game-bar .dropdown-bar .platoons-list .platoon-item > a {
          display: block;
          height: 26px;
          padding: 0 0 0 36px;
          position: relative;
          color: #353535;
          font-size: 12px;
          cursor: pointer;
          color: #a8a8a8;
          text-decoration: none; }
        #base-header .game-bar .dropdown-bar .platoons-list .platoon-item .primary-indicator {
          position: absolute;
          top: 10px;
          left: -14px;
          width: 11px;
          height: 8px;
          background: url(../base/shared/check.png) no-repeat; }
        #base-header .game-bar .dropdown-bar .platoons-list .platoon-item .emblem {
          width: 26px;
          height: 26px;
          position: absolute;
          left: 0;
          top: 0; }
        #base-header .game-bar .dropdown-bar .platoons-list .platoon-item .name {
          line-height: 1;
          padding: 1px 0;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          position: relative;
          top: -2px; }
      #base-header .game-bar .dropdown-bar .soldierstats-box {
        color: #fff;
        position: relative;
        min-height: 190px; }
        #base-header .game-bar .dropdown-bar .soldierstats-box .loadticker-wrapper {
          text-align: center;
          padding: 50px 0; }
        #base-header .game-bar .dropdown-bar .soldierstats-box .soldier-switch {
          position: absolute;
          bottom: 0;
          left: 0;
          font-size: 12px;
          z-index: 1;
          color: #ececec;
          cursor: pointer; }
        #base-header .game-bar .dropdown-bar .soldierstats-box header {
          position: relative;
          z-index: 1; }
          #base-header .game-bar .dropdown-bar .soldierstats-box header .name {
            font-size: 23px;
            margin-bottom: 10px;
            font-family: Purista, sans-serif;
            font-style: normal;
            font-weight: 600; }
          #base-header .game-bar .dropdown-bar .soldierstats-box header .platform {
            margin-bottom: 10px; }
            #base-header .game-bar .dropdown-bar .soldierstats-box header .platform:before, #base-header .game-bar .dropdown-bar .soldierstats-box header .platform:after {
              display: table;
              content: "";
              line-height: 0; }
            #base-header .game-bar .dropdown-bar .soldierstats-box header .platform:after {
              clear: both; }
        #base-header .game-bar .dropdown-bar .soldierstats-box .rank {
          min-height: 64px;
          position: relative;
          z-index: 1; }
          #base-header .game-bar .dropdown-bar .soldierstats-box .rank:before, #base-header .game-bar .dropdown-bar .soldierstats-box .rank:after {
            display: table;
            content: "";
            line-height: 0; }
          #base-header .game-bar .dropdown-bar .soldierstats-box .rank:after {
            clear: both; }
          #base-header .game-bar .dropdown-bar .soldierstats-box .rank .rank-progress {
            padding-left: 64px; }
          #base-header .game-bar .dropdown-bar .soldierstats-box .rank .insignia {
            position: absolute;
            top: 0;
            left: 0; }
          #base-header .game-bar .dropdown-bar .soldierstats-box .rank .title {
            font-size: 14px;
            margin-bottom: 2px;
            font-family: Purista, sans-serif;
            font-style: normal;
            font-weight: 400; }
          #base-header .game-bar .dropdown-bar .soldierstats-box .rank .progress-bar {
            width: 150px; }
          #base-header .game-bar .dropdown-bar .soldierstats-box .rank .points, #base-header .game-bar .dropdown-bar .soldierstats-box .rank .experience {
            font-size: 12px;
            color: #fff;
            float: left; }
            #base-header .game-bar .dropdown-bar .soldierstats-box .rank .points em, #base-header .game-bar .dropdown-bar .soldierstats-box .rank .experience em {
              color: #fff;
              font-style: normal; }
      #base-header .game-bar .dropdown-bar .soldierstats-pic-container {
        position: absolute;
        top: 30px;
        right: 0;
        bottom: 0;
        z-index: -1; }
      #base-header .game-bar .dropdown-bar .padder {
        padding-right: 16px; }
  #base-header .sticky-bar {
    position: relative;
    z-index: -3; }

#facebook-bar {
  position: relative;
  background: #000;
  background: rgba(0, 0, 0, 0.8);
  height: 168px;
  color: #fff;
  padding-top: 16px;
  margin-top: 96px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }
  #facebook-bar a.avatar {
    width: 136px;
    height: 136px;
    float: left;
    margin-right: 16px; }
  #facebook-bar .buy {
    float: right;
    position: relative; }
    #facebook-bar .buy i.box-art {
      display: block;
      background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/bf4-boxshots-e75e198f.png);
      background-size: 100%;
      width: 140px;
      height: 119px;
      margin-left: 30px;
      margin-bottom: 8px; }
    #facebook-bar .buy a.btn {
      position: absolute;
      right: 4px;
      bottom: -10px; }
  #facebook-bar .info-content {
    color: #a8a8a8;
    font-size: 14px; }
    #facebook-bar .info-content h3 {
      color: #F5AA25;
      font-size: 24px;
      text-transform: none;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600;
      margin: 0; }
    #facebook-bar .info-content p {
      margin-bottom: 12px; }
      #facebook-bar .info-content p a.learn-more {
        color: #fff; }

#base-header-secondary-nav {
  float: right;
  position: relative;
  z-index: 1;
  line-height: 47px; }
  #base-header-secondary-nav > ul {
    overflow: hidden; }
    #base-header-secondary-nav > ul > li {
      float: left;
      padding-left: 10px; }
      #base-header-secondary-nav > ul > li.active a {
        color: #fff;
        opacity: 1; }
      #base-header-secondary-nav > ul > li > a {
        display: block;
        color: #dbdbdb;
        opacity: 0.75;
        font-size: 14px;
        text-transform: uppercase;
        text-decoration: none;
        font-family: Purista, sans-serif;
        font-style: normal;
        font-weight: 400; }
        #base-header-secondary-nav > ul > li > a.premium-link {
          color: #E4B744; }
        #base-header-secondary-nav > ul > li > a.premium {
          overflow: hidden;
          text-indent: 100%;
          color: #cda51d;
          background: url(../base/bf4/logo-p-s.png) no-repeat 0 17px;
          width: 82px; }
        #base-header-secondary-nav > ul > li > a:hover {
          opacity: 1; }

#base-header-user-tools .header-signup-link {
  font-size: 12px;
  color: #fff;
  height: 13px;
  line-height: 13px;
  border-left: 1px solid #3c4042;
  padding-left: 5px;
  margin-top: 10px;
  float: left;
  position: relative;
  left: -1px; }
#base-header-user-tools .header-login-button {
  height: 47px;
  float: left; }
  #base-header-user-tools .header-login-button.popover-visible {
    background: #0a0e14; }
    #base-header-user-tools .header-login-button.popover-visible .login-btn {
      background: transparent;
      cursor: default; }
      #base-header-user-tools .header-login-button.popover-visible .login-btn:hover {
        background: transparent; }
  #base-header-user-tools .header-login-button .login-btn {
    line-height: 33px;
    background: transparent;
    border: 0;
    padding: 0 5px;
    color: #fff;
    font-size: 12px;
    cursor: pointer;
    margin: 0;
    outline: 0; }
    #base-header-user-tools .header-login-button .login-btn:hover span {
      text-decoration: underline; }
#base-header-user-tools .base-login-remember {
  font-size: 12px; }
#base-header-user-tools .tools > li {
  float: left; }
  #base-header-user-tools .tools > li:last-child .tools-item {
    right: 0;
    z-index: 0; }
#base-header-user-tools .tools .tools-item {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 36px;
  min-width: 36px;
  position: relative;
  right: -1px;
  z-index: 1;
  margin: 6px 0 0 0; }
  #base-header-user-tools .tools .tools-item.comcenter-toggle {
    margin-left: 8px; }
  #base-header-user-tools .tools .tools-item + .popover {
    -webkit-transform: translateY(13px);
    -moz-transform: translateY(13px);
    -ms-transform: translateY(13px);
    -o-transform: translateY(13px);
    transform: translateY(13px); }
    #base-header-user-tools .tools .tools-item + .popover .gamemanager-state.fail, #base-header-user-tools .tools .tools-item + .popover .gamemanager-state.success {
      background: transparent; }
  #base-header-user-tools .tools .tools-item:hover {
    background: #191c21; }
  #base-header-user-tools .tools .tools-item.popover-visible {
    background: #353a3f;
    z-index: 2; }
  #base-header-user-tools .tools .tools-item.pro {
    cursor: pointer;
    right: 0;
    z-index: 0; }
    #base-header-user-tools .tools .tools-item.pro.popover-visible .username, #base-header-user-tools .tools .tools-item.pro:hover .username {
      color: #fff; }
    #base-header-user-tools .tools .tools-item.pro .avatar {
      float: right;
      position: relative; }
    #base-header-user-tools .tools .tools-item.pro .username {
      padding: 0 12px 0 11px;
      font-size: 12px;
      color: #d5dde5;
      line-height: 32px;
      display: inline-block;
      margin: 2px 0 0 0; }
      #base-header-user-tools .tools .tools-item.pro .username:hover {
        text-decoration: none; }
#base-header-user-tools .tools .log {
  cursor: pointer; }
  #base-header-user-tools .tools .log:after {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    background: url(../base/shared/header-icons.png) top left no-repeat;
    opacity: 0.3;
    position: relative;
    top: 3px;
    left: 3px; }
    @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
      #base-header-user-tools .tools .log:after {
        background-image: url("../base/shared/header-icons@2x.png");
        background-size: 240px 60px; } }
  #base-header-user-tools .tools .log:hover:after, #base-header-user-tools .tools .log:active:after, #base-header-user-tools .tools .log.popover-visible:after {
    opacity: 1; }
  #base-header-user-tools .tools .log.notifications:after {
    background-position: -90px 0; }
  #base-header-user-tools .tools .log.notifications.highlight:after {
    background-position: -90px -30px; }
  #base-header-user-tools .tools .log.missions:after {
    background-position: -120px 0; }
  #base-header-user-tools .tools .log.missions.highlight:after {
    background-position: -120px -30px; }
  #base-header-user-tools .tools .log.reports:after {
    background-position: -60px 0; }
  #base-header-user-tools .tools .log.reports.highlight:after {
    background-position: -60px -30px; }
  #base-header-user-tools .tools .log.matches:after {
    background-position: -30px 0; }
  #base-header-user-tools .tools .log.matches.highlight:after {
    background-position: -30px -30px; }
  #base-header-user-tools .tools .log.gamemanager:after {
    background-position: 0 0; }
  #base-header-user-tools .tools .log.gamemanager.highlight:after {
    background-position: 0 -30px; }
  #base-header-user-tools .tools .log.gamemanager {
    display: none; }
  #base-header-user-tools .tools .log.gamemanager .base-section-menu-dropdown {
    width: 304px;
    line-height: 16px; }
  #base-header-user-tools .tools .log.highlight {
    position: relative; }
    #base-header-user-tools .tools .log.highlight:after {
      opacity: 1;
      background-position-y: -30px; }
  #base-header-user-tools .tools .log > div[data-bind-toggle=popover] {
    width: 100%;
    height: 100%; }
#base-header-user-tools .tools.login-tools .tools-item, #base-header-user-tools .tools.login-tools .tools-item:hover {
  background: transparent; }
#base-header-user-tools .tools.login-tools .popover {
  padding: 0;
  color: #a8a8a8; }
  #base-header-user-tools .tools.login-tools .popover input.base-login-input {
    color: #ffffff;
    padding-left: 0; }
#base-header-user-tools .tools .popover {
  width: 272px;
  background: #0a0e14;
  margin-top: -10px;
  z-index: -1;
  -webkit-filter: none;
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
  border: 0;
  margin-top: -11px; }
  #base-header-user-tools .tools .popover .popover-callout {
    display: none; }
  #base-header-user-tools .tools .popover .popover-body {
    color: #a8a8a8;
    border-top: 0; }
    #base-header-user-tools .tools .popover .popover-body li {
      font-weight: bold; }
      #base-header-user-tools .tools .popover .popover-body li:hover > a {
        background: rgba(255, 255, 255, 0.1); }
      #base-header-user-tools .tools .popover .popover-body li:first-child > a {
        border-top: none; }
      #base-header-user-tools .tools .popover .popover-body li > a {
        color: #a8a8a8;
        border-top: 1px solid #302f33; }
        #base-header-user-tools .tools .popover .popover-body li > a#toggleInvisible span {
          padding-right: 25px; }
    #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown a {
      position: relative;
      padding-left: 36px;
      color: #fff;
      font-weight: normal; }
      #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown a [class^="icon-"], #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown a [class*=" icon-"] {
        position: absolute;
        top: 50%;
        left: 12px;
        margin-top: -7px; }
    #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown li.facebook i.fb-icon {
      position: absolute;
      top: 50%;
      left: 12px;
      margin-top: -7px;
      background: url(../base/shared/icon-fb-share.png);
      width: 14px;
      height: 14px; }
    #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown li.facebook div.switch {
      margin: 0;
      position: absolute;
      top: 9px;
      right: 10px; }
    #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown .signout a {
      color: #a8a8a8; }
    #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown .invisible-mode {
      height: 25px;
      line-height: 25px;
      padding-left: 35px;
      padding-right: 10px;
      font-size: 12px; }
      #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown .invisible-mode #goVisible {
        cursor: pointer;
        position: relative;
        float: right;
        top: 6px; }
    #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown .profile-progression .completion-progression {
      padding: 12px 14px 5px;
      background-color: rgba(72, 140, 90, 0.8);
      font-size: 12px; }
      #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown .profile-progression .completion-progression > div {
        margin-top: 4px; }
        #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown .profile-progression .completion-progression > div span, #base-header-user-tools .tools .popover .popover-body .header-profile-dropdown .profile-progression .completion-progression > div a {
          font-size: 12px;
          color: #fff;
          padding-left: 0; }
    #base-header-user-tools .tools .popover .popover-body .admin a {
      padding-left: 36px;
      font-weight: normal; }
    #base-header-user-tools .tools .popover .popover-body .profile-icon-box {
      width: 36px;
      height: 36px;
      float: left;
      text-align: center; }
      #base-header-user-tools .tools .popover .popover-body .profile-icon-box .profile-icon {
        width: 11px;
        height: 11px;
        display: block;
        position: relative;
        top: 18px;
        margin: auto;
        background: transparent url(../common/profilehead.png) no-repeat 100% 50%; }
      #base-header-user-tools .tools .popover .popover-body .profile-icon-box .invis-icon {
        width: 11px;
        height: 11px;
        display: block;
        position: relative;
        top: 13px;
        margin: auto;
        background: transparent url(../common/profileinvis.png) no-repeat 100% 50%; }
    #base-header-user-tools .tools .popover .popover-body li.profile > a {
      color: #fff;
      line-height: 16px;
      padding-top: 6px;
      padding-bottom: 6px;
      font-weight: normal; }
    #base-header-user-tools .tools .popover .popover-body li.profile span {
      display: block;
      color: #8a8a8a;
      font-size: 11px; }
    #base-header-user-tools .tools .popover .popover-body li.signout > a {
      text-align: right;
      padding-right: 10px;
      font-weight: normal; }
  #base-header-user-tools .tools .popover .base-header-login-dropdown {
    padding: 0; }
    #base-header-user-tools .tools .popover .base-header-login-dropdown #base-login-ajax-loader {
      position: absolute;
      margin: 0;
      display: none;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.6);
      top: 0;
      left: 0;
      z-index: 2; }
      #base-header-user-tools .tools .popover .base-header-login-dropdown #base-login-ajax-loader .loader.small {
        display: block;
        margin: 0 auto;
        position: relative;
        top: 50%;
        margin-top: -16px; }
    #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container {
      padding: 16px; }
      #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .originconnect-status {
        display: none; }
      #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .base-login-bottom {
        min-height: 28px;
        margin-top: 16px; }
        #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .base-login-bottom .base-login-rmbrme {
          float: left;
          margin-top: 3px;
          margin-left: 0;
          font-size: 12px; }
        #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .base-login-bottom label {
          position: relative;
          top: -1px; }
        #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .base-login-bottom .base-login-submitbutton {
          margin: 0; }
      #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .base-login-popup-account-actions {
        width: 272px;
        padding-top: 6px;
        padding-bottom: 6px; }
      #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .common-form-input-wrapper.base-login-input-wrapper {
        margin-bottom: 10px;
        position: relative;
        background: #fff;
        line-height: 13px; }
        #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .common-form-input-wrapper.base-login-input-wrapper:last-child {
          margin-bottom: 0; }
        #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .common-form-input-wrapper.base-login-input-wrapper input {
          width: 100%;
          box-sizing: border-box;
          border: 0;
          background: transparent;
          font-size: 12px;
          color: #000;
          padding: 8px; }
        #base-header-user-tools .tools .popover .base-header-login-dropdown .form-container .common-form-input-wrapper.base-login-input-wrapper span {
          top: 9px;
          left: 11px;
          font-size: 12px;
          color: #8a8a8a; }
    #base-header-user-tools .tools .popover .base-header-login-dropdown footer {
      border-top: 1px solid rgba(255, 255, 255, 0.1);
      text-align: center; }
      #base-header-user-tools .tools .popover .base-header-login-dropdown footer a {
        text-transform: none;
        color: #a8a8a8;
        line-height: 22px;
        font-size: 12px; }

.base-game-selector:before, .base-game-selector:after {
  display: table;
  content: "";
  line-height: 0; }
.base-game-selector:after {
  clear: both; }
.base-game-selector .game-box {
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;
  width: 236px;
  display: block;
  height: 160px;
  background-position: center center;
  position: relative;
  overflow: hidden;
  text-align: center;
  text-decoration: none; }
  .base-game-selector .game-box .game-box-text {
    line-height: 160px;
    background: rgba(0, 0, 0, 0.35); }
    .base-game-selector .game-box .game-box-text:hover {
      background: rgba(0, 0, 0, 0.7); }
  .base-game-selector .game-box .game-box-image {
    display: block;
    width: 320px;
    margin: 0;
    border: 0;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -160px;
    z-index: 0; }
  .base-game-selector .game-box.game-mohw .game-box-image {
    margin-left: -118px; }
  .base-game-selector .game-box.active {
    cursor: default; }
    .base-game-selector .game-box.active:before {
      content: "";
      display: block;
      position: absolute;
      z-index: 2;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      box-shadow: inset 0 0 0 4px #ff9900; }
  .base-game-selector .game-box:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(7, 7, 7, 0.5);
    -webkit-transition: opacity 0.1s ease-out;
    -moz-transition: opacity 0.1s ease-out;
    transition: opacity 0.1s ease-out; }
  .base-game-selector .game-box:hover:after, .base-game-selector .game-box.active:after {
    opacity: 0;
    -webkit-transition: opacity 0 ease-out;
    -moz-transition: opacity 0 ease-out;
    transition: opacity 0 ease-out; }

body, h1, h2, h3, h4, h5, a {
  color: #fff; }

.uppercase {
  text-transform: uppercase; }

.lowercase {
  text-transform: lowercase; }

html:not(.is-touch) {
  height: 100%; }
  html:not(.is-touch) body, html:not(.is-touch) #viewport, html:not(.is-touch) #base-page {
    height: 100%; }

body {
  background-color: #230d0d; }

body.is-cte {
  background: #313131 none !important; }
  body.is-cte.is-loggedout #receipt-container {
    margin-bottom: 10px; }
  body.is-cte.is-loggedout #base-container:before {
    height: 48px; }
  body.is-cte .loggedout-usp-container {
    height: 710px; }

#base-background {
  background: #230d0d url(//d34ymitoc1pg7m.cloudfront.net/bf4/backgrounds/bg-video-overlay-dcc29baf.jpg) 50% 0 no-repeat;
  text-align: center; }
  #base-background .video-container {
    height: 960px;
    width: 1920px;
    position: absolute;
    left: 50%;
    top: 0;
    margin-left: -960px;
    opacity: 0;
    overflow: hidden;
    -webkit-transition: opacity 8s ease;
    -moz-transition: opacity 8s ease;
    transition: opacity 8s ease; }
    #base-background .video-container.show {
      opacity: 1; }
    #base-background .video-container video {
      outline: none; }

#esnlaunch_container {
  position: fixed;
  top: -1px;
  left: -1px; }

#base-container {
  min-height: 100%; }

#base-container {
  position: relative;
  width: 992px;
  margin: 0 auto; }

body.battlescreen #base-container {
  width: auto;
  padding: 0;
  margin: 0; }

h1.primary, #base-container .content > section > header h1.wrappable, .forum-start-title h1, .forum-page-title h1, .missions-details .header h1.wrappable, .devblog .header h1, #battlereport > header h1, #base-container .content > section > header h1 {
  position: relative;
  display: inline-block;
  line-height: 39px;
  margin: 0 0 16px 0;
  padding: 0 16px;
  padding-top: 1px;
  letter-spacing: -1px;
  color: #fff;
  background-color: rgba(7, 7, 7, 0.6);
  /*color: transparent;
    background: -webkit-linear-gradient(#ffffff 0%, #d6d8d8 100%);
    background-size: 2px 2px;
    background: -o-linear-gradient(transparent, transparent);
    -webkit-background-clip: text;

    &:before {
        position: absolute;
        z-index: -1;
        content: "";
        left: 0;
        right: 0;
        top: 2px;
        bottom: 2px;
        background-color: $color-dark-transparent;
    }*/ }

#base-container .content > section > header h1.wrappable, .forum-start-title h1, .forum-page-title h1, .missions-details .header h1.wrappable, .devblog .header h1 {
  position: relative;
  display: inline;
  white-space: pre-wrap;
  text-transform: none;
  padding-left: 0;
  left: 16px;
  top: 1px;
  background: rgba(7, 7, 7, 0.6);
  line-height: 44px; }
  #base-container .content > section > header h1.wrappable:before, .forum-start-title h1:before, .forum-page-title h1:before, .missions-details .header h1.wrappable:before, .devblog .header h1:before {
    position: absolute;
    display: block;
    content: "";
    left: -16px;
    top: 0px;
    bottom: 0px;
    width: 16px;
    background: rgba(7, 7, 7, 0.6); }

table.table-hover > tbody > tr:hover td {
  background-color: rgba(7, 7, 7, 0.6); }

/*table.table-striped {
    > tbody > tr:nth-child(odd) {
        background: rgba(0, 0, 0, 0.35);
    }

    &.table-hover {
        > tbody > tr:nth-child(odd) {
            &:hover {
                background-color: rgba(0, 0, 0, 0.5);
            }
        }
    }
}*/
html:not(.is-ios) table.table th, html:not(.is-ios) table.table td {
  background-clip: padding-box; }

table.table {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-collapse: collapse;
  border-spacing: 0;
  margin-bottom: 16px;
  width: 100%; }
  table.table .center {
    text-align: center; }
  table.table .middle {
    vertical-align: middle; }
  table.table .right {
    text-align: right; }
  table.table .valign {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%); }
  table.table th, table.table td {
    white-space: nowrap;
    padding: 10px;
    position: relative;
    color: #fff;
    background-color: rgba(7, 7, 7, 0.5);
    border: 1px solid transparent;
    border-left: 0;
    border-top: 0; }
    table.table th:last-child, table.table th.no-separator, table.table td:last-child, table.table td.no-separator {
      box-shadow: none;
      border-right: 0; }
    table.table th.less-padding, table.table td.less-padding {
      padding: 0 6px; }
    table.table th.center, table.table td.center {
      text-align: center; }
    table.table th.right, table.table td.right {
      text-align: right; }
    table.table th .pos-rel, table.table td .pos-rel {
      position: relative;
      width: 100%;
      height: 100%; }
  table.table tbody tr:last-child td, table.table tbody tr:last-child th, table.table tfoot tr:last-child td, table.table tfoot tr:last-child th {
    border-bottom: 0; }
  table.table > thead th, table.table > tfoot th {
    background-color: rgba(7, 7, 7, 0.8);
    color: #a8a8a8;
    text-transform: uppercase;
    font-size: 11px; }
  table.table > tfoot th {
    line-height: 25px; }
  table.table > tbody > tr {
    position: relative; }
    table.table > tbody > tr.active {
      box-shadow: 0 0 7px 0 #e0f4f8; }
      table.table > tbody > tr.active > td {
        color: #353535;
        color: #000;
        background-color: #fff;
        background-image: -webkit-linear-gradient(top, #d7d7d7 0%, rgba(215, 215, 215, 0) 50%);
        background-image: linear-gradient(to bottom, #d7d7d7 0%, rgba(215, 215, 215, 0) 50%); }
        table.table > tbody > tr.active > td.no-separator {
          box-shadow: none; }
        table.table > tbody > tr.active > td:last-child {
          box-shadow: none; }

table.table-leaderboard {
  font-size: 12px; }
  table.table-leaderboard.table-hover tbody tr {
    cursor: pointer; }
  table.table-leaderboard .position, table.table-leaderboard .score {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400; }
  table.table-leaderboard .position {
    text-align: center;
    font-size: 16px;
    width: 28px; }
  table.table-leaderboard .me .position {
    background: #ebca2f;
    color: #000; }
  table.table-leaderboard .score {
    text-align: right;
    font-size: 16px; }
  table.table-leaderboard .user {
    font-family: Arial, sans-serif;
    font-size: 12px;
    color: #8a8a8a;
    line-height: 14px; }
    table.table-leaderboard .user a {
      font-weight: bold;
      color: #fff; }
  table.table-leaderboard .avatar {
    float: left;
    margin: -5px 0;
    margin-right: 8px; }
  table.table-leaderboard .common-playername-personaname {
    font-weight: bold;
    margin-bottom: 2px; }
    table.table-leaderboard .common-playername-personaname.solo {
      margin-top: 7px; }
  table.table-leaderboard .common-playername-username {
    color: #a8a8a8; }
  table.table-leaderboard .played-rounds {
    color: #808080;
    width: 50px; }
    table.table-leaderboard .played-rounds .dots {
      margin-top: -4px; }
      table.table-leaderboard .played-rounds .dots > li {
        width: 7px;
        height: 7px;
        border: 1px solid #717171;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        display: inline-block; }
        table.table-leaderboard .played-rounds .dots > li.active {
          background: #fff;
          border: none; }
  table.table-leaderboard .status {
    color: #a8a8a8;
    text-transform: uppercase; }
  table.table-leaderboard .show-more {
    cursor: pointer;
    line-height: 8px; }
    table.table-leaderboard .show-more td:after {
      position: relative;
      display: inline;
      content: "▪ ▪ ▪"; }

#footer-wrapper {
  position: absolute;
  height: 207px;
  bottom: -207px;
  clear: both;
  background: transparent;
  z-index: 0;
  color: #a8a8a8; }

.footer-mirror {
  width: 1024px;
  height: 54px;
  position: absolute;
  bottom: -54px;
  left: 1px;
  /*background: url(../footer/footer-bg-mirror.png) 50% -1px no-repeat;*/ }

.base-content-full-width .footer-mirror {
  display: none; }
.base-content-full-width #footer {
  padding-bottom: 54px;
  background: transparent; }

#footer-social {
  min-height: 201px;
  padding-top: 21px;
  margin-bottom: 22px; }
  #footer-social #footer-social {
    padding-top: 30px; }
  #footer-social .footer-box {
    width: 280px;
    min-height: 201px;
    float: left;
    margin: 0 50px 0 0;
    position: relative; }
    #footer-social .footer-box .footer-box-header {
      color: #ffffff;
      /*text-shadow: 0 0 1px #b7b7b7;*/
      font-family: Tahoma, Arial, sans-serif;
      font-weight: bold;
      font-size: 11px;
      margin-bottom: 16px;
      text-transform: uppercase; }

.base-content-full-width #footer-social .footer-box .footer-box-header {
  color: #353535; }

#footer-social .footer-box.last {
  margin-right: 0;
  width: 330px; }

#footer-poll .footer-poll-title {
  padding: 0 0 6px;
  font-size: 12px;
  line-height: 1.3;
  color: #ffffff; }

.base-content-full-width #footer-poll .footer-poll-title {
  color: #353535; }

#footer-poll .footer-poll-novoting {
  font-weight: bold;
  font-size: 14px;
  line-height: 1.2; }
#footer-poll .footer-poll-voted-spacer {
  height: 20px; }
#footer-poll .footer-poll-totalvotes, #footer-poll .footer-poll-notloggedin {
  margin: 10px 0;
  font-size: 12px;
  color: #8a8a8a; }

.base-content-full-width #footer-poll .footer-poll-totalvotes, .base-content-full-width #footer-poll .footer-poll-notloggedin {
  color: #353535; }

#footer-poll .footer-poll-notloggedin {
  float: right;
  font-size: 10px;
  margin-top: 14px; }
  #footer-poll .footer-poll-notloggedin a {
    font-size: 10px; }
#footer-poll .footer-poll-totalvotes {
  margin-top: 15px;
  font-size: 11px;
  float: left; }
#footer-poll #footer-poll-form {
  margin: 0; }

#footer-poll-form input[type=submit] {
  margin: 10px 0 0 0; }
#footer-poll-form .footer-poll-answer {
  clear: both;
  margin: 2px 0;
  color: #a5a5a5; }

.base-content-full-width #footer-poll-form .footer-poll-answer {
  color: #606060; }

#footer-poll-form .footer-poll-answer .pollanswer-thumb {
  display: inline-block;
  width: 260px;
  height: 163px;
  background-size: contain;
  background-repeat: no-repeat;
  margin-top: 8px;
  cursor: pointer; }
#footer-poll-form .footer-poll-answer.on label span {
  background-position: 0 -10px; }
#footer-poll-form .footer-poll-answer .checkboxicon {
  background: url(../main/poll-checkbox.png);
  width: 10px;
  height: 10px;
  top: 1px;
  margin-right: 5px;
  position: relative;
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 0 0;
  cursor: pointer; }
#footer-poll-form .footer-poll-answer.footer-poll-answer-images .checkboxicon {
  top: -72px; }
#footer-poll-form .footer-poll-answer input {
  display: none; }
#footer-poll-form .footer-poll-answer label {
  font-size: 12px;
  font-weight: normal; }
#footer-poll-form .footer-pollanswer-radio {
  margin: 8px 10px 0 0; }

#footer-poll .footer-poll-answertitle {
  overflow: hidden;
  margin: 6px 0;
  color: #a5a5a5; }

#footer-poll .progress-bar {
  margin-bottom: 0px; }

.base-content-full-width #footer-poll .footer-poll-answertitle {
  color: #353535; }

#footer-poll-surface .footer-poll-novoting .pollanswer-thumb {
  display: inline-block;
  width: 290px;
  height: 180px;
  background-size: contain;
  background-repeat: no-repeat;
  margin-top: 8px;
  cursor: pointer;
  margin-bottom: 10px; }

#footer-poll .footer-poll-answertitle div.text-answer {
  float: left;
  font-size: 12px;
  font-weight: normal;
  width: 238px; }
#footer-poll .footer-poll-answertitle div.answer-percentage {
  float: right;
  clear: right;
  width: 40px;
  font-size: 12px;
  text-align: right;
  font-weight: normal; }

#footer-blog-list .footer-list-item {
  margin-bottom: 14px; }
#footer-blog-list .footer-item-title {
  line-height: 20px;
  font-size: 12px; }
#footer-blog-list .footer-item-info {
  color: #8a8a8a;
  font-size: 11px;
  margin-top: 4px; }
  #footer-blog-list .footer-item-info a {
    font-weight: normal;
    font-size: 11px; }
  #footer-blog-list .footer-item-info .footer-item-info-created {
    margin-right: 10px; }

#footer-twitter .main-officialupdate-item {
  padding: 0 0 4px;
  border-bottom: none; }
#footer-twitter .main-officialupdate-item-content {
  padding-top: 1px;
  font-size: 12px;
  line-height: 19px;
  padding-bottom: 6px;
  color: #a5a5a5; }
#footer-twitter .main-officialupdate-item-subcontent {
  padding-top: 2px;
  color: #8a8a8a; }

#footer-highlighted .footer-box {
  margin-top: 13px;
  float: left;
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  height: 128px; }
  #footer-highlighted .footer-box a {
    display: inline-block;
    vertical-align: middle; }
    #footer-highlighted .footer-box a + a {
      margin-left: 10px; }
  #footer-highlighted .footer-box#footer-frostbite, #footer-highlighted .footer-box#footer-esn {
    margin-left: 62px; }
  #footer-highlighted .footer-box#footer-ratings {
    float: right; }

#footer-diceea a {
  margin-top: 27px; }
  #footer-diceea a + a {
    margin-left: 20px !important; }

#footer-frostbite a {
  margin-top: 20px; }

#footer-esn a {
  margin-top: 26px;
  vertical-align: bottom !important; }

#footer-ratings .footer-rating-image a {
  margin-top: 15px;
  margin-left: 0; }

#footer-change-lang {
  font-size: 11px;
  font-weight: normal;
  text-decoration: none; }

#footer-allrightsreserved {
  max-width: 860px;
  font-size: 11px;
  line-height: 14px;
  color: #a8a8a8; }

#footer-allrightsreserved .sep, #footer-links .sep {
  padding-left: 4px;
  padding-right: 4px;
  color: rgba(255, 255, 255, 0.3); }

#footer-links {
  margin-top: 8px;
  line-height: 16px; }
  #footer-links li {
    display: inline;
    padding: 0 5px;
    padding-left: 0;
    padding-right: 5px;
    font-size: 11px; }
    #footer-links li:first-child {
      border-left: 0;
      padding-left: 0; }
    #footer-links li a {
      color: #a8a8a8;
      font-weight: normal;
      text-decoration: none;
      margin-right: 5px; }
      #footer-links li a:hover {
        text-decoration: underline; }
      #footer-links li a.footer-link-highlighted {
        font-weight: bold; }

#footer-highlighted .footer-box-header {
  color: #8a8a8a;
  font-family: Tahoma, Arial, sans-serif;
  font-size: 10px;
  font-weight: normal;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 180px; }

#footer-legal {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  position: relative;
  padding: 15px 0 16px; }

html.ugm-showing #footer-legal {
  padding-bottom: 80px; }

#footer-share {
  position: absolute;
  height: 20px;
  right: 0;
  top: 8px; }
  #footer-share ul {
    position: relative;
    margin: 0;
    padding: 0; }
    #footer-share ul li {
      float: left;
      margin-right: 15px;
      position: relative; }
      #footer-share ul li.last {
        margin-right: 0; }
      #footer-share ul li a {
        display: block;
        width: 100%;
        height: 100%;
        position: relative; }
        #footer-share ul li a#footer-facebook-logo {
          width: 24px;
          height: 24px;
          background-image: url(../footer/icon-facebook.png); }
        #footer-share ul li a#footer-twitter-logo {
          margin-top: 2px;
          width: 24px;
          height: 20px;
          background-image: url(../footer/icon-twitter.png); }
        #footer-share ul li a#footer-youtube-logo {
          margin-top: 2px;
          width: 50px;
          height: 20px;
          background-image: url(../footer/icon-youtube.png); }

.footer-ratings-continent {
  color: #8A8A8A;
  font-size: 9px;
  text-transform: uppercase; }

.footer-show-poll {
  position: absolute;
  bottom: 19px;
  right: 0; }
  .footer-show-poll.footer-show-poll-vote {
    bottom: 10px; }

#footer-poll .common-percentbar-container {
  background: #000;
  border-color: #464646; }

.base-content-full-width #footer-poll .common-percentbar-container {
  background: #fff;
  border-color: #cacaca; }

#footer-poll .common-percentbar-container div {
  background-color: #fff; }

.base-content-full-width #footer-poll .common-percentbar-container div {
  background-color: #353535; }

.footer-rating-image {
  float: left; }
  .footer-rating-image.rating-eu {
    width: 75px; }
  .footer-rating-image.rating-us {
    margin-left: 55px;
    width: 170px;
    overflow: hidden; }
    .footer-rating-image.rating-us a {
      float: left; }
    .footer-rating-image.rating-us .more-info {
      line-height: 15px;
      text-align: left;
      margin-top: 20px;
      margin-left: 8px;
      float: left;
      width: 100px;
      font-size: 11px; }

#footer-logo-esrb {
  position: relative; }

/* Home footer styles */
#home-footer {
  margin-top: 16px; }
  #home-footer .row-tight .span2 .box-content {
    height: 300px; }
  #home-footer #tweets {
    float: left; }
  #home-footer .main-officialupdate-item {
    font-size: 12px;
    line-height: 16px; }
  #home-footer .main-officialupdate-item-content {
    margin-left: 40px;
    margin-bottom: 10px; }
  #home-footer .main-officialupdate-icon-twitteravatar {
    float: left;
    margin-right: 5px;
    margin-top: 3px; }

form.inline label, form.inline input, form.inline button, form.inline select, form.inline textarea, form fieldset.inline label, form fieldset.inline input, form fieldset.inline button, form fieldset.inline select, form fieldset.inline textarea {
  display: inline-block; }
  form.inline label + input, form.inline label + button, form.inline label + select, form.inline label + textarea, form.inline input + input, form.inline input + button, form.inline input + select, form.inline input + textarea, form.inline button + input, form.inline button + button, form.inline button + select, form.inline button + textarea, form.inline select + input, form.inline select + button, form.inline select + select, form.inline select + textarea, form.inline textarea + input, form.inline textarea + button, form.inline textarea + select, form.inline textarea + textarea, form fieldset.inline label + input, form fieldset.inline label + button, form fieldset.inline label + select, form fieldset.inline label + textarea, form fieldset.inline input + input, form fieldset.inline input + button, form fieldset.inline input + select, form fieldset.inline input + textarea, form fieldset.inline button + input, form fieldset.inline button + button, form fieldset.inline button + select, form fieldset.inline button + textarea, form fieldset.inline select + input, form fieldset.inline select + button, form fieldset.inline select + select, form fieldset.inline select + textarea, form fieldset.inline textarea + input, form fieldset.inline textarea + button, form fieldset.inline textarea + select, form fieldset.inline textarea + textarea {
    margin-left: 8px; }

.input, input[type=text], input[type=password], input[type=email], input[type=number], input[type=search], select, textarea, .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap {
  outline: none;
  background: rgba(0, 0, 0, 0.5);
  border: 1px solid rgba(250, 246, 246, 0.6);
  padding: 3px 8px;
  margin: 0;
  color: #d5dde5; }
  .input:hover, input[type=text]:hover, input[type=password]:hover, input[type=email]:hover, input[type=number]:hover, input[type=search]:hover, select:hover, textarea:hover, .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap:hover, .input:focus, input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=number]:focus, input[type=search]:focus, select:focus, textarea:focus, .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap:focus, .input:active, input[type=text]:active, input[type=password]:active, input[type=email]:active, input[type=number]:active, input[type=search]:active, select:active, textarea:active, .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap:active {
    border-color: #fff; }
  .input:focus, input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=number]:focus, input[type=search]:focus, select:focus, textarea:focus, .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap:focus, .input:active, input[type=text]:active, input[type=password]:active, input[type=email]:active, input[type=number]:active, input[type=search]:active, select:active, textarea:active, .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap:active {
    color: #fff; }
  .input:-moz-placeholder, input[type=text]:-moz-placeholder, input[type=password]:-moz-placeholder, input[type=email]:-moz-placeholder, input[type=number]:-moz-placeholder, input[type=search]:-moz-placeholder, select:-moz-placeholder, textarea:-moz-placeholder, .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap:-moz-placeholder, .input::moz-placeholder, input[type=text]::moz-placeholder, input[type=password]::moz-placeholder, input[type=email]::moz-placeholder, input[type=number]::moz-placeholder, input[type=search]::moz-placeholder, select::moz-placeholder, textarea::moz-placeholder, .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap::moz-placeholder, .input:-ms-input-placeholder, input[type=text]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder, input[type=email]:-ms-input-placeholder, input[type=number]:-ms-input-placeholder, input[type=search]:-ms-input-placeholder, select:-ms-input-placeholder, textarea:-ms-input-placeholder, .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap:-ms-input-placeholder, .input::-webkit-input-placeholder, input[type=text]::-webkit-input-placeholder, input[type=password]::-webkit-input-placeholder, input[type=email]::-webkit-input-placeholder, input[type=number]::-webkit-input-placeholder, input[type=search]::-webkit-input-placeholder, select::-webkit-input-placeholder, textarea::-webkit-input-placeholder, .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap::-webkit-input-placeholder {
    color: rgba(250, 246, 246, 0.6); }
  .input.block, input.block[type=text], input.block[type=password], input.block[type=email], input.block[type=number], input.block[type=search], select.block, textarea.block, .battlefeed .list .item .feed-story-comments .feed-comment-form .block.feed-comment-form-textarea-wrap {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    width: 100%; }

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  input[type=radio] {
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 10px;
    height: 10px;
    line-height: 1em;
    margin-top: -2px;
    margin-right: 2px;
    border-radius: 3px;
    border: 1px solid #8e8e8e;
    cursor: pointer;
    padding: 1px;
    outline: none;
    background: rgba(0, 0, 0, 0.5); }
    input[type=radio]:checked {
      position: relative;
      border-color: #fff;
      box-shadow: 0 0 2px rgba(0, 0, 0, 0.8); }
      input[type=radio]:checked:after {
        position: absolute;
        top: 1px;
        left: 1px;
        right: 1px;
        bottom: 1px;
        content: "";
        background: #fff;
        border-radius: 2px; }
    input[type=radio]:disabled {
      opacity: 0.5;
      cursor: default; }
  input[type=checkbox] {
    -webkit-appearance: none;
    -moz-appearance: none;
    box-sizing: border-box;
    width: 10px;
    height: 10px;
    line-height: 1em;
    vertical-align: middle;
    margin-right: 2px;
    margin-top: 1px;
    border: 1px solid #8e8e8e;
    cursor: pointer;
    padding: 1px;
    outline: none;
    background: rgba(0, 0, 0, 0.5); }
    input[type=checkbox]:checked {
      position: relative;
      border: 1px solid #fff;
      background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAGCAMAAAA40HREAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDFGMjIyNjgzRDYyMTFFM0JGNUQ4QTZBMERENkFBNkYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDFGMjIyNjkzRDYyMTFFM0JGNUQ4QTZBMERENkFBNkYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0MUYyMjI2NjNENjIxMUUzQkY1RDhBNkEwREQ2QUE2RiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0MUYyMjI2NzNENjIxMUUzQkY1RDhBNkEwREQ2QUE2RiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PriiGpsAAAAGUExURf///////1V89WwAAAACdFJOU/8A5bcwSgAAAB9JREFUeNpiYAQDBgYoBWYACQYwBjIZoUJgxMgIEGAAAuAAHcl9Sj8AAAAASUVORK5CYII=');
      background-position: center center;
      background-repeat: no-repeat; }
    input[type=checkbox]:active, input[type=checkbox]:focus {
      border-color: #fff; }
    input[type=checkbox]:disabled {
      opacity: 0.5;
      cursor: default; } }

.btn, a.btn {
  display: inline-block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  overflow: hidden;
  height: 40px;
  line-height: 38px;
  font-size: 19px;
  padding: 0 25px;
  vertical-align: middle;
  cursor: pointer;
  outline: none;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 400;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  color: #d5dde5;
  border: 1px solid #d5dde5;
  background-color: transparent;
  background-image: -webkit-linear-gradient(top, rgba(7, 7, 7, 0.6) 0%, rgba(7, 7, 7, 0.3) 100%);
  background-image: linear-gradient(to bottom, rgba(7, 7, 7, 0.6) 0%, rgba(7, 7, 7, 0.3) 100%); }
  .btn:hover:not([disabled]):not(.disabled), a.btn:hover:not([disabled]):not(.disabled) {
    background-image: -webkit-linear-gradient(top, rgba(19, 19, 19, 0.6) 0%, rgba(70, 70, 70, 0.8) 100%);
    background-image: linear-gradient(to bottom, rgba(19, 19, 19, 0.6) 0%, rgba(70, 70, 70, 0.8) 100%);
    color: white;
    text-shadow: 0 0 0.5em rgba(255, 255, 255, 0.8);
    border-color: white; }
  .btn:active:not([disabled]):not(.disabled), .btn.active:not([disabled]):not(.disabled), a.btn:active:not([disabled]):not(.disabled), a.btn.active:not([disabled]):not(.disabled) {
    background-color: rgba(0, 0, 0, 0);
    background-image: -webkit-linear-gradient(top, #ffffff 0%, #d5dde5 50%, #b79d83 100%);
    background-image: linear-gradient(to bottom, #ffffff 0%, #d5dde5 50%, #b79d83 100%);
    text-shadow: none;
    color: black;
    border: 1px solid #b79d83; }
  .btn.btn-primary, a.btn.btn-primary {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #ff9900;
    border: 1px solid #ff9900;
    background-color: transparent;
    background-image: -webkit-linear-gradient(top, rgba(7, 7, 7, 0.6) 0%, rgba(7, 7, 7, 0.3) 100%);
    background-image: linear-gradient(to bottom, rgba(7, 7, 7, 0.6) 0%, rgba(7, 7, 7, 0.3) 100%); }
    .btn.btn-primary:hover:not([disabled]):not(.disabled), a.btn.btn-primary:hover:not([disabled]):not(.disabled) {
      background-image: -webkit-linear-gradient(top, rgba(19, 19, 19, 0.6) 0%, rgba(70, 70, 70, 0.8) 100%);
      background-image: linear-gradient(to bottom, rgba(19, 19, 19, 0.6) 0%, rgba(70, 70, 70, 0.8) 100%);
      color: #ffbf66;
      text-shadow: 0 0 0.5em rgba(255, 191, 101, 0.8);
      border-color: #ffbf66; }
    .btn.btn-primary:active:not([disabled]):not(.disabled), .btn.btn-primary.active:not([disabled]):not(.disabled), a.btn.btn-primary:active:not([disabled]):not(.disabled), a.btn.btn-primary.active:not([disabled]):not(.disabled) {
      background-color: rgba(0, 0, 0, 0);
      background-image: -webkit-linear-gradient(top, #ffffff 0%, #d5dde5 50%, #b79d83 100%);
      background-image: linear-gradient(to bottom, #ffffff 0%, #d5dde5 50%, #b79d83 100%);
      text-shadow: none;
      color: black;
      border: 1px solid #b79d83; }
  .btn.btn-inverse, a.btn.btn-inverse {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #070707;
    border: 1px solid #070707;
    background-color: transparent;
    background-image: -webkit-linear-gradient(top, rgba(213, 221, 229, 0.6) 0%, rgba(213, 221, 229, 0.3) 100%);
    background-image: linear-gradient(to bottom, rgba(213, 221, 229, 0.6) 0%, rgba(213, 221, 229, 0.3) 100%); }
    .btn.btn-inverse:hover:not([disabled]):not(.disabled), a.btn.btn-inverse:hover:not([disabled]):not(.disabled) {
      background-image: -webkit-linear-gradient(top, rgba(228, 233, 238, 0.6) 0%, rgba(255, 255, 255, 0.8) 100%);
      background-image: linear-gradient(to bottom, rgba(228, 233, 238, 0.6) 0%, rgba(255, 255, 255, 0.8) 100%);
      color: #3a3a3a;
      text-shadow: 0 0 0.5em rgba(58, 58, 58, 0.8);
      border-color: #3a3a3a; }
    .btn.btn-inverse:active:not([disabled]):not(.disabled), .btn.btn-inverse.active:not([disabled]):not(.disabled), a.btn.btn-inverse:active:not([disabled]):not(.disabled), a.btn.btn-inverse.active:not([disabled]):not(.disabled) {
      background-color: rgba(0, 0, 0, 0);
      background-image: -webkit-linear-gradient(top, #3a3a3a 0%, #070707 50%, #000000 100%);
      background-image: linear-gradient(to bottom, #3a3a3a 0%, #070707 50%, #000000 100%);
      text-shadow: none;
      color: white;
      border: 1px solid black; }
  .btn.btn-subtle, .btn.btn-clean, a.btn.btn-subtle, a.btn.btn-clean {
    border: 1px solid transparent !important;
    background: none;
    color: #d5dde5; }
    .btn.btn-subtle:hover:not([disabled]):not(.disabled), .btn.btn-clean:hover:not([disabled]):not(.disabled), a.btn.btn-subtle:hover:not([disabled]):not(.disabled), a.btn.btn-clean:hover:not([disabled]):not(.disabled) {
      background: none;
      color: #fff; }
    .btn.btn-subtle:active:not([disabled]):not(.disabled), .btn.btn-clean:active:not([disabled]):not(.disabled), a.btn.btn-subtle:active:not([disabled]):not(.disabled), a.btn.btn-clean:active:not([disabled]):not(.disabled) {
      color: #fff;
      background: none;
      box-shadow: 0; }
  .btn.btn-large, a.btn.btn-large {
    height: 47px;
    line-height: 45px;
    font-size: 23px;
    padding: 0 40px; }
  .btn.btn-small, a.btn.btn-small {
    height: 32px;
    line-height: 30px;
    font-size: 16px;
    padding: 0px 25px; }
    .btn.btn-small .icon-search, a.btn.btn-small .icon-search {
      position: relative;
      top: 2px; }
  .btn.btn-tiny, a.btn.btn-tiny {
    height: 24px;
    line-height: 22px;
    font-size: 13px;
    padding: 0 10px; }
    .btn.btn-tiny .icon-premium-p, a.btn.btn-tiny .icon-premium-p {
      position: relative;
      top: 2px;
      left: -4px; }
  .btn[disabled], .btn.disabled, .is-touch #serverbrowser aside .action-buttons-container .favorite-toggle.starred, a.btn[disabled], a.btn.disabled, .is-touch #serverbrowser aside .action-buttons-container a.favorite-toggle.starred {
    cursor: default;
    opacity: 0.5; }
  .btn.arrow:before, a.btn.arrow:before {
    position: relative;
    bottom: 0.15em;
    right: 0.2em;
    content: "► ";
    font-size: 0.7em; }
  .btn.arrow-down:after, a.btn.arrow-down:after {
    position: relative;
    bottom: 0.15em;
    left: 0.2em;
    content: " ▼";
    font-size: 0.7em;
    line-height: 1; }
  .btn.btn-block, a.btn.btn-block {
    display: block;
    width: 100%;
    padding-left: 0;
    padding-right: 0; }
  .btn > [class^="icon-"], .btn > [class*=" icon-"], a.btn > [class^="icon-"], a.btn > [class*=" icon-"] {
    opacity: 0.8; }
  .btn:hover:not(.disabled) > [class^="icon-"], .btn:hover:not(.disabled) > [class*=" icon-"], a.btn:hover:not(.disabled) > [class^="icon-"], a.btn:hover:not(.disabled) > [class*=" icon-"] {
    opacity: 1; }
  .btn:hover:not(.disabled).btn-subtle, a.btn:hover:not(.disabled).btn-subtle {
    background-color: rgba(7, 7, 7, 0.35); }

/**
 * Map thumbnails
 */
.map-thumb {
  position: relative;
  width: 48px;
  height: 33px; }
  .map-thumb img {
    height: 100%;
    width: 100%; }
  .map-thumb .quick-join {
    position: absolute;
    z-index: 1;
    background: rgba(0, 0, 0, 0.8);
    border: 1px solid rgba(255, 255, 255, 0.9);
    opacity: 0;
    width: 25px;
    height: 25px;
    top: 3px;
    left: 10px; }
    .map-thumb .quick-join:after {
      display: block;
      vertical-align: middle;
      text-align: center;
      content: "▶";
      color: rgba(255, 255, 255, 0.9);
      font-size: 19px;
      line-height: 1.2; }
  .map-thumb:hover .quick-join {
    opacity: 1; }
  .map-thumb.medium {
    width: 62px;
    height: 42px; }
    .map-thumb.medium .quick-join {
      width: 30px;
      height: 30px;
      top: 5px;
      left: 13px; }
      .map-thumb.medium .quick-join:after {
        line-height: 1.4; }

article:hover .map-thumb .quick-join, tr:hover .map-thumb .quick-join {
  opacity: 1; }

/* Firemode Icons */
.firemode-icon {
  background: transparent url(../common/warsaw/firemode-icons.png) no-repeat;
  width: 23px;
  height: 15px;
  display: inline-block; }
  .firemode-icon.disabled {
    opacity: 0.6; }
  .firemode-icon.auto {
    background-position: 0 0; }
  .firemode-icon.burst {
    background-position: 0 -18px; }
  .firemode-icon.single {
    background-position: 0 -36px; }

/* Kit icons */
.common-kit-icon {
  background: url(../profile/bf3/stats/stats-time-icons.png) no-repeat;
  width: 22px;
  height: 22px; }
  .common-kit-icon.kit-1 {
    background-position: -26px 2px; }
  .common-kit-icon.kit-2 {
    background-position: 1px -26px; }
  .common-kit-icon.kit-8 {
    background-position: 1px 1px; }
  .common-kit-icon.kit-32 {
    background-position: -26px -26px; }

/* ----------------- Warsaw kit icons ----------------- */
.kit-icon {
  display: inline-block;
  background-repeat: no-repeat; }
  .kit-icon.xsmall {
    background-image: url(../common/warsaw/kit-icons-xsmall.png);
    width: 15px;
    height: 15px; }
    .kit-icon.xsmall.kit-1, .kit-icon.xsmall.assault {
      background-position: 0 0; }
    .kit-icon.xsmall.kit-2, .kit-icon.xsmall.engineer {
      background-position: -17px 0; }
    .kit-icon.xsmall.kit-32, .kit-icon.xsmall.support {
      background-position: -30px 0; }
    .kit-icon.xsmall.kit-8, .kit-icon.xsmall.recon {
      background-position: -45px 0; }
  .kit-icon.small {
    background-image: url(../common/warsaw/kit-icons-small.png);
    width: 32px;
    height: 32px; }
    .kit-icon.small.kit-1, .kit-icon.small.assault {
      background-position: 0 0; }
    .kit-icon.small.kit-2, .kit-icon.small.engineer {
      background-position: -32px 0; }
    .kit-icon.small.kit-32, .kit-icon.small.support {
      background-position: -64px 0; }
    .kit-icon.small.kit-8, .kit-icon.small.recon {
      background-position: -96px 0; }
    .kit-icon.small.kit-2048, .kit-icon.small.commander {
      background-position: -128px 0; }
  .kit-icon.medium {
    background-image: url(../common/warsaw/kit-icons-medium.png);
    width: 52px;
    height: 52px; }
    .kit-icon.medium.kit-1, .kit-icon.medium.assault {
      background-position: 0 0; }
    .kit-icon.medium.kit-2, .kit-icon.medium.engineer {
      background-position: -52px 0; }
    .kit-icon.medium.kit-32, .kit-icon.medium.support {
      background-position: -104px 0; }
    .kit-icon.medium.kit-8, .kit-icon.medium.recon {
      background-position: -156px 0; }
    .kit-icon.medium.kit-2048, .kit-icon.medium.commander {
      background-position: -208px 0; }

/* ----------------- Warsaw vehicle icons ----------------- */
.vehicle-icon.xsmall {
  background-image: url(../common/warsaw/vehicle-icons-xsmall.png);
  background-repeat: no-repeat;
  display: inline-block;
  width: 16px;
  height: 16px; }
  .vehicle-icon.xsmall.vehicle-3, .vehicle-icon.xsmall.fast-attack-boat {
    background-position: -57px -5px; }
  .vehicle-icon.xsmall.vehicle-6, .vehicle-icon.xsmall.heli-attack {
    background-position: -109px -5px; }
  .vehicle-icon.xsmall.vehicle-5, .vehicle-icon.xsmall.heli-scout {
    background-position: -135px -5px; }
  .vehicle-icon.xsmall.vehicle-8, .vehicle-icon.xsmall.heli-transport {
    background-position: -161px -5px; }
  .vehicle-icon.xsmall.vehicle-4, .vehicle-icon.xsmall.jet-attack {
    background-position: -187px -5px; }
  .vehicle-icon.xsmall.vehicle-7, .vehicle-icon.xsmall.jet-ground-attack {
    background-position: -213px -5px; }
  .vehicle-icon.xsmall.vehicle-2, .vehicle-icon.xsmall.mobile-aa {
    background-position: -317px -5px; }
  .vehicle-icon.xsmall.vehicle-1, .vehicle-icon.xsmall.tank-ifv {
    background-position: -577px -5px; }
  .vehicle-icon.xsmall.vehicle-0, .vehicle-icon.xsmall.tank-mbt {
    background-position: -629px -5px; }

/* ----------------- List icons ----------------- */
.list-icon {
  display: inline-block;
  background-color: rgba(0, 0, 0, 0.45);
  background-image: url(../common/buttons/list-buttons.png);
  width: 76px;
  height: 24px;
  float: left;
  margin-left: 1px; }
  .list-icon.thumbs {
    background-position: 0 -24px; }
  .list-icon.rows {
    background-position: 76px -24px; }
  .list-icon.active {
    background-color: #fff;
    box-shadow: 0 0 7px 0 #e0f4f8; }
    .list-icon.active.thumbs {
      background-position: 0 0; }
    .list-icon.active.rows {
      background-position: 76px 0; }

.tag-icon-list {
  float: left;
  margin: 2px 3px 0 0; }
  .tag-icon-list li {
    float: left;
    margin-right: 2px; }

/* ----------------- Xpack icons ----------------- */
.xp-icon {
  display: inline-block;
  height: 17px;
  width: 17px;
  border: 1px solid #fff;
  background-color: rgba(7, 7, 7, 0.5);
  background-image: url(../profile/bf4/icon-bf4-xp-17x17.png); }
  .xp-icon[data-xpack=xp1] {
    background-position: -17px 0; }
  .xp-icon[data-xpack=xp2] {
    background-position: -34px 0; }
  .xp-icon[data-xpack=xp3] {
    background-position: -51px 0; }
  .xp-icon[data-xpack=xp4] {
    background-position: -68px 0; }
  .xp-icon[data-xpack=xp5] {
    background-position: -85px 0; }
  .xp-icon[data-xpack=xp6] {
    background-position: -102px 0; }
  .xp-icon[data-xpack=xp7] {
    background-position: -119px 0; }

.dialog .popup-reportabuse-body {
  height: 300px; }
.dialog.dialog-friends .dialog-body {
  height: 268px !important;
  overflow-x: hidden;
  overflow-y: auto; }
.dialog ul.avatars p {
  padding: 10px 16px;
  font-size: 12px;
  color: #575757; }
.dialog ul.avatars {
  width: 100%;
  position: relative; }
.dialog ul.avatars li {
  float: none;
  padding: 6px;
  position: relative;
  background: url(../base/bfbc2/loggedin-clean-heading2.png) bottom left no-repeat; }
  .dialog ul.avatars li.selected {
    background: rgba(255, 255, 255, 0.7);
    color: #000; }
    .dialog ul.avatars li.selected .base-friends-username {
      font-weight: bold; }
    .dialog ul.avatars li.selected .base-friends-selectbutton {
      opacity: 0.4; }
  .dialog ul.avatars li.non-selectable {
    opacity: 0.6; }
    .dialog ul.avatars li.non-selectable .base-friends-selectbutton {
      display: none; }
.dialog ul.avatars.avatar-only li {
  display: inline-block;
  background: none;
  float: left; }
.dialog ul.avatars li.last {
  background: none; }
.dialog ul.avatars li img {
  float: left; }
.dialog ul.avatars li img.main-profile-status-icon {
  margin: 5px 5px 0 12px; }
.dialog ul.avatars li a {
  line-height: 18px; }
.dialog ul.avatars .base-friends-avatar {
  float: left;
  margin-right: 10px; }
.dialog ul.avatars .base-friends-username {
  float: left; }
  .dialog ul.avatars .base-friends-username a {
    text-decoration: none; }
.dialog ul.avatars .base-friends-selectbutton {
  float: right;
  position: relative;
  top: 2px; }
.dialog > header a {
  color: #a8a8a8; }
.dialog > header .no-transform {
  text-transform: none; }
.dialog.joinflow-origin-not-started #joinflow-origin-missing-image {
  background: url(../joinflow/origin.png) center center no-repeat;
  background-size: cover;
  width: 106px;
  height: 106px;
  margin: 10px;
  float: left;
  position: relative; }
.dialog.joinflow-origin-not-started footer {
  text-align: right;
  margin-right: 8px; }
.dialog.joinflow-origin-not-started .bullet {
  margin-bottom: 12px;
  height: 30px; }
.dialog.joinflow-origin-not-started #joinflow-pluginpopup-info .loader {
  margin-right: 6px; }
.dialog.joinflow-origin-not-started .bullet-number {
  font-weight: bold;
  float: left;
  text-align: center;
  background: rgba(255, 255, 255, 0.9);
  color: #000;
  font-size: 20px;
  margin-right: 8px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  border: 1px solid #ccc; }
.dialog.joinflow-origin-not-started .bullet-text {
  position: relative;
  top: 56%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  margin-left: 40px;
  line-height: 17px; }
  .dialog.joinflow-origin-not-started .bullet-text.one-line {
    line-height: 30px; }
.dialog.identity2 {
  width: 900px;
  background: #fbfbfb;
  border: 0; }
  #base-bf3-html .dialog.identity2, #base-mohw-html .dialog.identity2 {
    margin-left: -450px; }
  .dialog.identity2 .background-loader {
    z-index: 0;
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -16px; }
  .dialog.identity2 .icon-dialog-close {
    z-index: 10;
    background: url("../base/shared/bright-close.png") center center no-repeat;
    width: 30px;
    height: 30px;
    padding-right: 6px;
    position: absolute;
    right: auto !important;
    left: 5px !important;
    top: 8px !important;
    cursor: pointer;
    opacity: 0.6; }
    #base-mohw-html .dialog.identity2 .icon-dialog-close {
      background-image: url("../base/shared/dark-close.png"); }
    .dialog.identity2 .icon-dialog-close:hover {
      opacity: 1; }
  .dialog.identity2 .dialog-body {
    padding: 0; }
  .dialog.identity2 iframe {
    z-index: 1;
    position: relative;
    display: block;
    width: 100%;
    height: 500px; }
  .dialog.identity2 footer {
    display: none; }
.dialog.punkbuster {
  width: 630px; }
.dialog.emblempreview.cloning .dialog-body .loader {
  display: block; }
.dialog.emblempreview .dialog-body {
  position: relative;
  text-align: center; }
  .dialog.emblempreview .dialog-body .loader {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -12px;
    margin-left: -9px; }
.dialog.emblemselect {
  width: 572px; }
  .dialog.emblemselect .emblems-loading {
    display: block;
    margin: 30px auto 10px; }
  .dialog.emblemselect .emblem-items .item {
    width: 100px;
    min-height: 148px;
    float: left;
    text-align: center;
    margin-left: 10px;
    text-decoration: none; }
    .dialog.emblemselect .emblem-items .item.item-none {
      margin-left: 0; }
    .dialog.emblemselect .emblem-items .item.active .edit-link {
      opacity: 1; }
    .dialog.emblemselect .emblem-items .item.active .emblem {
      opacity: 1;
      cursor: default;
      box-shadow: inset 0 0 10px 4px rgba(255, 255, 255, 0.2); }
    .dialog.emblemselect .emblem-items .item.disabled {
      opacity: 0.3; }
      .dialog.emblemselect .emblem-items .item.disabled .emblem {
        opacity: 1; }
      .dialog.emblemselect .emblem-items .item.disabled:hover .emblem {
        cursor: default; }
    .dialog.emblemselect .emblem-items .item.item-platoon .emblem {
      background: #a8a8a8; }
    .dialog.emblemselect .emblem-items .item.item-none .emblem, .dialog.emblemselect .emblem-items .item.item-create .emblem {
      background: none;
      text-align: center;
      color: #fff; }
      .dialog.emblemselect .emblem-items .item.item-none .emblem:before, .dialog.emblemselect .emblem-items .item.item-create .emblem:before {
        content: "X";
        font-size: 100px;
        line-height: 100px; }
    .dialog.emblemselect .emblem-items .item.item-create .emblem {
      border-radius: 0;
      box-shadow: inset 0 0 0 2px #fff; }
      .dialog.emblemselect .emblem-items .item.item-create .emblem:before {
        content: "+"; }
    .dialog.emblemselect .emblem-items .item h1 {
      text-align: left;
      text-transform: uppercase;
      color: #a8a8a8;
      font-size: 13px;
      line-height: 24px;
      font-family: Purista, sans-serif;
      font-weight: normal;
      margin: 0;
      cursor: default; }
    .dialog.emblemselect .emblem-items .item .emblem {
      width: 100px;
      height: 100px;
      display: block;
      margin-bottom: 8px;
      opacity: 0.7;
      cursor: pointer;
      border-radius: 2px;
      -webkit-transition: box-shadow 0.5s ease;
      -moz-transition: box-shadow 0.5s ease;
      transition: box-shadow 0.5s ease; }
      .dialog.emblemselect .emblem-items .item .emblem:first-child {
        margin-top: 24px; }
      .dialog.emblemselect .emblem-items .item .emblem:hover {
        opacity: 1; }
      .dialog.emblemselect .emblem-items .item .emblem img {
        width: 100px;
        height: 100px;
        display: block; }
    .dialog.emblemselect .emblem-items .item .edit-link {
      font-size: 12px; }
.dialog.soldierselect section {
  padding: 0;
  max-height: 300px;
  overflow-y: scroll; }
.dialog.soldierselect .soldier-list > li > a {
  padding: 10px;
  display: block;
  position: relative;
  line-height: 30px; }
  .dialog.soldierselect .soldier-list > li > a .bfh-game-platform {
    display: inline-block;
    width: 100px; }
  .dialog.soldierselect .soldier-list > li > a:hover {
    background-color: rgba(0, 0, 0, 0.1); }
.dialog.soldierselect .soldier-list > li .clan-tag, .dialog.soldierselect .soldier-list > li .name {
  font-weight: bold;
  font-size: 16px;
  line-height: 24px;
  padding-bottom: 2px; }
.dialog.soldierselect .soldier-list > li .gameicon {
  min-width: 26px;
  display: inline-block;
  vertical-align: text-bottom;
  margin-right: 10px;
  position: relative;
  top: 1px; }
.dialog .soldierselect-description {
  font-size: 11px;
  line-height: 16px;
  float: left;
  max-width: 360px;
  text-align: left; }
.dialog #soldierimage li {
  float: left;
  position: relative; }
  .dialog #soldierimage li .icon-premium-p {
    position: absolute;
    bottom: 6px;
    right: 6px; }
.dialog a:not(.btn) {
  text-decoration: underline; }
  .dialog a:not(.btn):hover, .dialog a:not(.btn):active {
    color: #808080; }
.dialog .popup-reportabuse-show-type {
  margin-bottom: 10px; }
  .dialog .popup-reportabuse-show-type select {
    cursor: pointer; }
  .dialog .popup-reportabuse-show-type .popup-reportabuse-text {
    margin-right: 6px;
    font-weight: bold;
    line-height: 24px; }
.dialog .popup-gameinvite-avatar {
  float: left;
  width: 65px;
  margin-left: 5px; }
.dialog .popup-gameinvite-serverinfo-firstrow {
  color: #a8a8a8; }
.dialog .popup-gameinvite-content {
  margin-left: 82px; }
.dialog .popup-gameinvite-serverinfo-map {
  overflow: hidden; }
  .dialog .popup-gameinvite-serverinfo-map img {
    height: 100px;
    width: auto;
    display: block;
    margin-left: -95px; }
.dialog .popup-gameinvite-serverinfo-gameicon {
  display: inline-block; }
.dialog .popup-gameinvite-serverinfo-gameicon span {
  margin-bottom: -2px; }
.dialog .popup-gameinvite-servername a {
  font-size: 14px;
  padding: 3px 0;
  font-weight: bold;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  white-space: nowrap; }
.dialog .popup-party-invitetext {
  line-height: 60px; }
.dialog.popup-coop-invite .popup-gameinvite-serverinfo-map {
  float: left;
  width: 75px; }
  .dialog.popup-coop-invite .popup-gameinvite-serverinfo-map img {
    margin-left: 0;
    height: auto; }
.dialog.popup-coop-invite .popup-coop-info {
  float: left; }
.dialog.popup-bannedpersona {
  text-align: center; }
.dialog.bfh-feedback-dialog {
  width: 1020px;
  height: 90%;
  margin-left: -510px;
  background-color: #fff; }
  .dialog.bfh-feedback-dialog .dialog-body {
    background-color: #fff;
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden; }
    .dialog.bfh-feedback-dialog .dialog-body .content ::-webkit-scrollbar {
      width: 7px; }
    .dialog.bfh-feedback-dialog .dialog-body .content ::-webkit-scrollbar-thumb {
      background: rgba(0, 0, 0, 0.5); }

html:not(.is-touch) body:not(.no-comcenter) #dialog-container .bfh-feedback-dialog {
  margin-left: -392px; }

#base-bf4-html .dialog.popup-coop-invite .popup-gameinvite-serverinfo-container {
  padding-top: 10px;
  padding-bottom: 6px; }

.track-item-dialog {
  width: 574px; }
  .track-item-dialog .dialog-body {
    padding-bottom: 0; }
  .track-item-dialog #selected-track-item {
    background-color: #fff;
    color: #000;
    width: 180px;
    height: 150px; }
  .track-item-dialog .suggestion-box {
    width: 180px;
    height: 150px;
    float: left;
    position: relative;
    overflow: hidden;
    background-color: #202026;
    text-align: center; }
    .track-item-dialog .suggestion-box:hover {
      background-color: #26262d; }
    .track-item-dialog .suggestion-box:first-child {
      margin-right: 1px; }
    .track-item-dialog .suggestion-box:last-child {
      margin-left: 1px; }
    .track-item-dialog .suggestion-box.active {
      background-color: rgba(255, 255, 255, 0.1); }
      .track-item-dialog .suggestion-box.active .current {
        display: none; }
    .track-item-dialog .suggestion-box strong {
      position: absolute;
      top: 10px;
      left: 15px;
      padding-right: 15px; }
    .track-item-dialog .suggestion-box .image {
      margin: 40px auto 0; }
    .track-item-dialog .suggestion-box .progress-bar {
      position: absolute;
      bottom: 0;
      margin-bottom: 0;
      width: 100%; }
    .track-item-dialog .suggestion-box .green-check-small {
      background-image: url(../battledash/images/icons/green-check-small.png);
      width: 12px;
      height: 12px;
      position: absolute;
      right: 3px;
      bottom: 10px; }

#gamenotstarting-resolve-origin {
  list-style-type: circle;
  margin-bottom: 24px;
  margin-left: 24px;
  margin-top: 8px; }

.share-br-dialog {
  width: 680px; }
  .share-br-dialog .avatar {
    float: left; }
  .share-br-dialog .content-container {
    float: left;
    width: 548px;
    margin-left: 15px; }
  .share-br-dialog .share-comment {
    margin-bottom: 8px; }
    .share-br-dialog .share-comment textarea {
      font-family: Arial, sans-serif;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      width: 548px;
      height: 75px; }
  .share-br-dialog footer .facebook-sharing {
    float: left;
    margin-left: 75px;
    position: relative;
    padding-left: 22px; }
    .share-br-dialog footer .facebook-sharing i.fb-icon {
      position: absolute;
      top: 3px;
      left: 0px;
      background: url(../base/shared/icon-fb-share.png);
      background-size: 100%;
      width: 11px;
      height: 11px; }
    .share-br-dialog footer .facebook-sharing a {
      text-decoration: none;
      margin-right: 8px; }
    .share-br-dialog footer .facebook-sharing .switch {
      margin-top: 0;
      margin-bottom: 0;
      position: relative;
      top: 0px; }
  .share-br-dialog footer .btn-container {
    float: right;
    margin-right: 25px; }

.feed-story-body p.feed-br-share-text {
  padding: 4px 0; }

.dialog-share-content {
  background-color: #303030; }

a.feed-item-anchor-battlereport:hover {
  text-decoration: none !important; }

.battlefeed .list .battlereport-feed-item, .battlereport-feed-item {
  width: 548px;
  margin: 10px 0 3px 0; }
  .battlefeed .list .battlereport-feed-item header, .battlereport-feed-item header {
    margin: 0 !important;
    padding: 0 !important;
    height: 163px; }
  .battlefeed .list .battlereport-feed-item .prize .box-content, .battlereport-feed-item .prize .box-content {
    padding: 8px; }
  .battlefeed .list .battlereport-feed-item .info-list li, .battlereport-feed-item .info-list li {
    display: inline-block;
    width: 106px;
    float: left;
    background-color: rgba(0, 0, 0, 0.5);
    margin: 1px 0 0 1px;
    text-align: center;
    overflow: hidden;
    color: #fff; }
    .battlefeed .list .battlereport-feed-item .info-list li h5, .battlereport-feed-item .info-list li h5 {
      font-size: 14px;
      line-height: 14px;
      margin: 10px auto 0;
      padding: 0; }
    .battlefeed .list .battlereport-feed-item .info-list li strong, .battlereport-feed-item .info-list li strong {
      font-size: 24px;
      font-weight: bold;
      line-height: 36px; }
    .battlefeed .list .battlereport-feed-item .info-list li.small, .battlereport-feed-item .info-list li.small {
      height: 65px; }
    .battlefeed .list .battlereport-feed-item .info-list li.medium, .battlereport-feed-item .info-list li.medium {
      position: relative;
      height: 85px;
      width: 213px; }
      .battlefeed .list .battlereport-feed-item .info-list li.medium h5, .battlereport-feed-item .info-list li.medium h5 {
        margin: 0 auto 4px;
        padding: 5px 0 3px;
        background-color: #000; }
      .battlefeed .list .battlereport-feed-item .info-list li.medium .na, .battlereport-feed-item .info-list li.medium .na {
        margin-top: 20px;
        color: #666;
        display: block; }
      .battlefeed .list .battlereport-feed-item .info-list li.medium .kit-icon, .battlereport-feed-item .info-list li.medium .kit-icon {
        margin-top: 10px; }
    .battlefeed .list .battlereport-feed-item .info-list li.large, .battlereport-feed-item .info-list li.large {
      width: 120px;
      height: 151px;
      margin-left: 0; }
      .battlefeed .list .battlereport-feed-item .info-list li.large .team-position, .battlereport-feed-item .info-list li.large .team-position {
        display: block;
        font-size: 38px;
        line-height: 40px;
        margin: 15px auto 32px; }

.popup-feedback-container {
  max-height: 320px; }
  .popup-feedback-container .hidden {
    display: none; }
  .popup-feedback-container .feedback-manual {
    margin-bottom: 16px; }
    .popup-feedback-container .feedback-manual p {
      font-size: 12px;
      font-weight: bold;
      margin-bottom: 10px; }
  .popup-feedback-container .feedback-manual-download {
    border: 1px solid rgba(255, 255, 255, 0.15);
    padding: 6px;
    text-decoration: none !important;
    margin-right: 6px;
    margin-top: 6px; }

.dialog-battlescreen {
  width: 800px; }
  .is-app .dialog-battlescreen {
    margin-left: -400px; }
  .dialog-battlescreen h6 {
    color: #a8a8a8;
    line-height: 24px; }
  .dialog-battlescreen .apps {
    color: #a8a8a8; }
    .dialog-battlescreen .apps a + a {
      margin-left: 5px; }
  .dialog-battlescreen .info {
    width: 310px;
    padding: 20px 0 0 20px; }
  .dialog-battlescreen .smartglass {
    margin-bottom: 5px; }
  .dialog-battlescreen p {
    text-transform: uppercase;
    font-weight: bold;
    padding: 2px 0 4px;
    font-size: 11px; }

.dialog-feedback {
  width: 560px; }
  .dialog-feedback .sprite {
    display: inline-block;
    background: url(//eaassets-a.akamaihd.net/battlelog/bb/bf4/dialog/dialog-feedback-1169fcb7.png) no-repeat top left;
    background-position: center center;
    width: 82px; }
    .dialog-feedback .sprite.ea {
      background-position: 0 0;
      width: 57px;
      height: 58px;
      vertical-align: middle;
      margin-top: -5px; }
    .dialog-feedback .sprite.accounts {
      background-position: 0 -68px;
      height: 67px; }
    .dialog-feedback .sprite.troubleshooting {
      background-position: -1px -145px;
      height: 67px; }
    .dialog-feedback .sprite.connectivity {
      background-position: 0 -218px;
      width: 81px;
      height: 67px; }
    .dialog-feedback .sprite.battlelog {
      background-position: 0 -285px;
      width: 49px;
      height: 42px;
      vertical-align: middle;
      margin-top: -5px;
      margin-right: 8px; }
    .dialog-feedback .sprite.help-ea-com {
      background-position: 0 -337px;
      width: 55px;
      height: 32px; }
    .dialog-feedback .sprite.answer-hq {
      background-position: 0 -379px;
      width: 52px;
      height: 45px; }
  .dialog-feedback h1 {
    text-transform: initial;
    line-height: 55px;
    margin-bottom: 16px; }
  .dialog-feedback h2 {
    text-transform: initial;
    line-height: 55px;
    margin: 16px 0;
    font-size: 26px !important; }
  .dialog-feedback .boxes a, .dialog-feedback .buttons a {
    position: relative;
    text-decoration: none !important; }
    .dialog-feedback .boxes a:hover, .dialog-feedback .buttons a:hover {
      color: #fff; }
      .dialog-feedback .boxes a:hover:after, .dialog-feedback .buttons a:hover:after {
        opacity: 1; }
    .dialog-feedback .boxes a:after, .dialog-feedback .buttons a:after {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: rgba(255, 255, 255, 0.2);
      opacity: 0;
      -webkit-transition: 0.1s opacity ease-out;
      -moz-transition: 0.1s opacity ease-out;
      transition: 0.1s opacity ease-out; }
  .dialog-feedback .boxes a {
    display: block;
    padding: 16px;
    width: calc(33% - 37px);
    margin-right: 10px;
    float: left;
    min-height: 132px;
    text-align: center;
    color: #fff; }
    .dialog-feedback .boxes a i {
      margin: 8px; }
    .dialog-feedback .boxes a h3 {
      text-align: left;
      color: #fff;
      text-transform: initial;
      font-size: 18px;
      line-height: 22px;
      margin: 0;
      -webkit-margin-after: 0; }
    .dialog-feedback .boxes a:nth-child(1) {
      background-color: #2a3b44; }
    .dialog-feedback .boxes a:nth-child(2) {
      background-color: #623f35; }
    .dialog-feedback .boxes a:nth-child(3) {
      background-color: #325b5a;
      margin-right: 0; }
  .dialog-feedback .buttons a, .dialog-feedback .more-help a {
    display: block;
    float: left; }
  .dialog-feedback .buttons a {
    padding: 8px 16px;
    margin-bottom: 10px;
    color: #fff;
    background-color: #2a3b44;
    font-size: 18px;
    padding: 8px 16px; }
    .dialog-feedback .buttons a.half {
      width: calc(50% - 37px);
      margin-right: 10px; }
      .dialog-feedback .buttons a.half:nth-child(even) {
        margin-right: 0; }
    .dialog-feedback .buttons a.full {
      width: calc(100% - 32px); }
  .dialog-feedback .more-help a {
    width: calc(50% - 10px);
    text-decoration: none !important;
    margin-right: 10px; }
    .dialog-feedback .more-help a:nth-child(even) {
      margin-right: 0; }
  .dialog-feedback .more-help i {
    margin-right: 16px; }
    .dialog-feedback .more-help i.help-ea-com {
      margin-top: 5px; }
    .dialog-feedback .more-help i.answer-hq {
      margin-top: 2px; }

.breadcrumb {
  margin: 0 0 5px 0;
  padding: 0;
  list-style: none; }
  .breadcrumb.small li {
    margin-right: 5px; }
    .breadcrumb.small li:before, .breadcrumb.small li:after {
      border-width: 12px 0 12px 7px; }
    .breadcrumb.small li:before {
      left: -7px; }
    .breadcrumb.small li:after {
      right: -7px; }
  .breadcrumb.small a {
    font-size: 12px;
    line-height: 24px;
    height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 280px; }
  .breadcrumb.small li a {
    font-family: arial, sans-serif; }
  .breadcrumb.medium a {
    height: 30px;
    line-height: 30px;
    font-size: 16px; }
  .breadcrumb.large a {
    font-size: 23px;
    line-height: 32px;
    height: 32px; }
  .breadcrumb.large li:before, .breadcrumb.large li:after {
    border-width: 16px 0 16px 9px; }
  .breadcrumb.large li a {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-weight: 600; }
  .breadcrumb li {
    display: inline-block;
    margin: 0 7px 0 0;
    position: relative;
    background: rgba(0, 0, 0, 0.5); }
    .breadcrumb li:before, .breadcrumb li:after {
      content: " ";
      position: absolute;
      top: 0;
      background: transparent;
      border-style: solid;
      height: 0;
      width: 0;
      border-width: 15px 0 15px 9px; }
    .breadcrumb li:before {
      left: -9px;
      border-color: rgba(0, 0, 0, 0.5) transparent; }
    .breadcrumb li:after {
      right: -9px;
      border-color: transparent transparent transparent rgba(0, 0, 0, 0.5); }
    .breadcrumb li a {
      display: block;
      padding: 0 12px 0 10px;
      cursor: pointer;
      text-decoration: none; }
    .breadcrumb li:first-of-type:before {
      display: none; }
    .breadcrumb li:first-of-type:after {
      border-color: transparent transparent transparent rgba(0, 0, 0, 0.5); }
    .breadcrumb li:first-of-type a {
      padding-left: 16px; }
    .breadcrumb li:hover, .breadcrumb li:active {
      background: rgba(0, 0, 0, 0.7); }
      .breadcrumb li:hover:before, .breadcrumb li:active:before {
        border-color: rgba(0, 0, 0, 0.7) transparent; }
      .breadcrumb li:hover:after, .breadcrumb li:active:after {
        border-color: transparent transparent transparent rgba(0, 0, 0, 0.7); }
      .breadcrumb li:hover:first-of-type:before, .breadcrumb li:active:first-of-type:before {
        display: none; }
      .breadcrumb li:hover:first-of-type:after, .breadcrumb li:active:first-of-type:after {
        border-color: transparent transparent transparent rgba(0, 0, 0, 0.7); }
    .breadcrumb li:last-of-type {
      cursor: default;
      background: rgba(0, 0, 0, 0.6); }
      .breadcrumb li:last-of-type:before {
        border-color: rgba(0, 0, 0, 0.6) transparent; }
      .breadcrumb li:last-of-type:after {
        border-color: transparent transparent transparent rgba(0, 0, 0, 0.6); }
      .breadcrumb li:last-of-type:first-of-type:before {
        display: none; }
      .breadcrumb li:last-of-type:first-of-type:after {
        border-color: transparent transparent transparent rgba(0, 0, 0, 0.6); }

.ui-select .dropdown li.selected {
  color: black;
  background-color: white;
  background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  box-shadow: 0 0 7px 0 #e0f4f8; }

.pagination-paginationbutton {
  margin-right: 5px;
  float: left;
  text-decoration: none;
  background-color: #efefef;
  border-bottom: 1px solid #fff; }

.pagination-paginationbutton:hover {
  text-decoration: none;
  background-color: #f9f9f9; }

.pagination-paginationbutton-border {
  border: 1px solid #d5d5d5; }

.pagination-paginationbutton-inner {
  font-size: 12px;
  text-align: center;
  display: block;
  height: 22px;
  line-height: 22px;
  padding: 1px 7px 0;
  font-weight: normal;
  box-shadow: inset 0 1px 0 #fff; }

.pagination-paginationbutton-extra {
  display: none;
  background: url(../forum/pagination-icons.png) no-repeat;
  width: 8px;
  height: 9px;
  top: 6px;
  position: relative; }

.pagination-paginationbutton.pagination-type-dots .pagination-paginationbutton-extra {
  display: block;
  height: 3px;
  background-position: 0 -38px;
  top: 12px; }

.pagination-paginationbutton.pagination-type-next .pagination-paginationbutton-extra {
  display: block;
  background-position: 0 0; }

.pagination-paginationbutton.pagination-type-next-disabled .pagination-paginationbutton-extra {
  display: block;
  background-position: 0 -9px; }

.pagination-paginationbutton.pagination-type-prev .pagination-paginationbutton-extra {
  display: block;
  background-position: 0 -19px; }

.pagination-paginationbutton.pagination-type-prev-disabled .pagination-paginationbutton-extra {
  display: block;
  background-position: 0 -28px; }

.pagination-pagination-left {
  float: right; }

.pagination-pagination-right {
  float: left; }

.pagination-paginationbutton.pagination-type-on {
  background-color: #dcdcdc; }

.pagination-paginationbutton.pagination-type-on:hover {
  cursor: default; }

.pagination-paginationbutton.pagination-type-on .pagination-paginationbutton-border {
  border: none;
  border-top: 1px solid #cacaca; }

.pagination-paginationbutton.pagination-type-on .pagination-paginationbutton-inner {
  box-shadow: inset 0 1px 0 #d5d5d5, inset 0 -1px 0 #d5d5d5;
  font-weight: bold;
  color: #353535;
  padding-bottom: 1px; }

.pagination-paginationbutton.pagination-type-next-disabled, .pagination-paginationbutton.pagination-type-prev-disabled {
  background-color: #f0f0f0;
  color: #dcdcdc; }

.pagination-paginationbutton.pagination-type-next-disabled .pagination-paginationbutton-border, .pagination-paginationbutton.pagination-type-prev-disabled .pagination-paginationbutton-border {
  border: 1px solid #e8e8e8; }

.pagination-paginationbutton.pagination-type-next, .pagination-paginationbutton.pagination-type-next-disabled {
  margin-right: 0; }

.pagination-paginationbutton.pagination-type-dots, .pagination-paginationbutton.pagination-type-dots .pagination-paginationbutton-border, .pagination-paginationbutton.pagination-type-dots .pagination-paginationbutton-inner, .pagination-paginationbutton.pagination-type-dots:hover, .pagination-paginationbutton.pagination-type-dots:hover .pagination-paginationbutton-border, .pagination-paginationbutton.pagination-type-dots:hover .pagination-paginationbutton-inner {
  background: none;
  border: none;
  cursor: default;
  height: auto; }

.pagination-paginationbutton.pagination-type-dots .pagination-paginationbutton-inner {
  padding: 0 2px; }

/* ########################## extra ########################## **/
#leaderboard-result .pagination-paginationbutton {
  margin-top: 0; }

.pagination-paginationbutton {
  background: none;
  border: none;
  margin-right: 1px; }
  .pagination-paginationbutton:hover {
    background: none; }
    .pagination-paginationbutton:hover .pagination-paginationbutton-border {
      border-color: #fff; }
    .pagination-paginationbutton:hover .pagination-paginationbutton-inner {
      color: #fff; }
  .pagination-paginationbutton.pagination-type-dots {
    margin: 0 5px; }
    .pagination-paginationbutton.pagination-type-dots .pagination-paginationbutton-extra {
      top: 11px; }

.pagination-paginationbutton-border {
  border: none;
  background-color: rgba(7, 7, 7, 0.5); }

.pagination-paginationbutton-inner {
  box-shadow: none;
  color: #d5dde5; }

.pagination-paginationbutton.pagination-type-on {
  background: none; }

.pagination-paginationbutton.pagination-type-on .pagination-paginationbutton-border {
  border: none; }

.pagination-paginationbutton.pagination-type-on .pagination-paginationbutton-inner {
  padding-bottom: 0;
  font-weight: normal;
  color: black;
  background-color: white;
  background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  box-shadow: 0 0 7px 0 #e0f4f8; }

.pagination-paginationbutton.pagination-type-next-disabled, .pagination-paginationbutton.pagination-type-prev-disabled {
  background-color: transparent;
  color: #a8a8a8; }

.pagination-paginationbutton.pagination-type-next-disabled .pagination-paginationbutton-border, .pagination-paginationbutton.pagination-type-prev-disabled .pagination-paginationbutton-border {
  border: none; }

.pagination-paginationbutton.pagination-type-next .pagination-paginationbutton-extra, .pagination-paginationbutton.pagination-type-prev .pagination-paginationbutton-extra {
  height: 10px;
  opacity: 0.8; }

.pagination-paginationbutton.pagination-type-next:hover .pagination-paginationbutton-extra, .pagination-paginationbutton.pagination-type-prev:hover .pagination-paginationbutton-extra {
  opacity: 1; }

.pagination-paginationbutton.pagination-type-next-disabled .pagination-paginationbutton-extra, .pagination-paginationbutton.pagination-type-prev-disabled .pagination-paginationbutton-extra {
  height: 10px;
  opacity: 0.3; }

.pagination-paginationbutton.pagination-type-next .pagination-paginationbutton-extra {
  background-position: 0 -9px; }

.pagination-paginationbutton.pagination-type-prev .pagination-paginationbutton-extra {
  background-position: 0 -28px; }

.battlefeed .loading {
  text-align: center; }
.battlefeed .update {
  padding: 16px;
  border-bottom: 1px solid transparent; }
.battlefeed .feeditems .base-item-ribbon-small {
  background: "/profile/bf3/stats/ribbons/ribbons-sprite.png"; }
.battlefeed .feeditems .awards .awardcontainer {
  border: 1px solid #8a8a8a;
  padding: 10px; }
.battlefeed .list .item {
  position: relative;
  font-size: 14px;
  padding-left: 68px;
  padding-top: 16px;
  padding-right: 16px;
  padding-bottom: 16px;
  line-height: 16px; }
  .battlefeed .list .item .avatar {
    position: absolute;
    left: 0px; }
  .battlefeed .list .item + .item {
    border-top: 1px solid transparent; }
  .battlefeed .list .item:first-child {
    padding-top: 0px; }
  .battlefeed .list .item:last-child {
    padding-bottom: 32px; }
  .battlefeed .list .item span {
    line-height: 16px;
    margin-bottom: 2px; }
  .battlefeed .list .item header {
    margin-bottom: 10px; }
    .battlefeed .list .item header .username {
      font-weight: bold; }
    .battlefeed .list .item header .hooah {
      float: right; }
  .battlefeed .list .item footer {
    text-transform: none; }
.battlefeed #profile-status-message #profile-edit-status-button {
  display: none; }
.battlefeed #profile-status-message #feed-addlinkwithpreviewarea {
  display: none;
  margin-bottom: 8px; }
.battlefeed #profile-status-message .feed-actions {
  float: right;
  text-align: right; }
.battlefeed .feed-comment-form, .battlefeed .feed-comment-text-not-clicked, .battlefeed .feed-comment-text-clicked {
  font-size: 12px; }
.battlefeed .feed-comment-form, .battlefeed .feed-comment-text-not-clicked {
  color: #a8a8a8; }

/* feed component CSS resource */
#feed-container {
  margin-top: 1px; }
  #feed-container .feed-friends .box-content {
    text-align: center; }
    #feed-container .feed-friends .box-content h2 {
      font-size: 20px; }
    #feed-container .feed-friends .box-content h3 {
      font-size: 16px; }
    #feed-container .feed-friends .box-content li {
      margin-bottom: 4px; }
  #feed-container .feed-statstransferlink {
    display: inline-block; }
    #feed-container .feed-statstransferlink:hover {
      text-decoration: none; }
  #feed-container .feed-statstransfer {
    margin-top: 8px;
    margin-bottom: 8px;
    background: rgba(0, 0, 0, 0.5);
    width: 310px;
    height: 54px;
    cursor: pointer; }
    #feed-container .feed-statstransfer:hover {
      background: rgba(0, 0, 0, 0.7); }
    #feed-container .feed-statstransfer .stats {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400;
      display: inline-block;
      width: 140px;
      text-align: center;
      font-size: 26px;
      margin-top: 18px; }
      #feed-container .feed-statstransfer .stats.grey {
        color: #ccc; }
      #feed-container .feed-statstransfer .stats.arrow {
        width: 9px;
        height: 18px;
        background: url(../feed/arrow_thin_white.png); }
  #feed-container.feed-show-item {
    margin-top: 0; }
  #feed-container .feed-story-creationDate a {
    color: #8A8A8A; }
  #feed-container .feed-story-playingas a {
    font-size: 11px;
    font-weight: normal; }
  #feed-container .base-profile-link {
    font-weight: bold; }

#feed-single-event-container {
  padding-top: 10px;
  padding-bottom: 10px; }
  #feed-single-event-container .feed-single-item {
    border: 0; }

.feed-single-item {
  clear: both;
  font-size: 12px;
  padding: 10px 0 10px 0;
  position: relative; }

.feed-show-item {
  width: 654px;
  min-height: 200px; }
  .feed-show-item .base-big-title {
    margin-bottom: 16px; }

.feed-showlikes-popup .common-popup-content-container {
  width: 495px;
  max-height: 350px;
  overflow: hidden; }

.feed-showlikes-useritem {
  position: relative;
  clear: both;
  padding: 5px; }
  .feed-showlikes-useritem:hover {
    background: rgba(255, 255, 255, 0.1); }
  .feed-showlikes-useritem div.base-avatar-container {
    display: inline-block; }
  .feed-showlikes-useritem a.base-profile-link {
    display: inline-block;
    position: relative;
    margin-left: 5px; }
  .feed-showlikes-useritem button {
    float: right;
    right: 5px;
    top: 5px;
    position: relative; }

.feed-events:last-child, .feed-single-item:last-child {
  border-bottom: none; }

.feed-events.feed-no-border {
  border-top: none; }

.menu-item {
  padding: 10px 0;
  padding-bottom: 5px;
  border-bottom: 1px solid #efefee; }

.feed-post-to {
  margin-left: 3px;
  font-size: 14px; }

.menu-item.active {
  border: 0px; }

.feed-show {
  display: block; }

.feed-bundle-likes, .feed-story-likes {
  margin-left: 45px;
  font-size: 11px;
  font-family: Arial, sans-serif;
  background: transparent;
  background: rgba(0, 0, 0, 0.2); }

.feed-story-comments {
  margin-left: 45px;
  font-size: 11px;
  font-family: Arial, sans-serif; }
  .feed-story-comments.feed-show {
    margin-top: 5px; }

.feed-item-likes a {
  font-size: 11px; }

.feed-item-likescontainer {
  margin-left: 45px; }

.feed-story {
  font-size: 12px;
  font-family: Arial, sans-serif; }

.feed-comment-text-not-clicked {
  font-family: Arial, sans-serif;
  font-style: italic;
  height: 22px;
  line-height: 22px;
  width: 530px;
  max-width: 530px; }

.feed-comment-textarea {
  -webkit-transition: height 0.2s;
  -moz-transition: height 0.2s;
  transition: height 0.2s; }

.feed-comment-text-clicked {
  font-family: Arial, sans-serif;
  height: 28px;
  padding: 6px 8px;
  width: 530px;
  max-width: 530px; }

.feed-bundle-likes, .feed-story-likes, .feed-story-comments {
  clear: both;
  width: 390px;
  line-height: 18px; }

.feed-sub-events .feed-single-item {
  margin: 5px 0; }

.feed-bundle-likes {
  margin-top: 4px;
  margin-left: 42px;
  font-size: 11px; }

.feed-story-likes {
  margin-left: 0;
  margin-top: 5px;
  padding: 4px 5px 4px; }

.feed-story-comments {
  border: 0;
  padding: 0;
  width: 402px; }

.feed-events a, .feed-story a, .feed-story-likes a, .feed-story-comments a {
  text-decoration: none; }

.feed-events a:hover, .feed-story a:hover, .feed-story-likes a:hover, .feed-story-comments a:hover {
  text-decoration: underline; }

.feed-avatar-container {
  margin-right: 10px;
  float: left;
  position: relative; }

.feed-story-content {
  overflow: hidden;
  line-height: 18px; }

.feed-story-creationDate, .feed-story-playingas {
  color: #aaa;
  font-size: 11px; }

.feed-story-heading {
  color: #8A8A8A;
  line-height: 18px;
  word-wrap: break-word; }

.feed-story-body {
  color: #fff;
  line-height: 18px;
  word-wrap: break-word; }
  .feed-story-body p {
    padding-left: 46px;
    word-wrap: break-word; }

.feed-story-heading .feed-info-title {
  font-size: 12px;
  color: #fff;
  font-weight: bold; }

#feed-container .feed-story-heading .feed-info-title a, #feed-container .feed-story-body .feed-info-title a {
  font-weight: bold; }

.feed-story-heading .feed-info-description {
  font-size: 11px;
  color: #8A8A8A; }
  .feed-story-heading .feed-info-description.limit {
    width: 400px; }
  .feed-story-heading .feed-info-description ul {
    list-style: disc;
    margin-left: 15px; }

.wallpost-body {
  width: 410px;
  color: #fff;
  word-wrap: break-word; }

#main-loggedin-feed .wallpost-body {
  width: 552px; }

.feed-story-created-content {
  color: #353535; }

#feed-container {
  position: relative; }
  #feed-container .feed-unavailable {
    padding: 24px 0;
    font-size: 12px;
    font-style: italic; }

#feed-filter-content .feed-view-more-events {
  width: 991px;
  bottom: -14px;
  left: 1px; }

.feed-view-more-events {
  text-align: center;
  height: 26px;
  line-height: 26px;
  bottom: 0;
  left: -15px;
  margin-top: 16px; }

.feed-view-more-events-button {
  width: 602px;
  color: #308DBF; }

.feed-story-friend-icon {
  position: relative;
  top: 4px;
  padding-right: 5px; }

.feed-story-small-icon {
  display: inline-block; }
  .feed-story-small-icon img {
    vertical-align: middle;
    margin-right: 2px; }

.feed-story-small-likeicon {
  vertical-align: middle; }

.feed-story-infoarea-separator {
  position: relative;
  top: 1px;
  display: inline-block;
  padding-left: 2px;
  padding-right: 2px;
  font-size: 11px;
  color: #a8a8a8; }

.feed-story-area-game {
  position: relative;
  top: 4px;
  line-height: 24px; }

.feed-story-content, .feed-events {
  font-size: 14px; }

.feed-story-area {
  display: inline-block; }

.feed-sub-events {
  margin-left: 16px;
  margin-top: 10px; }

.feed-comment-body {
  font-size: 11px;
  line-height: 18px;
  position: relative;
  margin-left: 40px;
  word-wrap: break-word; }
  .feed-comment-body a {
    font-size: 11px; }

.feed-comments-item {
  position: relative;
  clear: both;
  background: rgba(0, 0, 0, 0.05);
  margin-top: 1px;
  padding: 5px; }

.feed-comment-form {
  clear: both;
  overflow: hidden;
  margin-top: 1px;
  line-height: 0; }

.feed-comments-item .feed-avatar-container {
  margin-right: 5px; }

.feed-comment-submit-button-area {
  float: right;
  margin-right: 0px;
  margin-top: 8px;
  display: none; }

.feed-story-infoarea {
  clear: both; }
  .feed-story-infoarea a {
    font-size: 11px; }

.feed-nothing-happening {
  position: relative;
  width: 100%;
  line-height: 18px; }
  .feed-nothing-happening p {
    font-size: 12px;
    color: #525252;
    padding: 10px 0; }
    .feed-nothing-happening p.feed-nothing-happening-empty {
      text-align: center;
      color: #8a8a8a;
      font-style: italic;
      padding-top: 13px;
      font-size: 12px;
      line-height: 15px;
      padding-bottom: 0; }
  .feed-nothing-happening ul {
    list-style-type: square;
    list-style-position: inside;
    text-indent: 16px;
    color: #353535;
    color: #353535;
    font-size: 12px; }
    .feed-nothing-happening ul li {
      padding-bottom: 3px; }

.feed-livefeed-item {
  border-bottom: 1px solid #F0F0EF; }

.feed-livefeed-avatar {
  float: left;
  padding: 9px 10px 9px 0px; }

.feed-livefeed-content {
  float: left;
  font-size: 12px; }

.feed-livefeed-text {
  float: none;
  padding-top: 13px;
  color: #2F3030; }

.feed-livefeed-ago {
  float: none;
  padding-top: 5px;
  color: #8a8a8a;
  font-size: 11px; }

.battlefeed .list .item:not(:hover) .feed-story-area-comment-and-like {
  display: inline-block; }

.feed-unlike-item a {
  color: #8A8A8A;
  font-size: 11px;
  position: relative;
  padding-right: 13px;
  cursor: pointer;
  display: inline-block; }

.feed-story-content .feed-unlike-item a span.icon {
  background: url(../base/shared/row_icon_chat.png) right -26px no-repeat;
  width: 13px;
  height: 13px;
  display: inline-block; }

.feed-award-image {
  float: left;
  margin-right: 6px;
  margin-bottom: 10px; }
  .feed-award-image .common-selected-server-mapimage {
    position: relative; }

.feed-gameaccess .common-selected-feed-image {
  display: table-cell;
  vertical-align: top;
  border: none; }
  .feed-gameaccess .common-selected-feed-image.feed-image-premium img {
    background: black;
    padding: 10px; }

.feed-award-info {
  font-size: 11px;
  display: table-cell;
  vertical-align: top;
  padding-left: 10px; }

.feed-gamereport-info {
  font-size: 11px;
  float: left;
  padding-bottom: 10px; }

.feed-addedfavserver-gameicon {
  display: inline-block;
  width: 30px;
  height: 10px; }

.feed-addedfavserver-and {
  font-size: 12px;
  margin-right: 3px; }

.feed-bundle:hover .feed-story-delete, .feed-single-item:hover .feed-story-delete {
  background: url(../base/shared/row_icon_chat_light.png) 0 -26px;
  width: 13px;
  height: 13px;
  position: relative;
  float: right;
  cursor: pointer; }

.feed-bundle:hover .feed-story-delete:hover, .feed-single-item:hover .feed-story-delete:hover {
  background-position: 0 -39px; }

.feed-media-preview-remove {
  background: url(../base/shared/row_icon_chat_light.png) 0 -26px;
  width: 13px;
  height: 13px;
  position: relative;
  float: right;
  cursor: pointer; }

/*
#feed-addlinkwithpreviewarea {
    background: #fff;
    position: relative;
    top: -1px;
    padding: 10px;
    border: 1px solid #ABABAB;
    border-color: #E6E6E6 #ccc #ccc;
    label {
        color: #353535;
        font-size: 13px;
    }
}
*/
/*
.feed-link-preview {
    width: 626px;
    height: 25px;
    color: #353535;
    font-size: 16px;
    font-weight: normal;
    margin-top: 6px;
}
*/
.feed-media-preview-remove:hover {
  background-position: 0 -39px; }

.feed-bundle:hover #feed-optionsbutton, .feed-single-item:hover #feed-optionsbutton {
  background: url(../base/shared/row_icon_chat.png) 0 -26px;
  width: 13px;
  height: 13px;
  position: absolute;
  right: 5px;
  top: 5px;
  cursor: pointer; }

.feed-bundle:hover #feed-optionsbutton:hover, .feed-single-item:hover #feed-optionsbutton:hover {
  background-position: 0 -39px; }

#feed-optionsbutton-container {
  position: absolute;
  right: 0;
  top: 0;
  background: #f00; }

.feed-bundle:hover #feed-story-options, .feed-single-item:hover #feed-story-options {
  background: url(../base/shared/row_icon_chat.png) 0 -26px;
  width: 13px;
  height: 13px;
  position: relative;
  right: 5px;
  top: 5px;
  cursor: pointer; }

.feed-bundle:hover #feed-story-options:hover, .feed-single-item:hover #feed-story-options:hover {
  background-position: 0 -39px; }

#feed-optionsbutton-dropdown {
  position: absolute;
  width: 120px;
  top: 20px;
  right: 0px;
  z-index: 100;
  display: none;
  background-color: white;
  border: 1px solid #aaa;
  display: none; }
  #feed-optionsbutton-dropdown .active {
    display: block; }

.feed-story-report-container {
  visibility: hidden;
  position: relative;
  float: right;
  margin-right: 2px;
  margin-top: 5px; }
  .feed-story-report-container .common-reportbutton {
    opacity: 0.5; }
    .feed-story-report-container .common-reportbutton:hover {
      opacity: 1; }

.feed-single-item:hover .feed-item-interaction-area .feed-story-report-container, .feed-comments-item:hover .feed-story-report-container, .feed-bundle:hover .feed-story-report-container {
  visibility: visible; }

.feed-comments-show {
  padding: 5px;
  cursor: pointer;
  color: #308DBF;
  background: rgba(0, 0, 0, 0.2);
  border-bottom: 0; }
  .feed-comments-show:hover {
    text-decoration: underline; }

.feed-textlimit-counter {
  position: absolute;
  margin-top: 4px;
  color: #a8a8a8;
  font-size: 11px; }

.feed-textlimit-fillout {
  float: right;
  position: relative;
  margin-top: 19px;
  margin-right: 12px; }

.feed-view-center-loader {
  text-align: center; }

#feed-view-more-events-loading {
  display: none;
  margin-top: 16px;
  margin-left: auto;
  margin-right: auto;
  z-index: 20; }

.feed-comments-item:hover .feed-story-comment-delete {
  background: url(../base/shared/row_icon_chat_light.png) 0 -26px;
  width: 13px;
  height: 13px;
  position: relative;
  float: right;
  cursor: pointer;
  margin-top: 5px;
  margin-right: 5px;
  z-index: 2; }
  .feed-comments-item:hover .feed-story-comment-delete:hover {
    background-position: 0 -39px;
    z-index: 2; }

.feed-ago {
  font-size: 11px; }

.feed-item-interaction-area {
  position: absolute;
  right: 0;
  width: 40px;
  top: 4px; }

.feed-item-platoonbadge {
  margin-bottom: 6px; }

.feed-coop-level-complete-icon {
  background: url(../coop/difficulty-sprite.png) -2px 2px no-repeat;
  width: 19px;
  height: 19px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2; }

.feed-media-preview {
  position: relative;
  display: table;
  width: 100%;
  margin-top: 8px; }

#feed-media-preview-view-now-link {
  display: table-row; }

.feed-media-preview-thumb {
  display: table-cell;
  margin-left: 0px;
  margin-right: 10px;
  position: relative;
  width: 150px; }

.feed-media-preview-description {
  display: table-cell;
  padding: 0 0 0 12px;
  line-height: 18px;
  vertical-align: top; }
  .feed-media-preview-description h3 {
    font-size: 16px;
    line-height: 18px; }

.feed-media-preview-remove {
  position: absolute;
  top: 0px;
  right: 6px; }

.feed-media-preview-show-now {
  clear: both;
  position: absolute;
  top: 0px;
  left: 0px;
  width: inherit;
  height: 100%; }

.feed-media-preview-show-now-icon {
  background: url(../feed/icon-play.png) no-repeat;
  width: 34px;
  height: 34px;
  left: 50%;
  top: 50%;
  position: absolute;
  margin-left: -17px;
  margin-top: -17px; }

.feed-media-preview-show-now:hover .feed-media-preview-show-now-icon {
  background-position: 0 -34px; }

#feed-addlink-container {
  color: #8a8a8a;
  font-size: 12px;
  padding-top: 8px; }

.feed-update-status-terms {
  color: #898989;
  font-size: 11px;
  font-weight: normal;
  margin-right: 10px; }

.feed-update-status-button {
  float: right;
  margin: 10px 0;
  margin-top: 8px;
  z-index: 999;
  position: relative; }

#feed-addlinkwithpreview {
  cursor: pointer; }

.feed-addlink-container {
  font-size: 11px;
  color: #8a8a8a; }

.feed-link-preview-label {
  line-height: 24px;
  font-size: 12px; }
  .feed-link-preview-label input {
    width: 607px;
    margin-left: -1px; }

#feed-hidden-by-admin {
  color: #8A8A8A;
  display: block;
  font-size: 12px;
  padding: 30px;
  text-align: center; }

.common-reportbutton-dropdown a {
  font-weight: normal;
  color: #000; }

/*
.feed-like-item a {
    :hover {
        text-decoration: underline;
    }
    cursor: pointer;
}

.feed-unlike-item a {
    :hover {
        text-decoration: underline;
    }
    cursor: pointer;
}
*/
form.wallpost .wall-message-container {
  height: 32px;
  overflow: hidden; }
form.wallpost .btn-small {
  margin-left: 8px;
  box-sizing: border-box; }
form.wallpost textarea {
  overflow: hidden;
  resize: none;
  width: 100%;
  resize: none;
  height: 14px;
  line-height: 14px;
  font-family: Arial, sans-serif;
  font-size: 14px;
  box-sizing: border-box; }

#feed-share-dialog {
  position: absolute;
  z-index: 5000;
  width: 145px;
  height: 92px;
  background-color: #f4f4f4;
  padding: 5px;
  border-radius: 5px;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.5); }
  #feed-share-dialog .share-container {
    width: 125px;
    height: 73px;
    padding: 10px;
    background-color: #fff;
    text-align: center; }
  #feed-share-dialog .callout:before {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none; }
  #feed-share-dialog .callout:after {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(0, 0, 0, 0);
    border-top-color: #f4f4f4;
    border-width: 10px;
    left: 50%;
    margin-left: -10px; }
  #feed-share-dialog .close-dialog {
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0;
    background-color: #f4f4f4;
    padding: 5px;
    font-size: 20px;
    line-height: 10px;
    color: #222; }
  #feed-share-dialog .share-option {
    display: inline-block;
    height: 55px;
    width: 55px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    cursor: pointer; }
  #feed-share-dialog .share-tw {
    background-image: url(../feed/share_tw.png); }
  #feed-share-dialog .share-fb {
    background-image: url(../feed/share_fb.png); }
  #feed-share-dialog .share-link {
    font-size: 11px;
    display: block;
    position: absolute;
    top: 70px;
    width: 125px;
    box-sizing: border-box; }

.dialog.facebook-infopopup section.dialog-body {
  padding: 24px 30px 24px 30px;
  font-size: 14px; }
.dialog.facebook-infopopup h1 {
  font-size: 23px;
  line-height: 28px;
  text-align: center;
  padding-left: 70px;
  padding-right: 70px;
  padding-top: 67px;
  background: url(../facebook/icon-fb-l.png) no-repeat;
  background-position: center 0px; }
.dialog.facebook-infopopup p {
  color: #a8a8a8;
  margin-top: 24px;
  margin-bottom: 24px; }
  .dialog.facebook-infopopup p b {
    font-weight: bold;
    color: #fff; }
.dialog.facebook-infopopup ul {
  padding-left: 16px; }
  .dialog.facebook-infopopup ul li {
    list-style-type: disc;
    padding-left: 5px; }
.dialog.facebook-infopopup footer button {
  margin-left: 7px;
  margin-right: 7px; }

.dialog.facebook-friendfinder .dialog-body {
  padding: 16px;
  padding-top: 22px;
  min-height: 60px; }
  .dialog.facebook-friendfinder .dialog-body .info {
    margin-bottom: 20px; }
  .dialog.facebook-friendfinder .dialog-body .friendfinder-content {
    text-align: center; }
  .dialog.facebook-friendfinder .dialog-body button.connect {
    margin-top: 4px; }
  .dialog.facebook-friendfinder .dialog-body h4 {
    margin: 4px 0 4px 0;
    font-family: "Arial";
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: left;
    color: #fff; }
  .dialog.facebook-friendfinder .dialog-body ol li {
    margin-bottom: 12px;
    padding-right: 16px; }
    .dialog.facebook-friendfinder .dialog-body ol li:hover {
      background: rgba(255, 255, 255, 0.2); }
    .dialog.facebook-friendfinder .dialog-body ol li img {
      float: left;
      margin-right: 12px; }
    .dialog.facebook-friendfinder .dialog-body ol li .user-info {
      float: left;
      text-align: left;
      margin-top: 6px; }
      .dialog.facebook-friendfinder .dialog-body ol li .user-info .username {
        display: block;
        text-decoration: inherit; }
        .dialog.facebook-friendfinder .dialog-body ol li .user-info .username:hover {
          color: #fff;
          text-decoration: underline; }
      .dialog.facebook-friendfinder .dialog-body ol li .user-info .realname {
        display: block;
        color: #a8a8a8; }
    .dialog.facebook-friendfinder .dialog-body ol li button {
      float: right;
      margin-top: 8px; }
.dialog.facebook-friendfinder footer {
  padding: 26px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  display: none; }
  .dialog.facebook-friendfinder footer .sharing .switch {
    margin-right: 10px; }
  .dialog.facebook-friendfinder footer button {
    margin-top: 16px; }

#comcenter-area .facebook-friendfinder, #feed-container .facebook-friendfinder {
  background: url(../facebook/icon-fb-l.png) no-repeat;
  background-position: center 80px;
  padding-top: 140px;
  margin-right: 15px;
  text-align: center;
  position: relative;
  z-index: 1; }
  #comcenter-area .facebook-friendfinder p, #feed-container .facebook-friendfinder p {
    margin-bottom: 12px;
    text-transform: none;
    font-family: Arial;
    font-size: 14px;
    line-height: 1.5em;
    color: #a8a8a8; }
  #comcenter-area .facebook-friendfinder button, #feed-container .facebook-friendfinder button {
    cursor: pointer; }

#feed-container .facebook-friendfinder {
  background-position: center 0;
  padding-top: 55px;
  margin-bottom: 20px; }

#comcenter-area .comcenter-no-online-friends .facebook-friendfinder {
  margin-right: 0; }

@-webkit-keyframes pulsing-icon {
  0% {
    opacity: 0.2; }

  50% {
    opacity: 1; }

  100% {
    opacity: 0.2; } }

@-moz-keyframes pulsing-icon {
  0% {
    opacity: 0.2; }

  50% {
    opacity: 1; }

  100% {
    opacity: 0.2; } }

-o-keyframes pulsing-icon 0% {
  opacity: 0.2; }
-o-keyframes pulsing-icon 50% {
  opacity: 1; }
-o-keyframes pulsing-icon 100% {
  opacity: 0.2; }

@-ms-keyframes pulsing-icon {
  0% {
    opacity: 0.2; }

  50% {
    opacity: 1; }

  100% {
    opacity: 0.2; } }

@keyframes pulsing-icon {
  0% {
    opacity: 0.2; }

  50% {
    opacity: 1; }

  100% {
    opacity: 0.2; } }

.npx-explorer-icon {
  position: absolute;
  display: inline-block;
  width: 35px;
  height: 35px;
  background-image: url(//eaassets-a.akamaihd.net/battlelog/bb/bfh/icons/npx-icon-f371f6ea.png);
  cursor: pointer;
  -webkit-animation: pulsing-icon 2s ease infinite both;
  -moz-animation: pulsing-icon 2s ease infinite both;
  -ms-animation: pulsing-icon 2s ease infinite both;
  -o-animation: pulsing-icon 2s ease infinite both;
  animation: pulsing-icon 2s ease infinite both;
  z-index: 100; }
  .npx-explorer-icon.fixed {
    position: fixed; }
  .npx-explorer-icon[data-feature='leaderboards'], .npx-explorer-icon[data-feature='forum'] {
    z-index: 1000; }

.base-section-menu .npx-explorer-icon, #base-header-secondary-nav .npx-explorer-icon {
  top: 30px;
  left: 50%; }

#ugm-action-buttons .npx-explorer-icon {
  top: -2px;
  left: 7px; }

.profile-stats-tab.loadout {
  position: relative; }
  .profile-stats-tab.loadout .npx-explorer-icon {
    top: 7px;
    left: 10px; }

.npx-tooltip {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  -webkit-backface-visibility: hidden; }
  .npx-tooltip.success .npx-tooltip-box {
    border-color: #05d705;
    background: -webkit-radial-gradient(center, ellipse cover, #044903 0, #0b7a07 90%);
    background: -moz-radial-gradient(center, ellipse cover, #044903 0, #0b7a07 90%);
    background: radial, ellipse cover center, #044903 0, #0b7a07 90%; }
    .npx-tooltip.success .npx-tooltip-box:after {
      content: " ";
      display: block;
      width: 114px;
      height: 100%;
      position: absolute;
      top: 0;
      left: 50%;
      margin-left: -57px;
      background-image: url(../npx/check.png);
      background-repeat: no-repeat;
      background-size: contain;
      background-position: center; }
    .npx-tooltip.success .npx-tooltip-box h5, .npx-tooltip.success .npx-tooltip-box p, .npx-tooltip.success .npx-tooltip-box .close {
      opacity: 0; }
  .npx-tooltip.success .arrow {
    background-image: url(../npx/green-arrow.png); }
  .npx-tooltip.success.top .arrow {
    background-image: url(../npx/green-arrow-down.png); }
  .npx-tooltip .arrow {
    display: block;
    width: 21px;
    height: 12px;
    position: absolute;
    left: 50%;
    margin-left: -10px;
    background-image: url(../npx/blue-arrow.png);
    background-repeat: no-repeat;
    z-index: 90; }
  .npx-tooltip.fixed {
    position: fixed; }
  .npx-tooltip.bottom .arrow {
    top: -12px; }
  .npx-tooltip.top .arrow {
    bottom: -12px;
    background-image: url(../npx/blue-arrow-down.png); }
  .npx-tooltip .npx-tooltip-box {
    -webkit-backface-visibility: hidden;
    display: block;
    top: 11px;
    position: absolute;
    z-index: 80;
    width: 220px;
    margin-left: -108px;
    background-color: #10212B;
    text-align: left;
    border-radius: 4px; }
    .npx-tooltip .npx-tooltip-box .content {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      -webkit-backface-visibility: hidden;
      overflow: hidden;
      margin: 12px; }
    .npx-tooltip .npx-tooltip-box .close {
      position: absolute;
      top: 5px;
      right: 5px;
      z-index: 200;
      display: block;
      width: 11px;
      height: 11px;
      background-image: url(../npx/close.png);
      cursor: pointer; }
    .npx-tooltip .npx-tooltip-box h5 {
      font-size: 14px;
      line-height: 16px;
      margin: 0 0 4px 0;
      color: #FFF; }
    .npx-tooltip .npx-tooltip-box p {
      color: #FFF;
      font-size: 12px;
      line-height: 16px; }
    .npx-tooltip .npx-tooltip-box .swiping-glow {
      -webkit-backface-visibility: hidden;
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 100;
      overflow: hidden; }
      .npx-tooltip .npx-tooltip-box .swiping-glow > div {
        content: " ";
        width: 123px;
        height: 100%;
        background-image: url(../npx/swiping-glow.png);
        background-repeat: no-repeat;
        display: block;
        position: absolute;
        top: 0;
        left: -150px;
        background-size: cover; }

@media screen and (min-width: 1261px) {
  html:not(.is-touch) body:not(.no-comcenter) .dialog.npx-console {
    width: 980px;
    margin-left: -490px; } }

.dialog.npx-console {
  min-width: 819px;
  height: 80%;
  max-height: 500px;
  width: 80%;
  margin-left: -40%;
  top: 10%; }
  .dialog.npx-console section {
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%; }
  .dialog.npx-console .dialog-body {
    padding: 0px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%; }
  .dialog.npx-console .card {
    padding: 0;
    text-align: center;
    position: absolute;
    left: 0px;
    top: 32px;
    right: 0px;
    bottom: 0px;
    height: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Purista;
    display: none; }
    .dialog.npx-console .card .card-content {
      position: relative;
      width: 100%;
      margin: 0px auto;
      padding-top: 50px;
      height: 100%;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box; }
      .dialog.npx-console .card .card-content:before, .dialog.npx-console .card .card-content:after {
        display: table;
        content: "";
        line-height: 0; }
      .dialog.npx-console .card .card-content:after {
        clear: both; }
      .dialog.npx-console .card .card-content figure {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: left;
        width: 50%; }
      .dialog.npx-console .card .card-content article {
        position: relative;
        height: 66%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: left;
        width: 50%;
        text-align: left;
        padding-top: 20px;
        padding-left: 80px;
        min-height: 300px; }
        .dialog.npx-console .card .card-content article h2 {
          text-transform: uppercase;
          font-size: 36px;
          margin: 0;
          padding: 0;
          line-height: 1.1em;
          margin-bottom: 16px; }
        .dialog.npx-console .card .card-content article p {
          font-size: 19px;
          margin: 0 0 1.5em 0;
          padding: 0; }
          .dialog.npx-console .card .card-content article p small {
            color: #a8a8a8; }
        .dialog.npx-console .card .card-content article .btn {
          position: absolute;
          bottom: 0; }
    .dialog.npx-console .card.show {
      display: block;
      z-index: 10; }

.dialog.npx-pc {
  width: 845px;
  background-image: url("//d34ymitoc1pg7m.cloudfront.net/bf4/npx/pc/first-login-1-23e2dc67.png");
  background-position: bottom right;
  background-repeat: no-repeat; }
  .dialog.npx-pc .dialog-body {
    padding: 25px 40px; }
  .dialog.npx-pc h6, .dialog.npx-pc p {
    width: 330px; }
  .dialog.npx-pc h1 {
    width: 670px;
    font-size: 50px;
    line-height: 50px; }
  .dialog.npx-pc h6 {
    font-size: 19px;
    line-height: 28px;
    text-transform: none;
    font-weight: 400; }
  .dialog.npx-pc p {
    font-size: 14px;
    color: #a8a8a8; }
  .dialog.npx-pc footer {
    width: 350px; }

.comcenter-icon-notifications-container, #comcenter-icon-notifications, #comcenter-icon-game, #comcenter-icon-inbox, #comcenter-icon-matches {
  float: left;
  width: 40px;
  cursor: pointer;
  position: relative;
  height: 40px; }

.comcenter-icon-notifications-container:hover {
  background: url(../comcenter/taskbar-bg-hover.png); }

#comcenter-reports-list-loading, #comcenter-updates-list-loading {
  padding-top: 16px;
  text-align: center; }

#comcenter-icon-inbox {
  background: url(../comcenter/icons/cc-inbox-inactive.png) center center no-repeat; }
  #comcenter-icon-inbox:hover {
    background: url(../comcenter/cc-inbox-hover.png) no-repeat;
    background-position: 1px 1px; }

#comcenter-icon-game {
  background: url(../comcenter/icons/cc-reports.png) -5px 0 no-repeat; }

#comcenter-icon-matches {
  background: url(../comcenter/icons/cc-matches.png) -4px 0 no-repeat; }
  #comcenter-icon-matches:hover {
    background-position: -4px -40px; }
  #comcenter-icon-matches.open {
    background-color: #FDBF00;
    background-position: -4px -80px; }

#comcenter-tab-friends-content .btn.btn-small.join-friend-submit-link, .comcenter-chat-content .btn.btn-small.join-friend-submit-link {
  width: 32px;
  height: 32px;
  padding: 0 11px;
  margin-top: 4px;
  opacity: 0.8;
  float: left;
  border: 1px solid #ff9900; }
  #comcenter-tab-friends-content .btn.btn-small.join-friend-submit-link:hover, .comcenter-chat-content .btn.btn-small.join-friend-submit-link:hover {
    opacity: 1; }
  #comcenter-tab-friends-content .btn.btn-small.join-friend-submit-link.disabled, #comcenter-tab-friends-content .is-touch #serverbrowser aside .action-buttons-container .btn-small.join-friend-submit-link.favorite-toggle.starred, .is-touch #serverbrowser aside .action-buttons-container #comcenter-tab-friends-content .btn-small.join-friend-submit-link.favorite-toggle.starred, .comcenter-chat-content .btn.btn-small.join-friend-submit-link.disabled, .comcenter-chat-content .is-touch #serverbrowser aside .action-buttons-container .btn-small.join-friend-submit-link.favorite-toggle.starred, .is-touch #serverbrowser aside .action-buttons-container .comcenter-chat-content .btn-small.join-friend-submit-link.favorite-toggle.starred {
    opacity: 0.5; }
  #comcenter-tab-friends-content .btn.btn-small.join-friend-submit-link.btn-primary, .comcenter-chat-content .btn.btn-small.join-friend-submit-link.btn-primary {
    opacity: 1;
    width: 23px;
    height: 24px;
    padding: 0;
    margin-top: 2px; }
    #comcenter-tab-friends-content .btn.btn-small.join-friend-submit-link.btn-primary i, .comcenter-chat-content .btn.btn-small.join-friend-submit-link.btn-primary i {
      margin-top: 0;
      margin-left: 2px;
      padding-bottom: 1px; }
  #comcenter-tab-friends-content .btn.btn-small.join-friend-submit-link i, .comcenter-chat-content .btn.btn-small.join-friend-submit-link i {
    margin-top: 8px;
    background: url(../base/shared/icon-join.png) 0 0 no-repeat;
    background-repeat: no-repeat;
    width: 10px;
    height: 10px; }

body .comcenter-chat-content .btn.btn-small.join-friend-submit-link {
  margin-top: 0px; }

#comcenter-icon-game.unread, #comcenter-icon-game:hover {
  background: url(../comcenter/icons/cc-reports.png) -5px -40px no-repeat;
  cursor: pointer; }

/*#comcenter-icon-game.unread,*/
body #comcenter-icon-game.open {
  background: url(../comcenter/icons/cc-reports.png) -5px -80px no-repeat #fdbf00; }

#comcenter-icon-inbox.unread, #comcenter-icon-inbox.open {
  background: url(../comcenter/icons/cc-inbox-open.png) center center no-repeat #fdbf00; }

#comcenter-icon-notifications {
  background: url(../comcenter/icons/cc-notifications.png) -4px 0; }
  #comcenter-icon-notifications:hover {
    background-position: -4px -40px; }

/*
#comcenter-icon-notifications.unread
{
    background: url(../comcenter/icons/cc-notification-new.png) center center no-repeat;
}*/
/* #comcenter-icon-notifications:hover,*/
/*#comcenter-icon-notifications.unread,*/
#comcenter-icon-notifications.open {
  background-color: #FDBF00;
  background-position: -4px 40px; }

.comcenter-inbox-notifier {
  cursor: pointer; }

#base-header .comcenter-notification:hover, #base-header .comcenter-inbox-notifier:hover, #base-header .comcenter-notifications-moreinfo:hover {
  background: rgba(255, 255, 255, 0.1); }

#comcenter-icon-inbox.unread .comcenter-chat-unread {
  /* #comcenter-icon-notifications.unread .comcenter-chat-unread { */
  display: block; }

#comcenter .comcenter-chat-taskbar.unread .icon.chat.unread {
  display: block; }

body #comcenter .comcenter-chat-taskbar.active .icon.chat.unread {
  display: none; }

.chat-admin-info {
  text-align: center;
  color: #fff; }

#comcenter-icon-notifications.unread {
  background-position: -4px 80px; }
  #comcenter-icon-notifications.unread .comcenter-chat-unread {
    display: block; }

#comcenter-icon-game.unread .comcenter-chat-unread {
  display: block; }
#comcenter-icon-game.open .comcenter-chat-unread {
  display: none; }

#comcenter-icon-notifications.open .comcenter-chat-unread {
  display: none; }

#comcenter {
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 2000;
  font-size: 11px;
  font-weight: bold;
  color: #494949;
  line-height: 42px;
  height: 0; }
  #comcenter #comcenter-inner {
    height: 100%; }

.ugm-showing #comcenter {
  bottom: 42px; }

@-webkit-keyframes comcenter-friend-online {
  0% {
    background-color: rgba(168, 168, 168, 0); }

  100% {
    background-color: rgba(168, 168, 168, 0.6); } }

@-moz-keyframes comcenter-friend-online {
  0% {
    background-color: rgba(168, 168, 168, 0); }

  100% {
    background-color: rgba(168, 168, 168, 0.6); } }

-o-keyframes comcenter-friend-online 0% {
  background-color: rgba(168, 168, 168, 0); }
-o-keyframes comcenter-friend-online 100% {
  background-color: rgba(168, 168, 168, 0.6); }

@-ms-keyframes comcenter-friend-online {
  0% {
    background-color: rgba(168, 168, 168, 0); }

  100% {
    background-color: rgba(168, 168, 168, 0.6); } }

@keyframes comcenter-friend-online {
  0% {
    background-color: rgba(168, 168, 168, 0); }

  100% {
    background-color: rgba(168, 168, 168, 0.6); } }

#comcenter-friends .comcenter-friend {
  /* Fallback for legacy browsers (IE9) */ }
  #comcenter-friends .comcenter-friend.comcenter-friend-online.animate-ie9, #comcenter-friends .comcenter-friend.comcenter-friend-playing.animate-ie9 {
    background-color: rgba(168, 168, 168, 0.6); }
  #comcenter-friends .comcenter-friend.comcenter-friend-online.animate {
    -webkit-animation-name: comcenter-friend-online;
    -moz-animation-name: comcenter-friend-online;
    -ms-animation-name: comcenter-friend-online;
    -o-animation-name: comcenter-friend-online;
    animation-name: comcenter-friend-online;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -ms-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
    -webkit-animation-iteration-count: 2;
    -moz-animation-iteration-count: 2;
    -ms-animation-iteration-count: 2;
    -o-animation-iteration-count: 2;
    animation-iteration-count: 2; }
  #comcenter-friends .comcenter-friend.comcenter-friend-playing, #comcenter-friends .comcenter-friend.comcenter-friend-online {
    color: #6f6; }
  #comcenter-friends .comcenter-friend.comcenter-friend-idle {
    color: #FF0; }
  #comcenter-friends .comcenter-friend.comcenter-friend-offline {
    color: #999; }
    #comcenter-friends .comcenter-friend.comcenter-friend-offline a {
      color: #8a8a8a;
      font-weight: normal;
      text-decoration: none; }
      #comcenter-friends .comcenter-friend.comcenter-friend-offline a:hover {
        color: #8a8a8a;
        font-weight: normal;
        text-decoration: none; }
  #comcenter-friends .comcenter-friend.comcenter-friend-dnd {
    color: #F99; }

.comcenter-info {
  float: left;
  position: relative;
  margin-left: 3px; }

#patcher-events #patching, #comcenter-joinflow, #comcenter-gamereportupdates-preview, #comcenter-inbox-preview, #comcenter-notifications, #comcenter-matches {
  display: none;
  width: 213px;
  background: #fdfdfd;
  border: 1px solid #aaaaaa;
  border-bottom: 0px;
  position: absolute;
  bottom: 40px;
  left: 104px;
  z-index: 2000; }

#comcenter-notifications {
  left: 0;
  width: 230px; }

#comcenter-matches {
  left: 0;
  width: 269px; }

#patcher-events #patching, #comcenter-joinflow {
  display: none;
  height: 224px;
  top: -225px;
  left: -1px;
  width: 229px; }

#patcher-events #patching {
  display: block; }

#gamecontrol-game-launcher #comcenter-joinflow {
  display: block; }
  #gamecontrol-game-launcher #comcenter-joinflow.askForFullscreen {
    height: 264px;
    top: -265px; }

#comcenter-gamereportupdates-preview {
  left: -1px;
  width: 229px; }

#comcenter-inbox-preview {
  left: -1px; }

.comcenter-notification-icon {
  float: left;
  width: 34px;
  left: 0;
  position: absolute; }

.comcenter-notification-text {
  padding-left: 40px;
  position: relative;
  min-height: 35px;
  font-weight: normal;
  font-size: 12px; }
  .comcenter-notification-text a {
    font-size: 12px; }

.comcenter-notification-text.missions {
  min-height: 44px; }

.comcenter-notifications-bottom {
  clear: both;
  height: 4px;
  width: 100%;
  background: #ffc600; }

#comcenter-notifications a {
  color: #1c799d;
  font-size: 11px;
  text-decoration: none; }

.comcenter-notification-title {
  height: 33px;
  font-weight: bold;
  color: #000;
  text-transform: uppercase;
  background: #ebebeb;
  border-bottom: 1px solid #221e25;
  text-transform: uppercase;
  color: #000;
  text-shadow: 0 1px #fff;
  font-size: 11px;
  font-weight: bold;
  line-height: 33px;
  overflow: hidden;
  padding-left: 12px; }

.comcenter-notification-content {
  color: #000;
  max-height: 500px;
  overflow-y: auto; }
  .comcenter-notification-content a {
    font-size: 11px; }

.comcenter-notification-list {
  position: relative; }

#challenges .iconbox {
  width: 52px; }

.comcenter-notification .iconbox, .inbox-notification .iconbox {
  position: absolute;
  width: 40px;
  height: 32px;
  left: 0; }
.comcenter-notification .icon, .inbox-notification .icon {
  margin-top: 8px;
  margin-left: 8px;
  width: 18px;
  height: 18px;
  display: inline-block;
  overflow: hidden;
  background: url(../notification/notification-icons.png) no-repeat; }
  .comcenter-notification .icon.friend, .inbox-notification .icon.friend {
    background-position: 0 -18px; }
  .comcenter-notification .icon.comment, .inbox-notification .icon.comment {
    background-position: 0 -36px; }
  .comcenter-notification .icon.platoon, .inbox-notification .icon.platoon {
    background-position: 0 -54px; }
  .comcenter-notification .icon.premium, .inbox-notification .icon.premium {
    background-position: 0 -72px; }

.comcenter-notifications-one-click {
  cursor: pointer; }

.comcenter-notification {
  line-height: 14px;
  border-bottom: 1px solid #302f33;
  padding: 10px;
  font-size: 12px;
  font-weight: normal; }
  .comcenter-notification.notfound {
    text-align: center;
    line-height: 24px;
    height: 42px;
    line-height: 42px; }
  .comcenter-notification a {
    color: #fff;
    font-weight: normal; }
  .comcenter-notification .base-profile-link {
    font-weight: bold; }
  .comcenter-notification.not-read {
    background: rgba(255, 255, 255, 0.05); }
  .comcenter-notification:last-child {
    border-bottom: 0; }

.comcenter-notification-ago {
  color: #afafaf;
  font-size: 11px;
  display: block; }

.comcenter-notifications-moreinfo {
  text-align: center;
  line-height: 28px; }
  .comcenter-notifications-moreinfo a {
    font-size: 12px;
    text-transform: uppercase;
    text-decoration: none;
    color: #fff;
    width: 100%;
    display: inline-block; }
    .comcenter-notifications-moreinfo a:hover {
      text-decoration: underline; }

.comcenter-section {
  width: 132px;
  height: 100%;
  float: left;
  border-right: 1px solid #838382;
  text-align: center; }
  .comcenter-section img {
    margin-top: 7px; }

#comcenter-friendbutton {
  cursor: pointer;
  height: 39px;
  line-height: 14px;
  border: 1px solid #393939;
  border-bottom: 0;
  width: 235px; }

.comcenter-divider-left, .comcenter-divider {
  float: right;
  width: 1px;
  height: 40px; }

.comcenter-divider-left {
  float: left; }

#comcenter-friendbutton.active .comcenter-taskbar-info {
  background: url(../comcenter/comcenter-active.png);
  color: #131110; }
#comcenter-friendbutton .comcenter-button-info, #comcenter-friendbutton .comcenter-button-title {
  color: #FFF;
  font-weight: bold;
  margin-left: 8px;
  text-transform: uppercase; }
#comcenter-friendbutton .comcenter-button-info {
  color: #ffc600;
  font-weight: normal;
  text-transform: none;
  width: 116px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis; }
#comcenter-friendbutton.active .comcenter-button-info {
  color: #58410b;
  text-shadow: 0 1px #fddd82;
  font-weight: normal; }
#comcenter-friendbutton .comcenter-origin-logo {
  background: transparent url(../base/shared/origin-logo.png) no-repeat 210px center;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%; }
#comcenter-friendbutton .comcenter-button-title {
  margin-top: 5px;
  font-size: 11px;
  font-family: Tahoma, Arial, sans-serif; }
#comcenter-friendbutton.active .comcenter-button-title {
  color: #000;
  text-shadow: 0 1px #fddd82; }

#comcenter-friends-list ul li {
  padding: 5px 0 5px 0;
  clear: both;
  overflow: auto;
  display: block; }
  #comcenter-friends-list ul li:hover {
    background-color: #e9e9e9; }

#comcenter-friends-list ul li img {
  margin: 0 5px 0 5px;
  float: left; }
#comcenter-friends-list ul li .main-profile-status-icon {
  margin: 5px 0 0 10px; }
#comcenter-friends-list ul li a {
  float: left;
  line-height: 18px;
  text-decoration: none; }

.comcenter-chat-header form.join-friend .base-general-dropdown-area {
  border: 1px solid #ccc;
  left: 86px;
  top: 30px; }

#comcenter-friends-list ul li .join-friend .base-button-arrow-tiny {
  height: 18px;
  float: right;
  margin-right: 8px;
  background: transparent url(../base/bfbc2/buttons/base-button-arrow-extra-small.png) repeat scroll 0 -36px; }
  #comcenter-friends-list ul li .join-friend .base-button-arrow-tiny:hover {
    background: url(../base/bfbc2/buttons/base-button-arrow-extra-small.png) 0 -18px; }
  #comcenter-friends-list ul li .join-friend .base-button-arrow-tiny:active {
    background: url(../base/bfbc2/buttons/base-button-arrow-extra-small.png) 0 -36px; }

#comcenter li .join-friend {
  height: 5px; }

#comcenter-friendcounter {
  position: relative;
  float: right;
  margin-right: 10px;
  width: 25px;
  height: 100%;
  background: url(../comcenter/friends-online.png) center left no-repeat;
  padding-left: 10px;
  color: #959595;
  font-size: 11px;
  font-weight: bold;
  font-family: Arial, sans-serif; }

#comcenter-friendsplaying {
  position: relative;
  float: right;
  margin-right: 0;
  width: 20px;
  height: 100%;
  background: url(../comcenter/friends-playing.png) center left no-repeat;
  padding-left: 10px;
  color: #959595;
  font-size: 11px;
  font-weight: bold;
  font-family: Arial, sans-serif; }

.comcenter-item {
  float: left; }

.comcenter-chat-status-icon {
  float: left;
  width: 18px;
  height: 100%; }

.comcenter-status-icon {
  float: left;
  width: 18px;
  height: 100%; }
  .comcenter-status-icon img {
    margin-left: 6px;
    margin-top: 14px; }

.comcenter-chat-status-icon img {
  margin-left: 6px;
  margin-top: 12px; }

.comcenter-dropdownbutton {
  height: 37px;
  width: 18px;
  position: absolute;
  right: 0px;
  top: 0px;
  display: none; }

.comcenter-dropdownbutton-inner {
  background: url(../comcenter/dropdownbutton.png);
  height: 13px;
  width: 13px;
  position: absolute;
  top: 11px; }

.comcenter-friend:hover .comcenter-dropdownbutton {
  display: block; }

.comcenter-dropdownbutton.active, .comcenter-dropdownbutton:hover {
  display: block; }
.comcenter-dropdownbutton.active .comcenter-dropdownbutton-inner, .comcenter-dropdownbutton:hover .comcenter-dropdownbutton-inner {
  background-position: 0 13px; }

.comcenter-dropdown {
  border: 1px solid #aaaaaa;
  width: 115px;
  background: #fff;
  position: absolute;
  right: 6px;
  top: 23px;
  z-index: 100; }
  .comcenter-dropdown a {
    display: block;
    font-size: 11px;
    padding: 0 10px;
    width: 95px;
    height: 25px;
    line-height: 25px; }

#comcenter-area .comcenter-dropdown li {
  border-bottom: 1px solid #ebebeb;
  height: 25px;
  font-size: 11px;
  line-height: 25px; }

.comcenter-dropdown li.inactive {
  cursor: default;
  color: #a8a8a8;
  padding: 0 10px;
  cursor: default !important; }

.comcenter-friend-item .comcenter-dropdown li:hover {
  background: #fff; }

.comcenter-chat-avatar-multi, .comcenter-chat-avatar-taskbar, .comcenter-avatar, .comcenter-chat-avatar {
  float: left;
  margin-right: 6px; }

#comcenter-friendrequests-list .comcenter-avatar {
  padding-left: 11px; }

.comcenter-chat-avatar-taskbar {
  margin: 0 2px;
  margin-top: 4px;
  line-height: normal; }

.comcenter-chat-group .comcenter-chat-avatar-taskbar {
  margin-top: 8px; }

.comcenter-chat-avatar-multi-free-slot {
  margin-top: 0px;
  margin-right: 2px;
  margin-left: 0px;
  position: relative;
  width: 26px;
  height: 26px;
  float: left;
  background: #202020;
  border-top: 1px solid #202020; }

.comcenter-chat-avatar-multi {
  margin-top: 0px;
  margin-right: 2px;
  margin-left: 0px;
  position: relative;
  width: 26px;
  height: 27px;
  line-height: 1; }
  .comcenter-chat-avatar-multi:hover .base-general-dropdown-area {
    display: block; }
  .comcenter-chat-avatar-multi .base-general-dropdown-area {
    display: none;
    background: rgba(0, 0, 0, 0.9);
    z-index: 100;
    top: 26px;
    width: 140px;
    line-height: 1; }
    .comcenter-chat-avatar-multi .base-general-dropdown-area a {
      color: #fff; }

.comcenter-chat-serverinfo-playing {
  color: #353535;
  font-weight: normal; }

.comcenter-chat-serverinfo a {
  font-size: 11px; }

.comcenter-chat-serverinfo-notplaying {
  color: #959595;
  text-align: center; }

.comcenter-chat-empty {
  text-align: center;
  position: absolute;
  top: 120px;
  height: 120px;
  width: 200px; }

.comcenter-no-online-friends {
  text-align: center;
  padding: 4px;
  color: #959595;
  z-index: 1;
  font-size: 12px;
  line-height: 23px;
  font-weight: bold; }
  .comcenter-no-online-friends img {
    margin-top: 18px; }
  .comcenter-no-online-friends .loader {
    position: relative;
    top: 60px; }

.comcenter-origin-unavailable {
  color: #cc382c;
  padding-top: 20px; }

#comcenter-tab-settings-content {
  position: relative;
  overflow-y: scroll;
  overflow-x: hidden; }

.chat-header {
  position: relative;
  text-transform: uppercase;
  color: #000;
  text-shadow: 0 1px #fff;
  font-size: 11px;
  font-weight: bold;
  height: 34px;
  background: #ebebeb;
  border-bottom: 1px solid #bebebe;
  font-weight: bold;
  line-height: 33px; }

.comcenter-chat-contract {
  cursor: pointer;
  position: absolute;
  right: 6px;
  background: url(../base/shared/row_icon_chat.png);
  background-position: 0px 0px;
  height: 13px;
  top: 10px;
  width: 13px; }

.chat-header .comcenter-chat-contract {
  position: absolute;
  right: 22px; }

.chat-header .comcenter-username {
  position: absolute;
  right: 36px;
  height: 34px; }

.comcenter-chat-group .chat-header .comcenter-chat-contract {
  position: relative;
  right: 6px;
  float: right; }

.comcenter-close-group, .comcenter-close {
  cursor: pointer;
  position: relative;
  float: right;
  margin-right: 4px;
  top: 14px;
  background: url(../base/shared/row_icon_chat.png);
  background-position: 0px 26px;
  height: 13px;
  width: 13px; }

.comcenter-chat-party-menu {
  cursor: pointer;
  position: relative;
  float: right;
  margin-right: 4px;
  top: 10px; }

.comcenter-chat-party-menu-icon {
  cursor: pointer;
  position: relative;
  position: -2px;
  height: 14px;
  width: 14px;
  background-size: cover;
  background: url(../ui/icons-small.png) no-repeat;
  background-position: -14px -42px;
  opacity: 0.3; }
  .comcenter-chat-party-menu-icon:hover {
    opacity: 0.8; }

.comcenter-close-group {
  display: none;
  background-position: 0px 13px; }

.comcenter-close:hover {
  background-position: 0px 13px; }

.chat-header .comcenter-close-group, .chat-header .comcenter-close {
  top: 10px; }

#comcenter-notifications.comcenter-notification-padder {
  left: 2px; }

.chat-header {
  position: relative;
  z-index: 100;
  /*cursor:pointer;*/ }

.comcenter-contract:hover, .comcenter-chat-contract:hover {
  background-position: 0px -13px; }

.chat-members {
  display: none;
  position: absolute;
  top: 34px;
  left: 0;
  right: 0;
  bottom: 38px;
  background: #000;
  z-index: 1;
  overflow-y: auto; }
  .chat-members .chattitle {
    font-family: Tahoma, Arial, sans-serif;
    color: #8a8a8a;
    font-size: 13px;
    text-transform: uppercase;
    display: block;
    margin: 0px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0 6px;
    font-weight: normal;
    line-height: 20px; }
  .comcenter-chat-taskbar.showmembers .chat-members {
    display: block; }
  .chat-members .close-chat-members {
    position: fixed;
    bottom: 0px;
    left: 0;
    right: 0;
    height: 30px;
    text-align: center; }
  .chat-members .comcenter-chat-member {
    padding: 6px;
    clear: both;
    position: relative;
    border-bottom: 1px solid #2E2E2E; }
    .chat-members .comcenter-chat-member .join-friend-generic-button {
      position: absolute;
      top: 8px;
      right: 8px; }
    .chat-members .comcenter-chat-member .comcenter-chat-member-actions {
      text-align: right;
      position: absolute;
      top: 4px;
      right: 6px; }
    .chat-members .comcenter-chat-member .comcenter-chat-username {
      color: #8a8a8a;
      font-weight: normal;
      line-height: 18px;
      font-size: 12px;
      margin-left: 4px; }
    .chat-members .comcenter-chat-member .comcenter-chat-member-actions li {
      float: left;
      margin-right: 6px; }

.chat-member-close {
  display: none;
  position: absolute;
  z-index: 2;
  bottom: 0;
  height: 38px;
  line-height: 38px;
  left: 0;
  right: 0;
  background: #000;
  text-align: center;
  border-top: 1px solid #2E2E2E; }
  .comcenter-chat-taskbar.showmembers .chat-member-close {
    display: block; }

.comcenter-chat-group-header {
  border-top: 1px solid #d2d2d2;
  line-height: 34px;
  background: none;
  clear: both;
  position: relative;
  height: 34px; }

.comcenter-chat-header {
  height: 33px;
  position: relative;
  border-bottom: 1px solid #ccc;
  padding: 0 5px; }

.comcenter-chat-idle, .comcenter-chat-offline, .comcenter-chat-server {
  text-align: center;
  color: #8a8a8a;
  border-bottom: 1px solid #ccc; }

.comcenter-chat-header-origin {
  line-height: 17px; }

.chat-header-group-chat {
  float: left;
  padding-left: 6px;
  font-size: 12px;
  white-space: nowrap;
  max-width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: none; }

.chat-header-group-name-area {
  position: absolute;
  top: 0px;
  left: 5px;
  z-index: 2;
  width: 181px;
  display: none;
  background: #EBEBEB; }

.chat-header-submit {
  font-size: 11px; }

.chat-header-group-chat-editname {
  display: block;
  background: url(../comcenter/chat-edit.png) no-repeat 0 0;
  height: 14px;
  width: 14px;
  float: left;
  margin-left: 6px;
  margin-top: 9px; }
  .chat-header-group-chat-editname:hover {
    background-position: 0 -14px; }

.chat-header-group-name-area-input {
  width: 120px; }

.comcenter-chat-group-avatars {
  white-space: nowrap;
  margin-left: 4px;
  margin-top: 0px;
  position: Relative; }

.comcenter-chat-platoon .comcenter-chat-group-avatars {
  width: 135px; }

.comcenter-chat-group-expand {
  background: url(../base/shared/row_icon_collapse_expand.png);
  width: 12px;
  height: 12px;
  float: left;
  margin-top: 14px;
  margin-left: 6px;
  cursor: pointer; }
  .comcenter-chat-group-expand:hover {
    background-position: 0px -12px; }
  .comcenter-chat-group-expand.active {
    background-position: 0px 24px; }
    .comcenter-chat-group-expand.active:hover {
      background-position: 0px 12px; }

.comcenter-chat-group-expanded-header {
  background: none repeat scroll 0 0 #fdfdfd;
  height: 257px;
  position: absolute;
  top: 76px;
  z-index: 20;
  width: 230px;
  overflow-y: scroll;
  display: none; }

.comcenter-chat-group-usernames {
  clear: both;
  margin-left: 6px;
  margin-top: 0px; }
  .comcenter-chat-group-usernames a {
    font-size: 11px;
    font-weight: normal; }

.comcenter-chat-username-you {
  float: left;
  width: 154px;
  overflow: hidden;
  white-space: nowrap;
  color: #959595;
  font-weight: bold;
  font-size: 11px; }

.comcenter-chat-username-other {
  float: left;
  width: 154px;
  overflow: hidden;
  white-space: nowrap;
  color: #959595;
  font-weight: bold;
  font-size: 11px; }
  .comcenter-chat-username-other a {
    font-size: 11px; }

.comcenter-chat-timestamp {
  float: right;
  color: #cacaca;
  font-size: 9px; }

.comcenter-chat-message-content {
  clear: both;
  color: #353535;
  font-weight: normal;
  word-wrap: break-word;
  font-size: 12px; }
  .comcenter-chat-message-content .em {
    width: 18px;
    height: 18px;
    display: -moz-inline-stack;
    display: inline-block;
    *display: inline;
    zoom: 1;
    position: relative;
    top: 3px; }

.comcenter-chat-same-author {
  padding: 6px;
  padding-top: 0px;
  line-height: 16px; }

.comcenter-chat-message-content a {
  font-size: 11px; }

.comcenter-chat-status-message-content {
  font-weight: bold;
  clear: both;
  color: #353535;
  text-align: left;
  line-height: 16px;
  margin-bottom: 1px;
  padding: 6px 0;
  border-top: 1px solid #EBEBEB;
  padding-left: 6px; }

.chat-game-logo {
  float: left;
  margin: 0px 6px; }

.comcenter-chat-serverinfo {
  float: left;
  overflow: hidden;
  color: #308dbf;
  line-height: 30px;
  white-space: nowrap;
  margin-left: 1px; }

.comcenter-server-joinbutton {
  position: absolute;
  right: 6px;
  top: -2px;
  display: block; }

.chat-joinbutton {
  position: absolute;
  right: 6px;
  top: -2px;
  display: block;
  top: 0px; }

.comcenter-chat-bottom {
  height: 36px;
  width: 229px;
  position: relative; }
  .comcenter-chat-bottom .comcenter-chat-bottom-info {
    text-align: center;
    color: #a8a8a8;
    line-height: 36px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis; }
    .comcenter-chat-bottom .comcenter-chat-bottom-info a {
      color: #fff;
      text-decoration: none;
      font-weight: bold;
      cursor: pointer; }
  .comcenter-chat-bottom.user-is-offline {
    background-position: 0 -38px; }
  .comcenter-chat-bottom.disabled {
    background-position: 0 38px; }

#comcenter-chats ::-webkit-scrollbar {
  width: 7px; }
#comcenter-chats ::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.5); }

#comcenter-chats .comcenter-chat-chat {
  overflow-y: scroll;
  height: 302px;
  width: 100%;
  color: #959595;
  background: none repeat scroll 0 0 #FFF;
  position: relative; }
  #comcenter-chats .comcenter-chat-chat div:first-of-type {
    border-top: none; }

#comcenter-chats .comcenter-chat-minisize {
  height: 267px; }

#comcenter-chats .comcenter-chat-group .comcenter-chat-chat {
  height: 266px; }

#comcenter-chats .comcenter-chat-platoon .comcenter-chat-chat {
  height: 257px; }

.comcenter-chat-message {
  border-top: 1px solid #ebebeb;
  padding: 6px;
  line-height: 16px; }

.chat-header {
  text-transform: none;
  width: 230px; }

.comcenter-bottom-row {
  height: 4px;
  width: 100%;
  background: url(../comcenter/bottom-yellow.png); }

.comcenter-playing-logo {
  float: left;
  right: 0px;
  margin-top: 10px;
  margin-right: 4px;
  width: 26px; }

.comcenter-chat-group-list {
  width: 213px; }

/* #draggables is where a ComCenter friend is when you drag it.. style with pleasure! */
#draggables li {
  width: 225px;
  background: #000;
  color: #fff;
  border: 0px;
  overflow: hidden;
  list-style-type: none;
  padding: 5px; }
  #draggables li, #draggables li a {
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing;
    cursor: grabbing;
    /* There's no grabbing icon in IE, and a bug in how IE treats url()
            in cursor prevents us from using a relative url */
    cursor: url(/cdnprefix/local/public/comcenter/cursors/cursor-closedhand.cur), move; }
  #draggables li.active {
    background: #353535; }
  #draggables li .comcenter-interact-container, #draggables li .comcenter-dropdownbutton {
    display: none; }

.comcenter-friend-item {
  clear: both;
  /* width: 200px; */
  padding-right: 10px; }

#comcenter-tabs {
  height: 29px;
  line-height: 29px; }

.comcenter-tab-small, .comcenter-tab {
  float: left;
  width: 134px;
  text-transform: uppercase;
  color: #353535;
  font-size: 11px;
  font-weight: bold;
  background: url(../comcenter/tab-not-active.png);
  cursor: pointer;
  height: 29px;
  text-shadow: 0 1px #e0e0e0; }

.comcenter-tab-small.setting {
  border-left: 1px solid #9d9d9d;
  width: 31px; }

.comcenter-setting-icon {
  background: url(../comcenter/icon-settings.png);
  background-position: 0 -17px;
  width: 16px;
  height: 17px;
  margin-left: 8px;
  margin-top: 7px; }

.comcenter-tab.active .comcenter-setting-icon {
  background: url(../comcenter/icon-settings.png); }
.comcenter-tab.title {
  float: left; }
.comcenter-tab.active {
  background: url(../comcenter/tab-active.png);
  color: #ffc500;
  text-shadow: 0 1px #000000; }

.comcenter-tab .title {
  margin-left: 10px;
  float: left;
  font-family: Tahoma, Arial, sans-serif;
  font-size: 11px; }

.comcenter-tab-content {
  display: block; }
  .comcenter-tab-content.active {
    display: block; }

.comcenter-tab-line {
  width: 100%;
  height: 5px;
  background: url(../comcenter/comcenter-upper-line.png);
  clear: both;
  background: #000; }

#comcenter-loading {
  position: absolute;
  top: 68px;
  left: 0px;
  width: 270px;
  height: 303px;
  background: #f1f1f1;
  z-index: 12;
  display: none; }

.comcenter-loading-area {
  background: url(../base/shared/loading16x16.gif) no-repeat top center;
  height: 100px;
  width: 100px;
  text-align: center;
  padding-top: 48px;
  font-weight: bold;
  color: #353535;
  margin: 130px auto 0;
  margin-top: 100px; }

#comcenter-friendrequests-separator {
  position: relative; }

.chat-header p {
  margin-left: 15px; }

.comcenter-notification-title {
  font-family: Tahoma, Arial, sans-serif;
  font-size: 11px;
  padding-left: 12px; }

.comcenter-friend {
  font-weight: bold;
  height: 34px; }
  .comcenter-friend .comcenter-friend-avatar {
    width: 21px;
    height: 21px;
    border: 1px solid #DCDCDC;
    margin: 6px 10px;
    background: #FFF;
    float: left; }
  .comcenter-friend .comcenter-username {
    margin-top: 9px; }
  .comcenter-friend a {
    color: #308DBF;
    text-decoration: none; }
    .comcenter-friend a:hover {
      text-decoration: underline; }
  .comcenter-friend.ui-draggable-dragging.comcenter-friend-playing .comcenter-username {
    margin-top: 0; }
  .comcenter-friend.ui-draggable-dragging .comcenter-username.comcenter-username-idle {
    margin-top: 0; }
  .comcenter-friend.ui-multidraggable {
    background: #444444;
    border-bottom-color: #212121; }
    .comcenter-friend.ui-multidraggable:hover {
      background: #444444;
      border-bottom-color: #212121; }
      .comcenter-friend.ui-multidraggable:hover .comcenter-dropdownbutton {
        display: none; }

li.comcenter-thisisyou:hover {
  background: none;
  cursor: default; }

#comcenter-surface-friends {
  display: block; }

.comcenter-chat-bottom-loader {
  position: absolute;
  right: 11px;
  top: 13px;
  display: none; }

.comcenter-chat-input-disabled {
  width: 214px;
  height: 21px;
  line-height: 19px;
  margin-left: 6px;
  font-size: 12px;
  padding: 0 3px;
  color: #000;
  position: relative;
  top: -4px;
  border: 1px solid #cccccc;
  border-top: 1px solid #abadb3;
  left: -2px; }

.comcenter-chat-input {
  width: 214px;
  height: 21px;
  line-height: 19px;
  margin-left: 6px;
  font-size: 12px;
  padding: 0 3px;
  color: #000;
  position: relative;
  top: -4px;
  border: 1px solid #cccccc;
  border-top: 1px solid #abadb3;
  left: -2px; }
  .comcenter-chat-input::-webkit-input-placeholder, .comcenter-chat-input:-moz-placeholder, .comcenter-chat-input:-ms-input-placeholder {
    color: #8a8a8a; }

.comcenter-chat-content {
  position: absolute;
  bottom: 0px;
  height: 377px;
  width: 230px;
  border: 1px solid #ccc;
  border-bottom: 0;
  background: none repeat scroll 0 0 #fff;
  cursor: default;
  display: none;
  z-index: 5;
  overflow: hidden;
  -webkit-backface-visibility: hidden; }

.comcenter-chat-droppable-content {
  position: absolute;
  top: 106px;
  text-align: center;
  width: 231px; }

.comcenter-chat-droppable-info {
  position: absolute;
  top: 10px;
  text-align: center;
  width: 216px; }

.comcenter-chat-droppable {
  background: url(../comcenter/dropzone-party.png);
  padding: 0;
  display: none;
  width: 213px;
  height: 300px;
  position: absolute;
  top: 56px;
  left: 0;
  z-index: 100;
  text-align: center;
  color: #959595;
  font-weight: normal;
  line-height: 16px; }
  .comcenter-chat-droppable b {
    color: #000; }

.comcenter-chat-content .comcenter-chat-droppable.dragging .comcenter-chat-droppable-content, .comcenter-chat-content .comcenter-chat-droppable.active .comcenter-chat-droppable-content {
  color: #353535; }
.comcenter-chat-content .comcenter-chat-droppable.dragging, .comcenter-chat-content .comcenter-chat-droppable.active {
  background: url(../comcenter/dropzone-active.png);
  width: 230px;
  height: 195px; }

.comcenter-chat-droppable.visible {
  display: block; }

.comcenter-receipt {
  width: 270px;
  height: 40px;
  line-height: 40px;
  background: #daf3c1;
  position: absolute;
  bottom: 1px;
  left: 0px;
  z-index: 100;
  text-align: center;
  color: #353535;
  font-weight: bold;
  border-top: 1px solid #9cc078;
  display: none; }

.comcenter-chat-leavechat {
  float: right;
  margin-right: 6px; }

.comcenter-chat-taskbar.contracted {
  width: 40px; }
.comcenter-chat-taskbar .comcenter-close {
  display: none; }
.comcenter-chat-taskbar:hover .comcenter-close {
  display: block;
  background: url(../base/shared/row_icon_chat_light.png);
  background-position: 0px -26px; }
.comcenter-chat-taskbar .comcenter-close:hover {
  display: block;
  background: url(../base/shared/row_icon_chat_light.png);
  background-position: 0px 13px; }

#comcenter-search .hidden {
  display: none; }

.comcenter-search-friends {
  width: 210px;
  height: 32px;
  background: url(../comcenter/search.png); }

#comcenter-search-friends-input {
  width: 174px;
  height: 14px;
  line-height: 14px;
  margin-left: 6px;
  font-size: 11px;
  padding: 3px 3px 3px 21px;
  background: none;
  color: #353535;
  position: relative;
  top: -5px;
  border: none; }

.comcenter-setting {
  float: right;
  background: url(../comcenter/fullwidth-sprite.png);
  height: 40px;
  width: 33px;
  opacity: 0.75;
  filter: alpha(opacity=75);
  border-left: 1px solid #404040;
  cursor: pointer;
  position: relative;
  z-index: 2; }

.comcenter-setting:hover, .comcenter-setting.muted {
  opacity: 1;
  filter: alpha(opacity=100); }

.comcenter-setting.noise {
  background-position: -2px -35px; }

#comcenter-friendbutton.notselectable .noise.muted {
  background-position: -39px -35px;
  background-color: #d11b1b; }

.comcenter-setting.mic {
  background-position: -2px -71px; }

.ui-dragable, .ui-slider {
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none; }

.comcenter-notification-content .comcenter-separator {
  padding-left: 14px;
  color: #8a8a8a;
  height: 17px;
  line-height: 18px;
  font-size: 11px;
  text-transform: uppercase;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }

.comcenter-chat-offlineuser {
  position: absolute;
  bottom: 0px;
  background: #f8f8f8;
  border: 1px solid #ccc;
  padding: 6px;
  margin: 3px;
  width: 193px;
  color: #353535;
  line-height: 16px;
  height: 33px;
  font-weight: normal; }

.comcenter-notification-index-sendlink {
  float: left;
  margin-left: 6px; }

.comcenter-notification-index-viewlink {
  float: right; }

li.comcenter-friend-hidden {
  display: none; }

#comcenter-currentchannel {
  position: relative; }
  #comcenter-currentchannel .common-dropzone {
    width: 266px;
    height: 100%; }
    #comcenter-currentchannel .common-dropzone .common-dropzone-content {
      width: 263px;
      height: 105px; }

.comcenter-chat-platoon-header {
  height: 42px;
  padding: 0 6px;
  line-height: 18px;
  border-bottom: 1px solid #E2E2E2; }

.comcenter-platoonbadge {
  position: relative;
  top: 6px; }

.comcenter-friendrequestarea {
  float: right;
  width: 68px; }

.comcenter-friend-request-button {
  float: left;
  width: 25px;
  height: 26px;
  margin-right: 6px;
  border: 0;
  margin-top: 5px;
  cursor: pointer; }

.comcenter-taskbar-info {
  float: left;
  width: 100%;
  height: 39px;
  background: rgba(0, 0, 0, 0.9); }
  .comcenter-taskbar-info:hover {
    background: rgba(42, 42, 42, 0.9); }

.chat-list-party-privacy, .chat-toggle-party-privacy {
  float: left;
  margin-left: 6px;
  height: 10px;
  width: 11px;
  display: block;
  background: url(../base/shared/icon-lock.png);
  margin-top: 11px;
  position: relative; }

.chat-list-party-privacy:hover {
  cursor: default;
  text-decoration: none; }
.chat-list-party-privacy.open {
  background-position: -11px 0; }

.chat-toggle-party-privacy.open {
  background-position: 0px 0;
  text-decoration: none; }

.chat-list-party-privacy.closed {
  background-position: 11px 0; }

.chat-toggle-party-privacy.closed {
  background-position: 22px 0;
  text-decoration: none; }

#comcenter-create-party-area {
  background: #efefef;
  line-height: 32px;
  border-top: 2px solid #d2d2d2;
  color: #8a8a8a;
  padding-left: 6px;
  height: 32px; }

.comcenter-game-icon {
  float: left;
  margin-top: 1px;
  margin-right: 4px; }

.comcenter-interact-container {
  position: absolute;
  right: 12px;
  top: 0; }

.comcenter-manage-friends {
  display: block;
  text-decoration: none;
  background: url(../comcenter/icon-managefriends.png) no-repeat scroll 0 0 transparent;
  width: 23px;
  height: 33px;
  position: relative;
  top: 0;
  left: 6px;
  border-right: 1px solid #d2d2d2; }

.comcenter-manage-friendsn:hover {
  background-position: 0 -28px; }

#comcenter-area .join-friend-dropdown {
  width: 130px;
  top: 30px;
  left: -107px;
  border: 1px solid #A6A6A6; }

.comcenter-chat-bottom-container {
  border-top: 1px solid #d2d2d2;
  background: #f3f3f3; }

.comcenter-chat-group-avatars-container {
  margin: 4px 0;
  position: relative; }

.comcenter-username-serverinfo {
  position: relative;
  clear: both;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

.comcenter-chat-platoon-badge {
  float: left;
  height: 20px;
  position: relative;
  top: 4px;
  margin-left: 6px; }

.comcenter-chat-group-partyserverbutton {
  float: right;
  margin-right: 4px;
  position: relative;
  top: -2px;
  height: 35px; }
  .comcenter-chat-group-partyserverbutton button {
    line-height: 16px; }

.comcenter-chat-group-partyservername {
  float: left;
  line-height: 14px;
  margin-left: 6px;
  padding-top: 4px; }

.comcenter-chat-group-partyserver {
  position: relative;
  top: 0px;
  background: #F3F3F3;
  width: 230px;
  z-index: 1;
  border-bottom: 1px solid #d2d2d2;
  height: 38px;
  border-top: 1px solid #D2D2D2;
  padding-top: 2px; }

.comcenter-chat-group-partyservername .common-playing-mode {
  position: relative;
  top: 8px; }

.comcenter-chatpartyjoin {
  width: 130px;
  float: left; }

.comcenter-chatpartyjoin-icon {
  float: left;
  margin-top: 2px;
  margin-right: 4px;
  clear: left;
  line-height: 13px;
  width: 116px;
  overflow: hidden; }

.comcenter-chatpartyjoin-joinbutton {
  float: right;
  margin-right: 2px; }

.comcenter-chat-group-partyservername-players {
  color: #8a8a8a;
  float: left;
  cursor: pointer; }

.comcenter-chat-group-nooneplaying {
  text-align: center;
  color: #8a8a8a;
  background: #F3F3F3;
  border-bottom: 1px solid #D2D2D2;
  height: 41px;
  clear: both; }

.comcenter-chat-group-settings {
  float: right;
  display: block;
  height: 12px;
  width: 12px;
  background: url(../comcenter/settings.png);
  margin-right: 6px;
  margin-top: 7px;
  position: relative; }
  .comcenter-chat-group-settings:hover {
    background-position: 0 -12px; }

body .comcenter-chatparty-gameicon {
  margin-top: 1px;
  margin-right: 0px;
  position: relative;
  top: 4px;
  left: -4px; }

.comcenter-chat-partyowner {
  position: absolute;
  top: 0px;
  width: 2px;
  height: 2px;
  background: #000; }

.comcenter-chatparty-playingserver {
  width: 100px;
  overflow: hidden; }

#comcenter-matches-list-empty {
  color: #a8a8a8;
  padding-left: 10px;
  border-bottom: 1px solid #302f33;
  font-weight: normal;
  padding: 10px;
  font-size: 12px; }

/* Full height comcenter styling
 -------------------------------------------------------------------- */
#comcenter-friends .comcenter-friends-border {
  position: absolute;
  width: 1px;
  height: 100%;
  top: 0;
  left: -1px;
  background: #dfdfdf;
  opacity: 0.25;
  filter: alpha(opacity=25); }

#comcenter-tab-friends-content, #comcenter-tab-chats, #comcenter-tab-search {
  position: absolute;
  top: 48px;
  right: 0;
  bottom: 41px;
  left: 0;
  background: none;
  overflow: auto;
  margin-bottom: 0;
  outline: none; }
  .app-promotion #comcenter-tab-friends-content, .app-promotion #comcenter-tab-chats, .app-promotion #comcenter-tab-search {
    bottom: 134px; }

.comcenter-taskbar-info {
  display: none; }

.base-button-party {
  background-image: url(../comcenter/fullwidth-button-party.png);
  width: 132px;
  margin-left: 2px; }

li.comcenter-found-no-online-friends {
  background: none; }
li.comcenter-separator {
  height: 19px;
  margin-top: 4px;
  padding-left: 24px;
  margin-left: 2px; }

#comcenter-friendbutton {
  border: 0; }

.comcenter-friend-online .comcenter-username a, .comcenter-friend-playing .comcenter-username a, #comcenter-surface-friendrequests .comcenter-username a {
  color: white; }

.comcenter-friend-draggable, .comcenter-friend-draggable-dummy {
  float: left;
  width: 3px;
  height: 8px;
  margin-left: 1px;
  margin-right: 6px;
  margin-top: 14px; }

.comcenter-friend-draggable {
  background: url(../comcenter/comcenter-draggable.png);
  background-position: 0 48px; }

.base-button-party {
  display: none; }

.comcenter-full-height {
  display: inline; }

.comcenter-small-height {
  display: none; }

#comcenter-friendbutton {
  bottom: 0px;
  right: 0px;
  position: absolute; }

.comcenter-full-height {
  display: none; }

.comcenter-chat-username-link {
  padding-left: 6px;
  font-size: 12px;
  float: left; }

/* NEW STUFF HERE */
#comcenter-friends {
  display: block;
  position: fixed;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1001;
  width: 237px;
  background: rgba(0, 0, 0, 0.75);
  font-size: 12px;
  /** Begin states **/
  /** End states **/ }
  #comcenter-friends .jspVerticalBar {
    right: 0; }
    #comcenter-friends .jspVerticalBar .jspDrag {
      border-radius: 0; }
  #comcenter-friends .comcenter-setting.mic.muted {
    background-color: #d11b1b;
    background-position: -38px -71px; }
  #comcenter-friends #comcenter-friendrequests-list {
    margin-bottom: 6px; }
    #comcenter-friends #comcenter-friendrequests-list .comcenter-username a {
      width: 90px; }
  #comcenter-friends .comcenter-username-idle {
    float: left;
    font-size: 12px;
    white-space: nowrap;
    padding-top: 1px;
    margin-top: 0; }
  #comcenter-friends .comcenter-username-away {
    color: #8a8a8a;
    font-size: 11px;
    font-weight: normal;
    line-height: 15px; }
  #comcenter-friends #comcenter-tab-friends-content .common-playing-link {
    font-weight: normal;
    font-size: 11px;
    color: #8a8a8a;
    line-height: 15px;
    width: 100px; }
  #comcenter-friends #comcenter-tab-friends-content li {
    position: relative;
    padding: 4px 8px; }
    #comcenter-friends #comcenter-tab-friends-content li:hover {
      background: rgba(255, 255, 255, 0.2);
      cursor: pointer; }
      #comcenter-friends #comcenter-tab-friends-content li:hover .comcenter-friend-draggable {
        background-position: 0 0px; }
    #comcenter-friends #comcenter-tab-friends-content li.comcenter-friend-playing .comcenter-username {
      color: #a0a0a0;
      margin-top: 0; }
    #comcenter-friends #comcenter-tab-friends-content li.comcenter-add-friend {
      padding: 8px;
      padding-left: 19px;
      color: #8a8a8a; }
      #comcenter-friends #comcenter-tab-friends-content li.comcenter-add-friend .icon {
        margin-right: 2px; }
    #comcenter-friends #comcenter-tab-friends-content li.comcenter-add-friend-disabled {
      opacity: 0.2;
      cursor: default; }
    #comcenter-friends #comcenter-tab-friends-content li.comcenter-found-no-online-friends {
      color: #8a8a8a;
      text-align: center;
      cursor: default;
      background: #FDFDFD; }
      #comcenter-friends #comcenter-tab-friends-content li.comcenter-found-no-online-friends:hover {
        color: #8a8a8a;
        text-align: center;
        cursor: default;
        background: #FDFDFD; }
    #comcenter-friends #comcenter-tab-friends-content li.comcenter-separator.offline {
      background: rgba(0, 0, 0, 0.4); }
      #comcenter-friends #comcenter-tab-friends-content li.comcenter-separator.offline:hover {
        background: black;
        cursor: pointer; }
    #comcenter-friends #comcenter-tab-friends-content li.comcenter-separator.online {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600; }
      #comcenter-friends #comcenter-tab-friends-content li.comcenter-separator.online:hover {
        background: none;
        cursor: default; }
      #comcenter-friends #comcenter-tab-friends-content li.comcenter-separator.online .origin {
        padding-left: 24px; }
        #comcenter-friends #comcenter-tab-friends-content li.comcenter-separator.online .origin:before {
          content: "";
          position: absolute;
          background: url(../base/shared/origin-logo.png);
          top: 2px;
          width: 16px;
          height: 22px;
          display: block; }
    #comcenter-friends #comcenter-tab-friends-content li.comcenter-searched-for {
      padding-left: 16px;
      color: #353535;
      height: 28px;
      line-height: 28px; }
      #comcenter-friends #comcenter-tab-friends-content li.comcenter-searched-for:hover {
        background: #FDFDFD;
        cursor: default; }
    #comcenter-friends #comcenter-tab-friends-content li.comcenter-separator {
      cursor: pointer;
      line-height: 20px;
      font-size: 13px;
      text-transform: uppercase;
      font-family: Purista;
      color: #8a8a8a;
      padding-left: 16px;
      white-space: nowrap; }
      #comcenter-friends #comcenter-tab-friends-content li.comcenter-separator .base-left {
        float: none; }
    #comcenter-friends #comcenter-tab-friends-content li .join-friend {
      float: right;
      margin-left: 5px; }
    #comcenter-friends #comcenter-tab-friends-content li .icon-origin, #comcenter-friends #comcenter-tab-friends-content li .icon-mobile {
      float: right;
      margin: 14px 0 0 10px; }
    #comcenter-friends #comcenter-tab-friends-content li .origin-game-title {
      width: 150px; }
  #comcenter-friends .app-promotion {
    overflow: hidden;
    position: absolute; }
    #comcenter-friends .app-promotion .box {
      bottom: 43px; }
    #comcenter-friends .app-promotion .box-content {
      padding-bottom: 0px;
      background-color: rgba(255, 255, 255, 0.08); }
    #comcenter-friends .app-promotion img {
      float: left; }
    #comcenter-friends .app-promotion .origin {
      float: none; }
    #comcenter-friends .app-promotion .text {
      margin-left: 64px;
      font-size: 12px; }
      #comcenter-friends .app-promotion .text .title {
        color: #fff;
        font-weight: bold;
        display: inline-block;
        margin-top: 8px; }
      #comcenter-friends .app-promotion .text .upsell {
        color: #a8a8a8;
        display: inline-block;
        margin-top: 8px; }
    #comcenter-friends .app-promotion .app-promotion-interaction-area {
      position: absolute;
      right: 4px;
      top: 4px;
      width: 20px; }
      #comcenter-friends .app-promotion .app-promotion-interaction-area .app-promotion-close {
        background: url(../base/shared/row_icon_chat_light.png) 0 -26px;
        width: 13px;
        height: 13px;
        position: relative;
        float: right;
        cursor: pointer; }
      #comcenter-friends .app-promotion .app-promotion-interaction-area .app-promotion-close:hover {
        background-position: 0 -39px; }

#comcenter .comcenter-interact-party, #comcenter div.comcenter-interact-playing, #comcenter .comcenter-interact-party-invite, #comcenter .comcenter-interact-chat-offline, #comcenter .comcenter-interact-chat, #comcenter-friends .comcenter-interact-party, #comcenter-friends div.comcenter-interact-playing, #comcenter-friends .comcenter-interact-party-invite, #comcenter-friends .comcenter-interact-chat-offline, #comcenter-friends .comcenter-interact-chat {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  height: 24px;
  width: 23px;
  float: right;
  border: 0;
  cursor: pointer;
  margin-top: 4px; }
#comcenter .comcenter-interact-container .comcenter-interact-party, #comcenter .comcenter-interact-container div.comcenter-interact-playing, #comcenter .comcenter-interact-container .comcenter-interact-party-invite, #comcenter .comcenter-interact-container .comcenter-interact-chat-offline, #comcenter .comcenter-interact-container .comcenter-interact-chat, #comcenter-friends .comcenter-interact-container .comcenter-interact-party, #comcenter-friends .comcenter-interact-container div.comcenter-interact-playing, #comcenter-friends .comcenter-interact-container .comcenter-interact-party-invite, #comcenter-friends .comcenter-interact-container .comcenter-interact-chat-offline, #comcenter-friends .comcenter-interact-container .comcenter-interact-chat {
  margin-top: 9px; }
#comcenter .comcenter-interact-party, #comcenter-friends .comcenter-interact-party {
  background: transparent url(../comcenter/icons-interact.png) no-repeat;
  background-position: 0 -120px; }
  #comcenter .comcenter-interact-party.inParty, #comcenter-friends .comcenter-interact-party.inParty {
    background-position: -23px -120px; }
    #comcenter .comcenter-interact-party.inParty:hover, #comcenter-friends .comcenter-interact-party.inParty:hover {
      background-position: -46px -120px; }
    #comcenter .comcenter-interact-party.inParty:active, #comcenter-friends .comcenter-interact-party.inParty:active {
      background-position: -69px -120px; }
#comcenter .comcenter-friend-item:hover .comcenter-interact-chat, #comcenter .comcenter-friend-item:hover .comcenter-interact-party-invite, #comcenter-friends .comcenter-friend-item:hover .comcenter-interact-chat, #comcenter-friends .comcenter-friend-item:hover .comcenter-interact-party-invite {
  display: block; }
#comcenter .comcenter-interact-party-invite, #comcenter .comcenter-interact-chat-offline, #comcenter .comcenter-interact-chat, #comcenter-friends .comcenter-interact-party-invite, #comcenter-friends .comcenter-interact-chat-offline, #comcenter-friends .comcenter-interact-chat {
  display: none;
  background: transparent url(../comcenter/icons-interact.png) no-repeat;
  background-position: -23px -96px; }
  #comcenter .comcenter-interact-party-invite:hover, #comcenter .comcenter-interact-chat-offline:hover, #comcenter .comcenter-interact-chat:hover, #comcenter-friends .comcenter-interact-party-invite:hover, #comcenter-friends .comcenter-interact-chat-offline:hover, #comcenter-friends .comcenter-interact-chat:hover {
    background-position: -96px -96px;
    cursor: pointer; }
#comcenter .comcenter-interact-chat-offline, #comcenter-friends .comcenter-interact-chat-offline {
  background-position: 0 -96px; }
#comcenter .icon.chat, #comcenter-friends .icon.chat {
  display: inline-block; }
  #comcenter .icon.chat.group, #comcenter-friends .icon.chat.group {
    background: url(../comcenter/icon-party.png) no-repeat scroll 0 -5px transparent;
    width: 29px;
    height: 22px;
    vertical-align: baseline; }
  #comcenter .icon.chat.close, #comcenter .icon.chat.contract, #comcenter-friends .icon.chat.close, #comcenter-friends .icon.chat.contract {
    height: 13px;
    width: 13px;
    background: url(../base/shared/row_icon_chat.png);
    cursor: pointer; }
    #comcenter .icon.chat.close.inverted, #comcenter .icon.chat.contract.inverted, #comcenter-friends .icon.chat.close.inverted, #comcenter-friends .icon.chat.contract.inverted {
      background-image: url(../base/shared/row_icon_chat_light.png); }
  #comcenter .icon.chat.close, #comcenter-friends .icon.chat.close {
    background-position: 0 26px; }
    #comcenter .icon.chat.close:hover, #comcenter-friends .icon.chat.close:hover {
      background-position: 0 13px; }
    #comcenter .icon.chat.close:after, #comcenter-friends .icon.chat.close:after {
      display: none; }
  #comcenter .icon.chat.contract, #comcenter-friends .icon.chat.contract {
    background-position: 0 0; }
    #comcenter .icon.chat.contract:hover, #comcenter-friends .icon.chat.contract:hover {
      background-position: 0 -13px; }
  #comcenter .icon.chat.unread, #comcenter-friends .icon.chat.unread {
    display: none;
    background: url(../comcenter/unread.png);
    position: absolute;
    top: 0px;
    right: 0;
    height: 9px;
    width: 9px;
    z-index: 13; }
  #comcenter .icon.chat.add-friend, #comcenter-friends .icon.chat.add-friend {
    background: url(../comcenter/fullwidth-addfriend.png) no-repeat;
    width: 26px;
    height: 26px;
    vertical-align: middle; }

#comcenter-area {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%; }
  #comcenter-area.chats .show-cc-btn {
    opacity: 0.6; }
  #comcenter-area.chats .show-chat-btn {
    opacity: 1; }

#friendlist-header {
  margin-left: 15px;
  height: auto;
  margin-top: 6px;
  font-size: 14px;
  line-height: 42px;
  font-family: Purista;
  color: #d5dde5;
  text-transform: uppercase; }

.comcenter-username {
  float: left;
  position: relative;
  font-size: 12px; }
  .comcenter-username a {
    display: inline-block;
    white-space: nowrap;
    width: 130px;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 18px; }
  .comcenter-username .comcenter-chat-username-link a {
    width: 150px;
    display: block;
    margin-top: 2px;
    margin-bottom: -2px; }
  .comcenter-username .comcenter-chat-username-link .comcenter-username-away {
    color: #8a8a8a;
    font-size: 11px;
    font-weight: normal;
    line-height: 15px;
    text-shadow: none; }
  .comcenter-username p {
    font-weight: normal;
    clear: both;
    font-size: 11px; }

/* COMCENTER SETTINGS */
.comcenter-settings {
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  overflow: hidden;
  text-align: center;
  line-height: 1;
  z-index: 1;
  padding: 0 8px;
  height: 41px;
  line-height: 41px;
  border-top: 1px solid rgba(223, 223, 223, 0.15); }
  .comcenter-settings .icon.group {
    margin-bottom: -5px;
    margin-top: -1px; }
  .comcenter-settings .base-left {
    position: absolute;
    right: 112px; }

/* COMCENTER LIST */
.comcenter-list li:hover {
  background: rgba(255, 255, 255, 0.2); }

/* CHATS */
#comcenter-chats {
  position: absolute;
  margin: 0;
  height: 0;
  right: 8px;
  bottom: 40px; }
  .show-comcenter #comcenter-chats {
    right: 242px; }
  #comcenter-chats .comcenter-chat-gameicon {
    margin-top: 6px; }
  #comcenter-chats .comcenter-divider-left {
    float: right; }
  #comcenter-chats .comcenter-chat-avatar {
    position: relative;
    margin-left: 6px;
    margin-right: 0; }
  #comcenter-chats .comcenter-username a {
    color: #000; }
  #comcenter-chats .comcenter-chat-more-users {
    color: #a8a8a8;
    text-align: center;
    width: 26px;
    height: 26px;
    line-height: 26px;
    float: left; }
    #comcenter-chats .comcenter-chat-more-users:hover {
      cursor: pointer;
      color: #fff;
      background: rgba(255, 255, 255, 0.1); }
  #comcenter-chats .comcenter-chat-taskbar-avatar {
    color: #a8a8a8; }
    #comcenter-chats .comcenter-chat-taskbar-avatar .username {
      color: #a8a8a8; }
  #comcenter-chats .comcenter-chat-taskbar-username {
    color: #a8a8a8; }
  #comcenter-chats .comcenter-chat-taskbar-button {
    padding-left: 8px;
    padding-right: 8px;
    height: 40px;
    overflow: hidden; }
    #comcenter-chats .comcenter-chat-taskbar-button .avatar {
      float: left;
      display: inline-block;
      position: relative;
      margin: 8px 4px 0 0;
      line-height: 1; }
    #comcenter-chats .comcenter-chat-taskbar-button .username {
      display: inline-block;
      width: 71px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis; }
  #comcenter-chats .chat-header .icon.chat {
    float: right;
    margin: 10px 0;
    margin-right: 5px; }
  #comcenter-chats .comcenter-chat-taskbar-button:hover .icon.close {
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -6px;
    right: 8px; }

.comcenter-chat-taskbar-group {
  float: left; }

.comcenter-chat-group-icon {
  background: url(../comcenter/icon-party.png) no-repeat scroll 0 -5px transparent;
  height: 22px; }

.chat-header .comcenter-chat-group-icon {
  position: relative;
  top: -5px;
  left: 4px; }

/* PARTY CHAT */
.comcenter-chat-taskbar-username {
  display: inline-block;
  white-space: nowrap;
  width: 123px;
  overflow: hidden;
  text-overflow: ellipsis; }
  .comcenter-chat-taskbar-username .club-emblem {
    position: relative;
    top: 10px;
    margin-right: 3px; }
  .comcenter-chat-taskbar-username .icon.group {
    background-position: 0 -79px;
    position: relative;
    top: 5px; }

.comcenter-party-chat.active .icon.group {
  background-position: 0 -41px; }

.comcenter-chat-taskbar {
  position: relative;
  float: right;
  width: 136px;
  height: 40px;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.9);
  border-bottom: 0;
  color: #fff;
  margin-left: 1px; }
  .comcenter-chat-taskbar:hover {
    background: rgba(42, 42, 42, 0.9); }
  .comcenter-chat-taskbar.active {
    color: #000;
    background: url(../comcenter/comcenter-active.png);
    border-left: 0;
    border-right: 0;
    width: 232px; }
    .comcenter-chat-taskbar.active .icon-close {
      display: block; }
    .comcenter-chat-taskbar.active .comcenter-chat-taskbar-username {
      color: #000; }
  .comcenter-chat-taskbar.unread .icon.unread, .comcenter-chat-taskbar.active .comcenter-chat-content {
    display: block; }

.comcenter-chat-party-menu-dropdown {
  display: none;
  position: absolute;
  top: 24px;
  width: 120px;
  background: rgba(0, 0, 0, 0.9);
  right: -42px;
  z-index: 10;
  line-height: 26px;
  border: 1px solid #302f33;
  font-size: 11px;
  text-indent: 6px;
  text-shadow: none; }
  .comcenter-chat-party-menu-dropdown li {
    border-top: 1px solid #302f33; }
    .comcenter-chat-party-menu-dropdown li:hover {
      background: rgba(255, 255, 255, 0.2); }
  .comcenter-chat-party-menu-dropdown a {
    color: #fff;
    display: block;
    font-size: 11px; }
  .comcenter-chat-party-menu.active .comcenter-chat-party-menu-dropdown {
    display: block; }

#comcenter, #comcenter-friends {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

#comcenter-chats .comcenter-chat-chat {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text; }

.btn-yes, .btn-no {
  width: 25px;
  height: 26px;
  float: left;
  cursor: pointer; }

.btn-yes {
  background: url(../base/bfbc2/buttons/base_button_yesno.png) no-repeat 0 -26px; }
  .btn-yes.active, .btn-yes:active {
    background-position: 0 -52px; }
  .btn-yes:hover[disabled], .btn-yes:active[disabled], .btn-yes[disabled] {
    background-position: 0 -78px;
    cursor: default; }

.btn-no {
  background: url(../base/bfbc2/buttons/base_button_yesno.png) no-repeat -25px 0; }
  .btn-no:hover {
    background-position: -25px -26px; }
  .btn-no.active, .btn-no:active {
    background-position: -25px -52px; }
  .btn-no:hover[disabled], .btn-no:active[disabled], .btn-no[disabled] {
    background-position: -25px -78px;
    cursor: default; }

#friendlist-header {
  position: relative; }
  #friendlist-header .icon-search {
    background: url(../base/shared/search-icon-white.png) 0 0 no-repeat;
    height: 14px;
    width: 14px;
    padding: 0;
    cursor: pointer;
    position: absolute;
    top: 12px;
    right: 16px; }
  #friendlist-header form {
    display: none;
    line-height: 1; }
    #friendlist-header form input {
      background: #000;
      outline: none;
      border: 1px solid #505050;
      color: #fff;
      width: 188px;
      padding: 4px 8px;
      margin: 0; }
      #friendlist-header form input::-ms-clear {
        display: none; }
      #friendlist-header form input:focus {
        border-color: #fff; }

#comcenter-area.show-search #friendlist-header form {
  top: 42px;
  position: relative;
  display: block; }
  #comcenter-area.show-search #friendlist-header form .icon-close {
    position: absolute;
    top: 7px;
    right: 22px;
    z-index: 1;
    cursor: pointer; }
#comcenter-area.show-search #comcenter-tab-chats, #comcenter-area.show-search #comcenter-tab-friends-content {
  display: none; }
#comcenter-area.show-search #comcenter-tab-search {
  display: block;
  top: 80px; }
#comcenter-area.show-search #comcenter-search-results p {
  padding: 10px;
  color: #fff; }
#comcenter-area.show-search #comcenter-search-results li {
  margin-bottom: 8px; }
#comcenter-area.show-search #comcenter-search-results i.icon-platform {
  display: inline-block;
  position: relative;
  top: 15px; }

.comcenter-toggle {
  display: none; }
  .comcenter-toggle.show-cc-btn, .comcenter-toggle.show-chat-btn {
    display: block; }
  .comcenter-toggle.show-chat-btn button .icon {
    background: url(../base/shared/header-icons.png) -240px 0 no-repeat; }
  .comcenter-toggle.show-chat-btn.unread button {
    color: orange !important; }
    .comcenter-toggle.show-chat-btn.unread button .icon {
      background-position: -240px -30px; }
  .comcenter-toggle button {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400;
    position: relative;
    vertical-align: middle;
    background: none;
    border: 0;
    cursor: pointer;
    width: auto;
    color: #d5dde5;
    font-size: 16px;
    margin-top: 6px;
    padding: 7px 0 0;
    margin: 0;
    outline: 0; }
    .comcenter-toggle button:not(:hover) {
      opacity: 0.9; }
    .comcenter-toggle button .icon {
      width: 30px;
      height: 30px;
      background: url(../base/shared/header-icons.png) -180px 0 no-repeat;
      display: inline-block;
      vertical-align: middle;
      top: -3px;
      position: relative; }
      @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
        .comcenter-toggle button .icon {
          background-image: url("../base/shared/header-icons@2x.png");
          background-size: 240px 60px; } }

/* Fix for removing white background on checkboxes in chrome when using -webkit-backface-visibility: hidden;
       https://code.google.com/p/chromium/issues/detail?id=119698 */
/*
#base-header,
#base-container,
#comcenter-friends,
#comcenter-chats {
    //@include transform(translateZ(0));
    -webkit-perspective: 1000;
    //-webkit-backface-visibility: hidden;
}*/
#comcenter-challenges-list-loading {
  text-align: center; }
  #comcenter-challenges-list-loading .loader {
    margin-top: 16px; }

#challenges .comcenter-notification-text {
  padding-left: 51px;
  width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer; }

#challenges .comcenter-notification-text span.username {
  font-weight: bold;
  color: #fff; }

#challenges .comcenter-notification-text span.mission {
  color: #fff; }

#react-chats-container .chats-info {
  color: #fff;
  font-family: Tahoma, Arial, sans-serif;
  padding: 16px;
  text-align: center;
  line-height: 18px; }
  #react-chats-container .chats-info h2 {
    font-size: 14px;
    color: #8a8a8a; }
#react-chats-container .comcenter-create-chat {
  margin: 8px;
  text-align: center;
  width: 220px; }
#react-chats-container .chat-title {
  font-family: Tahoma, Arial, sans-serif;
  color: #8a8a8a;
  font-size: 13px;
  text-transform: uppercase;
  display: block;
  margin: 0px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  padding: 6px; }
#react-chats-container ul {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0; }
#react-chats-container li {
  list-style: none;
  position: relative;
  padding: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  line-height: 16px;
  font-size: 13px;
  color: #8a8a8a;
  cursor: pointer; }
  #react-chats-container li.kicked {
    opacity: 0.5; }
    #react-chats-container li.kicked:hover {
      opacity: 1; }
      #react-chats-container li.kicked:hover .leave-btn {
        display: block; }
  #react-chats-container li .leave-btn {
    display: none;
    position: absolute;
    top: 10px;
    right: 18px; }
  #react-chats-container li.unread .chat-row-info .unreadCount {
    display: block; }
  #react-chats-container li.unread:before {
    position: absolute;
    top: 0;
    right: 0;
    width: 9px;
    height: 9px;
    background: url('../comcenter/unread.png');
    content: ""; }
  #react-chats-container li:hover {
    background: rgba(255, 255, 255, 0.2); }
  #react-chats-container li.selected {
    background-color: rgba(255, 255, 255, 0.8);
    color: #000;
    box-shadow: 0 0 5px white; }
  #react-chats-container li .chat-club-emblem, #react-chats-container li .chat-icon {
    float: left;
    width: 44px;
    height: 36px; }
  #react-chats-container li .chat-icon {
    position: relative; }
    #react-chats-container li .chat-icon.group {
      background: url('../comcenter/chat/group-icon.png') no-repeat top left; }
    #react-chats-container li .chat-icon .avatar-container {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0; }
  #react-chats-container li .chat-club-emblem {
    position: relative; }
    #react-chats-container li .chat-club-emblem img {
      position: absolute;
      top: 6px;
      left: 6px; }
  #react-chats-container li .chat-row-info {
    float: left;
    width: 174px; }
    #react-chats-container li .chat-row-info .usernames {
      margin-right: 8px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      font-weight: bold;
      font-size: 14px; }
    #react-chats-container li .chat-row-info .unreadCount {
      font-size: 12px;
      color: orange;
      display: none;
      position: absolute;
      bottom: 8px;
      right: 6px; }
  #react-chats-container li .lastmessage {
    margin-top: 4px;
    font-weight: normal;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
    #react-chats-container li .lastmessage .em {
      width: 18px;
      height: 18px;
      display: -moz-inline-stack;
      display: inline-block;
      *display: inline;
      zoom: 1;
      position: relative;
      top: 3px; }
  #react-chats-container li.no-user .lastmessage {
    margin-top: 11px; }

.show-chat-btn {
  position: absolute;
  top: 0;
  left: 116px;
  opacity: 0.6; }

.show-cc-btn {
  position: absolute;
  top: 0;
  left: 46px;
  opacity: 1; }

/*
Fix for platform icons in search tab being stacked in top right corner.
*/
#comcenter-tab-search #comcenter-search-results li {
  padding: 4px 8px; }
#comcenter-tab-search #comcenter-search-results .comcenter-friend .comcenter-username {
  margin-top: 1px; }
#comcenter-tab-search #comcenter-search-results .comcenter-friend .comcenter-interact-container {
  position: relative;
  display: inline-block;
  right: 0;
  width: 130px; }
  #comcenter-tab-search #comcenter-search-results .comcenter-friend .comcenter-interact-container i.icon-platform {
    top: 0; }

#comcenter-tab-friends-content .btn.btn-small.join-friend-submit-link, .comcenter-chat-content .btn.btn-small.join-friend-submit-link {
  margin-top: 6px; }
  #comcenter-tab-friends-content .btn.btn-small.join-friend-submit-link i, .comcenter-chat-content .btn.btn-small.join-friend-submit-link i {
    display: block;
    margin-top: 2px;
    background: url(../base/shared/icon-join.png) 0 -10px no-repeat;
    background-repeat: no-repeat;
    height: 10px;
    width: 10px; }

#comcenter-chats .pull-left {
  margin: 0; }
#comcenter-chats .comcenter-chat-content {
  background-color: rgba(0, 0, 0, 0.85);
  border: 1px solid #2E2E2E; }
#comcenter-chats .comcenter-chat-message {
  border-top: 1px solid #1D1D1D; }
  #comcenter-chats .comcenter-chat-message:first-child {
    border-top: 0; }
#comcenter-chats .chat-header-group-chat {
  line-height: 32px; }
#comcenter-chats .chat-header {
  position: relative;
  border-bottom: 1px solid #2E2E2E;
  background: rgba(0, 0, 0, 0.45);
  font-family: Arial;
  color: #fff;
  font-size: 12px;
  font-weight: normal;
  height: 34px;
  margin-bottom: 1px;
  line-height: 32px;
  width: 230px;
  z-index: 100; }
  #comcenter-chats .chat-header .comcenter-close-group, #comcenter-chats .chat-header .comcenter-close {
    top: 10px; }
#comcenter-chats .comcenter-chat-chat {
  overflow-y: scroll;
  height: 298px;
  width: 229px;
  margin-top: 1px;
  color: #959595;
  background: none;
  position: relative; }
#comcenter-chats .comcenter-chat-idle {
  background: #000;
  margin-left: -5px;
  margin-right: -5px; }
#comcenter-chats .comcenter-chat-offline {
  background: #000;
  margin-left: -5px;
  margin-right: -5px;
  line-height: 33px; }
#comcenter-chats .comcenter-chat-idle, #comcenter-chats .comcenter-chat-offline, #comcenter-chats .comcenter-chat-server {
  border-bottom: 0; }
#comcenter-chats .comcenter-chat-input {
  background: rgba(0, 0, 0, 0.45);
  margin-left: 1px;
  padding-top: 10px;
  height: 25px;
  border: 1px solid rgba(10, 10, 10, 0.6); }
#comcenter-chats .comcenter-username a {
  color: #fff;
  text-shadow: none; }
#comcenter-chats .comcenter-chat-taskbar.active {
  background: none; }
#comcenter-chats .comcenter-chat-timestamp {
  color: #8a8a8a; }
#comcenter-chats .comcenter-chat-bottom-container {
  border-top: 1px solid #2e2e2e;
  background: #000; }
  #comcenter-chats .comcenter-chat-bottom-container .comcenter-chat-bottom {
    height: 38px;
    overflow: hidden; }
#comcenter-chats .comcenter-chat-message-content {
  color: #d3d3d3; }
#comcenter-chats .comcenter-chat-content .comcenter-chat-minisize {
  height: 264px; }
#comcenter-chats #comcenter-tab-friends-content .btn.btn-small.join-friend-submit-link, #comcenter-chats .comcenter-chat-content .btn.btn-small.join-friend-submit-link {
  width: 24px;
  height: 24px;
  padding: 0 7px;
  margin-top: 4px; }
  #comcenter-chats #comcenter-tab-friends-content .btn.btn-small.join-friend-submit-link i, #comcenter-chats .comcenter-chat-content .btn.btn-small.join-friend-submit-link i {
    position: relative;
    top: -1px; }
#comcenter-chats #comcenter-tab-friends-content:hover .btn.btn-small.join-friend-submit-link:hover, #comcenter-chats .comcenter-chat-content:hover .btn.btn-small.join-friend-submit-link:hover {
  border: 1px solid #f90; }
#comcenter-chats .comcenter-chat-header, #comcenter-chats .comcenter-chat-group-header {
  border-top: 0;
  border-bottom: 1px solid #2e2e2e;
  line-height: 28px; }
#comcenter-chats .comcenter-chat-group-nooneplaying {
  background: none;
  border-bottom: 1px solid #2e2e2e; }
#comcenter-chats .comcenter-chat-group-settings {
  float: right;
  display: block;
  height: 12px;
  width: 12px;
  opacity: 0.8;
  background: url(../comcenter/settings.png) 0 -24px;
  margin-right: 6px;
  margin-top: 7px;
  position: relative; }
  #comcenter-chats .comcenter-chat-group-settings:hover {
    opacity: 1; }
#comcenter-chats .comcenter-chat-group-partyserver {
  background: #000;
  border-top: 1px solid #000;
  border-bottom: 1px solid #2E2E2E; }
#comcenter-chats .comcenter-chat-status-message-content {
  color: #ccc; }
#comcenter-chats .comcenter-chat-status-message-content {
  border-top: 1px solid #2e2e2e; }
#comcenter-chats .base-general-dropdown-area {
  position: relative;
  background: #333;
  top: 0; }
  #comcenter-chats .base-general-dropdown-area ul li {
    height: 34px;
    line-height: 34px;
    border-top: 1px solid #666;
    cursor: pointer; }
    #comcenter-chats .base-general-dropdown-area ul li a {
      margin-left: 5px;
      color: #fff; }

.comcenter-chat-droppable-content {
  color: #a8a8a8; }

#comcenter-chats .comcenter-chat-droppable {
  background: url(../comcenter/dropzone-party-transparent.png) no-repeat; }

#comcenter-chats .comcenter-chat-droppable.dragging, #comcenter-chats .comcenter-chat-droppable.active {
  background: url(../comcenter/dropzone-active.png); }

.error-page.unavailable .box-content {
  height: 300px;
  text-align: center;
  padding: 0; }
  .error-page.unavailable .box-content p {
    line-height: 20px;
    margin-top: 140px; }

body.originconnect_in_progress #site-gate .gate-form .originconnect-status {
  opacity: 1;
  display: block; }
body.originconnect_in_progress #site-gate .gate-form .originconnect-fallback {
  max-height: 0; }

#site-gate {
  min-height: 0; }
  #site-gate .alert {
    margin-bottom: 16px; }
  #site-gate #recaptcha_widget_div {
    margin: 8px 0; }
  #site-gate .gate-actions {
    height: 50px; }
    #site-gate .gate-actions:before, #site-gate .gate-actions:after {
      display: table;
      content: "";
      line-height: 0; }
    #site-gate .gate-actions:after {
      clear: both; }
    #site-gate .gate-actions .btn-login, #site-gate .gate-actions .btn-get-game {
      float: right;
      min-width: 316px; }
  #site-gate .site-gate-footer {
    padding: 0 16px 16px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
    #site-gate .site-gate-footer:before, #site-gate .site-gate-footer:after {
      display: table;
      content: "";
      line-height: 0; }
    #site-gate .site-gate-footer:after {
      clear: both; }
    #site-gate .site-gate-footer.show-form .gate-actions {
      height: auto; }
    #site-gate .site-gate-footer .gate-actions {
      margin: 16px 0 32px; }
    #site-gate .site-gate-footer > .btn {
      float: right;
      min-width: 288px; }
    #site-gate .site-gate-footer .btn-login {
      margin-left: 8px; }
  #site-gate .header-headline {
    display: inline-block;
    margin: 0;
    padding: 6px 0;
    font-size: 50px;
    line-height: 40px;
    color: #fff; }
  #site-gate .logo {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center 0;
    width: 992px;
    margin-bottom: 48px; }
  #site-gate .promo {
    position: relative;
    z-index: 1;
    width: 992px;
    margin-top: 94px; }
  #site-gate .base-game-selector {
    margin-top: 16px; }

.site-gate-form-wrapper {
  float: right;
  width: 408px;
  margin-left: 16px; }
  .site-gate-form-wrapper .input-wrapper:before, .site-gate-form-wrapper .input-wrapper:after {
    display: table;
    content: "";
    line-height: 0; }
  .site-gate-form-wrapper .input-wrapper:after {
    clear: both; }
  .site-gate-form-wrapper .originconnect-status {
    background-color: #1a1a1a;
    margin: 16px 0;
    padding: 27px 20px;
    display: none;
    opacity: 0;
    position: absolute;
    width: 282px;
    -webkit-transition: opacity 0.2s ease-in;
    z-index: 1; }
  .site-gate-form-wrapper .originconnect-working, .site-gate-form-wrapper .originconnect-error {
    font-size: 14px;
    font-weight: bold;
    background-image: url(../originconnect/loading_blue.gif);
    background-repeat: no-repeat;
    background-position: 0px 50%;
    padding-left: 35px;
    line-height: 22px; }
  .site-gate-form-wrapper .originconnect-error {
    display: none; }
  .site-gate-form-wrapper .originconnect-fallback {
    overflow: hidden;
    -webkit-transition: max-height 0.2s ease-in;
    max-height: 250px; }
  .site-gate-form-wrapper .originconnect-error .originconnect-status {
    background-image: url(../originconnect/originicon.png); }
  .site-gate-form-wrapper .gate-form-checkbox label {
    padding-top: 1px;
    font-size: 13px;
    float: left; }
  .site-gate-form-wrapper .gate-login-form-submit-wrapper {
    text-align: right;
    padding-top: 5px; }
  .site-gate-form-wrapper .gate-login-form-extra {
    margin-top: 2px; }
    .site-gate-form-wrapper .gate-login-form-extra a {
      font-size: 12px;
      font-weight: normal;
      margin-right: 8px;
      color: #8a8a8a; }
  .site-gate-form-wrapper label.placeholder.gate-form-input-wrapper {
    width: 200px;
    position: relative;
    height: 30px;
    background: #fff;
    margin-bottom: 5px;
    display: block;
    float: left; }
    .site-gate-form-wrapper label.placeholder.gate-form-input-wrapper.omega {
      margin-left: 8px; }
    .site-gate-form-wrapper label.placeholder.gate-form-input-wrapper span {
      position: absolute;
      top: 0;
      left: 12px;
      line-height: 30px;
      font-size: 14px;
      color: #898989;
      z-index: 0;
      cursor: text;
      /* for IE */
      opacity: 1;
      -webkit-transition: all 1s ease-out;
      -moz-transition: all 1s ease-out;
      transition: all 1s ease-out; }
  .site-gate-form-wrapper label.placeholder:not(.filled) input:focus + span {
    opacity: 0.5;
    -webkit-transition: all 0 linear;
    -moz-transition: all 0 linear;
    transition: all 0 linear; }
  .site-gate-form-wrapper label.placeholder.filled span {
    opacity: 0;
    -webkit-transition: all 0 linear;
    -moz-transition: all 0 linear;
    transition: all 0 linear; }
  .site-gate-form-wrapper label.placeholder input {
    width: 176px;
    height: 20px;
    color: #353535;
    line-height: 20px;
    font-size: 14px;
    padding: 5px 12px;
    font-weight: normal;
    font-family: Arial, sans-serif;
    background: transparent;
    z-index: 1;
    position: relative;
    border: 0;
    outline: 0; }
    .site-gate-form-wrapper label.placeholder input:-webkit-autofill {
      color: #434343; }
  .site-gate-form-wrapper #gate-login-form-info {
    padding-top: 8px; }
  .site-gate-form-wrapper .gate-login-form-info-status {
    font-size: 16px;
    font-weight: bold;
    line-height: 22px; }
  .site-gate-form-wrapper .gate-login-form-info-secondary {
    font-size: 14px;
    font-weight: normal;
    line-height: 22px; }
  .site-gate-form-wrapper .gate-login-form-info-action-button {
    margin-top: 15px;
    min-width: 106px; }
  .site-gate-form-wrapper .gate-login-errormsg {
    color: #da3030;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 16px; }
    .site-gate-form-wrapper .gate-login-errormsg a {
      font-size: 16px;
      font-weight: bold; }
  .site-gate-form-wrapper .gate-login-queue {
    display: none; }
    .site-gate-form-wrapper .gate-login-queue.show {
      font-size: 14px;
      display: block;
      padding-bottom: 2px; }
  .site-gate-form-wrapper table.gate-login-possible {
    width: 100%;
    padding: 0;
    margin: 0; }
    .site-gate-form-wrapper table.gate-login-possible tr td {
      vertical-align: top; }

#base-bf4-html #site-gate .header-headline {
  padding: 6px 12px;
  background-color: rgba(7, 7, 7, 0.6);
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }
#base-bf4-html #site-gate .logo {
  height: 185px;
  background-image: url(//eaassets-a.akamaihd.net/battlelog/bb/bf4/logos/bf4-logo-large-37d340cd.png); }
#base-bf4-html #site-gate .site-gate-footer {
  background: rgba(7, 7, 7, 0.5);
  margin-bottom: 16px; }
  #base-bf4-html #site-gate .site-gate-footer.show-form .gate-actions .btn-get-game {
    float: left; }
#base-bf4-html #site-gate .gate-actions .btn-login, #base-bf4-html #site-gate .gate-actions .btn-get-game {
  float: right;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 400; }
#base-bf4-html #site-gate .gate-actions .btn-get-game {
  position: relative;
  font-size: 19px;
  padding-left: 86px;
  overflow: visible; }
  #base-bf4-html #site-gate .gate-actions .btn-get-game .game-stack {
    width: 68px;
    height: 81px;
    position: absolute;
    top: -15px;
    left: 8px;
    background: url(../main/warsaw/loggedout/getbf-stack.png) no-repeat; }
#base-bf4-html #site-gate .base-game-selector .game-box {
  width: 228px; }
#base-bf4-html .site-gate-form-wrapper .originconnect-status {
  color: #fff; }
#base-bf4-html .site-gate-form-wrapper .gate-login-form-info-status {
  color: #fff; }
#base-bf4-html .site-gate-form-wrapper .gate-login-form-info-secondary {
  color: #a8a8a8; }
#base-bf4-html .site-gate-form-wrapper .gate-login-queue {
  color: #a8a8a8; }
#base-bf4-html .site-gate-form-wrapper .gate-form-checkbox label {
  color: #a8a8a8; }

/* main component CSS resource */
.main-404-wrapper {
  font-size: 30px;
  padding-top: 20px;
  line-height: 40px;
  color: #000;
  width: 992px;
  position: relative;
  margin: 0 auto; }

.main-404-text {
  float: left;
  padding-top: 25px;
  padding-left: 16px;
  color: #676767; }
  .main-404-text p {
    line-height: 16px;
    font-size: 14px; }
  .main-404-text h1 {
    font-size: 30px;
    font-weight: bold; }
  .main-404-text h3 {
    font-size: 14px;
    font-weight: bold; }
  .main-404-text ul {
    list-style-type: none;
    padding: 0;
    margin: 10px 0; }
  .main-404-text a {
    font-size: 14px; }
  .main-404-text ul a {
    font-weight: normal; }
  .main-404-text li {
    line-height: 28px;
    background: url(../base/shared/li-image.png) 0 18px no-repeat;
    padding-left: 10px; }

.main-is-online {
  color: #6D6D6D;
  font-size: 12px; }

.main-splashinfo-fader-content {
  top: 70px;
  position: relative; }
  .main-splashinfo-fader-content h1 {
    color: #000;
    text-shadow: #FFF 0 1px 0;
    font-size: 55px;
    position: relative; }
  .main-splashinfo-fader-content h2 {
    position: relative;
    font-size: 22px;
    font-weight: normal;
    margin-top: 20px;
    line-height: 125%;
    text-shadow: #FFF 0 1px 0; }

.main-splashbar {
  width: 100%;
  height: 89px;
  position: absolute;
  bottom: 0;
  background: url(../main/bfbc2/splashbar.png) repeat-x;
  z-index: 4; }

#main-middle {
  position: relative;
  width: 1024px;
  background-color: #f4f4f4;
  overflow: hidden;
  padding-bottom: 20px; }

.base-content-full-width #main-middle {
  width: auto;
  background: url(//d34ymitoc1pg7m.cloudfront.net/common/backgrounds/light-bg-26fc61c7.jpg) no-repeat scroll center top #f4f4f4; }

.mainloggedin-middle {
  position: relative;
  width: 100%;
  background: white url(../base/bfbc2/middle-background_column_left.jpg) top center no-repeat; }

#main-content {
  position: relative;
  width: 992px;
  margin: 0 auto;
  padding-top: 16px; }

.main-login-register-area, .main-login-area {
  width: 654px;
  position: relative;
  margin: 0 auto; }

.main-login-register-area {
  padding-bottom: 20px; }
  .main-login-register-area a {
    font-weight: normal; }

.main-login-area a {
  font-weight: normal; }

.main-register-area h1 {
  text-align: center;
  float: none;
  margin-bottom: 16px; }
.main-register-area .registration-buttons {
  width: 195px; }
.main-register-area main-login-register-title {
  padding: 5px 0 16px; }

.main-login .main-login-floating-image {
  right: -110px;
  bottom: 0;
  position: absolute;
  z-index: 2; }

.main-login-area form {
  position: relative;
  width: 310px;
  margin: 10px auto 0 auto;
  text-align: left; }

.main-login-register-title {
  width: 614px;
  position: relative;
  margin: 0 auto;
  padding: 22px 0; }

.main-login-register-description {
  width: 614px;
  position: relative;
  margin: 0 auto;
  padding: 15px 0;
  font-size: 12px; }

.main-login-register-title h1 {
  display: block;
  font-size: 35px;
  text-align: center;
  color: #000;
  font-weight: normal; }
.main-login-register-title p {
  font-weight: normal;
  font-size: 14px;
  color: #353535;
  line-height: 17px;
  margin-top: 5px;
  width: 100%;
  text-align: center; }
  .main-login-register-title p.faded {
    color: #8a8a8a;
    font-size: 12px; }

.main-login-register-subtitle {
  width: 614px;
  position: relative;
  margin: 0 auto;
  padding: 15px 0; }
  .main-login-register-subtitle h2 {
    font-size: 18px;
    font-weight: normal;
    font-family: Arial, sans-serif;
    color: #666;
    text-align: center;
    letter-spacing: 0; }

.main-login-register-closed p {
  padding: 0 20px 20px 20px;
  font-size: 14px;
  font-weight: normal;
  font-family: Arial, sans-serif;
  color: #666;
  text-align: center;
  letter-spacing: 0;
  line-height: 22px; }
.main-login-register-closed a {
  font-size: 14px; }

#main-eyecatcher {
  width: 438px;
  height: 393px;
  float: left; }

.main-login-button {
  cursor: pointer;
  font-weight: bold;
  color: #fff;
  line-height: 42px;
  padding-left: 45px;
  text-align: left;
  border: 0;
  background: url(../base/shared/button_login.png);
  height: 42px;
  width: 195px;
  margin-bottom: 15px;
  float: left;
  font-family: Arial, sans-serif;
  font-size: 16px; }

.main-login-persist {
  margin-top: 9px;
  font-size: 12px;
  color: #666;
  text-align: left;
  float: left; }
  .main-login-persist input[type="checkbox"] {
    margin-left: 0; }

#main-login-pleasewait {
  font-size: 12px;
  color: #666; }

.main-login-links {
  margin-top: 11px; }
  .main-login-links ul {
    list-style: none; }
    .main-login-links ul li {
      margin: 0;
      font-size: 12px; }

#main-login-ajax-loader {
  position: absolute;
  right: 0;
  top: 12px;
  display: none; }

#main-splashinfo h1.main-header {
  clear: both;
  font-size: 60px;
  font-weight: bold;
  font-family: Arial, sans-serif;
  width: 500px;
  letter-spacing: -1.5px; }
#main-splashinfo h2.main-header {
  clear: both;
  font-size: 30px;
  font-weight: normal;
  font-family: Arial, sans-serif;
  width: 500px;
  margin-top: 20px;
  letter-spacing: -1px;
  line-height: 36px; }

#main-findserver {
  position: relative;
  width: 335px;
  height: 62px;
  line-height: 62px;
  margin-top: 40px; }

.single-column {
  width: 318px;
  height: 255px;
  float: left;
  margin-right: 18px; }

.single-column-last {
  margin-right: 0; }

.single-column-height {
  height: 276px; }

.single-column.single-column-first {
  margin-left: 0; }

.single-column-header {
  width: 320px;
  height: 38px; }

.main-twitter-column ul li.main-last-li {
  font-weight: bold;
  font-size: 12px;
  color: #6b6b6b;
  border-bottom: 0; }
  .main-twitter-column ul li.main-last-li div {
    margin-left: 23px; }
  .main-twitter-column ul li.main-last-li a {
    font-weight: bold;
    text-decoration: none; }
.main-twitter-column p.main-no-tweets {
  font-size: 12px;
  margin: 0 23px 13px 23px;
  padding-top: 13px; }

.main-singlecolumn-footer {
  position: absolute;
  width: 290px;
  bottom: 0;
  left: 0;
  height: 41px;
  border-top: 1px solid #EDEDED;
  margin: 0 14px; }

.main-singlecolumn-footertext {
  line-height: 39px;
  text-align: center;
  font-size: 12px;
  color: #6b6b6b; }

.main-blogpublishdate {
  font-size: 11px;
  margin: 0 23px 8px 23px; }
  .main-blogpublishdate a {
    text-decoration: none; }

.main-poll-title {
  padding-top: 13px; }
  .main-poll-title h4 {
    font-weight: normal;
    font-size: 12px;
    line-height: 1.3;
    color: #353535; }

.feed-livefeed-avatar {
  padding-top: 10px;
  padding-bottom: 6px; }

.main-login-text {
  font-size: 14px;
  color: #353535;
  float: left;
  margin-right: 20px;
  text-align: right;
  font-weight: bold; }
  .main-login-text div {
    position: relative;
    line-height: 26px;
    height: 43px;
    margin-top: 10px; }

.main-login-input-wrapper {
  position: relative;
  border: 1px solid #ccc;
  border-top-color: #ababab;
  background: #fff;
  margin-bottom: 5px;
  float: left; }
  .main-login-input-wrapper span {
    position: absolute;
    top: 7px;
    left: 13px;
    font-size: 18px;
    color: #a7a7a7;
    z-index: 0;
    cursor: text; }
  .main-login-input-wrapper input {
    width: 284px;
    height: 32px;
    font-size: 18px;
    padding: 0 12px;
    font-family: Arial, sans-serif;
    color: #353535;
    border: none;
    margin: 0; }

.register-container .main-login-text div #personaId {
  float: left;
  margin-top: 10px; }

.main-poll-novoting {
  font-weight: bold;
  font-size: 14px;
  line-height: 1.2; }

.main-poll-voted-spacer {
  height: 20px; }

.main-poll-totalvotes, .main-poll-notloggedin {
  margin: 10px 0;
  font-size: 12px; }

.main-poll-totalvotes {
  padding-bottom: 15px;
  margin-top: 15px;
  font-size: 11px;
  color: #353535; }

#main-poll-form {
  margin: 0 15px; }
  #main-poll-form input[type=submit] {
    margin: 20px 0 0 0;
    border: 0; }
  #main-poll-form .main-poll-answer {
    clear: both;
    margin: 2px 0; }

.main-poll-answertitle {
  overflow: hidden;
  width: 288px;
  margin: 6px 0;
  color: #353535; }
  .main-poll-answertitle div.text-answer {
    float: left;
    font-size: 12px;
    font-weight: bold;
    width: 248px; }
  .main-poll-answertitle div.answer-percentage {
    float: left;
    clear: right;
    width: 40px;
    font-size: 12px;
    text-align: right;
    font-weight: normal; }

#main-poll-form .main-poll-answer label {
  font-size: 12px;
  font-weight: bold; }
#main-poll-form .main-pollanswer-radio {
  margin: 10px 10px 0 0; }

#main-loggedin-top {
  width: 992px;
  height: 324px; }

.main-index-container {
  clear: both;
  width: 100%;
  position: relative;
  overflow: auto;
  top: -15px; }

.main-loggedin-container {
  width: 520px;
  margin: 0 auto;
  padding-top: 30px; }

.main-loggedin-submit {
  position: relative;
  margin-top: 5px;
  float: right; }

#main-loggedin-newsletter {
  background: url(../main/bfbc2/newsletter.png);
  margin-left: 16px;
  margin-top: 16px;
  float: right;
  width: 320px;
  height: 203px;
  position: relative; }
  #main-loggedin-newsletter #main-newsletter-signup {
    position: absolute;
    left: 190px;
    top: 103px; }
  #main-loggedin-newsletter #main-newsletter-view {
    position: absolute;
    left: 190px;
    top: 145px; }
  #main-loggedin-newsletter #main-newsletter-signup a {
    color: #f8f8f8;
    font-weight: bold;
    font-size: 16px;
    text-decoration: none;
    font-family: Arial, sans-serif; }
  #main-loggedin-newsletter #main-newsletter-view a {
    color: #f8f8f8;
    font-weight: bold;
    font-size: 12px;
    line-height: 12px;
    text-decoration: none;
    font-family: Arial, sans-serif; }
    #main-loggedin-newsletter #main-newsletter-view a:hover {
      color: #e69f1f; }
  #main-loggedin-newsletter #main-newsletter-signup a:hover {
    color: #e69f1f; }

#main-loggedin-content {
  width: 992px; }

.main-loggedin-playnow-desc {
  font-size: 11px;
  color: #353535;
  padding: 12px 0 6px 0; }
  .main-loggedin-playnow-desc a {
    font-size: 11px;
    font-weight: normal; }

.main-loggedin-award {
  clear: both;
  height: 58px; }

.main-loggedin-award-img {
  float: left;
  width: 110px;
  text-align: center; }

.main-loggedin-award-info {
  float: left;
  width: 210px; }

.main-loggedin-award-progress {
  padding-bottom: 3px;
  font-size: 12px; }

.main-loggedin-awarditem-progress {
  position: relative;
  top: 1px;
  left: 1px;
  background-color: #272829;
  height: 5px; }

.main-loggedin-award-title {
  padding-top: 5px;
  padding-bottom: 5px; }

.main-loggedin-award-desc {
  font-size: 11px;
  color: #8a8a8a;
  line-height: 1.2; }

.main-splashbar-container {
  position: relative;
  width: 992px;
  margin: 0 auto; }

.main-splashbar-signup {
  position: absolute;
  right: 0;
  top: 19px; }

.main-splashbar-info {
  float: left;
  margin-right: 70px;
  margin-top: 16px; }

.main-splashbar-info-text {
  text-shadow: 0 1px #000;
  color: #cccccc;
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 8px; }

.main-splashbar-info-amount {
  text-shadow: 0 1px #000;
  color: #fefefe;
  font-size: 35px; }

#main-loggedin-leftcolumn {
  width: 320px;
  float: right;
  margin-left: 16px;
  padding-bottom: 230px;
  /* so the soldier logo always is visible */
  margin-top: 0; }
  #main-loggedin-leftcolumn h3 {
    font-family: Tahoma, sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 15px;
    color: #353535;
    margin-bottom: 6px; }
    #main-loggedin-leftcolumn h3.grey {
      font-size: 11px;
      text-transform: uppercase;
      color: #8a8a8a; }
  #main-loggedin-leftcolumn .advirticement {
    margin: 12px 0; }

.main-loggedin-leftcolumn-active-console-friends {
  padding-top: 10px; }

.main-loggedin-leftcolumn-active-console-friend-avatars {
  height: 36px; }

.main-loggedin-leftcolumn-active-console-friend-avatar {
  width: 36px;
  height: 36px;
  float: left;
  margin-right: 5px; }

.main-loggedin-leftcolumn-active-soldier {
  border-bottom: 1px solid #fcfcfc;
  position: relative;
  margin-bottom: 9px; }

.main-loggedin-leftcolumn-active-soldier-inner {
  border-bottom: 2px solid #e8e8e8;
  min-height: 144px;
  height: auto; }

.main-loggedin-leftcolumn-active-soldier-name {
  font-weight: bold;
  font-size: 16px;
  line-height: 20px;
  position: absolute;
  top: 30px;
  left: 83px; }

.main-loggedin-leftcolumn-active-soldier-info {
  color: #8a8a8a;
  font-size: 12px;
  line-height: 20px;
  position: absolute;
  top: 50px;
  left: 83px; }

.main-loggedin-leftcolumn-active-soldier-info-platform {
  float: left;
  padding-right: 3px;
  padding-top: 4px; }

.main-loggedin-leftcolumn-active-soldier-info a {
  font-size: 12px;
  font-weight: normal; }

.main-loggedin-leftcolumn-active-soldier-rank {
  width: 100%;
  height: 128px;
  position: absolute;
  left: 0;
  bottom: 1px;
  background: url(../main/sidebar_separator_texture.png) bottom left no-repeat; }

.main-loggedin-leftcolumn-active-soldier-link {
  position: absolute;
  bottom: 0;
  left: 0; }

.main-loggedin-leftcolumn-active-soldier-rank-char-image.bf3-char {
  background: url(../profile/kits/m/bf3-us-assault.png) center bottom no-repeat; }

.main-loggedin-leftcolumn-ad {
  margin-top: 14px;
  margin-bottom: 6px; }

.main-loggedin-leftcolumn-ad-inner {
  padding: 8px; }
  .main-loggedin-leftcolumn-ad-inner img {
    display: block; }

#main-loggedin-maincolumn {
  width: 656px;
  float: right;
  margin-top: 0; }

.main-loggedin-awarditem-progress-container {
  overflow: hidden;
  background: #cacaca;
  padding: 1px;
  height: 7px;
  width: 206px; }

.main-loggedin-awarditem-progress-container-inner {
  background: #fff;
  height: 7px;
  width: 100%; }

#main-loggedin-next-awards, #main-loggedin-your-targets {
  clear: both; }

#main-loggedin-feed-container {
  border: 1px solid #d7d8d8;
  border-top: 0;
  background: #fcfcfb; }

#main-loggedin-createsoldier-container {
  border: 1px solid #d7d8d8;
  border-top: 0;
  line-height: 16px;
  background: #fcfcfb;
  font-size: 12px;
  padding: 13px; }

#main-loggedin-feed {
  position: relative;
  margin-top: 1px; }
  #main-loggedin-feed .facebook-cta {
    background: rgba(7, 7, 7, 0.6) url(../facebook/icon-fb-m.png) no-repeat;
    background-position: 16px center;
    padding-left: 56px;
    padding-right: 100px;
    font-size: 14px;
    line-height: 18px;
    color: #a8a8a8;
    position: relative; }
    #main-loggedin-feed .facebook-cta b {
      cursor: pointer;
      color: #fff; }
      #main-loggedin-feed .facebook-cta b:hover {
        text-decoration: underline; }
    #main-loggedin-feed .facebook-cta .close {
      display: block;
      position: absolute;
      right: 16px;
      top: 26px;
      background: url(../unifiedgamemanager/close@2x.png);
      background-size: 100%;
      width: 16px;
      height: 16px;
      cursor: pointer; }

#main-loggedin-wb-avatar {
  position: absolute;
  left: 0;
  top: 15px; }

#main-loggedin-wb-info {
  float: left; }

.main-loggedin-wb-info-icon {
  float: left;
  background: url(../main/singedinicons.png);
  width: 27px;
  height: 25px;
  cursor: pointer;
  position: relative; }
  .main-loggedin-wb-info-icon:hover {
    background-position: -36px 0; }

.main-loggedin-icon-new {
  background: #000;
  color: #f5a905;
  font-size: 11px;
  padding: 0 3px;
  position: absolute;
  right: 2px;
  top: 0;
  height: 14px;
  line-height: 14px;
  display: none;
  text-shadow: none; }

.main-loggedin-wb-info-icon-divider {
  float: left;
  background: url(../main/singedinicons-divider.png);
  width: 1px;
  height: 25px; }

#main-loggedin-activesoldier {
  position: absolute;
  top: 0;
  left: 340px;
  width: 200px;
  height: 90px;
  background: url(../main/bfbc2/activesoldier.png) bottom left no-repeat; }

#main-loggedin-activesoldier-header {
  position: relative;
  font-size: 11px;
  font-family: Tahoma, Arial, sans-serif;
  font-weight: bold;
  color: #8a8a8a;
  top: 30px;
  left: 70px; }

#main-loggedin-activesoldier-link {
  position: absolute;
  width: 61px;
  left: -72px;
  top: -28px;
  height: 87px; }

#main-loggedin-activesoldier-header a {
  line-height: 20px;
  font-size: 14px;
  font-family: Arial, sans-serif;
  font-weight: bold; }

#main-loggedin-activesoldier-game {
  margin-top: 0;
  width: 30px; }

#main-loggedin-wb-info-icon-inbox {
  position: relative;
  top: 47px;
  margin-left: 65px; }

#main-loggedin-wb-info-icon-gameupdates {
  position: relative;
  top: 47px;
  margin-left: 2px; }

#main-loggedin-wb-info-icon-notifications {
  position: relative;
  top: 47px;
  margin-left: 0; }

#main-loggedin-wb-info-icon-inbox.unread {
  background-position: 36px 0; }

#main-loggedin-wb-info-icon-notifications.unread .main-loggedin-icon-new, #main-loggedin-wb-info-icon-inbox.unread .main-loggedin-icon-new {
  display: block; }

#main-loggedin-wb-info-icon-gameupdates {
  background-position: 0 50px;
  position: relative;
  margin-left: 2px; }
  #main-loggedin-wb-info-icon-gameupdates:hover {
    background-position: -36px 50px; }
  #main-loggedin-wb-info-icon-gameupdates.unread {
    background-position: 36px 50px; }

#main-loggedin-wb-info-icon-notifications {
  background-position: 0 25px;
  position: relative;
  margin-left: 65px; }
  #main-loggedin-wb-info-icon-notifications:hover {
    background-position: -36px 25px; }
  #main-loggedin-wb-info-icon-notifications.unread {
    background-position: 36px 25px; }

#main-loggedin-wb-info {
  margin-top: 8px;
  margin-left: 20px; }

#main-loggedin-wb-username {
  position: absolute;
  top: 27px;
  left: 72px;
  font-size: 16px;
  font-family: Arial, sans-serif; }

#main-loggedin-wb-container {
  top: 0;
  height: 92px;
  position: relative;
  width: 992px;
  margin: 0 auto;
  border-bottom: 1px solid #fff; }

#main-loggedin-wb-bottomline {
  position: absolute;
  height: 3px;
  width: 100%;
  left: 0;
  bottom: 0;
  border-bottom: 2px solid #c0c0c0;
  opacity: 0.2;
  filter: alpha(opacity=20); }

#main-loggedin-singlecolumns {
  clear: left;
  margin: 0 16px 60px 16px; }
  #main-loggedin-singlecolumns .single-column {
    margin: 0 0 16px 18px; }
    #main-loggedin-singlecolumns .single-column:first-child {
      margin-left: 0; }

.adbox {
  height: 352px; }
  .adbox .box-content {
    background: url(../main/warsaw/soldier-box.jpg) no-repeat;
    position: relative;
    text-align: center; }
  .adbox .btn {
    margin-top: 300px; }

#main-loggedin-friends {
  width: 100%;
  position: relative; }

.profile-clean-heading, .main-loggedin-clean-heading {
  border-top: 0 solid #e0dfdf;
  padding-top: 8px;
  padding-bottom: 4px;
  background: url(../base/bfbc2/loggedin-clean-heading.png) no-repeat top left; }

#main-loggedin-friends .main-loggedin-clean-heading {
  background: none; }

.main-loggedin-clean-heading {
  font-size: 12px;
  font-weight: bold;
  color: #353535;
  font-family: Tahoma, Arial, sans-serif; }
  .main-loggedin-clean-heading h1 {
    font-family: Tahoma, sans-serif; }

.main-loggedin-heading {
  text-transform: uppercase;
  height: 38px;
  width: 100%;
  position: relative;
  background: url(../base/bfbc2/header_x1.png); }
  .main-loggedin-heading h1 {
    color: #FFF;
    font-size: 17px;
    margin-left: 16px;
    text-shadow: 0 1px #000;
    line-height: 38px;
    text-transform: uppercase; }

#main-loggedin-content #feed-container {
  width: 620px; }
#main-loggedin-content .feed-container-empty {
  text-align: center;
  padding: 10px; }
  #main-loggedin-content .feed-container-empty span {
    font-size: 14px;
    padding-bottom: 10px;
    display: block;
    color: #353535; }
  #main-loggedin-content .feed-container-empty a {
    font-size: 14px;
    font-weight: bold; }

#main-trailer-splash-content {
  position: relative;
  margin: auto;
  z-index: 210;
  width: 660px;
  height: 405px;
  display: none; }

#main-trailer-splash-darkbox {
  position: absolute;
  background-color: #151515;
  opacity: 0.95;
  filter: alpha(opacity=95);
  left: 0;
  top: -30px;
  width: 100%;
  height: 1000px;
  z-index: 200;
  display: none; }

#main-trailer-thumbnail {
  position: relative;
  margin: 0 auto;
  top: 315px;
  width: 992px;
  z-index: 190;
  cursor: pointer; }

#main-trailer-thumbnail-img {
  margin: 0 0 5px 0; }

#main-trailer-caption {
  margin: auto;
  margin-left: 5px;
  position: absolute;
  bottom: -20px;
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  color: #353535;
  text-shadow: #FFF 0 1px 0; }
  #main-trailer-caption:hover {
    color: #308DBF;
    text-decoration: underline; }

#main-live-userbar {
  position: relative;
  bottom: 0;
  width: 100%;
  margin-top: 20px; }

#loginFeed {
  width: 992px;
  margin: 72px auto auto;
  margin-top: 110px;
  position: relative;
  z-index: 2; }

.main-latest-logged-in-players {
  font-size: 14px;
  font-weight: bold;
  color: #a8a8a8; }

.main-splash-separator {
  margin: 15px 0 10px 0; }

.main-all-presence {
  margin: 0 auto;
  width: 618px;
  margin-bottom: 110px; }

.main-social {
  float: left;
  margin: 0 75px 20px 0;
  text-align: center;
  background: url(../main/all/footer-sociallogos-big.png);
  overflow: hidden; }

.main-social-last {
  margin-right: 0; }

#main-social-facebook {
  width: 158px;
  height: 59px; }
  #main-social-facebook:hover {
    background-position: 0 -59px; }

#main-social-twitter {
  margin-top: 12px;
  width: 167px;
  height: 39px;
  background-position: 0 -118px; }
  #main-social-twitter:hover {
    background-position: 0 -157px; }

#main-social-youtube {
  width: 127px;
  height: 53px;
  background-position: 0 -196px; }
  #main-social-youtube:hover {
    background-position: 0 -249px; }

.main-social-a {
  position: relative;
  top: 50px;
  left: 0;
  padding-top: 80px; }

#main-social-a-twitter {
  top: 38px;
  padding-top: 68px; }

#main-moh {
  position: relative;
  top: -20px; }

#loginfeed-avatars {
  height: 32px;
  margin-top: 5px;
  overflow: hidden;
  margin-top: 5px;
  width: 989px;
  padding: 5px;
  background-color: #f3f3f3; }

#loginfeed-avatars-container {
  position: relative;
  left: 0;
  width: 1200px;
  white-space: nowrap; }

#loginfeed-avatars .base-avatar-container {
  float: left;
  margin: 0 7px 0 0; }

.main-trailer-vietnam {
  display: none; }

#main-loggedin-top {
  width: 100%;
  height: 151px;
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/backgrounds/loggedin-top-6f944a4b.png) repeat-x;
  position: relative; }

.main-campaign {
  width: 320px;
  height: 100%;
  position: relative;
  float: left; }

.main-campaign-label {
  width: 113px;
  height: 29px;
  background: url(../main/bf3/shade.png);
  position: absolute;
  top: 5px;
  line-height: 29px;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  text-shadow: #000 0 1px 0;
  color: #FFF;
  text-transform: uppercase; }

.main-multiplayer-info, .main-campaign-info {
  color: #fff;
  font-size: 11px;
  margin: 10px;
  position: relative;
  float: left;
  line-height: 2.4; }

.main-campaign-launch {
  float: right;
  position: relative;
  margin-top: 10px;
  margin-right: 10px; }

.main-coop {
  float: left;
  position: relative;
  width: 352px;
  height: 100%; }

.main-multiplayer {
  float: left;
  position: relative;
  width: 320px;
  height: 100%; }

.main-multiplayer-label {
  width: 145px;
  height: 29px;
  background: url(../main/bf3/shade.png);
  position: absolute;
  top: 5px;
  line-height: 29px;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  text-shadow: #000 0 1px 0;
  color: #fff;
  text-transform: uppercase; }
  .main-multiplayer-label span {
    float: left; }
  .main-multiplayer-label img {
    float: left;
    margin: 9px 10px 0 10px; }

.main-multiplayer-info {
  position: relative;
  top: 98px; }

.main-multiplayer-launch {
  position: absolute;
  bottom: 12px;
  right: 10px; }

.main-targetsunlocks {
  width: 654px;
  border-top: 1px solid #cacaca;
  border-bottom: 1px solid #fff;
  margin-bottom: 16px; }

.main-targetsunlocks-inner {
  border: 1px solid #dbdbdb;
  background-color: #e7e7e7;
  position: relative;
  padding-bottom: 13px; }

.main-targetsunlocks-container-left, .main-targetsunlocks-container-right {
  width: 309px;
  position: relative;
  float: left; }

.main-targetsunlocks-container-left {
  left: 15px; }

.main-targetsunlocks-container-right {
  margin-right: 14px;
  float: right; }

.main-targetsunlocks-box-wrapper {
  margin-top: 9px; }

.main-targetsunlocks-box {
  width: 100px;
  height: 65px;
  margin: 0 10px 10px 0;
  position: relative;
  background-color: #dfdfdf;
  float: left; }
  .main-targetsunlocks-box.last {
    margin-right: 0; }

.main-targetstaken-closeform {
  display: none; }

.main-targetsunlocks-box:hover .main-targetstaken-closeform {
  display: block; }

.main-targetsunlocks-box-title {
  color: #8a8a8a;
  font-size: 10px; }

.main-targetsunlocks-box.taken {
  background: #b0d379; }

.main-targetsunlocks-target, .main-targetsunlocks-upcoming {
  height: 35px;
  line-height: 35px;
  color: #353535;
  font-family: Tahoma, Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
  position: relative; }

.main-targetsunlocks-target {
  background: url(../main/all/target.png) left no-repeat;
  text-indent: 20px;
  left: 15px;
  float: left;
  width: 309px; }

.main-targetsunlocks-upcoming {
  width: 309px;
  float: right;
  margin-right: 14px; }

.main-targetsunlocks-change {
  position: relative;
  font-weight: normal;
  line-height: 17px;
  font-size: 11px;
  padding-left: 4px; }

.main-targetsunlocks-viewall {
  position: absolute;
  bottom: 10px;
  width: 304px;
  left: 15px;
  font-weight: normal;
  text-align: center; }
  .main-targetsunlocks-viewall a {
    font-weight: normal; }

.main-targetsunlocks-progress-container {
  position: absolute;
  left: 10px;
  bottom: 6px;
  overflow: hidden;
  background: #cacaca;
  padding: 1px;
  height: 7px;
  width: 80px; }

.main-targetsunlocks-progress-container-inner {
  background: #fff;
  height: 7px;
  width: 100%; }

.main-targetsunlocks-progress {
  position: relative;
  top: 1px;
  left: 1px;
  background-color: #272829;
  height: 5px; }

.main-targetsunlocks-awardtitle {
  position: absolute;
  bottom: 7px;
  font-size: 11px;
  color: #353535;
  width: 130px;
  left: 10px;
  text-align: center;
  height: 16px;
  overflow: hidden; }

.main-targetsunlocks-statsimage {
  position: absolute; }

.main-loggedin-upcomingunlocks {
  width: 100%;
  position: relative; }

.main-loggedin-rankbar {
  width: 100%;
  position: relative;
  position: absolute;
  left: 70px;
  top: 70px;
  margin-top: 0; }

.main-loggedin-upcomingunlocks {
  min-height: 65px;
  clear: both;
  position: relative;
  left: -10px; }

.main-loggedin-rankbar a:hover {
  text-decoration: none; }

.main-loggedin-rankbar-prev {
  float: left;
  margin: 12px 0 0 0; }

.main-loggedin-rankbar-next {
  float: left;
  margin: 12px 0 0 0;
  opacity: 0.2;
  filter: alpha(opacity=20); }

.main-loggedin-rankbar-bar {
  float: left;
  font-size: 12px;
  width: 131px;
  margin-top: 15px; }

.main-loggedin-rankbar-rankName {
  line-height: 20px;
  color: #353535;
  font-size: 12px; }

.main-loggedin-rankbar-points {
  text-align: left;
  font-size: 11px;
  line-height: 18px;
  color: #8a8a8a;
  padding-top: 1px; }
  .main-loggedin-rankbar-points strong {
    font-weight: normal;
    color: #353535; }

.main-loggedin-rankbar-barmeter {
  width: 129px;
  height: 7px;
  padding: 1px;
  border: 1px solid #bebebe;
  background-color: #fff; }
  .main-loggedin-rankbar-barmeter div {
    height: 7px;
    background-color: #353535;
    max-width: 100%; }

.main-loggedin-campaign-map {
  float: left;
  width: 66px;
  height: 46px;
  border: 1px solid #e0e0df; }
  .main-loggedin-campaign-map img {
    width: 62px;
    height: 42px;
    margin: 2px; }

.main-loggedin-campaign-info {
  float: left;
  width: 154px;
  margin-left: 6px;
  overflow: hidden;
  line-height: 16px; }

.main-loggedin-campaign-chapter {
  color: #353535;
  font-size: 11px;
  font-weight: bold; }

.main-loggedin-campaign-title {
  font-size: 11px; }

.main-loggedin-campaign-ago {
  font-size: 11px;
  color: #8a8a8a; }

#main-loggedin-campaign, #main-loggedin-coop, #main-loggedin-multiplayer {
  margin-top: 14px; }

#main-loggedin-campaign {
  height: 89px; }

#main-loggedin-coop {
  height: 70px; }

.main-loggedin-sectiontitle {
  font-size: 15px;
  color: #353535;
  font-weight: bold;
  margin-bottom: 6px;
  text-indent: 5px;
  text-shadow: 0 1px #ffffff; }

.main-loggedin-coop-logo {
  background: url(../campaign/mock-cooplevels.png);
  width: 35px;
  height: 24px;
  float: left;
  margin-right: 10px;
  margin-top: 5px; }

.main-loggedin-coop-info-text {
  color: #353535;
  font-size: 12px; }

.main-loggedin-coop-info-friends {
  color: #8a8a8a;
  font-size: 11px; }

.main-loggedin-section-button {
  float: right; }

.main-loggedin-coop-info {
  width: 188px;
  float: left;
  line-height: 16px; }

.main-loggedin-multiplayer-info {
  margin-top: 6px;
  width: 240px;
  float: left; }

.main-loggedin-multiplayer-title {
  color: #8a8a8a;
  font-family: Tahoma, Arial, sans-serif;
  font-weight: bold;
  font-size: 11px; }

.main-loggedin-multiplayer-filters {
  margin-top: 6px;
  line-height: 16px;
  font-size: 11px;
  color: #8a8a8a; }
  .main-loggedin-multiplayer-filters span {
    font-weight: bold; }
  .main-loggedin-multiplayer-filters a {
    font-size: 11px;
    font-weight: normal; }

.main-loggedin-server-description {
  font-size: 11px;
  font-weight: bold;
  color: #8a8a8a;
  font-weight: bold;
  font-family: tahoma, geneva, arial, sans-serif;
  margin-bottom: 12px; }

.main-loggedin-server-infoarea {
  font-size: 11px;
  color: #8a8a8a;
  margin-left: 6px;
  line-height: 16px;
  float: left;
  margin-top: 3px; }

.main-loggedin-server {
  clear: left;
  margin-bottom: 10px; }

.main-loggedin-server-title a {
  font-size: 11px; }

.main-loggedin-server-map {
  width: 66px;
  height: 46px;
  float: left;
  border: 1px solid #e0e0df; }
  .main-loggedin-server-map img {
    width: 62px;
    height: 42px;
    margin: 2px; }

.main-targetstaken-close {
  cursor: pointer;
  position: relative;
  float: right;
  margin-right: 4px;
  background: url(../base/shared/row_icon_chat.png) 0 26px;
  height: 13px;
  width: 13px;
  margin-top: 4px;
  border: 0;
  z-index: 2; }
  .main-targetstaken-close:hover {
    background-position: 0 13px; }

.main-targetunlocks-foundnotargets {
  font-size: 12px;
  text-align: center;
  color: #353535;
  height: 70px;
  line-height: 70px; }

.main-targetunlocks-pointsneeded {
  font-size: 11px;
  position: absolute;
  top: 88px;
  left: 28px;
  color: #8a8a8a;
  text-align: center;
  width: 102px; }

#main-landing {
  height: 709px;
  background: white url(//d34ymitoc1pg7m.cloudfront.net/bf3/backgrounds/landing_bg-41a2381f.jpg) no-repeat 50% 100%;
  text-align: center;
  position: relative; }

.main-landing-bg-flick {
  width: 100%;
  height: 100%;
  background: transparent no-repeat 50% 100%;
  position: absolute;
  left: 0;
  top: 0;
  display: none; }

.main-landing-inner {
  width: 992px;
  height: 100%;
  margin: 0 auto;
  text-align: left;
  position: relative; }

#main-middle.main-landing-middle {
  padding-top: 62px;
  position: static; }

.main-landing-headinfo {
  height: 47px;
  padding-top: 25px; }
  .main-landing-headinfo table tr td {
    vertical-align: top; }

.main-landing-headinfo-line {
  width: 100%;
  height: 1px;
  background-color: #95a19b;
  margin-top: 24px; }

.main-landing-headinfo-title {
  font-family: Arial, sans-serif;
  font-size: 20px;
  padding: 14px 13px 0 12px;
  color: #c9c9cb;
  white-space: nowrap; }

#main-landing-headinfo-count {
  font-family: Arial, sans-serif;
  font-size: 47px;
  white-space: nowrap; }

.main-landing-header {
  height: 301px;
  padding-top: 70px;
  position: relative; }

.main-landing-header-action-link {
  /*padding-left: 34px;*/
  font-size: 32px;
  background: transparent no-repeat 0 50%;
  height: 34px;
  font-family: Arial, sans-serif;
  position: absolute;
  font-weight: normal; }

#base-all-body .main-landing-header {
  padding-top: 0; }

.main-landing-splashinfo {
  width: 662px;
  margin-left: 10px;
  padding-top: 14px;
  float: left; }
  .main-landing-splashinfo h1 {
    margin: 0;
    padding: 0;
    font-size: 90px;
    line-height: 75px;
    color: #ffffff;
    font-family: Arial, sans-serif;
    text-shadow: 0 1px 2px #222222;
    letter-spacing: 0;
    font-weight: normal; }
  .main-landing-splashinfo h2 {
    margin: 20px 0 0;
    padding: 0 0 0 4px;
    font-size: 32px;
    line-height: 32px;
    color: #252525;
    font-family: Arial, sans-serif;
    letter-spacing: 0;
    font-weight: normal; }

.main-landing-logo {
  width: 320px;
  height: 270px;
  float: left;
  background: transparent url(../main/all/logo.png) no-repeat 50% 20px; }

.main-landing-joincontent {
  height: 410px;
  position: absolute;
  bottom: -62px;
  z-index: 4; }

.main-landing-joincontent-login {
  width: 320px;
  height: 410px;
  background: #222222 url(../main/all/login_bg.png) no-repeat;
  float: left;
  text-align: center; }

.main-landing-joincontent-login-padder {
  padding: 19px 30px; }

.main-landing-joincontent-login h1 {
  font-family: Arial, sans-serif;
  color: #ffffff;
  font-size: 35px;
  line-height: 35px;
  margin: 0 0 18px;
  padding: 0;
  font-weight: normal; }
.main-landing-joincontent-login h4 {
  font-size: 14px;
  line-height: 22px;
  color: #d2d2d2;
  margin: 0 0 13px;
  padding: 0; }

.main-landing-joincontent-login-seperator {
  width: 260px;
  height: 14px;
  background: transparent url(../main/all/login-or-signup-seperator.png) no-repeat;
  margin: 32px 0 28px; }

.main-landing-joincontent-login-seperator-small {
  width: 260px;
  height: 1px;
  background-color: #2d2d2d;
  margin: 15px 0 11px; }

.main-landing-joincontent-login-form-input {
  position: relative;
  margin-bottom: 5px;
  background-color: #4f4f4f;
  height: 30px; }
  .main-landing-joincontent-login-form-input label {
    position: absolute;
    top: 9px;
    left: 10px;
    font-size: 12px;
    color: #a7a7a7;
    z-index: 0;
    cursor: text;
    /* for IE */ }
  .main-landing-joincontent-login-form-input.filled label {
    display: none; }
  .main-landing-joincontent-login-form-input input {
    width: 240px;
    height: 15px;
    margin: 0;
    padding: 9px 10px 6px !important;
    background-color: transparent;
    float: left;
    font-size: 12px;
    line-height: 12px;
    border: none;
    color: #b5b4b4;
    position: relative;
    z-index: 1; }
    .main-landing-joincontent-login-form-input input:focus {
      outline: none; }
    .main-landing-joincontent-login-form-input input:-webkit-autofill {
      color: #434343; }

.main-landing-login-form-actions {
  margin-top: 10px; }

.main-landing-login-form-action-remember {
  color: #a7a7a7;
  font-size: 11px;
  float: left;
  text-align: left;
  margin-top: 4px; }
  .main-landing-login-form-action-remember input {
    margin-left: 0; }
  .main-landing-login-form-action-remember label {
    top: -2px; }

.main-landing-login-action-lostpassword {
  font-weight: normal;
  color: #55728c;
  font-size: 11px; }

.main-landing-joincontent-pitchboxes {
  width: 672px;
  float: left; }

.main-landing-joincontent-pitchboxes-pitch {
  height: 197px;
  width: 320px;
  position: relative;
  float: left;
  margin-left: 16px;
  text-align: center; }

.main-landing-joincontent-pitchboxes-pitch-link {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  left: 0;
  top: 0; }

.main-landing-joincontent-pitchbox-bg {
  position: absolute;
  z-index: -1;
  width: 320px;
  height: 215px;
  top: -18px;
  left: 0;
  background: transparent no-repeat; }

.main-landing-joincontent-pitchboxes-pitch h1 {
  font-size: 30px;
  font-family: Arial, sans-serif;
  line-height: 32px;
  color: #000;
  font-weight: normal;
  margin-top: 131px; }

.main-landing-joincontent-pitchboxes-pitch-info {
  color: #9e9e9e;
  font-size: 12px;
  padding-top: 5px; }

.main-landing-joincontent-pitchboxes-pitch-size2 .main-landing-joincontent-pitchboxes-pitch-info {
  padding-top: 7px; }

.main-landing-liveeventsbox .common-box-title {
  text-align: center; }
.main-landing-liveeventsbox .common-box-inner {
  padding-bottom: 13px; }
.main-landing-liveeventsbox .common-box-inner-border {
  height: 322px; }

.main-landing-stats-separator {
  height: 2px;
  background-color: #e7e7e7;
  border-bottom: 1px solid #fff;
  margin-bottom: 15px; }

.main-landing-stats {
  margin-bottom: 24px; }
  .main-landing-stats table {
    width: 100%;
    height: 78px; }
  .main-landing-stats h1 {
    font-size: 11px;
    font-family: Tahoma, Arial, sans-serif;
    color: #ababab;
    padding: 0;
    margin: 14px 0 8px 11px; }

.main-landing-stats-stat {
  font-size: 35px;
  font-family: Arial, sans-serif;
  color: #878787;
  margin: 0 0 0 11px;
  padding: 0; }

.main-landing-stats-icon-kills {
  width: 71px;
  background: transparent url(../main/stats-kills.png) no-repeat 0 6px; }

.main-landing-stats-icon-users {
  width: 68px;
  background: transparent url(../main/stats-users.png) no-repeat -6px 5px; }

.main-landing-stats-icon-time {
  width: 65px;
  background: transparent url(../main/stats-time.png) no-repeat -7px 8px; }

.main-landing-stats-icon-dogtags {
  width: 49px;
  background: transparent url(../main/stats-dogtags.png) no-repeat -23px 0; }

.main-landing-loggedin-goto-game {
  margin-top: 8px; }

.main-landing-loggedin-goto-game-title {
  text-align: left; }

#main-loggedin-closedbeta p {
  font-size: 12px;
  color: #8a8a8a;
  line-height: 1.4; }
#main-loggedin-closedbeta a {
  font-size: 12px;
  line-height: 1.4; }

.main-targetsunlocks-statsimage-padder {
  width: 25px;
  float: left;
  height: 30px; }

#main-loggedin-friendsuggest {
  margin-top: 16px; }
  #main-loggedin-friendsuggest p {
    font-size: 12px;
    color: #353535;
    margin-bottom: 16px; }
  #main-loggedin-friendsuggest li {
    margin-bottom: 10px; }
  #main-loggedin-friendsuggest .base-friends-username, #main-loggedin-friendsuggest .base-friends-avatar {
    width: auto;
    float: left;
    margin-right: 10px; }
  #main-loggedin-friendsuggest .profile-add-friend {
    float: right;
    margin-top: 5px; }

/* main.about */
.main-about-intro {
  height: 178px;
  text-align: center; }
  .main-about-intro h1 {
    font-size: 65px;
    line-height: 68px;
    color: #000;
    font-family: Arial, sans-serif;
    font-weight: normal;
    padding-top: 31px;
    text-transform: uppercase; }
  .main-about-intro p {
    font-size: 30px;
    line-height: 33px;
    color: #353535;
    font-family: Arial, sans-serif;
    font-weight: normal;
    padding-top: 13px; }

.main-about-feature {
  border-bottom: 1px solid #dfdfdf; }
  .main-about-feature .main-about-feature-info {
    width: 488px;
    float: left;
    position: relative; }
  .main-about-feature.text-right .main-about-feature-info {
    float: right; }
  .main-about-feature h2 {
    font-size: 35px;
    line-height: 38px;
    font-family: Arial, sans-serif;
    font-weight: normal;
    color: #000;
    margin: 43px 0 0;
    text-transform: uppercase; }
  .main-about-feature img {
    float: right; }
  .main-about-feature.text-right img {
    float: left; }

.main-about-feature-info-intro {
  font-size: 20px;
  font-weight: normal;
  font-family: Arial, sans-serif;
  line-height: 23px;
  color: #353535;
  margin: 7px 0 0; }

.main-about-feature .main-about-feature-info-description {
  color: #777777;
  font-size: 16px;
  line-height: 23px;
  margin: 10px 0 0; }

.main-about-foot {
  text-align: center;
  padding: 40px 0; }

.main-about-foot-back-home {
  font-size: 50px;
  line-height: 53px;
  text-decoration: none;
  font-family: Arial, sans-serif;
  text-transform: uppercase;
  font-weight: normal; }

/* Forgot Password
 * ---------------------------------------------------------------- */
.note {
  font-size: 12px;
  font-weight: bold;
  line-height: 18px;
  text-align: center;
  margin: 20px auto;
  width: 440px; }

.main-login-register-area {
  min-height: 500px;
  text-align: center; }

.main-forgotpassword-label {
  font-family: Arial, sans-serif;
  font-size: 12px;
  float: left;
  text-align: right;
  width: 110px;
  margin: 18px 10px 0 0; }

.main-forgotpassword-input {
  color: #353535;
  font-family: Arial, sans-serif;
  font-size: 18px;
  margin-bottom: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  width: 290px; }

.main-forgotpassword-submit {
  margin: 10px 0 0 120px; }

.main-loggedin-header {
  border-bottom: 1px solid #fcfcfc; }

.main-loggedin-header-inner {
  padding: 16px 16px 0;
  height: 226px;
  border-bottom: 1px solid #dfdfdf;
  background: rgba(0, 0, 0, 0.03); }

.main-loggedin-header-puffs {
  width: 1024px;
  margin-bottom: 10px;
  position: relative; }

.main-loggedin-header-puff {
  width: 336px;
  height: 115px;
  float: left;
  margin-right: 8px;
  position: relative;
  display: block;
  margin-bottom: 8px; }
  .main-loggedin-header-puff.last {
    margin-right: 0; }
  .main-loggedin-header-puff:hover .main-loggedin-header-puff-content {
    cursor: pointer;
    background: rgba(255, 255, 255, 0.1); }
  .main-loggedin-header-puff.disabled:hover .main-loggedin-header-puff-content {
    cursor: auto;
    background: none; }
  .main-loggedin-header-puff a {
    font-weight: normal;
    color: #3aade3; }

#main-loggedin-header-puff-multiplayer-groupjoin:hover {
  color: #ffc500; }

.main-loggedin-header-puff-overlay {
  position: absolute; }

.puff-disabled:hover {
  cursor: default; }

#main-loggedin-header-puff-campaign .main-loggedin-header-puff-background {
  background: url(../main/bf3/boxes/bg-campaign-bf3.jpg) no-repeat; }

#main-loggedin-header-puff-topstory {
  height: 238px; }
  #main-loggedin-header-puff-topstory a.main-topstory-link {
    display: block; }
  #main-loggedin-header-puff-topstory .main-loggedin-header-puff-background {
    background-image: url(../main/bf3/boxes/bg-story-bf3.jpg);
    background-size: auto 100%;
    height: 100%; }
  #main-loggedin-header-puff-topstory .main-loggedin-header-puff-content {
    height: 100%; }

#main-loggedin-header-puff-assignments .main-loggedin-header-puff-background {
  background-image: url(../main/bf3/boxes/bg-ass-bf3.jpg); }

#main-loggedin-header-puff-unlocks .main-loggedin-header-puff-background {
  background-image: url(../main/bf3/boxes/bg-unlocks-bf3.jpg); }

#main-loggedin-header-puff-loadout .main-loggedin-header-puff-background {
  background-image: url(../main/bf3/boxes/bg-loadout-bf3.jpg); }

#main-loggedin-header-puff-leaderboard .main-loggedin-header-puff-background {
  background-image: url(../main/bf3/boxes/bg-leaderboards-bf3.jpg); }

#main-loggedin-header-puff-premium .main-loggedin-header-puff-background {
  background-image: url(../main/bf3/boxes/bg-premium-bf3.jpg); }
#main-loggedin-header-puff-premium article {
  position: absolute;
  display: none;
  color: #fff;
  top: 50px;
  left: 16px;
  right: 16px;
  bottom: 16px; }
#main-loggedin-header-puff-premium i.icon {
  display: block;
  position: absolute;
  top: auto;
  left: auto;
  bottom: 0;
  right: 90px;
  z-index: 2; }
#main-loggedin-header-puff-premium .event {
  position: absolute;
  right: 57px;
  bottom: 0;
  z-index: 1; }
#main-loggedin-header-puff-premium h1 {
  width: 185px;
  font-family: Arial, sans-serif;
  font-size: 12px;
  line-height: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden; }
#main-loggedin-header-puff-premium time {
  font-family: Arial, sans-serif;
  font-size: 11px;
  line-height: 15px;
  color: #8a8a8a; }
#main-loggedin-header-puff-premium .bullets {
  position: absolute;
  left: 14px;
  bottom: 5px; }
#main-loggedin-header-puff-premium span {
  font-family: Arial, sans-serif;
  font-size: 32px;
  line-height: 0;
  letter-spacing: 1px;
  color: #4f545a;
  -webkit-transition: color 0.2s; }
  #main-loggedin-header-puff-premium span.active {
    color: #cfcfcf; }

.main-loggedin-header-puff-background {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-repeat: no-repeat;
  background-position: 50% 20% !important;
  background-size: 100% auto; }

.main-loggedin-header-puff-background-dark {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-repeat: no-repeat;
  background-position: 50% 20% !important;
  background-size: 100% auto;
  background: #000;
  opacity: 0.3; }

.main-loggedin-header-puff-overlay {
  height: 100%;
  width: 100%;
  background: url(../main/topstory-overlay-home.png) left bottom repeat-x;
  box-shadow: inset 0 0 40px 0 rgba(255, 255, 255, 0.15); }

#main-loggedin-header-puff-campaign .main-loggedin-header-puff-overlay {
  width: 191px;
  height: 210px;
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/main/1-overlay-33f290da.png) no-repeat;
  right: 0;
  top: 0; }

#main-loggedin-header-puff-coop .main-loggedin-header-puff-background {
  background: url(../main/bf3/boxes/bg-coop-bf3.jpg) no-repeat; }

#main-loggedin-header-puff-fireteams .main-loggedin-header-puff-background {
  background: url(../main/mohw/boxes/bg-fireteams-mohw.jpg) no-repeat; }

#main-loggedin-header-puff-coop .main-loggedin-header-puff-overlay {
  width: 193px;
  height: 228px;
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/main/2-overlay-b4788212.png) no-repeat;
  left: 197px;
  top: 0; }
  #main-loggedin-header-puff-coop .main-loggedin-header-puff-overlay.disabled {
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/main/2-overlay-inactive-b27f122e.png) no-repeat; }

#main-loggedin-header-puff-multiplayer .main-loggedin-header-puff-background {
  background: url(../main/bf3/boxes/bg-multi-bf3.jpg) no-repeat; }
#main-loggedin-header-puff-multiplayer .main-loggedin-header-puff-overlay {
  width: 148px;
  height: 118px;
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/main/3-overlay-eef017b9.png) no-repeat;
  left: 182px;
  top: 109px; }

#main-loggedin-header-puff-buygame {
  width: 680px;
  height: 238px;
  margin-right: 0; }
  #main-loggedin-header-puff-buygame .pitch {
    position: absolute;
    bottom: 25px;
    left: 30px; }
  #main-loggedin-header-puff-buygame h1, #main-loggedin-header-puff-buygame h3 {
    font-family: Arial, sans-serif;
    font-weight: bold;
    text-transform: uppercase; }
  #main-loggedin-header-puff-buygame h1 {
    font-size: 24px;
    color: #ffc500;
    line-height: 1; }
  #main-loggedin-header-puff-buygame h3 {
    font-size: 14px;
    color: #fff;
    line-height: 1.9;
    text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.8); }
  #main-loggedin-header-puff-buygame .player {
    position: absolute;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    top: 27px;
    right: 27px;
    width: 288px;
    height: 186px;
    background: #000;
    /*box-shadow: 0 2px 8px rgba(0,0,0,.75)*/ }
  #main-loggedin-header-puff-buygame .video {
    background: #000;
    display: none; }
  #main-loggedin-header-puff-buygame iframe {
    display: none; }
  #main-loggedin-header-puff-buygame .player .borders {
    position: absolute;
    pointer-events: none;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    box-shadow: inset 0 0 1px 2px rgba(255, 255, 255, 0.3); }
  #main-loggedin-header-puff-buygame .player .mediabutton {
    display: none;
    position: absolute;
    background: url(../main/icon-play-m.png) 0 0 no-repeat;
    left: 50%;
    top: 50%;
    width: 72px;
    height: 73px;
    margin: -36px 0 0 -36px;
    cursor: pointer;
    z-index: 2; }
  #main-loggedin-header-puff-buygame .player:hover .mediabutton {
    background-position: 0 -72px; }
  #main-loggedin-header-puff-buygame .common-title {
    font-size: 22px;
    line-height: 35px; }

.main-loggedin-header-puff-content {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  -webkit-transition: background 0.5s ease;
  -moz-transition: background 0.5s ease;
  -ms-transition: background 0.5s ease;
  -o-transition: background 0.5s ease;
  transition: background 0.5s ease;
  text-shadow: 1px 1px 3px black; }
  .main-loggedin-header-puff-content h2 {
    color: #fff;
    text-transform: uppercase;
    padding: 3px 0 0 16px;
    line-height: 1;
    text-shadow: 0 1px 3px #000;
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=150,strength=1.5);
    overflow: hidden; }

.main-loggedin-header-puff-info {
  width: 288px;
  position: absolute;
  left: 16px;
  top: 50px; }

.main-loggedin-header-puff-info-title {
  font-size: 11px;
  font-family: Tahoma, sans-serif;
  color: #c3c3c3;
  line-height: 15px;
  font-weight: bold;
  text-transform: uppercase;
  padding-top: 1px;
  text-shadow: #222 2px 2px 5px; }

.puff-disabled .main-loggedin-header-puff-info-title {
  font-family: Arial, sans-serif;
  font-size: 22px;
  line-height: 22px;
  text-transform: uppercase;
  font-weight: normal;
  padding-top: 1px;
  text-shadow: none;
  color: #8a8a8a;
  padding-left: 16px; }
.puff-disabled .main-loggedin-header-puff-content h2 {
  text-shadow: none; }

.main-loggedin-header-puff-friends-avatars-wrapper {
  height: 36px;
  padding: 7px 0; }

.main-loggedin-header-puff-friends-avatar {
  width: 36px;
  height: 36px;
  float: left;
  margin-right: 5px; }

.main-view-friends-view-link {
  font-size: 11px;
  font-weight: normal;
  line-height: 14px; }

.main-loggedin-header-puff-progress-counter {
  background: black url(../coop/difficulty-sprite.png) 0 0 no-repeat;
  line-height: 19px;
  padding: 0 7px 0 27px;
  color: #fff;
  font-size: 12px; }

.main-loggedin-header-puff-play {
  position: absolute;
  left: 16px;
  bottom: 16px;
  color: #fff;
  font-size: 13px; }
  .main-loggedin-header-puff-play h3 {
    color: #fff;
    font-size: 16px;
    line-height: 20px;
    width: 300px;
    margin-bottom: 3px; }

.main-loggedin-header-puff-play-info {
  line-height: 14px;
  margin-bottom: 6px; }
  .main-loggedin-header-puff-play-info img {
    margin-bottom: -1px;
    padding-right: 4px; }
  .main-loggedin-header-puff-play-info a {
    font-weight: normal;
    font-size: 12px;
    color: #fff;
    text-decoration: none; }
    .main-loggedin-header-puff-play-info a:hover {
      font-weight: normal;
      font-size: 12px;
      color: #fff;
      text-decoration: none; }

.main-loggedin-header-puff-campaign-info-title {
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  line-height: 20px;
  text-shadow: #222 2px 2px 5px;
  margin-top: 4px; }

.main-loggedin-header-puff-campaign-info-extra {
  font-size: 11px;
  color: #c3c3c3;
  line-height: 14px;
  text-shadow: #222 2px 2px 5px; }

.main-loggedin-leftcolumn-upcoming-unlocks {
  margin-bottom: 2px;
  min-height: 121px;
  position: relative; }

.main-loggedin-upcomingunlocks {
  min-height: 65px;
  position: relative;
  left: -10px; }

.main-loggedin-leftcolumn-upcoming-unlocks-footer-anchor-separator {
  padding-left: 4px;
  padding-right: 3px; }

#main-landing-middle-wrapper #main-middle, #main-landing-middle-wrapper #footer-wrapper {
  width: auto; }

.main-plugin-debug-contaioner {
  width: 650px;
  margin: 0 auto;
  height: 800px; }

.main-upcoming-unlock {
  width: 100px;
  float: left;
  margin-right: 6px;
  position: relative; }

body .main-upcoming-unlock .common-bubble {
  top: -50px !important; }

.main-upcoming-unlock img {
  margin-top: 5px;
  margin-left: 10px; }
.main-upcoming-unlock .common-percentbar-container {
  margin-left: 16px;
  background: rgba(255, 255, 255, 0.2);
  border: 0;
  padding: 0;
  height: 5px; }
  .main-upcoming-unlock .common-percentbar-container div {
    background: none repeat scroll 0 0 #fff;
    margin: 0;
    height: 5px; }
.main-upcoming-unlock.last {
  margin-right: 0; }

.main-friendlist-playing {
  float: left;
  margin-top: 3px;
  margin-right: 6px; }

.main-loggedin-leftcolumn-bf3preorder {
  margin-bottom: 7px; }

.main-side-column .advirticement.ad320x200 {
  width: 320px;
  height: 200px;
  margin-bottom: 16px; }
.main-side-column .advirticement > :last-child {
  margin: 0 0 16px 0;
  display: block; }
.main-side-column .advirticement .advirticement-default {
  display: none; }
.main-side-column .advirticement.ad320x200 .advirticement-default {
  width: 320px;
  height: 200px; }

/* Latest news
 * ---------------------------------------------------------------- */
#main-postlistsmall {
  padding: 0 0 10px 0; }
  #main-postlistsmall footer {
    padding: 0; }
    #main-postlistsmall footer a {
      padding: 16px;
      display: block;
      text-decoration: none; }
    #main-postlistsmall footer:hover {
      background: none; }

#main-latest-news {
  margin-bottom: 10px; }
  #main-latest-news h3 {
    margin-bottom: 6px; }
  #main-latest-news li {
    border-bottom: 1px solid #ddd;
    margin: 0 0 5px 0;
    padding: 0 0 5px 0; }
    #main-latest-news li.last {
      border-bottom: 0; }
    #main-latest-news li.posts-premium a:first-child {
      display: inline-block;
      padding-left: 21px;
      min-height: 14px;
      background: url(../premium/icon-p-s.png) 0 0 no-repeat; }
    #main-latest-news li p {
      color: #8A8A8A;
      font-size: 11px;
      margin: 6px 0 3px 0; }
      #main-latest-news li p a {
        font-size: 11px;
        font-weight: normal; }

#main-loggedin-maincolumn #profile-status-message-area {
  padding-left: 10px; }

.agegate {
  font-size: 14px; }

body .main-credits-bf4 {
  background-color: rgba(7, 7, 7, 0.5); }
  body .main-credits-bf4 .main-credits-header1 {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 32px; }
  body .main-credits-bf4 .main-credits-header2 {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 23px; }
  body .main-credits-bf4 .main-credits-lines {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-weight: normal; }
  body .main-credits-bf4 .main-credits-human-role {
    font-weight: 600;
    font-size: 16px; }
  body .main-credits-bf4 .main-credits-human-name {
    font-weight: 400;
    font-size: 16px; }
  body .main-credits-bf4 .main-credits-multilines {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 16px; }
  body .main-credits-bf4 .main-credits-line {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 16px; }
  body .main-credits-bf4 .logo {
    margin: 0 auto;
    margin-top: 30px;
    width: 265px;
    height: 50px;
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf4/logos/bf4-logo-3ed8cb79.png); }

body .main-credits-bfh {
  background-color: rgba(7, 7, 7, 0.5); }
  body .main-credits-bfh .main-credits-header1 {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 32px; }
  body .main-credits-bfh .main-credits-header2 {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 23px; }
  body .main-credits-bfh .main-credits-lines {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-weight: normal; }
  body .main-credits-bfh .main-credits-human-role {
    font-weight: 600;
    font-size: 16px; }
  body .main-credits-bfh .main-credits-human-name {
    font-weight: 400;
    font-size: 16px; }
  body .main-credits-bfh .main-credits-multilines {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 16px; }
  body .main-credits-bfh .main-credits-line {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 16px; }
  body .main-credits-bfh .logo {
    margin: 0 auto;
    margin-top: 30px;
    width: 390px;
    height: 119px;
    background: url(//d34ymitoc1pg7m.cloudfront.net/bfh/logos/bfh-logo-promo-24973360.png); }

.main-credits {
  margin-bottom: 50px;
  text-align: center; }

.main-credits-header1 {
  font-family: Arial, sans-serif;
  font-size: 50px;
  line-height: 50px;
  font-weight: normal;
  color: #fff;
  margin-top: 53px;
  text-transform: uppercase; }

.main-credits-header2 {
  font-family: Arial, sans-serif;
  font-size: 30px;
  line-height: 38px;
  font-weight: normal;
  color: #fff;
  margin: 27px 0 0;
  text-transform: uppercase; }

.main-credits-lines {
  color: #fff;
  line-height: 24px;
  margin: 7px auto 0; }

.main-credits-human-role {
  width: 50%;
  text-align: right;
  font-size: 14px;
  font-weight: normal;
  padding-right: 16px;
  white-space: nowrap; }

.main-credits-human-name {
  width: 47.5%;
  text-align: left;
  font-size: 14px;
  font-weight: bold;
  white-space: nowrap; }
  .main-credits-human-name.first {
    width: 50%;
    text-align: right;
    padding-right: 16px; }

.main-credits-multilines {
  color: #fff;
  line-height: 24px;
  margin: 7px auto 0; }

.main-credits-line {
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  padding: 0 22px; }

.main-legal-image {
  float: left;
  margin-right: 16px; }

.main-legal-info {
  float: left;
  font-size: 12px;
  line-height: 18px;
  width: 188px; }

.main-legal-box {
  width: 320px;
  float: left;
  margin-right: 16px; }
  .main-legal-box:last-child {
    margin-right: 0; }

.main-legal-box-height {
  height: 142px;
  padding-top: 16px; }

.main-legal-info-subtitle {
  font-style: italic; }

.main-show-banner a {
  display: block;
  width: 100%;
  height: 100%; }
  .main-show-banner a:hover {
    text-decoration: none; }
.main-show-banner:hover .main-show-banner-info {
  text-decoration: underline; }

.main-show-banner-title {
  font-size: 25px;
  color: #fff;
  position: absolute;
  top: 16px;
  left: 16px;
  font-weight: normal; }

.main-show-banner-info {
  position: absolute;
  left: 16px;
  bottom: 20px;
  font-size: 12px;
  line-height: 16px;
  color: #3AADE3;
  font-weight: normal; }

a.main-show-banner-shop:hover {
  text-decoration: none; }
  a.main-show-banner-shop:hover .main-show-banner-info {
    text-decoration: underline; }

.main-show-banner-shop {
  display: block;
  position: relative;
  width: 320px;
  height: 107px;
  margin-bottom: 12px;
  background: url(../main/banner-shop.jpg); }

.main-show-banner-karkand {
  margin-bottom: 12px;
  position: relative; }
  .main-show-banner-karkand.karkand-not-owned, .main-show-banner-karkand.karkand-owned {
    background: url(../main/bf3/banner-b2k-bg.jpg);
    width: 320px;
    height: 200px;
    margin-bottom: 12px; }

.main-news-comments a {
  padding-bottom: 0; }

.main-selectlanguage-middle {
  text-align: center; }

.main-selectlanguage-form-wrapper {
  margin: 0 auto;
  width: 654px; }

.main-selectlanguage-form {
  margin-top: 16px; }

.main-selectlanguage-form-padder {
  padding: 14px 16px;
  text-align: left; }

.main-selectlanguage-form-submit {
  margin: 16px 0; }

.main-selectlanguage-language {
  float: left;
  width: 50%;
  margin-bottom: 10px; }
  .main-selectlanguage-language label {
    font-size: 12px; }
  .main-selectlanguage-language input[checked] + label {
    font-weight: bold; }

.main-news-comments a {
  padding-bottom: 0; }

.main-selectlanguage-middle {
  text-align: center; }

.main-selectlanguage-form-wrapper {
  margin: 0 auto;
  width: 654px; }

.main-selectlanguage-form {
  margin-top: 16px; }

.main-selectlanguage-form-padder {
  padding: 14px 16px;
  text-align: left; }

.main-selectlanguage-form-submit {
  margin: 16px 0; }

.main-selectlanguage-language {
  float: left;
  width: 50%;
  margin-bottom: 10px; }
  .main-selectlanguage-language label {
    font-size: 12px; }
  .main-selectlanguage-language input[checked] + label {
    font-weight: bold; }

/* Page Box content
 * ------------------------------------------------------------------ */
#main-loggedin-top-banner {
  overflow: hidden;
  margin-bottom: 6px;
  width: 100%; }

/* Karkand banner
 * ------------------------------------------------------------------ */
.main-show-banner-karkand {
  margin-bottom: 6px;
  position: relative;
  font-size: 11px;
  line-height: 16px; }
  .main-show-banner-karkand a {
    color: #3AADE3;
    font-size: 11px; }
  .main-show-banner-karkand.karkand-not-owned {
    background: url(../main/bf3/banner-b2k-bg.jpg);
    width: 320px;
    height: 200px; }
  .main-show-banner-karkand.karkand-owned {
    background: url(../main/bf3/banner-b2k-owned-bg.jpg);
    width: 320px;
    height: 166px; }

#main-karkandbanner-friends {
  height: 36px;
  padding: 7px 0; }

.main-loggedin-karkand-container {
  display: none;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 320px;
  height: 125px;
  padding-left: 12px; }

.karkand-owned .main-loggedin-karkand-container-nofriends {
  background: rgba(0, 0, 0, 0.85);
  position: absolute;
  left: 0;
  bottom: 0; }

.main-loggedin-header-puff-info-karkand {
  color: white;
  position: absolute;
  top: 46px;
  left: 16px; }

.main-bannerkarkand-avatar {
  margin: 2px 2px;
  display: inline-block; }

.main-loggedin-karkand-container-nofriends {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 6px 0 6px 36px;
  width: 284px; }

.main-bannerkarkand-avatar-container {
  text-align: center; }
  .main-bannerkarkand-avatar-container .base-avatar-status-overlay {
    background: none !important; }

.main-show-banner-karkand .base-button-arrow-large {
  font-family: BebasNeueRegular, Arial, sans-serif;
  font-size: 22px;
  font-weight: normal; }

#main-banner-karkand-transfooter {
  position: absolute;
  bottom: 8px;
  left: 16px; }

.main-show-banner-karkand karkand-owned #main-bannerkarkand-transfooter {
  height: 50px; }

.karkand-owned p {
  line-height: 16px;
  color: #fff;
  font-weight: bold; }

#main-bannerkarkand-checkbox {
  background: url(../coop/difficulty-sprite.png) no-repeat;
  width: 19px;
  height: 19px;
  position: absolute;
  top: 6px;
  left: 10px; }

.spinner {
  text-align: center;
  margin: 6px;
  display: none; }

#main-bannerkarkand-buy-form {
  position: absolute;
  top: 0;
  left: 16px; }

/* Banner Kit Shortcuts
 -------------------------------------------------------------------- */
#main-show-banner-kitshortcuts {
  background: url(../main/banner_kit_shortcuts.jpg) left top no-repeat;
  display: block;
  height: 107px;
  width: 320px;
  position: relative;
  margin-bottom: 16px; }
  #main-show-banner-kitshortcuts h2 {
    font-family: BebasNeueRegular, Arial, sans-serif;
    font-size: 24px;
    color: white;
    padding: 0;
    margin: 0;
    position: absolute;
    top: 12px;
    left: 16px;
    font-weight: normal; }
  #main-show-banner-kitshortcuts p {
    background: url(../main/icon_new_win.gif) right center no-repeat;
    font-family: Arial, sans-serif;
    font-size: 12px;
    color: #3aade3;
    position: absolute;
    left: 16px;
    bottom: 12px;
    padding-right: 14px; }
  #main-show-banner-kitshortcuts:hover p {
    text-decoration: underline; }

.main-loggedin-leftcolumn-activity {
  margin-bottom: 10px;
  position: relative;
  overflow: hidden; }

.main-loggedin-leftcolumn-activity-intro {
  border-bottom: 1px solid #e1e1e1;
  background: #f8f3c5;
  padding: 16px 20px 16px 16px;
  position: relative;
  display: none;
  color: #353535;
  padding: 10px; }

.main-loggedin-leftcolumn-activity.show-intro .main-loggedin-leftcolumn-activity-intro {
  display: block; }

.main-loggedin-leftcolumn-activity-intro .close {
  width: 7px;
  height: 7px;
  background: url(../base/shared/row_close.png) 0 0 no-repeat;
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer; }
  .main-loggedin-leftcolumn-activity-intro .close:hover {
    background-position: 0 -7px; }
.main-loggedin-leftcolumn-activity-intro h4 {
  line-height: 16px;
  font-size: 12px;
  font-weight: bold;
  margin-bottom: 2px; }
.main-loggedin-leftcolumn-activity-intro p {
  line-height: 18px;
  font-size: 12px; }
.main-loggedin-leftcolumn-activity-intro a {
  font-weight: normal;
  font-size: 12px;
  line-height: 18px; }

.main-loggedin-leftcolumn-activity .activity-header-gameicon {
  float: right;
  margin: 1px 10px 0 0; }

.main-loggedin-leftcolumn-activity .base-box-push-inner {
  padding: 0;
  overflow: hidden; }

#main-loggedin-leftcolumn .main-loggedin-leftcolumn-activity .base-box-push-header {
  border-bottom: 1px solid #e1e1e1;
  padding: 0 6px 0 16px;
  height: 40px; }
  #main-loggedin-leftcolumn .main-loggedin-leftcolumn-activity .base-box-push-header h3 {
    line-height: 39px;
    margin: 0;
    font-weight: bold;
    color: #353535;
    font-family: Tahoma, sans-serif;
    font-size: 12px;
    float: left; }

.main-loggedin-leftcolumn-activity .activitystream-list-wrapper {
  width: 100%;
  overflow-y: hidden;
  height: 334px;
  position: relative;
  z-index: 0; }
  .main-loggedin-leftcolumn-activity .activitystream-list-wrapper .activitystream-noevents {
    height: 334px; }
.main-loggedin-leftcolumn-activity.show-intro .activitystream-list-wrapper .activitystream-noevents {
  height: 212px; }
.main-loggedin-leftcolumn-activity .activitystream-list-wrapper .activitystream-noevents td {
  vertical-align: middle;
  text-align: center;
  background: transparent;
  border: 0;
  padding: 0 30px; }
  .main-loggedin-leftcolumn-activity .activitystream-list-wrapper .activitystream-noevents td h4 {
    font-size: 14px;
    text-transform: uppercase; }
  .main-loggedin-leftcolumn-activity .activitystream-list-wrapper .activitystream-noevents td p {
    font-size: 12px;
    line-height: 22px; }
.main-loggedin-leftcolumn-activity .view-more {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0; }
  .main-loggedin-leftcolumn-activity .view-more span {
    display: block;
    padding: 0 16px;
    text-align: left;
    line-height: 30px;
    font-size: 11px;
    font-weight: normal;
    background: #ebebeb;
    z-index: 2;
    border-top: 1px solid #d3d3d3; }
  .main-loggedin-leftcolumn-activity .view-more::after {
    display: block;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 20px;
    background: transparent;
    box-shadow: 0 -2px 20px 6px rgba(0, 0, 0, 0.1);
    z-index: -1;
    border-radius: 30%; }
.main-loggedin-leftcolumn-activity .activitystream-noevents + .view-more {
  display: none; }
.main-loggedin-leftcolumn-activity.show-intro .activitystream-list-wrapper {
  height: 213px; }
.main-loggedin-leftcolumn-activity .activitystream-list {
  padding: 0 9px;
  position: relative;
  z-index: 0;
  height: 100%;
  overflow: hidden; }
.main-loggedin-leftcolumn-activity .common-scrollbar-style .activitystream-list {
  height: auto;
  overflow: visible; }
.main-loggedin-leftcolumn-activity .activitystream-list .activitystream-item:first-child {
  margin-top: 12px; }
.main-loggedin-leftcolumn-activity .activitystream-list .activitystream-item:last-child {
  margin-bottom: 12px; }
.main-loggedin-leftcolumn-activity .common-scrollbar-style .activitystream-list {
  padding: 0 18px 0 9px; }

.main-loggedin-premium-scoremultiplier {
  background: url(../main/bf3/bg-event-1024.png) top right no-repeat;
  line-height: 35px;
  color: #fb8800;
  font-size: 11px;
  margin: 0 auto;
  width: 974px;
  position: absolute;
  right: 0;
  font-weight: bold;
  text-align: right;
  padding-right: 50px;
  font-family: Tahoma, sans-serif;
  height: 35px;
  margin-top: 8px;
  margin-bottom: 16px; }
  .main-loggedin-premium-scoremultiplier.brief {
    position: absolute;
    top: 0;
    right: 0;
    width: 355px;
    bottom: 0;
    background: url(../main/bf3/bg-event-400.png) top right no-repeat; }
  .main-loggedin-premium-scoremultiplier > strong {
    text-transform: uppercase;
    font-weight: bold;
    margin-right: 8px;
    color: #FFF;
    font-size: 11px;
    padding-top: 5px;
    clear: both;
    display: block;
    line-height: 1;
    font-family: Tahoma, sans-serif; }
  .main-loggedin-premium-scoremultiplier > span {
    clear: both;
    color: #f78513;
    line-height: 1;
    margin-right: 8px;
    display: block;
    text-transform: uppercase;
    padding-top: 2px;
    font-size: 12px;
    font-family: Tahoma, sans-serif; }
  .main-loggedin-premium-scoremultiplier > a {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1; }

#main-loggedin-premium-scoremultiplier-icon {
  width: 44px;
  height: 26px;
  position: absolute;
  top: 13px;
  right: 5px;
  background: url(../main/bf3/icon-2xp.png); }

.main-loggedin-actionbar.noplaybar .main-loggedin-premium-scoremultiplier {
  position: relative; }

.main-loggedin-header-puff-loading {
  position: absolute;
  right: 10px;
  bottom: 10px; }

.main-topstory-comments {
  display: inline-block;
  color: #fff;
  font-size: 12px;
  line-height: 18px;
  margin: 0 0 6px 0;
  padding: 0 6px 0 0;
  height: 18px; }
  .main-topstory-comments .icon {
    position: relative;
    top: 3px;
    display: block;
    float: left;
    background: url(../devblog/icon-comments.png) 0 -11px;
    width: 13px;
    height: 11px;
    margin: 0 6px 0 16px; }

.main-topstory-votes {
  display: inline-block;
  color: #fff;
  font-size: 12px;
  line-height: 18px;
  margin: 0 0 6px 0;
  padding: 0 6px 0 0;
  height: 18px; }
  .main-topstory-votes .icon {
    display: inline-block;
    background: url(../feed/icon-hooah-activitystream.png) 0 -54px;
    width: 14px;
    height: 14px;
    margin: 0 3px 0 0; }

#main-loggedin-header-puff-topstory h3 {
  text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.8); }

.main-loggedin-actionbar {
  position: relative; }

.main-loggedin-playbar {
  float: left;
  height: 35px;
  margin-top: 8px;
  margin-bottom: 16px;
  position: relative; }
  .main-loggedin-playbar span.title {
    font-family: BebasNeueRegular, Arial, sans-serif;
    font-size: 22px;
    font-weight: normal;
    color: #fff;
    background: url(../main/bf3/boxes/bg-playnow.png) top right no-repeat;
    float: left;
    height: 35px;
    line-height: 37px;
    margin-right: 10px;
    padding: 0 20px 0 16px;
    cursor: default; }

.main-loggedin-playbutton {
  margin-right: 6px; }
  .main-loggedin-playbutton p {
    padding: 0 20px; }

#main-loggedin-header-puff-unlocks .main-loggedin-header-puff-content {
  z-index: 2; }

.main-loggedin-header-puff-soldiers-content {
  bottom: 43px;
  left: 18px; }
  .main-loggedin-header-puff-soldiers-content > h1 {
    margin-bottom: 8px;
    font-size: 13px; }
  .main-loggedin-header-puff-soldiers-content > div {
    float: left;
    width: 88px;
    background-color: rgba(255, 255, 255, 0.3); }
    .main-loggedin-header-puff-soldiers-content > div > span {
      height: 5px;
      background: #fff;
      display: block; }

#main-loggedin-header-puff-unlocks {
  overflow: hidden; }
  #main-loggedin-header-puff-unlocks ul {
    position: absolute;
    right: 25px;
    bottom: -2px;
    z-index: 1; }
    #main-loggedin-header-puff-unlocks ul > li {
      float: left;
      width: 34px; }
      #main-loggedin-header-puff-unlocks ul > li > img {
        height: 107px; }

.main-loggedin-header-puff-platoon-content {
  width: 303px;
  position: absolute;
  top: 53px; }
  .main-loggedin-header-puff-platoon-content > h1 {
    font-size: 14px; }
  .main-loggedin-header-puff-platoon-content > span {
    display: block;
    float: none;
    margin: 3px 0 6px 2px; }
  .main-loggedin-header-puff-platoon-content > img.platoon-badge-item {
    position: absolute;
    top: -27px;
    right: 5px; }
  .main-loggedin-header-puff-platoon-content > div.main-loggedin-platoon-overlay {
    background-image: url('../main/mohw/boxes/platoon-overlay.png');
    width: 60px;
    height: 62px;
    position: absolute;
    top: -28px;
    right: 5px; }
    .main-loggedin-header-puff-platoon-content > div.main-loggedin-platoon-overlay > p {
      -webkit-transition: background 0.5s ease;
      -moz-transition: background 0.5s ease;
      -ms-transition: background 0.5s ease;
      -o-transition: background 0.5s ease;
      transition: background 0.5s ease;
      width: 60px;
      height: 62px; }

.main-loggedin-header-puff:hover div.main-loggedin-platoon-overlay > p {
  background: rgba(255, 255, 255, 0.1); }

.main-loggedin-header-puff-platoon-content > em {
  display: block;
  font-size: 11px;
  font-style: normal; }

#main-introduction {
  padding: 0;
  border: 0; }
  #main-introduction > header {
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/intro/intro-banner-bf3-1bd910e2.png) no-repeat;
    height: 207px;
    width: 1024px;
    margin: 0;
    border-bottom: 0; }
    #main-introduction > header > h3 {
      font-family: BebasNeueRegular, Arial, sans-serif;
      font-weight: normal;
      font-size: 44px;
      color: #fff;
      text-align: center;
      top: 35px;
      position: relative; }
  #main-introduction > .common-box-inner {
    padding: 16px;
    text-align: center; }
  #main-introduction .sections {
    display: table;
    margin: 0 77px 16px 77px;
    text-align: left; }
  #main-introduction section {
    display: table-cell;
    width: 33%; }
    #main-introduction section > .image {
      width: 264px;
      height: 137px;
      background: no-repeat 50% 50% #ebebeb;
      border: 0; }
    #main-introduction section > h2 {
      font-family: BebasNeueRegular, Arial, sans-serif;
      font-size: 30px;
      color: #353535;
      margin: 20px 0 12px 0;
      font-weight: normal; }
    #main-introduction section > p {
      font-family: Arial, sans-serif;
      font-size: 14px;
      color: #898989;
      line-height: 21px; }
    #main-introduction section.friends > .image {
      background-image: url(../main/intro-icon-friends-bf3.png); }
    #main-introduction section.platoons > .image {
      background-image: url(../main/intro-icon-platoon-bf3.png); }
    #main-introduction section.stats > .image {
      background-image: url(../main/intro-icon-stats-bf3.png); }
  #main-introduction .continue-button {
    margin: 32px 0; }
    #main-introduction .continue-button p {
      padding: 2px 110px 0 110px;
      font-size: 32px;
      font-weight: normal; }
    #main-introduction .continue-button:hover {
      text-decoration: none; }
  #main-introduction.mohw > header {
    background-image: url(//d34ymitoc1pg7m.cloudfront.net/mohw/intro/intro-banner-mohw-580c25d4.png); }
    #main-introduction.mohw > header > h3 {
      color: #353535; }
  #main-introduction.mohw section.friends > .image {
    background-image: url(../main/intro-icon-friends-mohw.png); }
  #main-introduction.mohw section.platoons > .image {
    background-image: url(../main/intro-icon-platoon-mohw.png); }
  #main-introduction.mohw section.stats > .image {
    background-image: url(../main/intro-icon-stats-mohw.png); }

body.premium .main-header .persona {
  background: url(../base/bf4/overlay-p.png) no-repeat top center; }
  body.premium .main-header .persona .username {
    color: #E4B744; }
  body.premium .main-header .persona .icon-premium-wide {
    float: left; }
  body.premium .main-header .persona .platform {
    float: left; }

#bfhbeta-offer {
  overflow: hidden;
  margin-bottom: 16px;
  height: 130px; }
  #bfhbeta-offer .bfh-hero {
    margin-top: -100px;
    margin-right: -16px;
    width: 200px;
    float: right; }
  #bfhbeta-offer .bfh-logo {
    width: 200px;
    float: right;
    margin-top: -45px;
    margin-right: -42px; }
  #bfhbeta-offer .offer-not-available {
    padding-bottom: 16px; }
  #bfhbeta-offer .get-hardline-beta-btn {
    float: left;
    margin-top: 8px; }
  #bfhbeta-offer .pre-order {
    margin-left: 16px;
    float: left;
    margin-top: 8px; }

.main-header .playbar {
  margin: 0;
  margin-top: 16px;
  margin-bottom: 16px; }
.main-header .tiles .box {
  height: 143px;
  background: none;
  margin-top: 1px;
  cursor: pointer; }
  .main-header .tiles .box h1 {
    font-size: 19px;
    line-height: 16px; }
  .main-header .tiles .box h2 {
    font-size: 16px;
    line-height: 16px;
    font-weight: normal;
    color: lightgrey; }
  .main-header .tiles .box h2 {
    line-height: 21px; }
    .main-header .tiles .box h2.white {
      color: #fff; }
  .main-header .tiles .box .box-content {
    background-color: transparent;
    background-position: 96% 67px;
    background-repeat: no-repeat;
    -webkit-transition: background-position 0.2s ease-in;
    -moz-transition: background-position 0.2s ease-in;
    transition: background-position 0.2s ease-in; }
  .main-header .tiles .box .box-hide {
    position: absolute; }
    .main-header .tiles .box .box-hide h1 {
      margin-top: 25px;
      font-size: 50px;
      line-height: 40px; }
    .main-header .tiles .box .box-hide h2 {
      text-transform: uppercase; }
  .main-header .tiles .box:hover > .box-content {
    background-position: 96% 62px;
    -webkit-transition: background-position 0.1s ease-in;
    -moz-transition: background-position 0.1s ease-in;
    transition: background-position 0.1s ease-in; }
    .main-header .tiles .box:hover > .box-content .box-hide {
      opacity: 0; }
    .main-header .tiles .box:hover > .box-content .box-inner {
      -webkit-transition: opacity 0.3s ease-in-out;
      -moz-transition: opacity 0.3s ease-in-out;
      transition: opacity 0.3s ease-in-out;
      opacity: 1; }
      .main-header .tiles .box:hover > .box-content .box-inner .bg-inner {
        -webkit-transition: opacity 0.3s ease-in-out;
        -moz-transition: opacity 0.3s ease-in-out;
        transition: opacity 0.3s ease-in-out;
        opacity: 1; }
.main-header .box {
  overflow: hidden;
  position: relative;
  text-decoration: none; }
  .main-header .box .bg {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    opacity: 0.6;
    width: 100%;
    height: 100%; }
    .main-header .box .bg.image {
      opacity: 0.8; }
  .main-header .box:hover .bg {
    opacity: 0.8;
    -webkit-transition: opacity 0.2s ease-in-out;
    -moz-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out; }
    .main-header .box:hover .bg.image {
      opacity: 1; }
  .main-header .box > .box-content {
    position: relative;
    z-index: 4;
    height: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
    .main-header .box > .box-content .box-inner {
      opacity: 0; }
.main-header .tiles a:hover {
  text-decoration: none; }
.main-header .tiles .bg {
  background: url(../main/warsaw/bg-box.jpg) 0 0; }
.main-header .tiles .leaderboards .bg {
  background: url(../main/warsaw/bg-box-lb.jpg) 0 0; }
.main-header .tiles .leaderboards .icons {
  position: absolute;
  right: 10px;
  bottom: 3px;
  -webkit-transition: bottom 0.1s ease-in;
  -moz-transition: bottom 0.1s ease-in;
  transition: bottom 0.1s ease-in; }
  .main-header .tiles .leaderboards .icons .division {
    position: absolute;
    bottom: 0;
    right: 60px; }
    .main-header .tiles .leaderboards .icons .division img {
      height: 55px; }
  .main-header .tiles .leaderboards .icons .category {
    position: absolute;
    right: 0;
    bottom: 16px; }
  .main-header .tiles .leaderboards .icons .rank {
    position: absolute;
    right: 70px;
    bottom: 0px;
    margin-top: 25px;
    font-size: 50px;
    line-height: 40px; }
  .main-header .tiles .leaderboards .icons.no-leaderboard {
    background-image: url(../main/warsaw/content-box-lb.png);
    background-repeat: no-repeat; }
.main-header .tiles .leaderboards .box:hover .icons {
  bottom: 8px; }
.main-header .tiles .leaderboards .loader {
  display: block;
  margin: 0 auto;
  margin-top: 30px; }
.main-header .tiles .club.no-club .bg img {
  opacity: 0.2; }
.main-header .tiles .club .bg img {
  position: absolute;
  top: -20px;
  right: -20px;
  width: 160px;
  height: 160px; }
.main-header .tiles .club .club-name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 14px;
  height: 16px;
  display: block;
  width: 150px;
  margin-bottom: 14px; }
.main-header .tiles .club h3 {
  font-size: 12px; }
.main-header .tiles .club h2 {
  width: auto; }
.main-header .tiles .club .box-hide {
  bottom: 12px;
  width: 90%; }
  .main-header .tiles .club .box-hide .club-rank {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    margin: 6px 0;
    font-size: 19px; }
  .main-header .tiles .club .box-hide .rank-progress {
    width: 80%;
    margin-bottom: 0;
    font-size: 12px;
    color: #a8a8a8; }
  .main-header .tiles .club .box-hide .club-details {
    margin-bottom: 4px; }
.main-header .tiles .loadout .box:hover > .box-content {
  background-position: 96% 0px; }
.main-header .tiles .loadout .box-content {
  background-position: 96% 10px;
  background-image: url(../main/warsaw/content-box-loadout.png); }
.main-header .tiles .challenges .box-content {
  background-position: 96% 72px;
  background-image: url(../main/warsaw/content-box-missions.png); }
.main-header .tiles .twitch .box-content {
  background-position: 96% 108px;
  background-image: url(//eaassets-a.akamaihd.net/battlelog/bb/common/logos/twitch-small-08bb4a91.png); }
.main-header .tiles .twitch .box-content:hover {
  background-position: 96% 102px; }
.main-header .tiles .premium .bg-inner {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  background: -webkit-linear-gradient(-315deg, #000000 0%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(45deg, #000000 0%, rgba(0, 0, 0, 0) 100%); }
.main-header .tiles .premium h2 {
  position: relative;
  z-index: 1; }
  .main-header .tiles .premium h2.no-items {
    top: 24px; }
.main-header .tiles .premium .icon-premium-p-big {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 1; }
.main-header .tiles .premium .bullets {
  position: absolute;
  left: 14px;
  bottom: 5px; }
  .main-header .tiles .premium .bullets span {
    font-family: Arial, sans-serif;
    font-size: 32px;
    line-height: 0;
    letter-spacing: 1px;
    color: #4f545a;
    -webkit-transition: color 0.2s; }
    .main-header .tiles .premium .bullets span.active {
      color: #cfcfcf; }
.main-header .tiles .premium h1 {
  position: absolute;
  z-index: 1; }
.main-header .tiles .premium article {
  display: none;
  padding: 40px 16px 16px 16px;
  box-sizing: inherit;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0; }
  .main-header .tiles .premium article .featured-background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(../main/warsaw/bg-box-p.jpg); }
  .main-header .tiles .premium article .thumbnail {
    position: absolute;
    right: 16px;
    bottom: 10px; }
.main-header .tiles .battlepacks .box-content {
  width: 327px;
  background-image: url(../main/warsaw/content-box-bp.png); }
.main-header .tiles .preorder {
  position: relative; }
  .main-header .tiles .preorder .box {
    background: url(../main/preorder-home.jpg) no-repeat; }
    .main-header .tiles .preorder .box.premium {
      background: url(../main/preorder-premium-home.jpg) no-repeat; }
  .main-header .tiles .preorder .bg {
    display: none; }
  .main-header .tiles .preorder h1 {
    color: black; }
  .main-header .tiles .preorder h2 {
    color: #353535; }
  .main-header .tiles .preorder button {
    position: absolute;
    bottom: 16px;
    left: 16px; }
    body.is-hybrid.is-ios .main-header .tiles .preorder button {
      display: none; }
.main-header .tiles.cteguide {
  background-image: url(../communitytest/cte-icons-guide.png); }
.main-header .tiles.feedback {
  background-image: url(../communitytest/cte-icons-feedback.png); }
.main-header .topstory {
  height: 352px;
  position: relative;
  background: rgba(255, 255, 255, 0.1);
  background-size: 100% auto; }
  .main-header .topstory .loader {
    margin: 15px; }
  .main-header .topstory .article {
    width: 100%;
    height: 100%;
    background: none;
    background-repeat: no-repeat;
    background-size: 100% auto; }
    .main-header .topstory .article > h1 {
      font-size: 23px;
      line-height: 23px;
      color: white;
      background: none;
      text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.75); }
    .main-header .topstory .article > footer {
      background-color: rgba(0, 0, 0, 0.6);
      position: absolute;
      bottom: 0px;
      text-align: left;
      min-height: 80px;
      padding-top: 10px;
      width: 100%;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box; }
      .main-header .topstory .article > footer h5 {
        text-transform: none;
        line-height: 24px;
        font-weight: normal; }
      .main-header .topstory .article > footer .meta {
        float: left;
        height: 16px;
        line-height: 19px; }
      .main-header .topstory .article > footer .published {
        font-size: 12px;
        text-transform: none; }
        .main-header .topstory .article > footer .published span {
          color: #a8a8a8; }
    .main-header .topstory .article:hover .box-content {
      background-color: rgba(255, 255, 255, 0.1); }
.main-header .persona {
  height: 247px;
  margin-bottom: 1px; }
  .main-header .persona .username {
    font-size: 22px;
    font-family: Purista;
    margin: -2px 0 3px 0;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap; }
  .main-header .persona .platform {
    line-height: 0;
    margin-bottom: 5px; }
  .main-header .persona .soldier-emblem {
    position: absolute;
    top: 40px;
    right: 70px; }
  .main-header .persona .dogtags-chain {
    position: relative;
    -webkit-transform: scale(0.8) translateX(-35px);
    -moz-transform: scale(0.8) translateX(-35px);
    -ms-transform: scale(0.8) translateX(-35px);
    -o-transform: scale(0.8) translateX(-35px);
    transform: scale(0.8) translateX(-35px); }
  .main-header .persona .rank {
    position: relative; }
    .main-header .persona .rank > .image {
      position: absolute;
      top: -16px; }
    .main-header .persona .rank > .number {
      font-family: Purista;
      font-size: 48px;
      position: relative;
      left: 66px;
      bottom: 9px; }
  .main-header .persona .legendary-level-container {
    position: relative; }
    .main-header .persona .legendary-level-container .legendary {
      display: block; }
    .main-header .persona .legendary-level-container .rank-number {
      display: block;
      position: absolute;
      right: 0;
      bottom: 0;
      font-size: 20px;
      color: #000; }
  .main-header .persona .soldier {
    position: absolute;
    top: 40px;
    right: 0;
    pointer-events: none; }
    .main-header .persona .soldier > img {
      width: 265px; }
  .main-header .persona .progress {
    position: absolute;
    bottom: 15px;
    width: 75%; }
    .main-header .persona .progress > .progress-bar {
      margin-bottom: 2px; }
    .main-header .persona .progress > .experience {
      font-size: 12px;
      color: lightgrey; }
.main-header .suggestions .suggestion {
  height: 80px;
  width: 108px;
  position: relative;
  padding: 0;
  text-align: center;
  overflow: hidden;
  margin-top: 1px;
  float: left;
  margin-right: 1px; }
  .main-header .suggestions .suggestion:last-child {
    width: 109px;
    margin-right: 0; }
  .main-header .suggestions .suggestion .image {
    margin: 15% 0; }
    .main-header .suggestions .suggestion .image.vehicleunlock {
      margin: 9% 0;
      margin-left: -45px; }
  .main-header .suggestions .suggestion .loader {
    margin-top: 23px; }
  .main-header .suggestions .suggestion .progress-bar {
    position: absolute;
    bottom: 0;
    width: 100%;
    border: 0;
    margin: 0; }
  .main-header .suggestions .suggestion .refresh {
    cursor: pointer;
    position: absolute;
    top: 3px;
    left: 5px;
    -webkit-transition: opacity 2s ease-out;
    -moz-transition: opacity 2s ease-out;
    transition: opacity 2s ease-out;
    background: rgba(0, 0, 0, 0.5);
    padding: 2px;
    opacity: 0.8; }
    .main-header .suggestions .suggestion .refresh:hover {
      opacity: 1; }
    .main-header .suggestions .suggestion .refresh:active {
      -webkit-transition: none;
      -moz-transition: none;
      transition: none;
      opacity: 0.5; }
    .main-header .suggestions .suggestion .refresh.disabled, .main-header .suggestions .suggestion .refresh.loading {
      opacity: 0.25;
      cursor: default;
      pointer-events: none; }
  .main-header .suggestions .suggestion:not(:hover) .refresh {
    opacity: 0;
    pointer-events: none; }
  .main-header .suggestions .suggestion .green-check-small {
    background-image: url(../battledash/images/icons/green-check-small.png);
    width: 12px;
    height: 12px;
    position: absolute;
    right: 3px;
    bottom: 10px; }
  .main-header .suggestions .suggestion .xp-icon {
    position: absolute;
    left: 2px;
    bottom: 6px; }
.main-header #recommended-server {
  position: relative; }
  .main-header #recommended-server .bg-map {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: opacity 2s ease;
    -moz-transition: opacity 2s ease;
    transition: opacity 2s ease;
    background-size: cover; }
  .main-header #recommended-server .overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    background-image: -webkit-linear-gradient(left top, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);
    background-image: linear-gradient(to right bottom, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);
    -webkit-transition: opacity 2s ease;
    -moz-transition: opacity 2s ease;
    transition: opacity 2s ease;
    opacity: 0; }
  .main-header #recommended-server.loaded .bg-map, .main-header #recommended-server.loaded .overlay {
    opacity: 1; }
  .main-header #recommended-server .loader {
    display: block;
    margin: 0 auto;
    margin-top: 30px; }
  .main-header #recommended-server .servername {
    display: block; }
  .main-header #recommended-server .playercount {
    font-weight: bold; }
  .main-header #recommended-server .servermeta {
    margin: 6px 0; }
    .main-header #recommended-server .servermeta > .item {
      font-size: 12px;
      color: lightgrey;
      margin-top: 3px; }
  .main-header #recommended-server .players {
    position: absolute;
    bottom: 15px;
    left: 15px; }
    .main-header #recommended-server .players .avatar {
      width: 28px;
      height: 28px; }
  .main-header #recommended-server button {
    position: absolute;
    bottom: 15px;
    right: 15px; }
  .main-header #recommended-server.disabled {
    opacity: 0.5; }
.main-header .challenges {
  position: relative;
  background: url(../main/warsaw/bg-box.jpg) 0 0; }
  .main-header .challenges .badge {
    width: 60px;
    height: 60px;
    position: absolute;
    bottom: 16px;
    left: 50%;
    margin-left: -60px;
    z-index: 0; }
    .main-header .challenges .badge.focused {
      z-index: 1;
      left: 50%;
      margin-left: -10px; }
.main-header .spotlight {
  height: 287px; }
  .main-header .spotlight h1 {
    font-size: 19px;
    line-height: 16px; }
  .main-header .spotlight h2 {
    font-size: 16px;
    line-height: 16px;
    font-weight: normal;
    color: lightgrey; }
  .main-header .spotlight h1, .main-header .spotlight h2 {
    text-align: center; }
  .main-header .spotlight.video > .box-content {
    background-color: rgba(255, 255, 255, 0); }
    .main-header .spotlight.video > .box-content header {
      margin-top: 166px; }
  .main-header .spotlight.video:hover > .box-content {
    background-color: rgba(255, 255, 255, 0.1); }

#main-alphatrialinformation {
  margin-bottom: 16px; }
  #main-alphatrialinformation p {
    font-size: 14px;
    line-height: 1.2;
    margin-bottom: 10px; }

.agerating-container .box-content {
  min-height: 130px; }

#rsp h6 {
  font-size: 14px;
  color: #8a8a8a; }
#rsp a {
  display: inline-block;
  margin: 0 30px; }

/*body.home-signedout-bf4 {
    background: #080a16;
}*/
body.loggedout-usps #base-container {
  width: auto; }

body.is-loggedin:not(.loggedout-usps) .usp {
  opacity: 0; }
  body.is-loggedin:not(.loggedout-usps) .usp.is-mobile-app {
    opacity: 1; }

body.is-loggedout {
  background: #080a14; }
  body.is-loggedout #base-background {
    -webkit-transition: transform 500ms ease-out;
    -moz-transition: transform 500ms ease-out;
    transition: transform 500ms ease-out; }

body.home-signedout-bf4 #base-background {
  position: absolute;
  overflow: hidden;
  height: 940px; }
  body.home-signedout-bf4 #base-background:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100px;
    z-index: 0;
    background: -webkit-linear-gradient(top, rgba(35, 13, 13, 0) 0%, #080A14 100%);
    background: linear-gradient(to bottom, rgba(35, 13, 13, 0) 0%, #080A14 100%); }

body.loggedout-usps #footer-wrapper {
  display: none !important; }

body.loggedout-usps:not(.is-loggedout) #footer-wrapper {
  display: none; }

body.is-loggedout #footer-wrapper {
  position: relative;
  margin: 0 auto;
  width: 992px;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto; }

@-webkit-keyframes pulsate {
  from {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }

  to {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8); } }

@-moz-keyframes pulsate {
  from {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }

  to {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8); } }

-o-keyframes pulsate from {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1); }
-o-keyframes pulsate to {
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
  transform: scale(0.8); }

@-ms-keyframes pulsate {
  from {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }

  to {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8); } }

@keyframes pulsate {
  from {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }

  to {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8); } }

.main-about-icon {
  display: inline-block;
  width: 21px;
  height: 21px;
  background: url(../base/shared/icon-info.png) no-repeat;
  text-decoration: none;
  opacity: 0.75;
  cursor: pointer; }
  .main-about-icon:hover {
    opacity: 1; }

#base-container #main-loggedout {
  padding-top: 16px;
  margin-top: -16px; }
  #base-container #main-loggedout .main-loggedout-loader {
    display: block;
    margin: 100px auto; }

.loggedout-usp-container {
  min-width: 992px;
  overflow: hidden; }
  .loggedout-usp-container #scroll-down-icon, .loggedout-usp-container #scroll-down-icon-fixed {
    left: 50%;
    margin-left: -41px;
    width: 82px;
    height: 52px;
    background: url(../main/warsaw/loggedout/arrow-down.png) no-repeat;
    cursor: pointer;
    opacity: 0.9;
    z-index: 2; }
    .loggedout-usp-container #scroll-down-icon:hover, .loggedout-usp-container #scroll-down-icon-fixed:hover {
      opacity: 1; }
  .loggedout-usp-container #scroll-down-icon {
    position: absolute;
    bottom: -60px; }
  .loggedout-usp-container #scroll-down-icon-fixed {
    position: fixed;
    bottom: 0;
    display: none; }
  .loggedout-usp-container .usp {
    width: 992px;
    margin: 0 auto;
    text-align: center;
    -webkit-transition: opacity 1s ease-out;
    -moz-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out; }
    .loggedout-usp-container .usp h1.headline, .loggedout-usp-container .usp h2.subheading {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600;
      background: rgba(7, 7, 7, 0.6);
      text-transform: uppercase;
      font-size: 36px;
      display: inline-block;
      padding: 1px 16px 0;
      margin-bottom: 1px; }
    .loggedout-usp-container .usp h2.subheading {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400;
      font-size: 23px;
      line-height: 31px; }
    .loggedout-usp-container .usp p.subheading-big {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400;
      font-size: 23px;
      text-transform: uppercase;
      margin-bottom: 10px; }
    .loggedout-usp-container .usp h2 {
      font-size: 30px;
      margin-bottom: 4px; }
    .loggedout-usp-container .usp p.subheading-small {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400;
      font-size: 19px;
      text-transform: uppercase;
      margin-bottom: 6px; }
    .loggedout-usp-container .usp p.subheading-tiny {
      font-size: 16px;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400;
      text-transform: uppercase; }
    .loggedout-usp-container .usp p.description {
      color: #a8a8a8;
      line-height: 24px;
      font-size: 14px;
      margin-bottom: 12px; }
  .loggedout-usp-container .alwayson {
    text-align: left;
    margin-top: 16px;
    position: relative; }
    .loggedout-usp-container .alwayson h1.header-headline {
      display: inline-block;
      margin: 0;
      padding: 6px 12px;
      font-size: 50px;
      background-color: rgba(7, 7, 7, 0.6); }
    .loggedout-usp-container .alwayson .battlefield-logo {
      background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/loggedout/home-logo-e3e42ee9.png);
      width: 616px;
      height: 114px;
      margin-top: 24px; }
    .loggedout-usp-container .alwayson .alwayson-soldier {
      position: absolute;
      right: -375px;
      top: -75px;
      height: 940px;
      overflow: hidden; }
      .loggedout-usp-container .alwayson .alwayson-soldier:after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 328px;
        right: 213px;
        height: 50px;
        z-index: 0;
        background: -webkit-linear-gradient(top, rgba(8, 10, 20, 0) 0%, #080A14 100%);
        background: linear-gradient(to bottom, rgba(8, 10, 20, 0) 0%, #080A14 100%); }
    .loggedout-usp-container .alwayson .calltoaction {
      margin-top: 32px; }
      .loggedout-usp-container .alwayson .calltoaction .btn {
        display: inline-block;
        min-width: 288px;
        width: auto; }
      .loggedout-usp-container .alwayson .calltoaction .btn-login {
        margin-right: 8px; }
      .loggedout-usp-container .alwayson .calltoaction .btn-get-game {
        position: relative;
        font-size: 19px;
        padding-left: 76px;
        overflow: visible; }
        .loggedout-usp-container .alwayson .calltoaction .btn-get-game .game-stack {
          width: 68px;
          height: 81px;
          position: absolute;
          top: -15px;
          left: 8px;
          background: url(../main/warsaw/loggedout/getbf-stack.png) no-repeat; }
    .loggedout-usp-container .alwayson.in-viewport .devices img {
      opacity: 1; }
      .loggedout-usp-container .alwayson.in-viewport .devices img.anim {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        transform: translate(0, 0); }
    .loggedout-usp-container .alwayson .devices {
      margin-top: 48px;
      height: 500px;
      position: relative; }
      .loggedout-usp-container .alwayson .devices img {
        position: absolute;
        opacity: 0;
        -webkit-transition: all 0.5s ease-out;
        -moz-transition: all 0.5s ease-out;
        transition: all 0.5s ease-out; }
        .loggedout-usp-container .alwayson .devices img.anim {
          -webkit-transition-delay: 1s;
          -moz-transition-delay: 1s;
          transition-delay: 1s; }
      .loggedout-usp-container .alwayson .devices img.tv {
        left: 215px;
        top: 0px; }
      .loggedout-usp-container .alwayson .devices img.pc {
        left: 25px;
        top: 85px;
        -webkit-transform: translateX(-50px);
        -moz-transform: translateX(-50px);
        -ms-transform: translateX(-50px);
        -o-transform: translateX(-50px);
        transform: translateX(-50px); }
      .loggedout-usp-container .alwayson .devices img.tablet {
        left: 525px;
        top: 185px;
        -webkit-transform: translateX(100px);
        -moz-transform: translateX(100px);
        -ms-transform: translateX(100px);
        -o-transform: translateX(100px);
        transform: translateX(100px); }
      .loggedout-usp-container .alwayson .devices img.mobile {
        left: 850px;
        top: 210px;
        -webkit-transform: translate(200px);
        -moz-transform: translate(200px);
        -ms-transform: translate(200px);
        -o-transform: translate(200px);
        transform: translate(200px); }
  .loggedout-usp-container .connected {
    margin-top: 100px;
    padding-top: 65px;
    margin-bottom: 65px;
    position: relative;
    text-align: left; }
    .loggedout-usp-container .connected.is-mobile-app {
      margin-top: 0px;
      padding-top: 0px; }
    .loggedout-usp-container .connected .googleplay-logo {
      margin-left: 6px; }
    .loggedout-usp-container .connected .row {
      position: relative; }
    .loggedout-usp-container .connected img.battlescreen {
      margin-top: 30px;
      margin-left: -50px;
      opacity: 0; }
      .loggedout-usp-container .connected img.battlescreen.transition {
        -webkit-transition: margin-left 0.25s ease-out, opacity 0.25s ease-out;
        -moz-transition: margin-left 0.25s ease-out, opacity 0.25s ease-out;
        transition: margin-left 0.25s ease-out, opacity 0.25s ease-out; }
    .loggedout-usp-container .connected img.remotejoin, .loggedout-usp-container .connected img.loadout {
      position: absolute;
      bottom: 0;
      right: -100px;
      opacity: 0; }
      .loggedout-usp-container .connected img.remotejoin.transition, .loggedout-usp-container .connected img.loadout.transition {
        -webkit-transition: right 0.25s ease-out, opacity 0.25s ease-out;
        -moz-transition: right 0.25s ease-out, opacity 0.25s ease-out;
        transition: right 0.25s ease-out, opacity 0.25s ease-out; }
    .loggedout-usp-container .connected img.loadout {
      right: 200px; }
    .loggedout-usp-container .connected.in-viewport img.battlescreen {
      margin-left: 0;
      opacity: 1; }
    .loggedout-usp-container .connected.in-viewport img.remotejoin {
      right: 0;
      opacity: 1; }
    .loggedout-usp-container .connected.in-viewport img.loadout {
      right: 252px;
      opacity: 1; }
  .loggedout-usp-container .commander {
    position: relative;
    padding-top: 60px;
    height: 1126px;
    overflow-y: hidden;
    width: auto;
    text-align: center;
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf4/loggedout/bg-home-commander-36b3c266.jpg) 50% 0 no-repeat; }
    .loggedout-usp-container .commander p.description {
      color: white;
      display: block;
      width: 560px;
      margin-top: 8px;
      margin-left: auto;
      margin-right: auto; }
    .loggedout-usp-container .commander .commander-tablet {
      position: relative;
      margin-top: 106px;
      opacity: 0;
      margin-left: auto;
      margin-right: auto;
      width: 992px;
      height: 774px;
      -webkit-transition: margin-top 0.25s ease-out, opacity 0.25s ease-out;
      -moz-transition: margin-top 0.25s ease-out, opacity 0.25s ease-out;
      transition: margin-top 0.25s ease-out, opacity 0.25s ease-out; }
    .loggedout-usp-container .commander.in-viewport .commander-tablet {
      margin-top: 16px;
      opacity: 1; }
  .loggedout-usp-container .ingame {
    position: relative;
    padding-top: 60px;
    padding-bottom: 60px;
    text-align: center;
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf4/loggedout/ingame-bkg-47ff6e40.jpg) no-repeat top center;
    width: auto; }
    .loggedout-usp-container .ingame p.description {
      color: white;
      margin-top: 8px;
      display: block;
      width: 550px;
      margin-left: auto;
      margin-right: auto; }
    .loggedout-usp-container .ingame .tv-carousel {
      position: relative; }
      .loggedout-usp-container .ingame .tv-carousel .arrowleft, .loggedout-usp-container .ingame .tv-carousel .arrowright {
        width: 52px;
        height: 103px;
        position: absolute;
        top: 190px;
        background-image: url(../main/warsaw/loggedout/ingame-arrows.png);
        cursor: pointer; }
      .loggedout-usp-container .ingame .tv-carousel .arrowleft {
        background-position: 0 0; }
      .loggedout-usp-container .ingame .tv-carousel .arrowright {
        right: 0px;
        background-position: -52px 0; }
      .loggedout-usp-container .ingame .tv-carousel .dots {
        margin: 22px auto 0;
        display: block; }
        .loggedout-usp-container .ingame .tv-carousel .dots .dot {
          width: 14px;
          height: 14px;
          border: 1px solid #fff;
          margin-right: 16px;
          display: inline-block; }
        .loggedout-usp-container .ingame .tv-carousel .dots .dot.last {
          margin-right: 0; }
        .loggedout-usp-container .ingame .tv-carousel .dots .dot.active {
          background: #fff; }
      .loggedout-usp-container .ingame .tv-carousel .screenshots {
        position: absolute;
        left: 112px;
        top: 16px; }
        .loggedout-usp-container .ingame .tv-carousel .screenshots img {
          position: absolute;
          left: 0;
          top: 0;
          -webkit-transition: opacity 0.4s ease-in-out;
          -moz-transition: opacity 0.4s ease-in-out;
          -o-transition: opacity 0.4s ease-in-out;
          transition: opacity 0.4s ease-in-out;
          opacity: 0;
          -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
          filter: alpha(opacity=0); }
        .loggedout-usp-container .ingame .tv-carousel .screenshots img.opaque {
          opacity: 1;
          -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
          filter: alpha(opacity=1); }
    .loggedout-usp-container .ingame .controllers {
      position: relative;
      margin-top: -30px;
      height: 150px; }
      .loggedout-usp-container .ingame .controllers .xbox, .loggedout-usp-container .ingame .controllers .ps, .loggedout-usp-container .ingame .controllers .pc {
        position: absolute;
        top: 50px;
        -webkit-transition: top 0.5s ease-out, left 0.5s ease-out, right 0.5s ease-out;
        -moz-transition: top 0.5s ease-out, left 0.5s ease-out, right 0.5s ease-out;
        transition: top 0.5s ease-out, left 0.5s ease-out, right 0.5s ease-out; }
      .loggedout-usp-container .ingame .controllers .xbox {
        left: -50px; }
      .loggedout-usp-container .ingame .controllers .ps {
        left: 240px; }
      .loggedout-usp-container .ingame .controllers .pc {
        right: -50px; }
    .loggedout-usp-container .ingame.in-viewport .controllers .xbox, .loggedout-usp-container .ingame.in-viewport .controllers .ps, .loggedout-usp-container .ingame.in-viewport .controllers .pc {
      top: 0; }
    .loggedout-usp-container .ingame.in-viewport .controllers .xbox {
      left: 0; }
    .loggedout-usp-container .ingame.in-viewport .controllers .pc {
      right: 0; }
  .loggedout-usp-container .progress {
    height: 643px;
    position: relative;
    margin-top: 75px; }
    .loggedout-usp-container .progress .stats {
      margin-top: 16px;
      position: relative; }
    .loggedout-usp-container .progress .soldier-image {
      position: absolute;
      right: -200px;
      top: -240px; }
  .loggedout-usp-container .stats {
    width: auto;
    padding-top: 65px;
    padding-bottom: 100px;
    text-align: center;
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf4/loggedout/bg-home-stats-c4afedb7.jpg) top center no-repeat; }
    .loggedout-usp-container .stats p.description {
      display: block;
      color: white;
      width: 600px;
      margin-top: 8px;
      margin-left: auto;
      margin-right: auto; }
    .loggedout-usp-container .stats #overview-info {
      width: 993px;
      margin-left: auto;
      margin-right: auto;
      text-align: left;
      margin-top: 45px; }
      .loggedout-usp-container .stats #overview-info #overview-soldier .box-content {
        height: 460px;
        text-align: center; }
    .loggedout-usp-container .stats .soldier {
      position: absolute;
      top: -45px;
      right: 25px; }
  .loggedout-usp-container .missions {
    padding-top: 65px;
    height: 850px;
    width: auto;
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf4/loggedout/bg-home-missions-d248322d.jpg) top center no-repeat; }
    .loggedout-usp-container .missions .mission-content {
      position: relative;
      width: 992px;
      margin-top: 65px;
      margin-left: auto;
      margin-right: auto; }
    .loggedout-usp-container .missions.in-viewport .leaderboard .leaderboard-list li {
      opacity: 1; }
      .loggedout-usp-container .missions.in-viewport .leaderboard .leaderboard-list li.item-3 .position {
        background: #ffc600;
        color: #000; }
    .loggedout-usp-container .missions.in-viewport .soldier {
      opacity: 1; }
    .loggedout-usp-container .missions.in-viewport .soldier-highlight {
      opacity: 1;
      -webkit-animation: pulsate 2s ease-in-out 0s infinite alternate;
      -moz-animation: pulsate 2s ease-in-out 0s infinite alternate;
      -ms-animation: pulsate 2s ease-in-out 0s infinite alternate;
      -o-animation: pulsate 2s ease-in-out 0s infinite alternate;
      animation: pulsate 2s ease-in-out 0s infinite alternate; }
    .loggedout-usp-container .missions .soldier {
      position: absolute;
      opacity: 0;
      z-index: 1;
      -webkit-transition: opacity 0.25s ease-in;
      -moz-transition: opacity 0.25s ease-in;
      transition: opacity 0.25s ease-in; }
      .loggedout-usp-container .missions .soldier.soldier-1 {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        transition-delay: 0s; }
      .loggedout-usp-container .missions .soldier.soldier-2 {
        -webkit-transition-delay: 0.25s;
        -moz-transition-delay: 0.25s;
        transition-delay: 0.25s; }
      .loggedout-usp-container .missions .soldier.soldier-3 {
        -webkit-transition-delay: 0.5s;
        -moz-transition-delay: 0.5s;
        transition-delay: 0.5s; }
      .loggedout-usp-container .missions .soldier.soldier-4 {
        -webkit-transition-delay: 0.75s;
        -moz-transition-delay: 0.75s;
        transition-delay: 0.75s; }
      .loggedout-usp-container .missions .soldier.soldier-5 {
        -webkit-transition-delay: 1s;
        -moz-transition-delay: 1s;
        transition-delay: 1s; }
    .loggedout-usp-container .missions .soldier-1 {
      left: -139px;
      top: -70px; }
    .loggedout-usp-container .missions .soldier-2 {
      left: 95px;
      top: -20px; }
    .loggedout-usp-container .missions .soldier-3 {
      left: 213px;
      top: 10px; }
    .loggedout-usp-container .missions .soldier-4 {
      left: 305px;
      top: 40px; }
    .loggedout-usp-container .missions .soldier-5 {
      left: 455px;
      top: 10px; }
    .loggedout-usp-container .missions .soldier-highlight {
      width: 225px;
      height: 56px;
      position: absolute;
      left: 224px;
      top: 532px;
      background: url(../main/warsaw/loggedout/soldier-highlight.png) no-repeat;
      z-index: 0;
      opacity: 0;
      -webkit-transition: opacity 1s 2s ease-out;
      -moz-transition: opacity 1s 2s ease-out;
      transition: opacity 1s 2s ease-out; }
    .loggedout-usp-container .missions .leaderboard {
      margin-top: 125px;
      text-align: left; }
      .loggedout-usp-container .missions .leaderboard header {
        background: #04050b;
        height: 88px;
        padding: 16px;
        padding-left: 118px;
        padding-top: 48px;
        position: relative; }
        .loggedout-usp-container .missions .leaderboard header p.subheading-small {
          font-weight: 600; }
        .loggedout-usp-container .missions .leaderboard header .mission-type-image {
          position: absolute;
          left: -28px;
          top: 10px; }
      .loggedout-usp-container .missions .leaderboard .leaderboard-list {
        margin: 0;
        padding: 0;
        list-style: none; }
        .loggedout-usp-container .missions .leaderboard .leaderboard-list li {
          margin-top: 1px;
          background: #04050b;
          height: 39px;
          line-height: 39px;
          color: #fff;
          position: relative;
          font-size: 16px;
          opacity: 0;
          -webkit-transition: opacity 0.25s ease-out;
          -moz-transition: opacity 0.25s ease-out;
          transition: opacity 0.25s ease-out; }
          .loggedout-usp-container .missions .leaderboard .leaderboard-list li.item-1 {
            -webkit-transition-delay: 0.25s;
            -moz-transition-delay: 0.25s;
            transition-delay: 0.25s; }
          .loggedout-usp-container .missions .leaderboard .leaderboard-list li.item-2 {
            -webkit-transition-delay: 0.5s;
            -moz-transition-delay: 0.5s;
            transition-delay: 0.5s; }
          .loggedout-usp-container .missions .leaderboard .leaderboard-list li.item-3 {
            -webkit-transition-delay: 0.75s;
            -moz-transition-delay: 0.75s;
            transition-delay: 0.75s; }
          .loggedout-usp-container .missions .leaderboard .leaderboard-list li.item-4 {
            -webkit-transition-delay: 1s;
            -moz-transition-delay: 1s;
            transition-delay: 1s; }
          .loggedout-usp-container .missions .leaderboard .leaderboard-list li.item-5 {
            -webkit-transition-delay: 1.25s;
            -moz-transition-delay: 1.25s;
            transition-delay: 1.25s; }
          .loggedout-usp-container .missions .leaderboard .leaderboard-list li.item-3 .position {
            -webkit-transition: all 1s 2s ease-out;
            -moz-transition: all 1s 2s ease-out;
            transition: all 1s 2s ease-out; }
          .loggedout-usp-container .missions .leaderboard .leaderboard-list li .position {
            float: left;
            text-align: center;
            width: 39px;
            font-family: Purista, sans-serif;
            font-style: normal;
            font-weight: 600; }
          .loggedout-usp-container .missions .leaderboard .leaderboard-list li .avatar {
            width: 39px;
            height: 39px;
            display: block;
            float: left; }
          .loggedout-usp-container .missions .leaderboard .leaderboard-list li .name {
            padding-left: 8px;
            float: left;
            font-family: Purista, sans-serif;
            font-style: normal;
            font-weight: 400; }
          .loggedout-usp-container .missions .leaderboard .leaderboard-list li .score {
            position: absolute;
            top: 0;
            right: 0;
            padding-right: 8px;
            font-size: 23px;
            font-family: Purista, sans-serif;
            font-style: normal;
            font-weight: 600; }
  .loggedout-usp-container .geoleaderboards {
    width: auto;
    height: 940px;
    position: relative;
    text-align: center;
    background-position: top center;
    background-repeat: no-repeat; }
    .loggedout-usp-container .geoleaderboards .map {
      width: 100%;
      height: 940px;
      position: absolute;
      left: 0;
      top: 0;
      -webkit-transition: opacity 1s ease-in-out;
      -moz-transition: opacity 1s ease-in-out;
      -o-transition: opacity 1s ease-in-out;
      transition: opacity 1s ease-in-out;
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
      filter: alpha(opacity=0);
      background-repeat: no-repeat;
      background-position: top center;
      cursor: default; }
      .loggedout-usp-container .geoleaderboards .map .player {
        position: absolute;
        background-size: 100%;
        top: 50%;
        left: 50%; }
        .loggedout-usp-container .geoleaderboards .map .player.p1 {
          width: 120px;
          height: 120px;
          background: url(../main/warsaw/loggedout/avatar1.png); }
        .loggedout-usp-container .geoleaderboards .map .player.p2 {
          width: 203px;
          height: 203px;
          background: url(../main/warsaw/loggedout/avatar2.png); }
        .loggedout-usp-container .geoleaderboards .map .player.p3 {
          width: 120px;
          height: 120px;
          background: url(../main/warsaw/loggedout/avatar3.png); }
        .loggedout-usp-container .geoleaderboards .map .player.p4 {
          width: 72px;
          height: 72px;
          background: url(../main/warsaw/loggedout/avatar4.png); }
        .loggedout-usp-container .geoleaderboards .map .player.p5 {
          width: 72px;
          height: 72px;
          background: url(../main/warsaw/loggedout/avatar5.png); }
        .loggedout-usp-container .geoleaderboards .map .player.p6 {
          width: 172px;
          height: 172px;
          background: url(../main/warsaw/loggedout/avatar6.png); }
        .loggedout-usp-container .geoleaderboards .map .player.p7 {
          width: 120px;
          height: 120px;
          background: url(../main/warsaw/loggedout/avatar7.png); }
        .loggedout-usp-container .geoleaderboards .map .player.p8 {
          width: 120px;
          height: 120px;
          background: url(../main/warsaw/loggedout/avatar8.png); }
        .loggedout-usp-container .geoleaderboards .map .player.p9 {
          width: 203px;
          height: 203px;
          background: url(../main/warsaw/loggedout/avatar9.png); }
        .loggedout-usp-container .geoleaderboards .map .player.p10 {
          width: 120px;
          height: 120px;
          background: url(../main/warsaw/loggedout/avatar10.png); }
        .loggedout-usp-container .geoleaderboards .map .player.me {
          width: 199px;
          height: 199px;
          background: url(../main/warsaw/loggedout/avatar_me.png); }
    .loggedout-usp-container .geoleaderboards .map.friends {
      background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/loggedout/geoleaderboards-map-friends-ccd63843.jpg); }
      .loggedout-usp-container .geoleaderboards .map.friends .player.me {
        margin-left: -201px;
        margin-top: 8px; }
      .loggedout-usp-container .geoleaderboards .map.friends .player.p2 {
        margin-left: 52px;
        margin-top: -142px; }
      .loggedout-usp-container .geoleaderboards .map.friends .player.p3 {
        margin-left: -424px;
        margin-top: 238px; }
      .loggedout-usp-container .geoleaderboards .map.friends .player.p6 {
        margin-left: -255px;
        margin-top: -82px; }
    .loggedout-usp-container .geoleaderboards .map.city {
      background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/loggedout/geoleaderboards-map-city-2d1eae7d.jpg); }
      .loggedout-usp-container .geoleaderboards .map.city .player.me {
        margin-left: -74px;
        margin-top: -75px; }
      .loggedout-usp-container .geoleaderboards .map.city .player.p4 {
        margin-left: -128px;
        margin-top: 8px; }
      .loggedout-usp-container .geoleaderboards .map.city .player.p7 {
        margin-left: -268px;
        margin-top: -152px; }
    .loggedout-usp-container .geoleaderboards .map.country {
      background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/loggedout/geoleaderboards-map-country-08b0bccb.jpg); }
      .loggedout-usp-container .geoleaderboards .map.country .player.me {
        margin-left: -160px;
        margin-top: 65px; }
      .loggedout-usp-container .geoleaderboards .map.country .player.p1 {
        margin-left: -140px;
        margin-top: -35px; }
      .loggedout-usp-container .geoleaderboards .map.country .player.p5 {
        margin-left: -227px;
        margin-top: 192px; }
    .loggedout-usp-container .geoleaderboards .map.world {
      background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/loggedout/geoleaderboards-map-world-3f3f31f4.jpg); }
      .loggedout-usp-container .geoleaderboards .map.world .player.me {
        margin-left: -288px;
        margin-top: -305px; }
      .loggedout-usp-container .geoleaderboards .map.world .player.p8 {
        margin-left: -360px;
        margin-top: 95px; }
      .loggedout-usp-container .geoleaderboards .map.world .player.p9 {
        margin-left: -808px;
        margin-top: -181px; }
      .loggedout-usp-container .geoleaderboards .map.world .player.p10 {
        margin-left: 290px;
        margin-top: -25px; }
    .loggedout-usp-container .geoleaderboards .map.opaque {
      opacity: 1;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
      filter: alpha(opacity=1); }
    .loggedout-usp-container .geoleaderboards .heading {
      position: absolute;
      left: 0;
      top: 35px;
      width: 100%; }
    .loggedout-usp-container .geoleaderboards .zoom-widget {
      position: absolute;
      left: 0;
      top: 135px;
      width: 100%; }
      .loggedout-usp-container .geoleaderboards .zoom-widget ul {
        width: 608px;
        margin: 0 auto; }
      .loggedout-usp-container .geoleaderboards .zoom-widget li {
        width: 150px; }
        .loggedout-usp-container .geoleaderboards .zoom-widget li:not(.active) span {
          cursor: pointer; }
          .loggedout-usp-container .geoleaderboards .zoom-widget li:not(.active) span:hover {
            background-color: rgba(7, 7, 7, 0.6); }
      .loggedout-usp-container .geoleaderboards .zoom-widget li span {
        padding: 63px 0 10px;
        height: 23px;
        background-image: url(../main/warsaw/loggedout/geoleaderboards-btn-icons.png);
        background-size: auto;
        display: block; }
      .loggedout-usp-container .geoleaderboards .zoom-widget li.friends span {
        background-position: 0 0; }
      .loggedout-usp-container .geoleaderboards .zoom-widget li.friends.active span {
        background-position: 0 -86px; }
      .loggedout-usp-container .geoleaderboards .zoom-widget li.city span {
        background-position: -152px 0; }
      .loggedout-usp-container .geoleaderboards .zoom-widget li.city.active span {
        background-position: -152px -86px; }
      .loggedout-usp-container .geoleaderboards .zoom-widget li.country span {
        background-position: -304px 0; }
      .loggedout-usp-container .geoleaderboards .zoom-widget li.country.active span {
        background-position: -304px -86px; }
      .loggedout-usp-container .geoleaderboards .zoom-widget li.world span {
        background-position: -456px 3px; }
      .loggedout-usp-container .geoleaderboards .zoom-widget li.world.active span {
        background-position: -456px -83px; }
  .loggedout-usp-container.geoleaderboard-loggedout .geoleaderboards {
    height: 1000px; }
  .loggedout-usp-container .video {
    padding-top: 60px;
    position: relative;
    text-align: center; }
    .loggedout-usp-container .video #uspVideo {
      margin-top: 32px;
      margin-bottom: 44px; }
      .loggedout-usp-container .video #uspVideo .overlay {
        position: relative;
        display: inline-block;
        cursor: pointer;
        width: 656px;
        height: 369px;
        background: url(//d34ymitoc1pg7m.cloudfront.net/bf4/loggedout/movie-template-e7c745ff.jpg) 0 50% no-repeat;
        -webkit-transition: opacity 0.5s ease-in-out;
        -moz-transition: opacity 0.5s ease-in-out;
        transition: opacity 0.5s ease-in-out; }
        .loggedout-usp-container .video #uspVideo .overlay:after {
          content: "";
          width: 90px;
          height: 90px;
          background: url(../serverbrowserwarsaw/playbutton-circle.png);
          position: absolute;
          left: 50%;
          margin-left: -45px;
          top: 50%;
          margin-top: -45px;
          opacity: 0.8; }
        .loggedout-usp-container .video #uspVideo .overlay:hover:after {
          opacity: 0.9; }
  .loggedout-usp-container .footer {
    position: relative;
    text-align: center;
    padding-bottom: 50px;
    margin-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
    .loggedout-usp-container .footer .buttons {
      padding-bottom: 46px; }
      .loggedout-usp-container .footer .buttons .btn {
        font-size: 19px; }
      .loggedout-usp-container .footer .buttons a.btn.withstack {
        padding: 0 40px 0 86px;
        overflow: visible;
        position: relative;
        margin-left: 10px; }
        .loggedout-usp-container .footer .buttons a.btn.withstack img {
          position: absolute;
          left: 9px;
          top: -12px; }
    .loggedout-usp-container .footer p.learnmore {
      margin-bottom: 30px; }
    .loggedout-usp-container .footer .appicons .googleplay-logo {
      margin-left: 6px; }

.main-friends-container {
  position: absolute;
  bottom: 40px;
  width: 327px;
  height: 82px; }
  .main-friends-container .friends h3 {
    line-height: 16px;
    color: #fff;
    font-size: 14px;
    margin: 0;
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400;
    text-align: center; }
  .main-friends-container .friends .outer-center {
    float: right;
    right: 50%;
    position: relative; }
  .main-friends-container .friends .inner-center {
    float: right;
    right: -50%;
    position: relative; }
  .main-friends-container .friends .clear {
    clear: both; }
  .main-friends-container .friends .avatars {
    float: left;
    padding: 0;
    padding-top: 6px; }
  .main-friends-container .friends .more-friends {
    float: left;
    text-align: center;
    font-size: 14px;
    font-family: Purista, sans-serif;
    width: 34px;
    height: 34px;
    overflow: hidden;
    line-height: 34px;
    margin-top: 8px;
    background: rgba(0, 0, 0, 0.8);
    border: 1px solid #606870;
    margin-left: 3px; }

.dialog-bf4required .dialog-body {
  padding: 0;
  overflow: hidden; }
.dialog-bf4required.xp.download .dialog-content {
  height: 260px; }
  .dialog-bf4required.xp.download .dialog-content .info {
    height: 80px; }
.dialog-bf4required.xp.has-premium .dialog-content {
  height: 300px; }
  .dialog-bf4required.xp.has-premium .dialog-content .info {
    height: 130px; }
.dialog-bf4required.xp .dialog-content {
  height: 400px; }
  .dialog-bf4required.xp .dialog-content .main-friends-container {
    color: #fff;
    width: 560px;
    bottom: 70px;
    overflow: hidden; }
  .dialog-bf4required.xp .dialog-content .premium-xpack-info {
    color: #fff;
    position: absolute;
    bottom: 60px;
    width: 560px;
    text-align: center; }
  .dialog-bf4required.xp .dialog-content .info {
    height: 220px; }
    .dialog-bf4required.xp .dialog-content .info h3 {
      text-transform: uppercase;
      font-size: 18px;
      line-height: 18px;
      margin: 0;
      padding: 0;
      margin-top: 12px;
      color: #fff;
      font-weight: normal; }
    .dialog-bf4required.xp .dialog-content .info .buttons {
      position: absolute;
      bottom: 16px;
      left: 0;
      width: 560px; }
.dialog-bf4required.xp.xp1048576 {
  /* XP1 China Rising */ }
  .dialog-bf4required.xp.xp1048576 .dialog-content {
    background: url(../main/warsaw/game-dialog-bg-xp1.jpg) top center no-repeat; }
.dialog-bf4required.xp.xp524288 {
  /* XP0 Second Assault */ }
  .dialog-bf4required.xp.xp524288 .dialog-content {
    background: url(../main/warsaw/game-dialog-bg-xp0.jpg) top center no-repeat; }
.dialog-bf4required.xp.xp2097152 {
  /* XP2 Naval Strike */ }
  .dialog-bf4required.xp.xp2097152 .dialog-content {
    background: url(../main/warsaw/game-dialog-bg-xp2.jpg) top center no-repeat; }
.dialog-bf4required.xp.bfh, .dialog-bf4required.xp.xp536870912 {
  /* Criminal Activity BFH */ }
  .dialog-bf4required.xp.bfh .dialog-content, .dialog-bf4required.xp.xp536870912 .dialog-content {
    background: url(../clubs/club-npx-bfh.jpg) top center no-repeat;
    background-size: cover; }
.dialog-bf4required .dialog-content {
  width: 560px;
  height: 326px;
  background: url(../main/warsaw/game-dialog-bg.jpg) top center no-repeat;
  position: relative; }
  .dialog-bf4required .dialog-content .main-friends-container {
    width: 560px; }
  .dialog-bf4required .dialog-content .overlay {
    position: absolute;
    top: 164px;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    background-image: -webkit-linear-gradient(left top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.6) 100%);
    background-image: linear-gradient(to right bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.6) 100%); }
  .dialog-bf4required .dialog-content .info {
    z-index: 3;
    position: absolute;
    bottom: 0;
    height: 160px;
    text-align: center;
    width: 560px;
    left: 0; }
    .dialog-bf4required .dialog-content .info .buttons {
      position: absolute;
      bottom: 16px;
      left: 146px; }
      .dialog-bf4required .dialog-content .info .buttons .btn-primary {
        margin-right: 8px; }
    .dialog-bf4required .dialog-content .info h4 {
      font-weight: bold;
      font-family: Arial;
      font-size: 16px;
      text-transform: uppercase;
      line-height: 24px;
      margin: 0;
      padding: 0;
      margin-top: 12px; }
    .dialog-bf4required .dialog-content .info h5 {
      font-weight: normal;
      font-family: Arial;
      font-size: 14px;
      text-transform: none;
      line-height: 24px; }

#trialmessage {
  font-size: 14px;
  color: #ccc; }
  #trialmessage .expired-box {
    background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/trial/bg-gametime-786dcb2b.png);
    text-align: center;
    padding: 32px; }
    #trialmessage .expired-box h3 {
      font-size: 23px;
      line-height: 1; }
    #trialmessage .expired-box p {
      margin: 23px 0 13px 0; }
    #trialmessage .expired-box a.origin-upgrade {
      font-size: 22px;
      text-decoration: underline;
      display: inline-block;
      background-image: url(../odcstore/origin-storelogo-small.png);
      background-repeat: no-repeat;
      background-position: center right;
      line-height: 45px;
      padding-right: 45px; }
  #trialmessage .unexpired-box {
    background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/trial/icon-gametime-cd01b474.png);
    background-repeat: no-repeat;
    background-position: 12px 12px;
    padding-left: 50px;
    font-family: Purista;
    font-size: 16px;
    line-height: 32px; }
    #trialmessage .unexpired-box .btn {
      float: right; }
    #trialmessage .unexpired-box a.origin-upgrade {
      margin-left: 12px;
      font-size: 16px;
      display: inline-block;
      text-decoration: underline;
      background-image: url(../odcstore/origin-storelogo-small.png);
      background-repeat: no-repeat;
      background-position: center right;
      background-size: contain;
      line-height: 35px;
      padding-right: 35px; }

.survey {
  font-size: 12px;
  margin-top: 16px; }
  .survey input {
    display: none; }
  .survey .checkboxicon {
    background: url(../main/poll-checkbox.png);
    width: 10px;
    height: 10px;
    position: relative;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: 0 0;
    cursor: pointer; }
  .survey table.scores {
    color: #d5dde5;
    margin-top: 16px;
    margin-bottom: 8px; }
    .survey table.scores tr td {
      padding-right: 16px;
      margin-bottom: 8px;
      text-align: center; }
  .survey .description {
    color: #a8a8a8; }
    .survey .description .min {
      float: left; }
    .survey .description .max {
      float: right; }
  .survey .feedback textarea {
    width: 270px;
    max-width: 270px;
    height: 50px;
    overflow-y: auto;
    margin-top: 16px;
    margin-bottom: 8px; }
  .survey .feedback button {
    float: right; }

body.no-main-header header section.game-bar {
  display: None; }

.main-xp-boost-notice:hover {
  text-decoration: none; }

.main-header .get-bfh-tile {
  height: 280px;
  background: url(//eaassets-a.akamaihd.net/battlelog/bb/bf4/main/bfh-banner-87797f74.jpg) no-repeat;
  position: relative;
  margin-bottom: 16px; }
  .main-header .get-bfh-tile .tile-body {
    height: 60px;
    padding: 24px 16px;
    background: rgba(7, 7, 7, 0.5);
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0; }
    .main-header .get-bfh-tile .tile-body .friends-container {
      float: left; }
      .main-header .get-bfh-tile .tile-body .friends-container:before, .main-header .get-bfh-tile .tile-body .friends-container:after {
        display: table;
        content: "";
        line-height: 0; }
      .main-header .get-bfh-tile .tile-body .friends-container:after {
        clear: both; }
      .main-header .get-bfh-tile .tile-body .friends-container h6 {
        margin-top: -5px;
        margin-bottom: 5px; }
      .main-header .get-bfh-tile .tile-body .friends-container .friends-list .avatars {
        padding: 0;
        margin-left: -4px; }
    .main-header .get-bfh-tile .tile-body .buy-btn {
      float: right;
      margin-top: 10px; }

#alpha-trial p {
  line-height: 21px; }
  #alpha-trial p:not(last-of-type) {
    margin-bottom: 1em; }
#alpha-trial textarea {
  width: 100%;
  height: 300px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
#alpha-trial a {
  text-decoration: underline; }

html.ugm-showing #serverbrowser {
  padding-bottom: 60px; }

.icon-servertype {
  width: 11px;
  height: 16px; }

.icon-servertype-1 {
  background: url(../serverguide/icon-rank-official.png) top left no-repeat; }

.icon-servertype-2 {
  background: url(../serverguide/icon-rank-ranked.png) top left no-repeat; }

.icon-servertype-4 {
  background: url(../serverguide/icon-rank-unranked.png) top left no-repeat; }

.icon-servertype-8 {
  background: url(../serverguide/icon-rank-private.png) top left no-repeat; }

.server-row.active .icon-servertype-1 {
  background: url(../serverguide/icon-rank-official-dark.png) top left no-repeat; }
.server-row.active .icon-servertype-2 {
  background: url(../serverguide/icon-rank-ranked-dark.png) top left no-repeat; }
.server-row.active .icon-servertype-4 {
  background: url(../serverguide/icon-rank-unranked-dark.png) top left no-repeat; }
.server-row.active .icon-servertype-8 {
  background: url(../serverguide/icon-rank-private-dark.png) top left no-repeat; }

.serverguide-open-filter-box {
  position: relative;
  top: 2px; }

#serverbrowser #server-browser-refresh-global {
  padding: 1px 8px 0 12px;
  margin: 6px 0 0; }
#serverbrowser header button {
  margin: 4px 0 0 10px; }
#serverbrowser .serverbrowser-platform-filter-select {
  float: right; }
#serverbrowser .arrow-container {
  position: relative; }
  #serverbrowser .arrow-container .outerarrow {
    position: absolute;
    top: 0;
    right: 0;
    width: 20px;
    height: 30px; }
  #serverbrowser .arrow-container .arrow {
    position: absolute;
    top: 50%;
    left: 0%;
    margin-top: -3px;
    margin-left: 4px;
    border: 6px solid transparent;
    border-top-color: #fff;
    opacity: 0.3;
    -webkit-transition: all 0.1s ease-out, opacity 0;
    -moz-transition: all 0.1s ease-out, opacity 0;
    transition: all 0.1s ease-out, opacity 0;
    -webkit-transform-origin: center;
    -moz-transform-origin: center;
    -ms-transform-origin: center;
    -o-transform-origin: center;
    transform-origin: center; }
  #serverbrowser .arrow-container:hover .arrow, #serverbrowser .arrow-container.active .arrow {
    opacity: 0.75; }
#serverbrowser .server-filter {
  margin-bottom: 16px; }
  #serverbrowser .server-filter.collapsed {
    padding-right: 28px; }
    #serverbrowser .server-filter.collapsed > footer {
      width: 27px;
      display: block;
      position: absolute;
      right: 0;
      top: 0;
      bottom: 0;
      background-color: rgba(7, 7, 7, 0.5);
      padding: 0; }
#serverbrowser .no-results {
  margin-top: 16px;
  text-align: center; }
  #serverbrowser .no-results h2 {
    font-size: 2em; }
#serverbrowser [data-sort] {
  text-decoration: none; }
#serverbrowser .sort-desc:after {
  content: "▲";
  padding-left: 2px;
  text-decoration: none; }
#serverbrowser .sort-asc:after {
  content: "▼";
  padding-left: 2px;
  text-decoration: none; }
#serverbrowser #servers {
  margin-top: 8px;
  min-height: 800px; }
#serverbrowser .servers-list thead th {
  line-height: 24px;
  padding: 0 6px; }
#serverbrowser .servers-list thead .players {
  width: 55px; }
#serverbrowser .servers-list thead .ping {
  width: 40px; }
#serverbrowser .servers-list thead .server-icons {
  width: 22px; }
#serverbrowser .servers-list:not(.loading) tfoot {
  display: none; }
#serverbrowser .servers-list tfoot th {
  padding: 16px;
  text-align: center; }
#serverbrowser .servers-list tr .icon {
  background: url(../serverguide/icons_server.png) top left no-repeat;
  display: inline-block;
  vertical-align: middle;
  width: 16px;
  height: 16px;
  margin: 0;
  padding: 0; }
  #serverbrowser .servers-list tr .icon.punkbuster {
    background-position: -141px -166px; }
    #serverbrowser .servers-list tr .icon.punkbuster.on {
      background-position: -142px -128px; }
  #serverbrowser .servers-list tr .icon.ranked {
    background-position: -68px -167px; }
    #serverbrowser .servers-list tr .icon.ranked.on {
      background-position: -68px -128px; }
  #serverbrowser .servers-list tr .icon.type {
    background-position: -214px -128px; }
    #serverbrowser .servers-list tr .icon.type.normal {
      background-position: -214px -167px; }
#serverbrowser .servers-list .server-icons {
  padding: 0 0 0 6px; }
#serverbrowser .servers-list .active .icon.punkbuster {
  background-position: -142px -128px; }
  #serverbrowser .servers-list .active .icon.punkbuster.on {
    background-position: -141px -166px; }
#serverbrowser .servers-list .active .icon.ranked {
  background-position: -68px -128px; }
  #serverbrowser .servers-list .active .icon.ranked.on {
    background-position: -68px -167px; }
#serverbrowser .servers-list img {
  vertical-align: middle; }
#serverbrowser .servers-list tbody .server-row {
  height: 49px;
  cursor: pointer; }
  #serverbrowser .servers-list tbody .server-row:active:not(.active) > td {
    background-color: rgba(7, 7, 7, 0.6); }
  #serverbrowser .servers-list tbody .server-row .favorite {
    width: 20px;
    overflow: hidden;
    padding-right: 0; }
  #serverbrowser .servers-list tbody .server-row .star {
    display: block;
    width: 20px;
    margin: 0 auto;
    padding: 0; }
    #serverbrowser .servers-list tbody .server-row .star:after {
      position: relative;
      z-index: 1;
      display: none;
      content: "★";
      font-size: 22px;
      color: rgba(255, 255, 255, 0.3); }
  #serverbrowser .servers-list tbody .server-row .server-icons {
    padding: 10px 0 0 9px; }
  #serverbrowser .servers-list tbody .server-row:hover .star:after, #serverbrowser .servers-list tbody .server-row .star.starred:after {
    display: block;
    color: rgba(255, 255, 255, 0.3); }
  #serverbrowser .servers-list tbody .server-row .star.starred:after, #serverbrowser .servers-list tbody .server-row .star:hover:after {
    color: white; }
  #serverbrowser .servers-list tbody .server-row.loading-info td.map .loader {
    display: block; }
  #serverbrowser .servers-list tbody .server-row td {
    line-height: 28px;
    font-size: 12px;
    padding: 6px; }
    #serverbrowser .servers-list tbody .server-row td:first-child {
      width: 18px; }
    #serverbrowser .servers-list tbody .server-row td.map {
      width: 48px;
      line-height: 1;
      position: relative; }
      #serverbrowser .servers-list tbody .server-row td.map .loader {
        position: absolute;
        top: 50%;
        left: 21px;
        margin-top: -13px;
        display: none; }
      #serverbrowser .servers-list tbody .server-row td.map .map-thumb {
        width: auto; }
    #serverbrowser .servers-list tbody .server-row td.server {
      min-width: 50px;
      max-width: 480px;
      overflow: hidden; }
      #serverbrowser .servers-list tbody .server-row td.server .server-name {
        line-height: 16px;
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap; }
      #serverbrowser .servers-list tbody .server-row td.server .server-details {
        line-height: 12px;
        margin-top: 2px;
        font-size: 11px;
        color: #a8a8a8;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis; }
        #serverbrowser .servers-list tbody .server-row td.server .server-details .country-flag {
          float: left;
          margin-top: -2px;
          margin-right: 5px; }
      #serverbrowser .servers-list tbody .server-row td.server .friends-playing {
        position: absolute;
        line-height: 48px;
        top: 0;
        right: 8px;
        bottom: 0; }
    #serverbrowser .servers-list tbody .server-row td.players {
      text-align: center;
      width: 55px; }
    #serverbrowser .servers-list tbody .server-row td.ping {
      color: #a8a8a8;
      font-size: 11px;
      text-align: center;
      width: 40px; }
    #serverbrowser .servers-list tbody .server-row td.server-icons {
      width: 22px; }

html:not(.is-touch) #serverbrowser .servers-list tbody .server-row.active {
  -webkit-filter: drop-shadow(0 0 7px #e0f4f8);
  -moz-filter: drop-shadow(0 0 7px #e0f4f8);
  -ms-filter: drop-shadow(0 0 7px #e0f4f8);
  -o-filter: drop-shadow(0 0 7px #e0f4f8);
  filter: drop-shadow(0 0 7px #e0f4f8); }
  html:not(.is-touch) #serverbrowser .servers-list tbody .server-row.active .server-name {
    font-weight: bold; }
  html:not(.is-touch) #serverbrowser .servers-list tbody .server-row.active .star:after {
    color: rgba(0, 0, 0, 0.3); }
  html:not(.is-touch) #serverbrowser .servers-list tbody .server-row.active .star.starred:after, html:not(.is-touch) #serverbrowser .servers-list tbody .server-row.active .star:hover:after {
    color: rgba(0, 0, 0, 0.9) !important; }

.is-touch #serverbrowser aside .action-buttons-container .favorite-toggle {
  margin-top: 8px; }
  .is-touch #serverbrowser aside .action-buttons-container .favorite-toggle.starred .add-text {
    display: none; }
  .is-touch #serverbrowser aside .action-buttons-container .favorite-toggle.starred .remove-text {
    display: inline; }
  .is-touch #serverbrowser aside .action-buttons-container .favorite-toggle .remove-text {
    display: none; }

#serverbrowser-show .btn.join {
  margin-top: 8px; }
#serverbrowser-show .settings {
  margin-top: -10px; }
  #serverbrowser-show .settings li {
    font-size: 12px;
    color: #a8a8a8;
    display: block;
    margin-top: 10px;
    line-height: 16px;
    clear: both; }
    #serverbrowser-show .settings li b {
      max-width: 130px;
      padding-right: 5px;
      color: #fff;
      float: right;
      text-align: right;
      margin-right: 5px; }
    #serverbrowser-show .settings li .icon {
      vertical-align: middle;
      margin-top: -4px;
      margin-right: 2px; }
#serverbrowser-show .quick-info {
  position: relative;
  height: 160px;
  width: auto;
  overflow: hidden;
  background-position: center center; }
  #serverbrowser-show .quick-info:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: -webkit-linear-gradient( rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.8) 100%);
    background: linear-gradient( rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.8) 100%); }
  #serverbrowser-show .quick-info .holder {
    position: absolute;
    padding: 16px;
    bottom: 0; }
  #serverbrowser-show .quick-info .player-count, #serverbrowser-show .quick-info .map-info li {
    padding: 0 5px; }
  #serverbrowser-show .quick-info li {
    height: 18px;
    line-height: 18px;
    float: left; }
  #serverbrowser-show .quick-info .player-count {
    font-size: 18px;
    margin-bottom: 2px; }
  #serverbrowser-show .quick-info .holder ul {
    float: left; }
    #serverbrowser-show .quick-info .holder ul.friends li {
      padding: 0 5px; }
  #serverbrowser-show .quick-info .map-info {
    color: #eee;
    font-size: 12px; }
    #serverbrowser-show .quick-info .map-info img {
      vertical-align: middle; }
#serverbrowser-show #serverbrowser-show-serverjoin {
  margin-top: 5px; }
#serverbrowser-show .box {
  margin-top: 8px; }
#serverbrowser-show footer {
  padding: 0; }
  #serverbrowser-show footer a {
    padding: 16px;
    text-decoration: none;
    display: block; }
  #serverbrowser-show footer:hover {
    background-color: rgba(7, 7, 7, 0.6); }

#serverbrowser-recommended-servers ul {
  overflow: hidden; }
  #serverbrowser-recommended-servers ul.row-tight .span2.server {
    width: 330px; }
#serverbrowser-recommended-servers .loader {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -16px;
  margin-top: -16px; }
#serverbrowser-recommended-servers .toggle {
  position: relative;
  overflow: hidden;
  cursor: pointer; }
  #serverbrowser-recommended-servers .toggle .serverbrowser-toggler {
    float: right;
    position: absolute;
    top: 1px;
    right: 10px;
    color: #aaa; }
    #serverbrowser-recommended-servers .toggle .serverbrowser-toggler:after {
      float: right;
      text-align: center;
      content: "-";
      padding-right: 3px;
      font-size: 21px; }
  #serverbrowser-recommended-servers .toggle:hover .serverbrowser-toggler {
    color: #fff; }
#serverbrowser-recommended-servers.collapsed .toggle .serverbrowser-toggler {
  top: 2px; }
  #serverbrowser-recommended-servers.collapsed .toggle .serverbrowser-toggler:after {
    float: right;
    text-align: center;
    content: "+";
    padding-right: 0;
    font-size: 21px; }
#serverbrowser-recommended-servers .server {
  height: 160px;
  position: relative;
  display: table;
  background: rgba(7, 7, 7, 0.6);
  overflow: hidden; }
  #serverbrowser-recommended-servers .server img {
    position: absolute;
    top: 0;
    bottom: 0;
    opacity: 1;
    width: 100%;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease; }
    #serverbrowser-recommended-servers .server img.show-on-load {
      opacity: 0; }
  #serverbrowser-recommended-servers .server:before {
    position: absolute;
    z-index: 1;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: -webkit-linear-gradient( rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.8) 100%);
    background: linear-gradient( rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.8) 100%); }
  #serverbrowser-recommended-servers .server > header {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.9);
    padding: 8px 16px;
    min-height: 37px;
    z-index: 2; }
    #serverbrowser-recommended-servers .server > header .recommendation {
      line-height: 14px;
      font-size: 12px;
      color: #a8a8a8; }
    #serverbrowser-recommended-servers .server > header .server-name {
      color: #fff;
      font-size: 14px;
      line-height: 22px;
      text-decoration: none;
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden; }
    #serverbrowser-recommended-servers .server > header .server-details {
      line-height: 18px;
      font-size: 12px;
      color: #a8a8a8; }
  #serverbrowser-recommended-servers .server button {
    margin-left: 8px;
    bottom: 16px;
    right: 16px;
    position: absolute;
    z-index: 2; }
  #serverbrowser-recommended-servers .server > .server-info {
    position: absolute;
    z-index: 2;
    font-size: 11px;
    left: 16px;
    bottom: 22px;
    color: #fff; }
    #serverbrowser-recommended-servers .server > .server-info p {
      height: 32px;
      position: relative;
      top: 7px;
      line-height: 16px;
      font-size: 12px;
      display: table-cell;
      vertical-align: bottom; }
      #serverbrowser-recommended-servers .server > .server-info p span {
        display: block; }
        #serverbrowser-recommended-servers .server > .server-info p span.map {
          white-space: nowrap;
          width: 126px;
          overflow: hidden;
          text-overflow: ellipsis; }
  #serverbrowser-recommended-servers .server > .players {
    position: absolute;
    z-index: 2;
    top: 61px;
    left: 16px; }
    #serverbrowser-recommended-servers .server > .players .avatar {
      width: 32px;
      height: 32px;
      float: left;
      margin-right: 2px; }

#serverbrowser-filters .toggle {
  font-family: Arial, sans-serif !important;
  position: relative;
  overflow: hidden;
  padding: 0 16px;
  cursor: pointer;
  font-size: 12px;
  color: #aaa;
  line-height: 32px;
  margin-right: 37px; }
  #serverbrowser-filters .toggle em {
    text-transform: uppercase;
    background: url(../base/shared/search-icon-white.png) 0 1px no-repeat;
    padding-left: 18px;
    color: #fff; }
  #serverbrowser-filters .toggle:hover .serverbrowser-toggler {
    color: #fff; }
  #serverbrowser-filters .toggle #custom-filter-list-content {
    display: inline-block;
    max-width: 725px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: top; }
  #serverbrowser-filters .toggle ul, #serverbrowser-filters .toggle li {
    display: inline;
    margin: 0;
    padding: 0; }
  #serverbrowser-filters .toggle ul {
    list-style: none; }
  #serverbrowser-filters .toggle li {
    margin: 0 6px 0 0;
    text-transform: none; }
  #serverbrowser-filters .toggle .outerarrow {
    top: 1px; }
#serverbrowser-filters .serverbrowser-refresh {
  cursor: pointer;
  font-size: 21px;
  line-height: 32px;
  padding: 0;
  height: 32px;
  width: 36px;
  text-align: center;
  float: right;
  color: #a8a8a8; }
  #serverbrowser-filters .serverbrowser-refresh:hover {
    color: #fff; }
#serverbrowser-filters.expanded .toggle .arrow {
  margin-top: -9px;
  border-top-color: transparent;
  border-bottom-color: #fff; }
#serverbrowser-filters.expanded .filters-container {
  display: block; }
#serverbrowser-filters.expanded.advanced-expanded .advanced-filters {
  display: block; }
#serverbrowser-filters.expanded.advanced-expanded .button-row .arrow {
  margin-top: -9px;
  border-top-color: transparent;
  border-bottom-color: #fff; }
#serverbrowser-filters .btn-primary {
  margin-left: 10px; }
#serverbrowser-filters .filters-container, #serverbrowser-filters .advanced-filters {
  display: none; }
#serverbrowser-filters .box-content {
  overflow: hidden;
  position: relative; }
  #serverbrowser-filters .box-content .serverbrowser-filter {
    padding: 2px 0;
    width: 132px;
    overflow: hidden;
    border-top: 1px solid #dadad9;
    float: left;
    border-right: 1px solid #e1e1e1;
    height: 100%;
    position: relative;
    background: #ececec;
    border-top-width: 0; }
  #serverbrowser-filters .box-content .filterextra .serverbrowser-filter {
    width: 218px; }
#serverbrowser-filters .row-tight {
  overflow: hidden;
  padding-bottom: 16px; }
#serverbrowser-filters .filter-col {
  margin-top: 0;
  padding-bottom: 1000px;
  margin-bottom: -1000px; }
  #serverbrowser-filters .filter-col.filter-player-settings {
    width: 396px; }
  #serverbrowser-filters .filter-col .filter-col {
    margin-top: 1px; }

section.filter {
  margin-bottom: 16px; }
  section.filter:last-child {
    margin-bottom: 0; }
  section.filter:after {
    clear: both;
    content: "";
    display: table; }
  section.filter h3 {
    color: #8A8A8A;
    font-size: 13px;
    line-height: 20px; }
  section.filter ul {
    list-style: none;
    margin: 0;
    padding: 0; }
    section.filter ul li {
      min-height: 20px;
      font-size: 12px;
      margin: 0 0 4px 0;
      padding: 0;
      cursor: pointer;
      padding-left: 20px;
      background: url(../serverbrowserwarsaw/icon-checkbox-4.png) no-repeat;
      line-height: 14px;
      -webkit-transition: color 0.2s ease;
      -moz-transition: color 0.2s ease;
      transition: color 0.2s ease;
      /* -1 */
      background-position: 0 -297px; }
      section.filter ul li[data-toggle="section"] {
        font-family: Purista, sans-serif;
        font-style: normal;
        font-weight: 600;
        text-transform: uppercase;
        color: #8A8A8A !important;
        font-size: 13px;
        line-height: 1.2;
        margin-bottom: 7px; }
      section.filter ul li.plain {
        padding-left: 0px;
        background: none; }
      section.filter ul li:hover {
        background-position: 0 -396px; }
        section.filter ul li:hover.on {
          background-position: 0 -97px; }
      section.filter ul li.on {
        /* 1 */
        background-position: 0 4px;
        color: #d1ffbe; }
      section.filter ul li.off {
        background-position: 0 -796px;
        color: #ffcacf; }
      section.filter ul li.filter-range {
        min-height: 20px; }
        section.filter ul li.filter-range input {
          padding: 1px 2px;
          text-align: center;
          width: 65px; }
  section.filter label {
    cursor: pointer;
    position: relative;
    top: 2px; }
    section.filter label.premium {
      display: inline-block;
      background: url(../premium/icon-p-s.png) right center no-repeat;
      padding-right: 18px; }
    section.filter label img.icon {
      margin: -3px 4px 0px -4px;
      vertical-align: middle; }
  section.filter a.popup {
    position: relative;
    top: 2px; }
    section.filter a.popup:after {
      clear: both;
      content: "";
      display: table; }
  section.filter select, section.filter input[type="checkbox"] {
    display: none; }
  section.filter input[disabled] + label {
    opacity: 0.5; }
  section.filter #serverbrowser-open-advanced-link, section.filter #serverbrowser-open-region-link {
    float: none;
    margin: 0;
    padding: 0;
    top: 2px; }
  section.filter.gameexpansion-filter li {
    margin-bottom: 16px; }
  section.filter.split ul li {
    width: 157px;
    float: left;
    margin-right: 4px; }
  section.filter .filter-range label {
    display: inline-block;
    max-width: 185px; }
  section.filter.xpack-filter .section label {
    float: left; }
    section.filter.xpack-filter .section label img.icon {
      margin-top: 0;
      float: left; }

.popup-serveradvancedfilter-value.bool-filter {
  position: relative;
  clear: both;
  width: 100%; }

#serverbrowser-filterstring em {
  margin-right: 5px;
  text-decoration: none;
  font-style: normal; }
#serverbrowser-filterstring strong {
  text-decoration: none;
  font-style: normal; }
#serverbrowser-filterstring label {
  margin-left: 3px;
  margin-right: 3px; }

#server-page > header {
  margin-bottom: 8px; }
  #server-page > header p {
    margin-bottom: 16px; }
  #server-page > header button {
    width: 220px;
    display: block; }
    #server-page > header button + button {
      margin-top: 8px; }
#server-page h5 {
  text-transform: none; }

#server-page-map-rotation .scroll-area {
  overflow: hidden; }
#server-page-map-rotation table {
  margin-top: 1px;
  margin-bottom: 0; }
#server-page-map-rotation td {
  vertical-align: top;
  width: 178px;
  height: 130px;
  margin-bottom: 8px;
  padding: 1px; }
  #server-page-map-rotation td.active {
    color: black;
    background-color: white;
    background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    box-shadow: 0 0 7px 0 #e0f4f8; }
    #server-page-map-rotation td.active .xp-icon {
      border: 1px solid #000; }
  #server-page-map-rotation td:last-child {
    width: auto; }
  #server-page-map-rotation td .map-image {
    width: auto;
    min-width: 160px;
    height: 79px;
    display: block;
    background-repeat: no-repeat;
    background-size: cover; }
  #server-page-map-rotation td .xp-icon {
    float: left;
    margin-top: 2px;
    margin-right: 6px;
    margin-left: -8px; }
  #server-page-map-rotation td p {
    padding: 5px 14px 4px;
    font-size: 12px;
    line-height: 16px; }
    #server-page-map-rotation td p span {
      color: #a8a8a8; }
  #server-page-map-rotation td.xpack p {
    padding-left: 32px; }
#server-page-map-rotation .no-maps-rotation {
  vertical-align: middle;
  text-align: center; }
#server-page-map-rotation .jspHorizontalBar .jspTrack {
  background: rgba(7, 7, 7, 0.6); }

#server-page-settings {
  margin-bottom: 16px;
  overflow: hidden; }
  #server-page-settings .span2 .box-content {
    padding-bottom: 500px;
    margin-bottom: -484px; }
  #server-page-settings dl {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 11px;
    padding-bottom: 6px;
    margin-bottom: 7px; }
    #server-page-settings dl dt {
      float: left;
      color: #a8a8a8;
      text-transform: uppercase; }
    #server-page-settings dl dd {
      float: right; }
      #server-page-settings dl dd .icon {
        vertical-align: top;
        margin-top: -1px; }
    #server-page-settings dl:last-child {
      border-bottom: 0;
      margin: 0;
      padding: 0; }

#server-page-join-buttons {
  background-color: transparent;
  padding: 16px 0px 0px; }
  #server-page-join-buttons .btn + .btn {
    margin-left: 8px; }

#server-page-slot-info {
  margin-top: 15px; }
  #server-page-slot-info dl {
    font-size: 11px;
    padding-bottom: 3px; }
    #server-page-slot-info dl dt {
      float: left;
      color: #a8a8a8;
      text-transform: uppercase; }
    #server-page-slot-info dl dd {
      float: right; }
    #server-page-slot-info dl:last-child {
      border-bottom: 0;
      margin: 0;
      padding: 0; }

#server-page-info .row-tight {
  overflow: hidden; }
  #server-page-info .row-tight .box header {
    text-align: center;
    padding-bottom: 200px;
    margin-bottom: -200px; }
  #server-page-info .row-tight .box section {
    height: 78px;
    padding: 16px;
    text-align: center; }
    #server-page-info .row-tight .box section h5 {
      margin: 0;
      font-size: 22px;
      line-height: 24px; }
#server-page-info .icon-servertype-large {
  width: 19px;
  height: 27px;
  margin-bottom: -8px; }
#server-page-info .icon-servertype-large-1 {
  background: url(../serverguide/icon-rank-official-l.png) top left no-repeat; }
#server-page-info .icon-servertype-large-2 {
  background: url(../serverguide/icon-rank-ranked-l.png) top left no-repeat; }
#server-page-info .icon-servertype-large-4 {
  background: url(../serverguide/icon-rank-unranked-l.png) top left no-repeat; }
#server-page-info .icon-servertype-large-8 {
  background: url(../serverguide/icon-rank-private-l.png) top left no-repeat; }

#server-page-gamemode {
  margin-bottom: 1px; }
  #server-page-gamemode p {
    font-size: 14px;
    line-height: 14px; }
  #server-page-gamemode .flag {
    margin: 0 8px -1px 8px; }
  #server-page-gamemode .common-gameicon-hori {
    margin-bottom: -2px; }
  #server-page-gamemode .common-gameexpansion {
    margin-bottom: -2px; }

/* serverbrowser component CSS resource */
.serverbrowser-invite-item {
  clear: both;
  height: 26px;
  line-height: 26px;
  margin-bottom: 6px; }

#serverbrowser-serverfilter-configure .base-link {
  font-weight: normal; }

.serverbrowser-invite-avatar, .serverbrowser-invite-username {
  float: left; }

.serverbrowser-invite-status {
  float: right;
  text-align: right;
  width: 100px; }

.serverbrowser-invite-list-container {
  margin-top: 16px; }

.serverbrowser-invite-username {
  width: 160px;
  margin-left: 6px;
  overflow: hidden; }

.serverbrowser-invite-status {
  width: 100px;
  font-size: 11px; }

.serverbrowser-invite-text {
  display: block;
  width: 75px;
  text-align: left;
  float: left;
  padding-left: 6px; }

.serverbrowser-invite-img-waiting, .serverbrowser-invite-img-joining, .serverbrowser-invite-img-declined {
  float: left;
  width: 16px;
  height: 16px;
  margin-top: 5px; }

.serverbrowser-invite-img-waiting {
  background: url(../serverguide/invited_loader.gif); }

.serverbrowser-invite-img-joining {
  margin-left: 2px;
  margin-top: 8px;
  width: 11px;
  height: 11px;
  background: url(../serverguide/invited_status.png); }

.serverbrowser-invite-img-declined {
  margin-top: 8px;
  width: 11px;
  height: 11px;
  background: url(../serverguide/invited_status.png) 0 11px; }

#serverbrowser-search-container {
  width: 992px;
  position: relative;
  top: 122px;
  height: 33px;
  margin: 0 auto; }

#serverbrowser-search {
  width: 405px;
  height: 34px;
  clear: both;
  background: white url(../serverguide/search.png); }

#serverbrowser-search-input {
  background-image: url(../base/shared/search-icon-white.png);
  background-position: 5px 10px;
  background-repeat: no-repeat;
  width: 123px;
  font-size: 14px;
  padding: 8px 8px 8px 23px; }

#serverbrowser-search-button {
  background: url(../serverguide/search-button.png);
  float: left;
  width: 21px;
  height: 28px;
  border: 0;
  cursor: pointer;
  margin-top: 3px; }

#serverbrowser-content {
  width: 100%; }
  #serverbrowser-content .common-box-inner-border {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-right-width-value: 1px;
    border-left-width-value: 1px; }

.serverbrowser-selectable span {
  text-shadow: none;
  font-weight: normal;
  font-size: 12px;
  margin-left: 20px; }
.serverbrowser-selectable.serverbrowser-include span, .serverbrowser-selectable.serverbrowser-noinclude span {
  font-weight: bold; }

#serverbrowser-apply-filters .serverbrowser-filter-search {
  border-top: 0;
  height: 49px;
  width: 440px;
  text-align: left;
  position: absolute;
  bottom: -2px; }
  #serverbrowser-apply-filters .serverbrowser-filter-search h1 {
    position: relative;
    top: 17px;
    float: left;
    margin-left: 14px;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase; }
  #serverbrowser-apply-filters .serverbrowser-filter-search input {
    position: relative;
    top: -3px;
    float: left;
    margin-left: 10px; }

#serverbrowser-filters .serverbrowser-filter-game {
  width: 227px;
  height: 160px; }
#serverbrowser-filters .serverbrowser-filter-search {
  width: 227px;
  height: 100px; }
#serverbrowser-filters .filtergameexpansionvenice {
  float: left;
  width: 228px; }
#serverbrowser-filters .filtergameexpansion {
  float: left;
  margin-left: 16px;
  width: 184px; }
#serverbrowser-filters .serverbrowser-filter-gamemode {
  width: 403px;
  border-right: none;
  min-height: 0; }
#serverbrowser-filters .serverbrowser-filter-region {
  height: 136px;
  width: 227px; }
#serverbrowser-filters .serverbrowser-filter-slots {
  width: 139px;
  position: relative;
  height: 404px; }
#serverbrowser-filters .serverbrowser-filter-gametype {
  height: 49px; }
#serverbrowser-filters .serverbrowser-filter-extra {
  min-height: 404px;
  height: 100%; }
#serverbrowser-filters .serverbrowser-filter-map {
  border-right: 0;
  width: 403px;
  height: 267px;
  padding: 0; }
#serverbrowser-filters .serverbrowser-filter-mapmode-wrapper {
  border-right: 0;
  width: 403px;
  max-height: 428px;
  overflow-y: auto;
  min-height: 328px;
  /* height: 235px; */
  float: left;
  background: #ececec; }
#serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-name {
  width: 100%;
  height: 30px;
  float: left;
  position: relative;
  clear: both; }
  #serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-name h1 {
    font-weight: bold;
    text-shadow: none;
    float: left;
    font-size: 11px;
    margin-right: 0;
    margin-top: 12px;
    text-align: left;
    font-family: Tahoma, Arial, sans-serif;
    margin-left: 16px;
    clear: both;
    position: relative;
    text-transform: uppercase;
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text; }
#serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables {
  width: 100%;
  position: relative;
  padding-bottom: 3px;
  width: 100%;
  position: relative; }
#serverbrowser-filters .serverbrowser-filter.serverbrowser-filter-map .serverbrowser-filter-selectables {
  padding-bottom: 4px; }
  #serverbrowser-filters .serverbrowser-filter.serverbrowser-filter-map .serverbrowser-filter-selectables .serverbrowser-selectable {
    /*width: 187px;*/
    height: 21px;
    line-height: 21px;
    position: relative;
    margin-left: 16px;
    margin-top: 2px;
    width: 184px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    float: left;
    clear: none; }
    #serverbrowser-filters .serverbrowser-filter.serverbrowser-filter-map .serverbrowser-filter-selectables .serverbrowser-selectable.multicolumn {
      float: left;
      clear: none; }
      #serverbrowser-filters .serverbrowser-filter.serverbrowser-filter-map .serverbrowser-filter-selectables .serverbrowser-selectable.multicolumn.second {
        margin-left: 10px; }
#serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-label {
  font-size: 14px;
  font-weight: bold;
  text-shadow: #fff 0 1px 1px;
  float: left;
  margin-right: 8px;
  margin-top: 12px; }
#serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable {
  width: 85%;
  line-height: 16px;
  text-align: left;
  float: left;
  cursor: pointer;
  position: relative;
  clear: both;
  margin: 0 0 2px 16px;
  display: block; }
  #serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable.serverbrowser-selectable-small {
    width: 41px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    margin: 8px 34px 8px 0; }

/*#serverbrowser-filters .filtergameexpansionvenice .serverbrowser-filter.serverbrowser-filter-game {*/
/*min-height: 310px;*/
/*}*/
.serverbrowser-selectable {
  font-size: 13px;
  font-weight: normal;
  text-shadow: #fff 0 1px 1px;
  -webkit-user-select: none;
  -moz-user-select: -moz-none;
  user-select: none; }

#serverbrowser-filters.serverbrowser-filter-map .serverbrowser-filter-selectables .serverbrowser-selectable span {
  top: 1px;
  display: block;
  width: 120px; }
#serverbrowser-filters .serverbrowser-filter-selectables .serverbrowser-selectable.serverbrowser-exclude:hover span {
  color: #353535;
  font-weight: bold; }
#serverbrowser-filters .serverbrowser-filter-selectables .serverbrowser-selectable.serverbrowser-disabled span {
  color: #c7c7c7; }
#serverbrowser-filters.serverbrowser-filter-map .serverbrowser-filter-selectables .serverbrowser-selectable.serverbrowser-disabled img {
  opacity: 0.3;
  filter: alpha(opacity=30); }
#serverbrowser-filters .serverbrowser-filter-selectables .serverbrowser-selectable.serverbrowser-selectable-small span {
  margin-left: 0; }
#serverbrowser-filters .serverbrowser-filter-game.serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable {
  height: 51px; }
  #serverbrowser-filters .serverbrowser-filter-game.serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable.serverbrowser-selectable-game-bfbc2 .ticbox {
    top: 10px; }
  #serverbrowser-filters .serverbrowser-filter-game.serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable.serverbrowser-selectable-game-bfbc2nam .ticbox {
    top: 18px; }
#serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable .serverbrowser-selectable-background-icon {
  position: relative;
  z-index: 0;
  width: 150px;
  left: 20px; }
#serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable.serverbrowser-exclude .serverbrowser-selectable-background-icon {
  opacity: 0.7;
  filter: alpha(opacity=70); }
  #serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable.serverbrowser-exclude .serverbrowser-selectable-background-icon:hover {
    opacity: 1;
    filter: alpha(opacity=100); }
#serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable#serverbrowser-squaddeathmatch .serverbrowser-selectable-background-icon {
  top: 7px; }
#serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable#serverbrowser-squadrush .serverbrowser-selectable-background-icon, #serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable#serverbrowser-rush .serverbrowser-selectable-background-icon {
  top: 6px; }
#serverbrowser-filters .serverbrowser-filter .serverbrowser-filter-selectables .serverbrowser-selectable.serverbrowser-filter-gamemode-item {
  float: left;
  width: 184px;
  clear: none; }

.ticbox {
  width: 10px;
  height: 10px;
  background: url(../serverbrowserwarsaw/icon-checkbox-4.png) no-repeat;
  position: absolute;
  top: 6px;
  left: 0; }

.serverbrowser-exclude .ticbox {
  background-position: 0 -301px; }

.serverbrowser-exclude:hover .ticbox {
  background-position: 0 -400px; }

.serverbrowser-include .ticbox {
  background-position: 0 0; }

.serverbrowser-include:hover .ticbox {
  background-position: 0 -101px; }

.serverbrowser-noinclude .ticbox {
  background-position: 0 -800px; }

.serverbrowser-noinclude:hover .ticbox {
  background-position: 0 -800px; }

/*.serverbrowser-selectable-multi.serverbrowser-include:hover .ticbox {*/
/*background-position: -10px 0;*/
/*}*/
.serverbrowser-disabled .ticbox {
  opacity: 0.4;
  filter: alpha(opacity=40);
  background-position: 0 -40px; }
.serverbrowser-disabled:hover {
  background-position: 0 -40px;
  cursor: default !important; }

.serverbrowser-include.serverbrowser-selectable-small {
  width: 41px;
  height: 28px;
  background: url(../serverguide/bfbc2/selectable-small.png); }

.serverbrowser-exclude.serverbrowser-selectable-small {
  background: url(../serverguide/bfbc2/selectable-small.png) 0 56px; }

.serverbrowser-selectable-small:hover {
  background: url(../serverguide/bfbc2/selectable-small.png) 0 28px; }

.serverbrowser-ignore {
  border: 1px solid #666;
  background: #999; }

#serverbrowser-filters .serverbrowser-filter.serverbrowser-filter-map .serverbrowser-filter-selectables .serverbrowser-selectable img {
  float: left;
  width: 30px;
  height: 21px;
  margin: 2px 2px;
  margin-bottom: 0;
  margin-top: 0;
  margin-left: 18px;
  margin-right: -9px; }

#serverbrowser-apply-filters {
  text-align: right;
  margin-top: 16px; }

#serverbrowser-open-region-link, #serverbrowser-open-advanced-link {
  float: left;
  margin-left: 10px;
  font-weight: normal;
  top: 4px;
  position: relative; }

#serverbrowser-show-loading {
  display: none;
  width: 195px; }
  #serverbrowser-show-loading img {
    position: relative;
    left: 85px;
    top: 5px; }

#serverbrowser-noservers .box-content {
  text-align: center; }
  #serverbrowser-noservers .box-content p {
    background: transparent;
    font-size: 16px; }
  #serverbrowser-noservers .box-content h1 {
    font-weight: bold;
    font-size: 30px; }

.serverbrowser-list {
  width: 681px;
  margin-bottom: 16px;
  position: relative;
  float: left; }
  .serverbrowser-list .common-box-container {
    border-top: none; }

#serverbrowser-result {
  width: 679px;
  border-bottom-width: 0; }
  #serverbrowser-result #results-container {
    position: relative; }

#serverbrowser-apply-filters #serverbrowser-join-random span {
  margin-left: 10px; }

#serverbrowser-result p {
  background: #eeeeec;
  font-size: 14px;
  font-weight: normal;
  padding: 20px; }

#serverbrowser-no-result p {
  font-size: 14px;
  font-weight: normal;
  padding: 20px; }

.serverbrowser-join-ie7fix {
  margin-top: 0;
  padding-left: 5px; }

.serverbrowser-headercells {
  height: 28px;
  cursor: default;
  background: url(../common/box-title-gradient-with-lin.png) repeat-x 0 0;
  position: relative;
  top: 0;
  left: 0;
  width: 679px; }

.serverbrowser-bodycells {
  background: #fefefe;
  cursor: pointer;
  height: 40px;
  margin-top: 0;
  height: 47px;
  /*margin-top: -1px;*/
  line-height: 47px;
  position: relative;
  padding: 1px 0 0;
  border-top: 1px solid #ededed; }
  .serverbrowser-bodycells:hover {
    background-color: #f3f3f3; }
  .serverbrowser-bodycells .serverbrowser-cell-join input[type=submit] {
    visibility: hidden; }

.serverbrowser-server-friends-playing {
  background: #e7eef1;
  border-top-color: #dbe2e5; }

.serverbrowser-bodycells.active {
  /*background: url(../serverguide/row-active.png) no-repeat 100% 0;*/
  /*width: 691px;*/
  background: #353535;
  margin-top: 1px;
  z-index: 10;
  border-top: none; }
  .serverbrowser-bodycells.active:before {
    content: "";
    position: absolute;
    background: #353535;
    right: -1px;
    top: 2px;
    width: 1px;
    height: 44px;
    display: block; }
  .serverbrowser-bodycells.active:after {
    position: absolute;
    content: "";
    top: 0;
    left: 100%;
    border-left: 12px solid #353535;
    border-right: none;
    border-top: 26px solid transparent;
    border-bottom: 22px solid transparent; }

.serverbrowser-headercell {
  float: left;
  height: 30px;
  font-size: 11px;
  font-family: Arial, sans-serif;
  line-height: 30px;
  border: 0; }

.serverbrowser-bodycell {
  float: left;
  height: 30px;
  font-size: 11px;
  font-family: Arial, sans-serif;
  line-height: 30px;
  border: 0;
  float: left;
  height: 47px;
  font-size: 11px;
  font-family: Arial, sans-serif;
  overflow: hidden;
  border: 0;
  border-right: 1px solid #f2f2f2;
  padding-right: 1px; }

.serverbrowser-server-friends-playing .serverbrowser-bodycell {
  border-right-color: #e0e7e9; }

.serverbrowser-bodycells:hover .serverbrowser-bodycell {
  border-right-color: #e8e8e8; }
.serverbrowser-bodycells.active .serverbrowser-bodycell {
  border-right: 1px solid #2c2c2c;
  height: 47px; }

.serverbrowser-bodycell.serverbrowser-cell-noborder {
  padding-right: 0; }

.serverbrowser-bodycell .serverbrowser-bodycell-border {
  width: 1px;
  height: 38px;
  position: relative;
  float: right;
  background-color: #f2f2f2;
  margin-top: 1px; }

.serverbrowser-bodycells.active .serverbrowser-bodycell .serverbrowser-bodycell-border {
  background-color: #2c2c2c; }
.serverbrowser-bodycells.active .serverbrowser-bodycell a {
  font-weight: bold; }
.serverbrowser-bodycells .serverbrowser-bodycell.serverbrowser-cell-noborder {
  border: 0; }

.serverbrowser-headercell {
  font-weight: normal;
  text-shadow: none;
  position: relative;
  font-size: 11px; }

.serverbrowser-sort-down, .serverbrowser-sort-up {
  background: url(../common/box-title-gradient-active.png) repeat-x 0 0; }

.serverbrowser-headersep {
  float: left;
  width: 1px;
  margin-left: 0;
  height: 28px;
  background-color: #d7d7d7; }

.serverbrowser-bodycell {
  color: #8a8a8a;
  font-weight: normal;
  line-height: 47px;
  font-size: 11px;
  margin-top: 0; }

.serverbrowser-cell-expansion {
  width: 39px;
  position: relative; }
  .serverbrowser-cell-expansion > .premium {
    position: absolute;
    height: 43px;
    background-color: #FFC17F;
    width: 3px;
    left: 2px;
    top: 2px; }

.serverbrowser-bodycells.active .serverbrowser-cell-expansion > .premium {
  background-color: #CC700D; }

.serverbrowser-headercell.serverbrowser-cell-expansion {
  width: 40px; }

.serverbrowser-cell-official {
  width: 32px;
  display: none; }

.serverbrowser-cell-fav {
  width: 32px; }

.serverbrowser-cell-friendfavs, .serverbrowser-cell-friend {
  width: 32px;
  text-align: center;
  font-size: 12px;
  color: #353535;
  font-weight: bold; }

.serverbrowser-cell-name {
  width: 418px;
  line-height: normal; }

.special-column .serverbrowser-cell-name {
  width: 151px; }

.serverbrowser-cell-players {
  width: 65px;
  font-size: 11px; }

.serverbrowser-cell-free {
  width: 54px; }

.serverbrowser-cell-map {
  width: 136px;
  position: relative; }

.serverbrowser-cell-mode {
  width: 77px; }

.serverbrowser-cell-type-wrapper {
  width: 22px; }
  .serverbrowser-cell-type-wrapper .serverbrowser-cell-type {
    height: 26px;
    margin-top: 4px; }

.serverbrowser-cell-pb-wrapper {
  width: 23px;
  border-right: none; }
  .serverbrowser-cell-pb-wrapper .serverbrowser-cell-pb {
    height: 26px;
    margin-top: 4px; }

.serverbrowser-cell-lock {
  width: 34px; }

.serverbrowser-cell-ranked-wrapper {
  width: 23px;
  border-right: none; }
  .serverbrowser-cell-ranked-wrapper .serverbrowser-cell-ranked {
    height: 26px;
    margin-top: 4px; }

.serverbrowser-cell-ping {
  width: 62px; }

.serverbrowser-cell-join {
  width: 86px; }

.serverbrowser-cell-expand {
  width: 12px; }

.serverbrowser-cellend {
  clear: both; }

.serverbrowser-favorite-off, .serverbrowser-favorite-on, .serverbrowser-favorite-header, .serverbrowser-friends-off, .serverbrowser-friends-on, .serverbrowser-friends-header, .serverbrowser-friendfavs-header, .serverbrowser-password-off, .serverbrowser-password-on, .serverbrowser-password-header, .serverbrowser-punkbuster-on, .serverbrowser-punkbuster-off, .serverbrowser-ranked-on, .serverbrowser-ranked-off, .serverbrowser-expansion-header, .serverbrowser-official-on, .serverbrowser-official-off, .serverbrowser-official-header {
  background-repeat: no-repeat; }

.serverbrowser-friendfavs-header, .serverbrowser-friends-header {
  background-image: url(../serverguide/icons_server.png);
  background-position: 11px -44px;
  width: 33px; }

.serverbrowser-friendfavs-header {
  background-position: -99px -43px; }

.serverbrowser-sort-up.serverbrowser-friends-header, .serverbrowser-sort-down.serverbrowser-friends-header {
  background-position: 11px -5px; }

.serverbrowser-sort-up.serverbrowser-friendfavs-header, .serverbrowser-sort-down.serverbrowser-friendfavs-header {
  background-position: -79px -4px; }

.serverbrowser-sort-up.serverbrowser-ranked-header, .serverbrowser-sort-down.serverbrowser-ranked-header {
  background-position: -67px -3px; }

.serverbrowser-sort-up.serverbrowser-pb-header, .serverbrowser-sort-down.serverbrowser-pb-header {
  background-position: -138px -3px; }

.serverbrowser-sort-up.serverbrowser-type-header, .serverbrowser-sort-down.serverbrowser-type-header {
  background-position: -212px -4px; }

.serverbrowser-cell-type, .serverbrowser-ranked-on, .serverbrowser-punkbuster-on, .serverbrowser-ranked-off, .serverbrowser-punkbuster-off {
  background-image: url(../serverguide/icons_server.png); }

.serverbrowser-punkbuster-on {
  background-position: -138px 0; }

.serverbrowser-bodycells.active .serverbrowser-punkbuster-on {
  background-position: -137px -116px; }

.serverbrowser-punkbuster-off {
  background-position: -138px -78px; }

.serverbrowser-bodycells.active .serverbrowser-punkbuster-off {
  background-position: -137px -156px; }

.serverbrowser-ranked-on {
  background-position: -64px 0; }

.serverbrowser-bodycells.active .serverbrowser-ranked-on {
  background-position: -62px -116px; }

.serverbrowser-ranked-off {
  background-position: -62px -78px; }

.serverbrowser-bodycells.active .serverbrowser-ranked-off {
  background-position: -62px -156px; }

.serverbrowser-type-hardcore {
  background-position: -211px 0; }

.serverbrowser-bodycells.active .serverbrowser-type-hardcore {
  background-position: -211px -116px; }

.serverbrowser-type-normal, .serverbrowser-type-custom {
  background-position: -211px -78px; }

.serverbrowser-bodycells.active .serverbrowser-type-normal {
  background-position: -211px -156px; }
.serverbrowser-bodycells.active .serverbrowser-type-infantry {
  background-position: 0 -116px; }
.serverbrowser-bodycells.active .serverbrowser-type-custom {
  background-position: -211px -156px; }

.serverbrowser-cell-expansion-normal {
  display: block; }

.serverbrowser-cell-expansion-hover {
  display: none; }

.serverbrowser-bodycells:hover .serverbrowser-cell-expansion-normal {
  display: none; }
.serverbrowser-bodycells:hover .serverbrowser-cell-expansion-hover {
  display: block; }

.serverbrowser-cell-expansion-button-play {
  background: url(../comcenter/icons-interact.png) repeat scroll -23px 0 transparent;
  height: 24px;
  width: 23px;
  float: left;
  margin-top: 11px;
  margin-left: 7px;
  cursor: pointer;
  border: none; }
  .serverbrowser-cell-expansion-button-play:hover {
    background-position: -46px 0; }
  .serverbrowser-cell-expansion-button-play:active {
    background-position: -69px 0; }

.serverbrowser-bodycells.active .serverbrowser-cell-expansion-button-play {
  background-position: -161px 0; }
  .serverbrowser-bodycells.active .serverbrowser-cell-expansion-button-play:hover {
    background-position: -184px 0; }
  .serverbrowser-bodycells.active .serverbrowser-cell-expansion-button-play.active, .serverbrowser-bodycells.active .serverbrowser-cell-expansion-button-play:active {
    background-position: -207px 0; }

.serverbrowser-cell-expansion-button-play.base-button-general-dropdown:hover {
  background-position: -92px 0; }
.serverbrowser-cell-expansion-button-play.base-button-general-dropdown.active, .serverbrowser-cell-expansion-button-play.base-button-general-dropdown:active {
  background-position: -115px 0; }

.serverbrowser-bodycells.active .serverbrowser-cell-expansion-button-play.base-button-general-dropdown:hover {
  background-position: -230px 0; }
.serverbrowser-bodycells.active .serverbrowser-cell-expansion-button-play.base-button-general-dropdown.active, .serverbrowser-bodycells.active .serverbrowser-cell-expansion-button-play.base-button-general-dropdown:active {
  background-position: -253px 0; }
.serverbrowser-bodycells .serverbrowser-cell-expansion-hover .base-general-dropdown-area {
  width: 130px;
  top: 35px;
  left: 5px;
  border: 1px solid #A6A6A6; }
  .serverbrowser-bodycells .serverbrowser-cell-expansion-hover .base-general-dropdown-area a {
    color: #353535 !important; }
  .serverbrowser-bodycells .serverbrowser-cell-expansion-hover .base-general-dropdown-area li:hover a {
    color: #FFC500 !important; }
.serverbrowser-bodycells.active .serverbrowser-cell-expansion-hover .base-general-dropdown-area span {
  display: block; }

.serverbrowser-sort-arrow {
  position: relative;
  height: 4px;
  left: 0;
  width: 7px;
  top: 0;
  visibility: hidden;
  margin: 0 auto;
  z-index: 10; }

.serverbrowser-sort-down .serverbrowser-sort-arrow {
  visibility: visible;
  background: url(../serverguide/serverbrowser-sort.gif) no-repeat scroll center bottom;
  top: -6px; }

.serverbrowser-sort-up .serverbrowser-sort-arrow {
  visibility: visible;
  top: -28px;
  background: url(../serverguide/serverbrowser-sort.gif) no-repeat; }

.serverbrowser-cell-name span, .serverbrowser-cell-map span, .serverbrowser-cell-type span, .serverbrowser-cell-mode span {
  padding-left: 10px;
  padding-top: 8px;
  float: left; }

.serverbrowser-cell-name .serverbrowser-hasPassword {
  width: 8px;
  height: 12px;
  float: left;
  margin-left: 2px;
  margin-right: 1px;
  margin-top: 7px;
  background-image: url(../serverguide/icons_server.png);
  background-position: -288px -13px; }

.serverbrowser-bodycells.active .serverbrowser-cell-name .serverbrowser-hasPassword {
  margin-top: 8px;
  background-position: -288px -131px; }

.serverbrowser-cell-mode span {
  text-transform: capitalize; }

.serverbrowser-bodycells .serverbrowser-cell-map span {
  padding-left: 49px; }

.serverbrowser-cell-map img {
  position: absolute;
  top: 8px;
  left: 10px; }

.serverbrowser-cell-players, .serverbrowser-cell-free, .serverbrowser-cell-pb, .serverbrowser-cell-ranked, .serverbrowser-cell-ping {
  text-align: center; }

.serverbrowser-bodycell.serverbrowser-cell-players {
  font-size: 12px; }

.serverbrowser-cell-players, .serverbrowser-cell-ping {
  text-align: left;
  padding-left: 10px; }

.serverbrowser-headercell.serverbrowser-cell-players, .serverbrowser-headercell.serverbrowser-cell-ping {
  color: #2f8dbf; }

.serverbrowser-punkbuster, .serverbrowser-ranked, .serverbrowser-slots {
  margin-top: 6px;
  float: left;
  margin-right: 32px; }

.serverbrowser-cell-name-server-ping-lines-wrapper {
  width: 12px;
  height: 8px;
  float: left;
  margin: 20px 6px 0 0; }

.serverbrowser-cell-name-server-ping-line {
  width: 2px;
  float: left;
  margin-right: 1px;
  background-color: #ededed; }

.serverbrowser-bodycells:hover .serverbrowser-cell-name-server-ping-line {
  background-color: #e5e5e5; }
.serverbrowser-bodycells.active .serverbrowser-cell-name-server-ping-line {
  background-color: #606060; }

.serverbrowser-cell-name-server-ping-line.worst {
  height: 2px;
  margin-top: 6px; }
.serverbrowser-cell-name-server-ping-line.bad {
  height: 4px;
  margin-top: 4px; }
.serverbrowser-cell-name-server-ping-line.good {
  height: 6px;
  margin-top: 2px; }
.serverbrowser-cell-name-server-ping-line.best {
  height: 8px; }

.serverbrowser-cell-name-server-ping-lines-wrapper.ping-worst .serverbrowser-cell-name-server-ping-line.worst {
  background-color: #ff0000; }
.serverbrowser-cell-name-server-ping-lines-wrapper.ping-bad .serverbrowser-cell-name-server-ping-line.worst, .serverbrowser-cell-name-server-ping-lines-wrapper.ping-bad .serverbrowser-cell-name-server-ping-line.bad {
  background-color: #ffaa07; }
.serverbrowser-cell-name-server-ping-lines-wrapper.ping-good .serverbrowser-cell-name-server-ping-line.worst, .serverbrowser-cell-name-server-ping-lines-wrapper.ping-good .serverbrowser-cell-name-server-ping-line.bad, .serverbrowser-cell-name-server-ping-lines-wrapper.ping-good .serverbrowser-cell-name-server-ping-line.good {
  background-color: #99b839; }
.serverbrowser-cell-name-server-ping-lines-wrapper.ping-best .serverbrowser-cell-name-server-ping-line.worst, .serverbrowser-cell-name-server-ping-lines-wrapper.ping-best .serverbrowser-cell-name-server-ping-line.bad, .serverbrowser-cell-name-server-ping-lines-wrapper.ping-best .serverbrowser-cell-name-server-ping-line.good, .serverbrowser-cell-name-server-ping-lines-wrapper.ping-best .serverbrowser-cell-name-server-ping-line.best {
  background-color: #39b54a; }

.serverbrowser-cell-name-server-map-image {
  float: left;
  margin-top: 6px;
  margin-right: 8px; }

.serverbrowser-cell-name-server-wrapper {
  float: left;
  width: 358px;
  overflow: hidden;
  position: relative; }

.serverbrowser-cell-name-server-name {
  font-weight: bold;
  padding: 7px 0 3px 2px;
  display: block;
  overflow: hidden;
  height: 15px;
  max-width: 345px;
  white-space: nowrap;
  float: left;
  text-overflow: ellipsis;
  color: #353535; }

body .serverbrowser-cell-name-server-name:hover {
  text-decoration: none; }

.serverbrowser-cell-name-server-info {
  color: #c5c5c5;
  font-size: 11px;
  font-weight: normal;
  padding: 1px 0 0 2px; }
  .serverbrowser-cell-name-server-info span {
    color: #8a8a8a;
    padding: 0 2px;
    float: none;
    position: relative;
    top: -1px; }

.serverbrowser-bodycells.active .serverbrowser-cell-name-server-info {
  color: #8a8a8a; }
  .serverbrowser-bodycells.active .serverbrowser-cell-name-server-info span {
    color: #c5c5c5; }

.serverbrowser-name-header-sorting-extra {
  font-weight: normal;
  font-size: 11px;
  color: #8a8a8a;
  float: right;
  padding: 8px 10px 0 0; }
  .serverbrowser-name-header-sorting-extra a {
    font-weight: normal;
    font-size: 11px; }
    .serverbrowser-name-header-sorting-extra a.serverbrowser-sort-up, .serverbrowser-name-header-sorting-extra a.serverbrowser-sort-down {
      color: #000;
      background: none; }
    .serverbrowser-name-header-sorting-extra a.serverbrowser-sort-up:hover, .serverbrowser-name-header-sorting-extra a.serverbrowser-sort-down:hover {
      cursor: default;
      text-decoration: none; }

.serverbrowser-list[data-sorting=map] .serverbrowser-cell-name-server-info-map, .serverbrowser-list[data-sorting=friend] .serverbrowser-cell-name-server-info-friend, .serverbrowser-list[data-sorting=mode] .serverbrowser-cell-name-server-info-mode {
  font-weight: bold;
  colohideFooterr: #353535; }

#serverbrowser-show-column .serverbrowser-offline-info {
  min-height: 400px; }
#serverbrowser-show-column .common-secondary-column-line, #serverbrowser-show-column .common-secondary-simple-column-line {
  width: 295px;
  margin: 6px 0; }
#serverbrowser-show-column .common-gameicon {
  position: relative;
  float: left;
  top: 17px;
  margin-right: 5px; }
#serverbrowser-show-column h1 {
  padding-top: 16px;
  word-wrap: break-word;
  float: left;
  width: 264px; }
#serverbrowser-show-column hr {
  color: #dfdfdf;
  background-color: #dfdfdf;
  border-width: 0;
  float: left;
  height: 1px;
  width: 295px;
  margin: 10px 0; }

#serverbrowser-region-serverfilter-popup {
  float: left;
  width: 214px;
  margin-left: 16px; }

#serverbrowser-country-serverfilter-popup {
  float: left;
  width: 420px; }

#serverbrowser-region-serverfilter-popup h1, #serverbrowser-country-serverfilter-popup h1 {
  font-weight: bold;
  color: #8a8a8a;
  text-shadow: none;
  float: left;
  font-size: 11px;
  margin: 12px 0 0;
  text-align: left;
  font-family: Tahoma, Arial, sans-serif;
  width: 100%;
  clear: both;
  position: relative;
  text-transform: uppercase;
  line-height: 11px; }

.serverbrowser-region-countries {
  display: none; }

.serverbrowser-region-filter-show {
  position: relative;
  clear: both;
  width: 100%;
  font-size: 14px;
  font-weight: normal;
  color: #fff;
  line-height: 25px;
  cursor: pointer; }
  .serverbrowser-region-filter-show span.label:hover {
    text-decoration: underline; }
  .serverbrowser-region-filter-show.showing {
    font-weight: bold;
    cursor: default; }
    .serverbrowser-region-filter-show.showing:hover {
      text-decoration: none; }

.region-server-filter div h1 {
  padding-bottom: 16px; }

.serverbrowser-regionfilter-selectable {
  position: relative;
  clear: both;
  width: 100%;
  line-height: 1.7;
  height: 20px;
  font-size: 12px; }
  .serverbrowser-regionfilter-selectable:hover {
    font-weight: bold; }

.serverbrowser-regionfilter-selectable, #popup-serveradvancedfilter-settings-gamesettings .serverguide-advancedfilter-selectable {
  text-indent: 16px; }

.serverbrowser-regionfilter-selectable .ticbox:hover, .serverbrowser-regionfilter-selectable span:hover, #popup-serveradvancedfilter-settings-gamesettings .serverguide-advancedfilter-selectable .ticbox:hover, #popup-serveradvancedfilter-settings-gamesettings .serverguide-advancedfilter-selectable span:hover {
  cursor: pointer;
  font-weight: bold; }

.serverbrowser-regionfilter-selectable.even-column, .serverbrowser-regionfilter-selectable.odd-column {
  float: left;
  clear: none;
  width: 200px; }

.region-server-filter {
  width: 682px; }

.region-server-filter h1, .advanced-server-filter h1 {
  font-weight: bold;
  color: #8a8a8a;
  text-shadow: none;
  float: left;
  font-size: 11px;
  margin-right: 0;
  margin-top: 12px;
  text-align: left;
  font-family: Tahoma, Arial, sans-serif;
  width: 100%;
  clear: both;
  position: relative;
  text-transform: uppercase; }

#serverbrowser-filters .serverguide-filter #serverbrowser-region-settings-checkbox {
  width: auto;
  float: left; }

.serverbrowser-show-join-button-wrapper {
  position: absolute;
  top: 0;
  right: 0; }

.serverbrowser-regionfilter-selectable-selectall {
  position: relative;
  clear: both;
  width: 100%;
  line-height: 24px;
  padding-bottom: 6px;
  text-indent: 16px; }
  .serverbrowser-regionfilter-selectable-selectall:hover {
    font-weight: bold;
    cursor: pointer; }

.serverbrowser-regionfilter-selectable {
  position: relative;
  clear: both;
  width: 100%;
  line-height: 1.7;
  height: 20px;
  font-size: 12px; }

.serverbrowser-regionfilter-selectable:hover {
  font-weight: bold; }

.play-now-menu > ul {
  width: 100%;
  margin-top: 1px; }
  .play-now-menu > ul > li {
    width: 100%;
    padding: 0;
    margin-bottom: 1px;
    text-overflow: ellipsis;
    overflow: hidden;
    position: relative; }
    .play-now-menu > ul > li.active > a, .play-now-menu > ul > li.active > a:active {
      color: black;
      background-color: white;
      background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
      background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
      box-shadow: 0 0 7px 0 #e0f4f8;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600; }
    .play-now-menu > ul > li.premium {
      background: -webkit-radial-gradient(center,  ellipse cover, rgba(255, 239, 123, 0.45) 0%, rgba(255, 184, 0, 0.25) 10%, transparent 70%) center -24px no-repeat;
      background: radial-gradient( ellipse  at center, rgba(255, 239, 123, 0.45) 0%, rgba(255, 184, 0, 0.25) 10%, transparent 70%) center -24px no-repeat; }
    .play-now-menu > ul > li .icon-premium-p {
      position: absolute;
      right: 6px;
      bottom: 6px; }
    .play-now-menu > ul > li > div {
      position: absolute;
      left: 8px;
      top: 8px;
      width: 57px;
      height: 32px;
      background: #182937; }
    .play-now-menu > ul > li:not(.active) > a:hover {
      background-color: rgba(7, 7, 7, 0.6); }
    .play-now-menu > ul > li > a {
      display: block;
      padding: 8px 0px 8px 80px;
      line-height: 31px;
      font-size: 16px;
      text-transform: uppercase;
      text-decoration: none;
      cursor: pointer;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400;
      background-color: rgba(7, 7, 7, 0.5);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      max-width: auto; }

.playnow-tab-content {
  position: relative;
  min-height: 432px; }
  .playnow-tab-content .ranked-only {
    position: absolute;
    right: 16px;
    top: 62px;
    font-size: 14px; }
  .playnow-tab-content div.game-mode-image {
    margin: 0px -16px 0 -16px;
    overflow: hidden;
    position: relative;
    text-align: center;
    min-height: 164px; }
    .playnow-tab-content div.game-mode-image .image {
      width: 663px;
      height: 164px;
      opacity: 1;
      -webkit-filter: blur(0px);
      background-position: -329px center;
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      transition: all 0.5s ease; }
      .playnow-tab-content div.game-mode-image .image.show-on-load {
        -webkit-filter: blur(10px);
        opacity: 0; }
    .playnow-tab-content div.game-mode-image .play-button {
      width: 90px;
      height: 90px;
      position: absolute;
      left: 287px;
      z-index: 1;
      top: 37px;
      cursor: pointer;
      background-image: url(../serverbrowserwarsaw/playbutton-circle.png);
      opacity: 0.5;
      background-repeat: no-repeat; }
      .playnow-tab-content div.game-mode-image .play-button:hover {
        opacity: 0.75; }
  .playnow-tab-content p.objective-text {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400;
    padding-right: 200px;
    text-transform: uppercase;
    line-height: 22px;
    margin-bottom: 16px;
    height: 88px;
    overflow: hidden;
    text-overflow: ellipsis; }
  .playnow-tab-content .game-mode-objectives {
    float: left;
    width: 450px;
    margin-top: 16px; }
    .playnow-tab-content .game-mode-objectives p {
      color: #a8a8a8;
      font-size: 12px;
      line-height: 22px; }
    .playnow-tab-content .game-mode-objectives ul.objectives {
      list-style-type: disc;
      list-style-position: inside;
      margin-bottom: 16px; }
      .playnow-tab-content .game-mode-objectives ul.objectives > li {
        color: #a8a8a8;
        font-size: 14px;
        padding: 4px;
        margin-left: 16px;
        list-style-position: outside; }
    .playnow-tab-content .game-mode-objectives ul.maps > li {
      float: left;
      margin-right: 6px;
      width: 62px;
      height: 42px; }
    .playnow-tab-content .game-mode-objectives h5 {
      font-size: 14px;
      line-height: 22px;
      margin-bottom: 0px; }
  .playnow-tab-content button {
    position: absolute;
    top: 16px;
    right: 16px; }
  .playnow-tab-content .game-mode-legends {
    float: right;
    width: 150px;
    margin-top: 16px; }
    .playnow-tab-content .game-mode-legends ul > li {
      color: #fff;
      font-size: 12px;
      text-transform: uppercase;
      margin-bottom: 4px; }
      .playnow-tab-content .game-mode-legends ul > li#legend-squad {
        color: #9EC555; }
      .playnow-tab-content .game-mode-legends ul > li#legend-friendly, .playnow-tab-content .game-mode-legends ul > li#legend-friendly-base {
        color: #65BBEE; }
      .playnow-tab-content .game-mode-legends ul > li#legend-enemy, .playnow-tab-content .game-mode-legends ul > li#legend-enemy-base {
        color: #D6757D; }
      .playnow-tab-content .game-mode-legends ul > li span {
        padding-left: 6px; }

.legend-icon {
  background: url(../serverbrowserwarsaw/icons-gameexplain.png) no-repeat;
  width: 25px;
  height: 25px;
  display: inline-block;
  vertical-align: middle; }
  .legend-icon.neutral {
    background-position: 0 0px;
    opacity: 1; }
  .legend-icon.friendly-base {
    background-position: 0 -25px;
    opacity: 1; }
  .legend-icon.enemy-base {
    background-position: 0 -50px;
    opacity: 1; }
  .legend-icon.squad {
    background-position: 0 -75px;
    opacity: 1; }
  .legend-icon.friendly {
    background-position: 0 -100px;
    opacity: 1; }
  .legend-icon.enemy {
    background-position: 0 -125px;
    opacity: 1; }

#server-page header .server-buttons + .server-title {
  width: 850px; }
#server-page header .server-buttons.can-favorite + .server-title {
  width: 760px; }
#server-page header .server-buttons {
  padding-top: 6px; }
  #server-page header .server-buttons .btn {
    padding-left: 8px;
    padding-right: 10px; }
    #server-page header .server-buttons .btn.refresh {
      padding-left: 8px;
      padding-right: 8px;
      line-height: 32px; }
    #server-page header .server-buttons .btn .star {
      display: inline-block;
      vertical-align: top;
      padding-right: 5px; }
      #server-page header .server-buttons .btn .star:after {
        position: relative;
        z-index: 1;
        content: "★";
        font-size: 22px;
        color: rgba(255, 255, 255, 0.3); }
    #server-page header .server-buttons .btn.starred .star:after {
      color: #FFF; }

#live-header {
  margin-bottom: 4px; }
  #live-header header {
    padding: 0 5px 0 8px; }
    #live-header header .switch-container {
      margin-top: 5px; }
    #live-header header p {
      margin: -2px 8px 0 0;
      line-height: 17px;
      font-size: 13px; }
  #live-header .box-content {
    padding: 8px 16px;
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400; }

#selected-server-scoreboard .box {
  position: relative; }
#selected-server-scoreboard .box-content {
  min-height: 32px; }
#selected-server-scoreboard .error {
  font-size: 12px;
  line-height: 14px;
  color: #a8a8a8; }
#selected-server-scoreboard .team {
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 400;
  color: #ff9f80; }
  #selected-server-scoreboard .team:first-child {
    color: #94cdf3; }
  #selected-server-scoreboard .team.pull-right {
    text-align: right; }
  #selected-server-scoreboard .team .team-score {
    margin-top: 4px;
    font-size: 20px;
    line-height: 24px;
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600; }
#selected-server-scoreboard .progress-bar {
  width: 60px;
  margin: 1px 8px; }
  #selected-server-scoreboard .progress-bar.home {
    background-color: rgba(151, 215, 246, 0.4); }
  #selected-server-scoreboard .progress-bar.away {
    background-color: rgba(233, 167, 137, 0.4); }
#selected-server-scoreboard .round-time {
  position: absolute;
  text-align: center;
  font-size: 12px;
  line-height: 20px;
  color: #a8a8a8;
  bottom: 16px;
  left: 0;
  width: 100%; }
#selected-server-scoreboard .targets {
  font-size: 12px;
  line-height: 12px;
  margin-bottom: 4px; }
  #selected-server-scoreboard .targets .target {
    display: inline-block;
    border: 1px solid;
    text-align: center;
    padding: 1px;
    width: 12px;
    height: 12px; }
    #selected-server-scoreboard .targets .target.destroyed {
      opacity: 0.3; }
#selected-server-scoreboard .lspace {
  letter-spacing: 0.13em;
  margin-right: -0.13em; }
#selected-server-scoreboard .gamemode-8 .team {
  margin-bottom: 2px; }
#selected-server-scoreboard .gamemode-8 .team-name {
  width: 56px;
  padding-right: 8px;
  text-align: right; }
#selected-server-scoreboard .gamemode-8 .team-score {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  margin: 0;
  width: 36px; }
#selected-server-scoreboard .gamemode-8 .progress-bar {
  width: 96px;
  margin-right: 0; }
#selected-server-scoreboard .gamemode-8 .round-time {
  position: inherit;
  line-height: 12px;
  margin-top: 8px; }
#selected-server-scoreboard .gamemode-32 .round-time {
  bottom: 34px; }
#selected-server-scoreboard .gamemode-268435456 .round-time {
  bottom: 34px; }
#selected-server-scoreboard .gamemode-8589934592 .round-time {
  bottom: 34px; }
#selected-server-scoreboard .gamemode-33554432 .round-time {
  top: 19px;
  bottom: auto; }
#selected-server-scoreboard .gamemode-33554432 .team-score {
  margin-top: 0;
  margin-bottom: 8px;
  line-height: 20px; }
#selected-server-scoreboard .gamemode-33554432 .objectives {
  margin-top: 8px;
  color: #fff;
  font-size: 18px;
  font-weight: 600; }
#selected-server-scoreboard .gamemode-2 .team-score {
  color: #94cdf3; }
  #selected-server-scoreboard .gamemode-2 .team-score:first-child {
    margin-right: 16px; }
  #selected-server-scoreboard .gamemode-2 .team-score:last-child {
    color: #ff9f80; }
#selected-server-scoreboard .gamemode-2 .progress-bar {
  width: 112px; }
#selected-server-scoreboard .gamemode-2 .team-name {
  margin-top: 8px;
  color: #94cdf3;
  text-transform: uppercase; }
#selected-server-scoreboard .gamemode-2 .round-time {
  text-align: right;
  right: 16px;
  bottom: 12px;
  width: auto; }
#selected-server-scoreboard .gamemode-2147483648 .team-score {
  color: #94cdf3; }
  #selected-server-scoreboard .gamemode-2147483648 .team-score:first-child {
    margin-right: 16px; }
  #selected-server-scoreboard .gamemode-2147483648 .team-score:last-child {
    color: #ff9f80; }
#selected-server-scoreboard .gamemode-2147483648 .progress-bar {
  width: 112px; }
#selected-server-scoreboard .gamemode-2147483648 .team-name {
  margin-top: 8px;
  color: #94cdf3;
  text-transform: uppercase; }
#selected-server-scoreboard .gamemode-2147483648 .round-time {
  text-align: right;
  right: 16px;
  bottom: 12px;
  width: auto; }
#selected-server-scoreboard .gamemode-17179869184 .team-score {
  color: #94cdf3; }
  #selected-server-scoreboard .gamemode-17179869184 .team-score:first-child {
    margin-right: 16px; }
  #selected-server-scoreboard .gamemode-17179869184 .team-score:last-child {
    color: #ff9f80; }
#selected-server-scoreboard .gamemode-17179869184 .progress-bar {
  width: 112px; }
#selected-server-scoreboard .gamemode-17179869184 .team-name {
  margin-top: 8px;
  color: #94cdf3;
  text-transform: uppercase; }
#selected-server-scoreboard .gamemode-17179869184 .round-time {
  text-align: right;
  right: 16px;
  bottom: 12px;
  width: auto; }
#selected-server-scoreboard .gamemode-34359738368 .pull-left {
  text-align: left; }
  #selected-server-scoreboard .gamemode-34359738368 .pull-left .link-icon {
    background: url(../serverguide/chainlink-blue.png) top left no-repeat; }
#selected-server-scoreboard .gamemode-34359738368 .pull-right {
  text-align: right; }
  #selected-server-scoreboard .gamemode-34359738368 .pull-right .link-icon {
    background: url(../serverguide/chainlink-orange.png) top left no-repeat; }
#selected-server-scoreboard .gamemode-34359738368 .round-time {
  line-height: 70px;
  font-weight: bold;
  font-size: 14px; }
#selected-server-scoreboard .gamemode-512 {
  text-align: center; }
  #selected-server-scoreboard .gamemode-512 h2 {
    font-size: 18px;
    line-height: 18px;
    margin: 0; }
  #selected-server-scoreboard .gamemode-512 h1 {
    font-size: 30px;
    margin-bottom: 18px; }
  #selected-server-scoreboard .gamemode-512 h1, #selected-server-scoreboard .gamemode-512 h2 {
    font-weight: 400; }

#server-page-map-rotation .round-status {
  position: absolute;
  top: 8px;
  right: 8px;
  font-size: 12px;
  color: #FFF; }

/* Overview */
#overview-info {
  margin-bottom: 16px;
  /* Temp fix for the none working no-padding class.. */ }
  #overview-info .edit-link {
    opacity: 0;
    display: inline-block;
    padding: 0 16px;
    background: rgba(7, 7, 7, 0.5);
    line-height: 30px;
    font-size: 11px;
    position: absolute;
    -webkit-transition: opacity 0.1s ease-out;
    -moz-transition: opacity 0.1s ease-out;
    transition: opacity 0.1s ease-out; }
    #overview-info .edit-link.force-visible {
      opacity: 1; }
  #overview-info .leaderboard-highlight {
    height: 55px;
    margin-bottom: 1px;
    overflow: hidden;
    text-transform: uppercase;
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600; }
    #overview-info .leaderboard-highlight .position, #overview-info .leaderboard-highlight .icon, #overview-info .leaderboard-highlight .description, #overview-info .leaderboard-highlight .item-info-icon {
      float: left;
      margin-top: 8px;
      margin-left: 8px;
      line-height: 40px;
      color: #fff; }
    #overview-info .leaderboard-highlight img {
      height: 40px; }
    #overview-info .leaderboard-highlight .position {
      font-size: 23px; }
    #overview-info .leaderboard-highlight .description {
      font-size: 19px; }
    #overview-info .leaderboard-highlight .item-info-icon {
      background: no-repeat transparent 0 0 url('../loadout/icon-info-s.png');
      width: 17px;
      height: 17px;
      cursor: pointer;
      opacity: 0.7;
      display: inline-block;
      margin-top: 19px; }
      #overview-info .leaderboard-highlight .item-info-icon:hover {
        opacity: 1; }
  #overview-info #replay-nodes-container, #overview-info .progress-bar-inner {
    -webkit-transform: translate3d(0, 0, 0); }
  #overview-info a:not(.edit-link):hover {
    text-decoration: none; }
  #overview-info .overview-info-box.small {
    margin-top: 1px; }
    #overview-info .overview-info-box.small .box-content {
      height: 180px; }
  #overview-info .progress-bar {
    height: 14px;
    overflow: hidden;
    padding-right: 1px; }
    #overview-info .progress-bar.thick .progress-bar-inner {
      height: 16px; }
    #overview-info .progress-bar .progress-bar-inner.warning {
      z-index: 100; }
    #overview-info .progress-bar .progress-bar-inner.success {
      z-index: 50; }
    #overview-info .progress-bar .progress-bar-inner + .progress-bar-inner {
      margin-left: 0; }
  #overview-info #overview-rank {
    position: relative;
    height: 231px; }
    #overview-info #overview-rank > .rank {
      position: absolute;
      left: 50%;
      top: 40px;
      margin-left: -64px;
      -webkit-transition: transform 0.5s ease 0.01s;
      -moz-transition: transform 0.5s ease 0.01s;
      transition: transform 0.5s ease 0.01s; }
      #overview-info #overview-rank > .rank.highlighted {
        -webkit-transform: scale(1.12);
        -moz-transform: scale(1.12);
        -ms-transform: scale(1.12);
        -o-transform: scale(1.12);
        transform: scale(1.12); }
    #overview-info #overview-rank .rank-progress {
      position: absolute;
      left: 16px;
      right: 16px;
      bottom: 20px; }
      #overview-info #overview-rank .rank-progress .progress-bar {
        position: relative; }
      #overview-info #overview-rank .rank-progress .progress-bar-info {
        font-size: 12px; }
        #overview-info #overview-rank .rank-progress .progress-bar-info p:first-child {
          float: left;
          color: #a8a8a8; }
        #overview-info #overview-rank .rank-progress .progress-bar-info p:last-child {
          float: right; }
  #overview-info .overview-service-stars .progress-bar {
    height: 20px; }
  #overview-info.replay-drag .progress-bar-inner {
    -webkit-transition: width 0.3s ease;
    -moz-transition: width 0.3s ease;
    transition: width 0.3s ease; }
  #overview-info #overview-skill .overview-info-box.small {
    margin-top: 1px; }
    #overview-info #overview-skill .overview-info-box.small .box-content {
      height: 188px; }
  #overview-info #overview-skill .box-content {
    height: 105px;
    text-align: center; }
    #overview-info #overview-skill .box-content p {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600;
      font-size: 58px;
      margin: 10px auto;
      -webkit-transition: 0.8s;
      -moz-transition: 0.8s;
      transition: 0.8s; }
      #overview-info #overview-skill .box-content p.animating {
        -webkit-transition: 0.1s;
        -moz-transition: 0.1s;
        transition: 0.1s; }
    #overview-info #overview-skill .box-content .overview-skill-bar {
      position: relative;
      width: 150px;
      height: 8px;
      margin: 0 auto;
      border: 1px solid #fff;
      background-color: rgba(0, 0, 0, 0.6); }
      #overview-info #overview-skill .box-content .overview-skill-bar > div {
        position: absolute;
        left: 0;
        width: 8px;
        height: 8px;
        background-color: #fff;
        -webkit-transition: left 0.8s ease;
        -moz-transition: left 0.8s ease;
        transition: left 0.8s ease; }
  #overview-info #overview-info-list li {
    float: left;
    width: 111px;
    height: 40px;
    background-color: rgba(7, 7, 7, 0.5);
    margin: 1px 1px 0 0;
    text-align: center; }
    #overview-info #overview-info-list li.last {
      margin-right: 0; }
    #overview-info #overview-info-list li span {
      display: block;
      margin: 4px auto 2px;
      color: #a8a8a8;
      font-size: 12px;
      text-transform: uppercase; }
    #overview-info #overview-info-list li strong {
      display: block;
      font-weight: bold;
      line-height: 20px;
      font-size: 14px; }
      #overview-info #overview-info-list li strong.focus {
        font-size: 14px;
        font-family: Purista, sans-serif;
        font-style: normal;
        font-weight: 600; }
    #overview-info #overview-info-list li:hover {
      background-color: rgba(7, 7, 7, 0.6); }
  #overview-info .overview-skillcontainer #overview-info-list li {
    width: 111px;
    height: 62px; }
    #overview-info .overview-skillcontainer #overview-info-list li span {
      display: block;
      margin: 12px auto 2px;
      color: #a8a8a8;
      font-size: 14px;
      text-transform: uppercase; }
    #overview-info .overview-skillcontainer #overview-info-list li strong {
      line-height: 30px;
      font-size: 14px; }
      #overview-info .overview-skillcontainer #overview-info-list li strong.focus {
        font-size: 23px;
        font-family: Purista, sans-serif;
        font-style: normal;
        font-weight: 600; }
  #overview-info #overview-teamplay .box-content {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 63px; }
    #overview-info #overview-teamplay .box-content.alpha {
      height: 116px; }
  #overview-info #overview-key-values .box-content {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 63px; }
    #overview-info #overview-key-values .box-content.alpha {
      height: 98px; }
  #overview-info #overview-rank .box-content:hover, #overview-info #overview-teamplay .box-content:hover, #overview-info #overview-dogtags .box-content:hover, #overview-info .overview-info-box .box-content:hover {
    background-color: rgba(7, 7, 7, 0.6); }
  #overview-info .overview-skillcontainer:hover #overview-info-list li, #overview-info .overview-skillcontainer:hover #overview-skill .box-content {
    background-color: rgba(7, 7, 7, 0.6); }
  #overview-info .profile-overview .clubs-list .name.pull-left {
    width: 288px; }
  #overview-info .profile-overview .clubs-list .emblem {
    width: 60px;
    float: left;
    margin-right: 16px; }
  #overview-info .profile-overview .clubs-list .club-info {
    float: left;
    margin-left: 5px;
    color: #d5dde5;
    font-size: 14px;
    font-family: Purista; }
    #overview-info .profile-overview .clubs-list .club-info .name {
      padding-top: 8px;
      font-size: 16px;
      width: 200px;
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap; }
  #overview-info .overview-soldier .soldierbox-reportbutton {
    float: right;
    margin-top: 8px;
    margin-right: 8px; }
  #overview-info .overview-soldier .soldier-emblem {
    height: 241px; }
  #overview-info #overview-soldier .box-content {
    height: 255px;
    position: relative; }
    #overview-info #overview-soldier .box-content .agent-info-on-portrait {
      position: absolute;
      z-index: 0;
      width: 100%;
      bottom: 22px;
      color: #fff;
      padding: 16px 0 5px 16px; }
      #overview-info #overview-soldier .box-content .agent-info-on-portrait .name {
        font-size: 24px;
        font-style: italic;
        font-weight: bold; }
      #overview-info #overview-soldier .box-content .agent-info-on-portrait .geolb-agent-info {
        padding: 0 16px;
        font-size: 20px;
        font-style: italic; }
        #overview-info #overview-soldier .box-content .agent-info-on-portrait .geolb-agent-info div {
          padding: 0 0 5px 0; }
    #overview-info #overview-soldier .box-content .soldier-emblem {
      position: absolute;
      top: 10px;
      left: 10px;
      z-index: 0;
      width: 200px;
      height: 200px; }
      #overview-info #overview-soldier .box-content .soldier-emblem .emblem-preview-link {
        display: block;
        height: 100%; }
      #overview-info #overview-soldier .box-content .soldier-emblem.click-area {
        z-index: 2; }
        #overview-info #overview-soldier .box-content .soldier-emblem.click-area .edit-link {
          top: -10px;
          left: -10px; }
        #overview-info #overview-soldier .box-content .soldier-emblem.click-area:hover .edit-link {
          opacity: 1; }
    #overview-info #overview-soldier .box-content .soldier-portrait {
      width: 287px;
      height: 241px;
      overflow: hidden;
      position: absolute;
      bottom: 0;
      right: 0; }
      #overview-info #overview-soldier .box-content .soldier-portrait .click-area {
        z-index: 1; }
        #overview-info #overview-soldier .box-content .soldier-portrait .click-area .edit-link {
          right: 0;
          bottom: 0; }
      #overview-info #overview-soldier .box-content .soldier-portrait:hover .edit-link {
        opacity: 1; }
    #overview-info #overview-soldier .box-content .profile-soldier-image {
      position: absolute;
      top: 0;
      right: -65px;
      width: 327px;
      height: 430px; }
  #overview-info .box > header + .box-content.no-padding {
    padding: 0; }

.overview-missions-empty {
  line-height: 36px;
  font-weight: bold;
  font-size: 20px;
  text-align: center; }

.overview-missions-top-opponent .inner-wrapper {
  position: relative;
  padding-left: 57px;
  height: 46px; }
.overview-missions-top-opponent .avatar {
  position: absolute;
  top: 0;
  left: 3px; }
.overview-missions-top-opponent .title {
  font-size: 14px;
  color: #a8a8a8;
  text-transform: uppercase; }
.overview-missions-top-opponent .name {
  font-weight: bold;
  font-size: 12px;
  padding-top: 6px; }

.overview-most-played-mission .inner-wrapper {
  padding-left: 58px;
  position: relative; }
.overview-most-played-mission .thumb {
  position: absolute;
  bottom: 0;
  left: 0; }
.overview-most-played-mission .title {
  font-size: 14px;
  color: #a8a8a8;
  text-transform: uppercase; }
.overview-most-played-mission .mission-name {
  width: 100%;
  overflow: hidden;
  text-transform: uppercase;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 16px;
  line-height: 1;
  padding-top: 6px;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }
.overview-most-played-mission p {
  padding-top: 2px;
  font-size: 16px;
  text-transform: uppercase;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 400; }

.overview-service-stars {
  margin: 6px 16px 0 12px; }
  .overview-service-stars li {
    height: 34px;
    position: relative; }
  .overview-service-stars .kit-icon {
    position: absolute;
    top: 1px; }
  .overview-service-stars .progress-bar {
    position: absolute;
    top: 5px;
    right: 0;
    width: 252px;
    margin: 0; }
  .overview-service-stars .star-count {
    position: absolute;
    top: 8px;
    left: 150px;
    z-index: 200;
    height: 18px;
    min-width: 18px;
    background: url(../profile/warsaw/stats/servicestars/servicestar-18x18.png) no-repeat; }
    .overview-service-stars .star-count span {
      padding-left: 25px;
      line-height: 18px; }
  .overview-service-stars.gamemodes {
    margin: 6px 0; }
    .overview-service-stars.gamemodes .star-count {
      left: 200px; }
    .overview-service-stars.gamemodes .gamemode {
      padding-top: 12px;
      font-size: 12px;
      color: #a8a8a8; }
    .overview-service-stars.gamemodes .progress-bar {
      width: 150px; }

#overview-dogtags img {
  width: 190px;
  height: 95px; }
#overview-dogtags .box-content {
  text-align: center;
  position: relative; }
  #overview-dogtags .box-content .edit-link {
    top: 0;
    left: 0; }
  #overview-dogtags .box-content:hover .edit-link {
    opacity: 1; }
#overview-dogtags .dogtags {
  margin-top: 45px; }

#overview-stats .box-content {
  padding: 20px 0;
  text-align: center;
  margin-bottom: 1px; }
  #overview-stats .box-content.double-row {
    padding: 12px 0; }
  #overview-stats .box-content p {
    font-size: 22px; }
  #overview-stats .box-content span {
    font-size: 12px; }

#play-style .playstyle-kits {
  float: right;
  padding: 3px 0px;
  margin-top: 1px; }
  #play-style .playstyle-kits .kit-icon {
    cursor: pointer;
    opacity: 0.5; }
    #play-style .playstyle-kits .kit-icon.active {
      opacity: 1; }
#play-style .box-content {
  position: relative;
  height: 231px; }
  #play-style .box-content .kit-icon {
    position: absolute;
    top: 8px;
    left: 12px; }
#play-style svg {
  position: relative;
  top: 8px; }

.radar-chart .level {
  stroke: grey;
  stroke-width: 0.5; }

.radar-chart .axis line {
  stroke: grey;
  stroke-width: 0.5; }

.radar-chart .axis .legend {
  font-family: Arial, sans-serif;
  font-size: 12px;
  fill: white; }

.radar-chart .axis .legend.top {
  dy: 1em; }

.radar-chart .axis .legend.left {
  text-anchor: end; }

.radar-chart .axis .legend.middle {
  alignment-baseline: after-edge;
  baseline-shift: 4px;
  text-anchor: middle; }

.radar-chart .axis .legend.right {
  text-anchor: start; }

.radar-chart .tooltip {
  font-family: sans-serif;
  font-size: 13px;
  transition: opacity 200ms;
  opacity: 0; }

.radar-chart .tooltip.visible {
  opacity: 1; }

/* area transition when hovering */
.radar-chart .area {
  stroke-width: 2;
  fill-opacity: 0.5; }

.radar-chart.focus .area {
  fill-opacity: 0.1; }

.radar-chart.focus .area.focused {
  fill-opacity: 0.7; }

.radar-chart .circle {
  fill-opacity: 0.9; }

/* transitions */
.radar-chart .area, .radar-chart .circle {
  transition: opacity 300ms, fill-opacity 200ms;
  opacity: 1; }

.radar-chart .d3-enter, .radar-chart .d3-exit {
  opacity: 0; }

/* Assignments
* ---------------------------------------------------------------- */
.assignments-list li {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid transparent;
  position: relative;
  height: 108px;
  background-color: rgba(7, 7, 7, 0.5); }
  .assignments-list li .award_mission {
    opacity: 0.3; }
  .assignments-list li.active .award_mission, .assignments-list li.completed .award_mission {
    opacity: 1; }
.assignments-list .tmp-code {
  position: absolute;
  top: 56px;
  left: 50%;
  margin-left: -27px;
  width: 50px;
  color: #000;
  background-color: rgba(255, 255, 255, 0.8);
  padding: 2px 0;
  font-size: 10px;
  text-align: center; }
.assignments-list .dependencies {
  position: absolute;
  bottom: 1px;
  right: 1px; }
  .assignments-list .dependencies li {
    float: right;
    height: 19px;
    width: 19px;
    border: 1px solid #fff;
    margin-left: 1px; }
.assignments-list li.has-progress .dependencies {
  bottom: 5px; }

.assignment-rewards {
  text-align: center; }
  .assignment-rewards p {
    margin-top: 5px;
    font-weight: bold; }

.assignment-info {
  text-align: center; }

.dependency-icon {
  height: 19px;
  width: 19px;
  border: 1px solid #fff;
  background-color: rgba(7, 7, 7, 0.5);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
  .dependency-icon[data-code^="rk"] {
    background-image: url(../profile/bf4/icon-dependencies.png);
    background-position: -1px -1px; }
  .dependency-icon[data-code^="as"], .dependency-icon[data-code^="xp"], .dependency-icon[data-code^="XP"], .dependency-icon[data-code^="axp"], .dependency-icon[data-code^="aXP"], .dependency-icon[data-code="amaster"], .dependency-icon[data-code="apremium"] {
    background-image: url(../profile/bf4/icon-dependencies.png);
    background-position: -20px -1px; }

#assignment-criterias li .pull-left {
  max-width: 270px;
  line-height: 14px; }
#assignment-criterias li .in-a-round {
  clear: both;
  color: #a8a8a8;
  padding-top: 4px; }

#assignment-dependencies li .dependency-icon {
  float: left; }
#assignment-dependencies li a {
  cursor: pointer; }
#assignment-dependencies li span, #assignment-dependencies li a {
  float: left;
  margin: 4px 0 0 10px; }
#assignment-dependencies li .green-check-small {
  float: right;
  background-image: url(../battledash/images/icons/green-check-small.png);
  width: 12px;
  height: 12px;
  margin-top: 3px; }
#assignment-dependencies li.nottaken .green-check-small {
  opacity: 0.2; }

/* Awards
* ---------------------------------------------------------------- */
.awards-list li {
  height: 170px; }
  .awards-list li .nottaken .image {
    opacity: 0.3; }
  .awards-list li .award-medal {
    position: relative;
    height: 105px;
    margin-bottom: 1px;
    background-color: rgba(7, 7, 7, 0.5); }
    .awards-list li .award-medal .progress-bar {
      position: absolute;
      bottom: 0;
      margin-bottom: 0;
      width: 100%; }
  .awards-list li.ribbon-empty:hover {
    background: inherit;
    cursor: inherit; }
  .awards-list li .award-ribbon {
    position: relative;
    height: 64px;
    background-color: rgba(7, 7, 7, 0.5); }
    .awards-list li .award-ribbon div {
      margin-top: -16px;
      /* TMP, TODO: Remove this when the gamedata award_ribbons is ok */ }
  .awards-list li .times-taken {
    position: absolute;
    bottom: 5px;
    right: 5px;
    font-size: 11px;
    color: #bec3c7; }
  .awards-list li.active .award-medal, .awards-list li.active .award-ribbon {
    background-color: #fff; }
  .awards-list li.active .image {
    opacity: 1; }
  .awards-list li.has-icon .award-ribbon .times-taken {
    right: 25px; }
.awards-list .xp-icon {
  position: absolute;
  right: 2px;
  bottom: 2px; }

#awards-details .image-container {
  text-align: center; }
#awards-details .award-medal {
  margin-bottom: 1px; }
#awards-details .award-info {
  margin: 16px 0 0; }
#awards-details .progress-bar {
  margin: 8px 0; }
#awards-details .progress-info {
  font-size: 12px;
  color: #a8a8a8; }
#awards-details .award-info strong, #awards-details .progress-info .pull-left {
  width: 245px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap; }
#awards-details .award-xpack {
  margin-bottom: 15px; }
  #awards-details .award-xpack .xp-icon {
    position: relative;
    top: 5px; }
  #awards-details .award-xpack span {
    font-size: 12px;
    color: #a8a8a8; }
  #awards-details .award-xpack strong {
    font-weight: normal;
    color: #fff; }

/* Unlocks
* ---------------------------------------------------------------- */
.upcoming-unlocks-container .upcoming-unlock header img {
  float: right;
  margin-top: 2px; }
.upcoming-unlocks-container .upcoming-unlock header span {
  color: #a8a8a8;
  font-size: 14px; }
.upcoming-unlocks-container .upcoming-unlock header strong {
  display: block;
  margin-top: 3px; }
.upcoming-unlocks-container .upcoming-unlock > a {
  display: block;
  text-align: center; }
.upcoming-unlocks-container .upcoming-unlock > div {
  font-size: 12px; }
  .upcoming-unlocks-container .upcoming-unlock > div .progress-info {
    text-align: right;
    color: #666; }
  .upcoming-unlocks-container .upcoming-unlock > div .progress-bar {
    margin: 3px auto 5px; }

#upcoming-unlocks-progression {
  margin-top: 16px; }
  #upcoming-unlocks-progression td {
    height: 60px;
    padding: 0;
    box-shadow: none; }
  #upcoming-unlocks-progression .value-cell {
    position: relative;
    width: 100px;
    font-size: 30px;
    vertical-align: top;
    line-height: 60px; }
    #upcoming-unlocks-progression .value-cell div {
      position: absolute;
      background-color: rgba(200, 200, 200, 0.2);
      height: 60px; }
  #upcoming-unlocks-progression .kit-cell {
    width: 20px; }
  #upcoming-unlocks-progression .image-cell {
    width: 90px; }
  #upcoming-unlocks-progression .desc-cell a {
    text-decoration: none;
    color: #a8a8a8; }
  #upcoming-unlocks-progression .desc-cell p {
    margin-left: 20px;
    font-size: 13px; }
    #upcoming-unlocks-progression .desc-cell p:first-child {
      margin-bottom: 5px;
      font-size: 15px; }

/* Battlereports
* ---------------------------------------------------------------- */
table.battlereports-table {
  font-size: 14px;
  margin: 0; }
  table.battlereports-table.show-first-ten tr:nth-child(n+11) {
    display: none; }
  table.battlereports-table tr {
    cursor: pointer; }
    table.battlereports-table tr .star {
      display: block;
      width: 20px;
      margin: 0;
      padding: 0; }
      table.battlereports-table tr .star:after {
        position: relative;
        z-index: 1;
        display: none;
        content: "★";
        font-size: 22px;
        color: rgba(255, 255, 255, 0.3); }
      table.battlereports-table tr .star.starred:after {
        display: block;
        color: white; }
    table.battlereports-table tr.active {
      -webkit-filter: drop-shadow(0 0 1px #e0f4f8);
      -moz-filter: drop-shadow(0 0 1px #e0f4f8);
      -ms-filter: drop-shadow(0 0 1px #e0f4f8);
      -o-filter: drop-shadow(0 0 1px #e0f4f8);
      filter: drop-shadow(0 0 1px #e0f4f8); }
      table.battlereports-table tr.active [class*='winstatus-'] {
        color: #000; }
      table.battlereports-table tr.active .star:after {
        color: rgba(0, 0, 0, 0.3); }
      table.battlereports-table tr.active .star.starred:after {
        color: #000; }
      table.battlereports-table tr.active td.favcell:hover .star:after {
        color: #000; }
    table.battlereports-table tr td.favcell {
      width: 22px;
      text-align: center; }
      table.battlereports-table tr td.favcell:hover .star:after {
        color: #fff; }
    table.battlereports-table tr .favorite {
      width: 20px;
      overflow: hidden; }
    table.battlereports-table tr .server-icons {
      padding: 0 0 0 6px; }
  table.battlereports-table.own-reports tr:hover .star:after {
    display: block; }
  table.battlereports-table thead th {
    padding-top: 0;
    padding-bottom: 0;
    line-height: 24px; }
  table.battlereports-table .map-thumb {
    margin-right: 8px; }
  table.battlereports-table .map-info {
    max-width: 268px; }
    table.battlereports-table .map-info p {
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden; }
  table.battlereports-table td p:nth-of-type(1) {
    line-height: 20px; }
  table.battlereports-table td p:nth-of-type(2) {
    font-size: 11px;
    line-height: 13px;
    color: #a8a8a8; }
  table.battlereports-table .winstatus {
    text-transform: uppercase; }
  table.battlereports-table .winstatus-1 {
    color: #94cdf3; }
  table.battlereports-table .winstatus--1 {
    color: #ff9f80; }
  table.battlereports-table .winstatus-0 {
    color: #86B886; }

#battlereports img.map {
  width: 100%; }
#battlereports .row {
  float: left; }
#battlereports .box {
  margin-bottom: 1px; }
#battlereports aside .box header {
  padding: 0; }
#battlereports aside .box ul {
  display: table;
  width: 100%;
  font-size: 12px; }
  #battlereports aside .box ul li {
    display: table-row; }
    #battlereports aside .box ul li span {
      text-align: left;
      display: table-cell;
      padding-top: 8px; }
      #battlereports aside .box ul li span:first-child {
        width: 30%;
        color: #a8a8a8;
        padding: 0; }
#battlereports aside footer {
  padding: 0; }
  #battlereports aside footer a {
    display: block;
    padding: 16px;
    text-decoration: none; }
  #battlereports aside footer:hover {
    background-color: rgba(7, 7, 7, 0.6); }
#battlereports .premium-requirement-box .btn {
  width: auto; }
#battlereports .btn {
  width: 100%;
  margin-top: 4px; }
#battlereports section footer {
  padding: 0; }
  #battlereports section footer .btn {
    margin-top: 0; }
#battlereports #battlereports-favorites {
  margin-bottom: 16px; }
  #battlereports #battlereports-favorites footer {
    margin-top: 0; }
#battlereports #battlereports-latest {
  margin-bottom: 20px; }

.no-reports.hide {
  display: none; }

.is-touch .star:after {
  display: block !important; }

/* Stat details
* ---------------------------------------------------------------- */
#stats-detailed .name {
  font-size: 14px; }
#stats-detailed .score {
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  text-align: right; }

#soldierportraits-container li.selected {
  background-color: #000; }

/* Dog tags
* ---------------------------------------------------------------- */
#dogtags-filter.submenu {
  margin-bottom: 8px; }

#dogtags-top .submenu {
  margin-bottom: 8px; }

#dogtags-equipped-box {
  margin-bottom: 8px; }
  #dogtags-equipped-box .box-content {
    position: relative;
    padding: 16px 13px; }
    #dogtags-equipped-box .box-content .dogtags-chain {
      height: 130px;
      margin-bottom: 0; }
    #dogtags-equipped-box .box-content.claim {
      padding-top: 32px;
      padding-bottom: 36px; }
      #dogtags-equipped-box .box-content.claim .btn {
        margin-bottom: 16px;
        width: 100%; }
      #dogtags-equipped-box .box-content.claim .progress-bar {
        margin-top: 16px;
        margin-bottom: 8px; }
      #dogtags-equipped-box .box-content.claim .progress-info {
        margin-top: 10px;
        font-size: 14px; }

#dogtags-body {
  margin-top: 0; }
  #dogtags-body .dogtags-list .box {
    margin-bottom: 8px; }
  #dogtags-body .dogtags-list .box.grid .box-content {
    padding: 0;
    background: inherit; }
  #dogtags-body .dogtag-aside button {
    width: 100%;
    margin-top: 8px; }
  #dogtags-body .dogtag-aside .box-content.selected-dog-tags.advanced-active .dogtags-chain .advanced {
    z-index: 3;
    position: relative; }
  #dogtags-body .dogtag-aside .box-content.description p {
    font-size: 12px;
    line-height: 1.4; }
  #dogtags-body .dogtag-aside .box-content.seen {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    text-transform: uppercase;
    padding: 8px 16px; }
  #dogtags-body .dogtag-aside .box-content .name {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 18px; }

.profile-stats-dogtags li {
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  width: 130px;
  height: 73px;
  padding: 4px 1px 1px;
  margin: 0 1px 1px 0;
  background-color: rgba(7, 7, 7, 0.5);
  cursor: pointer; }
  .profile-stats-dogtags li:nth-child(5n) {
    width: 132px;
    margin-right: 0; }
  .profile-stats-dogtags li.disabled .dogtags {
    opacity: 0.5; }
    .cssfilters .profile-stats-dogtags li.disabled .dogtags {
      opacity: 1;
      -webkit-filter: brightness(40%);
      -moz-filter: brightness(40%);
      -ms-filter: brightness(40%);
      -o-filter: brightness(40%);
      filter: brightness(40%); }
  .profile-stats-dogtags li:hover {
    background-color: rgba(7, 7, 7, 0.6); }
  .profile-stats-dogtags li.equipped {
    box-shadow: inset 0 0 0 1px #fff; }
  .profile-stats-dogtags li.active {
    background-color: #fff; }
    .profile-stats-dogtags li.active:hover {
      background-color: #fff; }

.dogtags-chain {
  margin: 14px 0; }
  .dogtags-chain .basic {
    position: relative;
    z-index: 2; }
  .dogtags-chain.horizontal .basic {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    transform: rotate(10deg); }
  .dogtags-chain.horizontal .basic + .advanced {
    margin-left: -60px; }
    .dogtags-chain.horizontal .basic + .advanced.xlarge, .dogtags-chain.horizontal .basic + .advanced.large {
      margin-left: -80px; }
    .dogtags-chain.horizontal .basic + .advanced.medium, .dogtags-chain.horizontal .basic + .advanced.mediumns {
      margin-left: -60px; }
    .dogtags-chain.horizontal .basic + .advanced.small, .dogtags-chain.horizontal .basic + .advanced.smallns {
      margin-left: -25px; }
  .dogtags-chain.vertical .advanced {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    transform: rotate(10deg); }
  .dogtags-chain.vertical .basic, .dogtags-chain.vertical .advanced {
    display: block; }
  .dogtags-chain.vertical .basic + .advanced {
    margin-top: -40px; }
    .dogtags-chain.vertical .basic + .advanced.medium {
      margin-left: -30px; }
    .dogtags-chain.vertical .basic + .advanced.small {
      margin-left: -12px; }

.dogtags-extra {
  position: absolute;
  left: 12px;
  bottom: 4px; }

.dogtag-seen-times {
  background: #353535;
  color: white;
  font-size: 11px;
  font-family: Arial, sans-serif;
  padding: 1px 5px 2px 5px;
  float: left; }

/* Kits */
#stats-kits .span8 > .box {
  margin-bottom: 8px; }
#stats-kits .span8 .box-content {
  padding: 0;
  background: inherit; }
#stats-kits aside .kititem {
  margin-left: 16px; }
#stats-kits aside h4 {
  margin-top: 16px; }
#stats-kits aside .progress-bar {
  margin-bottom: 8px; }
#stats-kits aside .score {
  font-size: 12px;
  color: #a8a8a8; }
#stats-kits aside .track-button {
  margin: 16px 0;
  width: 100%; }
#stats-kits aside .description {
  font-size: 12px;
  line-height: 20px;
  margin-top: 8px; }

.kits-list li {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  float: left;
  width: 163px;
  height: 110px;
  margin: 0 0 1px 1px;
  overflow: hidden;
  background-color: rgba(7, 7, 7, 0.5);
  text-align: center; }
  .kits-list li:nth-child(4n+1) {
    margin-left: 0;
    width: 164px; }
  .kits-list li:hover {
    background-color: rgba(7, 7, 7, 0.6);
    cursor: pointer; }
  .kits-list li.noprogress:not(.active) .image {
    opacity: 0.5; }
  .kits-list li.noprogress:not(.active) p {
    color: #a8a8a8; }
  .kits-list li.active {
    color: black;
    background-color: white;
    background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    box-shadow: 0 0 7px 0 #e0f4f8; }
    .kits-list li.active p {
      font-weight: bold; }
  .kits-list li .image {
    margin: 16px 0; }
    .kits-list li .image.kititem {
      margin-top: 26px; }
    .kits-list li .image.weapon {
      margin-top: 26px; }
  .kits-list li p {
    position: absolute;
    bottom: 16px;
    left: 0;
    right: 0;
    font-size: 12px; }
  .kits-list li .progress-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0; }

aside .weapon_unlock, aside .kititem_unlock {
  display: block;
  margin: 0 auto; }

/* Replay bar */
#replay-button {
  position: absolute;
  left: 0;
  width: 42px;
  height: 31px;
  background-color: rgba(0, 0, 0, 0.6);
  background-image: url(../profile/replay-button-small.png);
  background-repeat: no-repeat;
  background-position: 0 0; }

#stat-replay-discontinue-notice {
  font-size: 10px;
  color: #fff;
  padding-left: 16px;
  padding-top: 1px;
  margin-top: 1px;
  position: relative;
  line-height: 12px; }
  #stat-replay-discontinue-notice .info-icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 12px;
    height: 12px;
    background: url(../loadout/icon-info-s.png) 0 0 no-repeat;
    background-size: cover; }

#stat-replay-container {
  margin: 1px 0 16px;
  height: 31px;
  position: relative; }
  #stat-replay-container.disabled {
    -webkit-transition: opacity 0.15s ease-out 0.1s;
    -moz-transition: opacity 0.15s ease-out 0.1s;
    transition: opacity 0.15s ease-out 0.1s;
    opacity: 0.5; }
    #stat-replay-container.disabled #stat-replay-track {
      opacity: 0.1; }
    #stat-replay-container.disabled #replay-no-data {
      display: block; }
    #stat-replay-container.disabled .scrubber {
      display: none; }
  #stat-replay-container:not(.disabled) #replay-button {
    cursor: pointer; }
    #stat-replay-container:not(.disabled) #replay-button:hover {
      background-color: #fff;
      box-shadow: 0 0 4px 1px rgba(255, 255, 255, 0.6);
      background-position: 0 -31px; }
    #stat-replay-container:not(.disabled) #replay-button.playing {
      background-position: -42px 0; }
      #stat-replay-container:not(.disabled) #replay-button.playing:hover {
        background-position: -42px -31px; }
  #stat-replay-container:not(.disabled) #stat-replay-slider {
    cursor: pointer; }
  #stat-replay-container:not(.disabled) .scrubber {
    cursor: w-resize; }
  #stat-replay-container.not-premium #replay-nodes-container {
    width: 728px; }
  #stat-replay-container.not-premium #stat-replay-slider {
    width: 750px; }
  #stat-replay-container.not-premium #premium-info {
    background-color: rgba(0, 0, 0, 0.6);
    position: absolute;
    left: 43px;
    width: 199px;
    height: 31px; }
  #stat-replay-container.not-premium .border {
    position: absolute;
    left: 0px;
    width: 210px;
    z-index: 1;
    top: 14px;
    left: 16px;
    height: 1px;
    border-bottom: 1px solid #7A7D83; }

#stat-replay-slider {
  position: absolute;
  right: 0;
  width: 949px;
  height: 31px;
  background-color: rgba(0, 0, 0, 0.6); }

#stat-replay-track {
  position: absolute;
  top: 15px;
  left: 15px;
  right: 15px;
  height: 1px;
  z-index: 100;
  background-color: #fff; }
  #stat-replay-track .scrubber {
    position: absolute;
    top: -6px;
    left: 100%;
    right: 0;
    margin-left: -6px;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    background-color: #fff; }
    #stat-replay-track .scrubber p {
      opacity: 0;
      -webkit-transition: opacity 0.15s ease-out 0.1s;
      -moz-transition: opacity 0.15s ease-out 0.1s;
      transition: opacity 0.15s ease-out 0.1s;
      font-size: 10px;
      position: relative;
      width: 60px;
      margin: 17px 0 0 -23px;
      text-align: center; }

.replay-playing #stat-replay-track .scrubber, .replay-drag #stat-replay-track .scrubber {
  cursor: default; }
  .replay-playing #stat-replay-track .scrubber p, .replay-drag #stat-replay-track .scrubber p {
    opacity: 1; }
.replay-playing #stat-replay-slider, .replay-drag #stat-replay-slider {
  cursor: w-resize; }
.replay-playing .replay-start-date, .replay-playing .replay-end-date, .replay-drag .replay-start-date, .replay-drag .replay-end-date {
  opacity: 0; }

#replay-nodes-container {
  position: relative;
  width: 919px;
  height: 31px;
  margin: 0 15px;
  z-index: 90; }
  #replay-nodes-container canvas {
    position: relative;
    left: -5px; }
  #replay-nodes-container .replay-date {
    position: absolute;
    bottom: 2px;
    font-size: 10px;
    -webkit-transition: opacity 0.15s ease-out 0.1s;
    -moz-transition: opacity 0.15s ease-out 0.1s;
    transition: opacity 0.15s ease-out 0.1s; }
  #replay-nodes-container .replay-start-date {
    left: 0; }
  #replay-nodes-container .replay-end-date {
    right: 0; }
    #replay-nodes-container .replay-end-date span {
      text-align: right;
      right: 0; }

#replay-no-data {
  position: absolute;
  top: 11px;
  left: 50%;
  width: 300px;
  margin-left: -150px;
  font-size: 10px;
  text-align: center;
  text-transform: uppercase;
  display: none; }

.replay-highlight {
  -moz-animation-duration: 0.8s;
  -webkit-animation-duration: 0.8s;
  -moz-animation-name: highlightbox;
  -webkit-animation-name: highlightbox; }

@-moz-keyframes highlightbox {
  from {
    box-shadow: none; }

  50% {
    box-shadow: 0 0 4px 1px rgba(255, 255, 255, 0.6); }

  to {
    box-shadow: none; } }

@-webkit-keyframes highlightbox {
  from {
    box-shadow: none; }

  50% {
    box-shadow: 0 0 4px 1px rgba(255, 255, 255, 0.6); }

  to {
    box-shadow: none; } }

/* Weapons
* ---------------------------------------------------------------- */
.game-stats-content .profile-statistics-head .show-filters {
  position: relative;
  margin-top: 8px;
  -webkit-transition: height 1s linear;
  -moz-transition: height 1s linear;
  transition: height 1s linear; }
  .game-stats-content .profile-statistics-head .show-filters h1 {
    font-size: 12px;
    color: #FFF;
    font-family: Arial, sans-serif;
    text-transform: none;
    font-weight: normal;
    line-height: 32px;
    cursor: pointer; }
  .game-stats-content .profile-statistics-head .show-filters .toggler {
    float: right;
    position: absolute;
    top: 0;
    right: 10px; }
    .game-stats-content .profile-statistics-head .show-filters .toggler:after {
      text-align: center;
      color: #AAA;
      content: "+";
      font-size: 21px;
      width: 20px; }
  .game-stats-content .profile-statistics-head .show-filters header:hover .toggler:after {
    color: #FFF; }
  .game-stats-content .profile-statistics-head .show-filters header.active .toggler:after {
    content: "-"; }
  .game-stats-content .profile-statistics-head .show-filters #filter-options {
    display: none;
    margin: 0; }
.game-stats-content .profile-statistics-head .list-icon {
  cursor: pointer;
  margin-left: 0;
  margin: 0; }
.game-stats-content .profile-statistics-container {
  margin-top: 8px;
  position: relative;
  margin-bottom: 16px;
  min-height: 400px; }
  .game-stats-content .profile-statistics-container .locked .image {
    opacity: 0.7; }
  .game-stats-content .profile-statistics-container .locked p {
    color: #a8a8a8; }
  .game-stats-content .profile-statistics-container .locked-column {
    font-size: 14px; }
.game-stats-content table.profile-stats-table {
  margin-bottom: 0; }
  .game-stats-content table.profile-stats-table th {
    padding: 5px 0;
    width: 82px;
    text-align: center; }
    .game-stats-content table.profile-stats-table th:first-child {
      width: 40px; }
    .game-stats-content table.profile-stats-table th.item-name {
      width: auto;
      text-align: left;
      padding-left: 5px; }
  .game-stats-content table.profile-stats-table tbody tr.locked:not(.active) .image {
    opacity: 0.3; }
  .game-stats-content table.profile-stats-table tbody tr.active p {
    color: #000;
    font-weight: bold; }
  .game-stats-content table.profile-stats-table tbody tr.active td {
    color: black;
    background-color: white;
    background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    box-shadow: 0 0 7px 0 #e0f4f8; }
  .game-stats-content table.profile-stats-table tbody tr.active:hover {
    background-color: transparent; }
  .game-stats-content table.profile-stats-table tbody tr .relative.no-entry {
    color: #a8a8a8;
    padding-top: 0;
    line-height: 53px; }
  .game-stats-content table.profile-stats-table td {
    height: 85px;
    padding: 0;
    text-align: center;
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0.5);
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400; }
    .game-stats-content table.profile-stats-table td:first-child {
      font-size: 24px; }
    .game-stats-content table.profile-stats-table td:nth-child(2) .progress-bar {
      width: auto; }
    .game-stats-content table.profile-stats-table td .relative {
      position: relative; }
    .game-stats-content table.profile-stats-table td strong {
      display: block;
      font-size: 20px;
      font-weight: 400; }
    .game-stats-content table.profile-stats-table td .progress-bar {
      margin: 0;
      position: absolute;
      right: 0;
      left: 0;
      bottom: 0px; }
    .game-stats-content table.profile-stats-table td.item-name {
      width: 208px;
      text-align: center; }
      .game-stats-content table.profile-stats-table td.item-name .image {
        vertical-align: middle;
        margin-bottom: 9px; }
      .game-stats-content table.profile-stats-table td.item-name p {
        font-size: 12px;
        font-family: Arial, sans-serif; }
      .game-stats-content table.profile-stats-table td.item-name .progress-bar {
        bottom: 0;
        left: 0;
        right: 0;
        margin: 0; }
      .game-stats-content table.profile-stats-table td.item-name span {
        position: absolute;
        bottom: 4px;
        left: 0;
        right: 0;
        text-align: center;
        font-size: 12px; }
    .game-stats-content table.profile-stats-table td.item-kills strong {
      margin-top: 26px;
      margin-bottom: 10px; }
      .game-stats-content table.profile-stats-table td.item-kills strong.soldier-equipment {
        margin-top: 16px; }
    .game-stats-content table.profile-stats-table td.item-kills span {
      color: #a8a8a8;
      font-size: 12px; }
    .game-stats-content table.profile-stats-table td.item-kills .icon-weapon {
      position: absolute;
      top: 5px;
      right: 5px; }
    .game-stats-content table.profile-stats-table td .unlocks-taken {
      position: absolute;
      top: 10px;
      left: 0;
      width: 100%;
      font-size: 12px;
      text-align: center; }

.stat-details .image-container {
  overflow: hidden;
  text-align: center; }
  .stat-details .image-container .large {
    margin-top: 10px;
    margin-bottom: 10px; }
  .stat-details .image-container .squarelarge {
    margin-top: -20%;
    margin-bottom: -20%; }
.stat-details .box-content + .box {
  margin-top: 1px; }
.stat-details .missing-details-info {
  font-size: 12px;
  text-align: center; }
.stat-details .progress-bar {
  margin-bottom: 0; }
.stat-details .track-weapon-stats .progress-bar {
  margin-top: 2px; }
.stat-details .track-weapon-stats li {
  height: 22px;
  line-height: 22px; }
.stat-details .progress-info {
  font-size: 12px;
  color: #a8a8a8;
  margin: 6px 0;
  line-height: 16px; }
.stat-details .btn {
  width: 100%;
  height: 30px;
  line-height: 30px;
  margin-bottom: 16px; }
.stat-details h4 {
  width: 100%;
  height: 30px;
  margin: 5px 0;
  font-size: 20px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  text-transform: uppercase; }
.stat-details p {
  font-size: 12px;
  line-height: 20px; }
.stat-details .track-button {
  margin-top: 16px; }
  .stat-details .track-button i {
    background-image: url(../common/warsaw/icon-track.png);
    width: 17px;
    height: 19px;
    display: inline-block;
    position: relative;
    top: 3px;
    right: 2px; }
.stat-details .track-weapon-stats {
  margin-top: 8px; }
  .stat-details .track-weapon-stats.weapon-statistics span:first-child {
    width: 160px; }
  .stat-details .track-weapon-stats span {
    text-transform: uppercase;
    font-size: 12px; }
    .stat-details .track-weapon-stats span:first-child {
      float: left;
      width: 100px;
      margin-right: 5px;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden; }
      .stat-details .track-weapon-stats span:first-child.extended {
        width: 150px; }
    .stat-details .track-weapon-stats span:last-child {
      float: right; }
  .stat-details .track-weapon-stats .progress-bar {
    float: left;
    width: 183px;
    margin-top: 6px; }
  .stat-details .track-weapon-stats .firemode-icon {
    margin-bottom: -3px; }
.stat-details .weapon-statistics {
  margin-top: 0; }
.stat-details .loader {
  display: block;
  margin: 8px auto; }
.stat-details footer {
  padding: 0; }
  .stat-details footer a {
    padding: 16px;
    display: block;
    text-decoration: none; }
    .stat-details footer a.upsell {
      color: #ff9900; }
  .stat-details footer:hover {
    background-color: rgba(7, 7, 7, 0.6); }

ul.weapon-accessories {
  margin-top: 1px; }
  ul.weapon-accessories li {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    float: left;
    width: 79px;
    height: 40px;
    padding-top: 10px;
    margin: 0 0 1px 1px;
    overflow: hidden;
    background-color: rgba(7, 7, 7, 0.5);
    text-align: center;
    overflow: hidden; }
    ul.weapon-accessories li:nth-child(4n+1) {
      margin-left: 0;
      width: 80px; }
    ul.weapon-accessories li[data-guid]:not(.active) {
      cursor: pointer; }
      ul.weapon-accessories li[data-guid]:not(.active):hover {
        background-color: rgba(7, 7, 7, 0.6); }
    ul.weapon-accessories li .progress-bar {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 0; }
    ul.weapon-accessories li .battlepacks {
      top: -13px;
      position: relative; }
    ul.weapon-accessories li.locked:not(.active) .weaponaccessory {
      opacity: 0.3; }
    ul.weapon-accessories li.locked:not(.active) .battlepacks_lineart {
      opacity: 0.3; }
    ul.weapon-accessories li.locked:not(.active) p {
      color: #a8a8a8; }
    ul.weapon-accessories li.active {
      color: black;
      background-color: white;
      background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
      background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
      box-shadow: 0 0 7px 0 #e0f4f8; }

.weapon-details {
  margin-top: 1px;
  text-align: center; }

.weapon-pagination {
  margin: 10px 0; }
  .weapon-pagination a {
    padding: 7px 11px;
    background-color: rgba(0, 0, 0, 0.45);
    cursor: pointer;
    text-decoration: none;
    margin-right: 1px;
    float: left; }
    .weapon-pagination a:hover {
      background-color: rgba(0, 0, 0, 0.65); }
    .weapon-pagination a.active {
      background-color: #fff;
      box-shadow: 0 0 7px 0 #e0f4f8;
      color: #000; }
  .weapon-pagination .loader {
    display: none;
    float: left;
    margin: 3px 0 0 10px; }

.weapon-stats-box > header ~ .box-content {
  padding: 0;
  background-color: inherit;
  margin-bottom: 8px; }
.weapon-stats-box.license-unlocked {
  margin-bottom: 16px; }
  .weapon-stats-box.license-unlocked .box-content {
    background-color: transparent;
    padding: 0; }

#weapon-list .icon {
  position: absolute;
  right: 2px;
  bottom: 2px; }

.weapon-stats-list li {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  float: left;
  width: 163px;
  height: 96px;
  margin: 0 0 1px 1px;
  overflow: hidden;
  background-color: rgba(7, 7, 7, 0.5);
  text-align: center; }
  .weapon-stats-list li:nth-child(4n+1) {
    margin-left: 0;
    width: 164px; }
  .weapon-stats-list li[data-guid]:not(.active) {
    cursor: pointer; }
    .weapon-stats-list li[data-guid]:not(.active):hover {
      background-color: rgba(7, 7, 7, 0.6); }
  .weapon-stats-list li .weapon {
    margin-top: 18px; }
  .weapon-stats-list li .service-star-container {
    position: absolute;
    left: 4px;
    bottom: 3px; }
    .weapon-stats-list li .service-star-container .service-star {
      padding-left: 16px;
      background-size: 14px 14px;
      font-weight: 400;
      font-size: 14px;
      height: 14px;
      line-height: 15px; }
  .weapon-stats-list li p {
    position: absolute;
    bottom: 18px;
    width: 100%;
    padding: 4px 0;
    font-size: 12px; }
  .weapon-stats-list li .progress-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0; }
  .weapon-stats-list li.locked:not(.active) .image {
    opacity: 0.3; }
  .weapon-stats-list li.locked:not(.active) p {
    color: #a8a8a8; }
  .weapon-stats-list li.active, .weapon-stats-list li.active.locked {
    color: black;
    background-color: white;
    background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    box-shadow: 0 0 7px 0 #e0f4f8; }
    .weapon-stats-list li.active p, .weapon-stats-list li.active.locked p {
      font-weight: bold;
      color: #000; }
  .weapon-stats-list li.has-progress .service-star-container, .weapon-stats-list li.has-progress .xp-icon {
    bottom: 10px; }

.license-unlocked .weapon-stats-list .service-star-container {
  bottom: 3px; }

.no-weapons-found {
  font-size: 12px; }

.weapons-stat-tbl .service-star.no-service-stars {
  text-indent: -200%;
  overflow: hidden;
  opacity: 0.4;
  width: 20px;
  padding: 0; }
.weapons-stat-tbl td.item-name > .relative {
  height: 69px;
  padding-top: 16px; }
.weapons-stat-tbl td.item-servicestars > .relative {
  height: 53px;
  padding-top: 32px; }
.weapons-stat-tbl td.item-nextunlock > .relative {
  height: 51px;
  padding-top: 34px; }

#bn-show-all {
  margin-top: 8px; }

/* Vehicles
* ---------------------------------------------------------------- */
.vehicles-stat-tbl td {
  height: 100px; }
.vehicles-stat-tbl .image-container {
  margin: 0 auto;
  overflow: hidden; }
.vehicles-stat-tbl .service-star.no-service-stars {
  text-indent: -200%;
  overflow: hidden;
  opacity: 0.4;
  width: 20px;
  padding: 0; }
.vehicles-stat-tbl td.item-name > .relative {
  height: 69px; }
.vehicles-stat-tbl td.item-servicestars > .relative {
  height: 53px;
  padding-top: 32px; }
.vehicles-stat-tbl td.item-nextunlock > .relative {
  height: 56px;
  padding-top: 29px; }

td.item-servicestars > .relative .servicestar.faded {
  opacity: 0.3; }

.vehicle-stats-box {
  margin-bottom: 16px; }
  .vehicle-stats-box > header + .box-content {
    padding: 0;
    background-color: inherit; }

.vehicle-stats-list li {
  height: 100px;
  background-color: rgba(7, 7, 7, 0.5); }
  .vehicle-stats-list li:hover {
    background-color: rgba(7, 7, 7, 0.6); }
  .vehicle-stats-list li .image-container {
    position: absolute;
    top: 33px;
    width: 118px;
    overflow: hidden; }
    .vehicle-stats-list li .image-container .vehicleunlock {
      margin-left: -11px; }
  .vehicle-stats-list li .progress-bar {
    position: absolute;
    bottom: 0;
    margin-bottom: 0;
    width: 100%; }
  .vehicle-stats-list li.locked .image-container {
    opacity: 0.5; }
  .vehicle-stats-list li.active {
    color: black;
    background-color: white;
    background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    box-shadow: 0 0 7px 0 #e0f4f8;
    opacity: 1; }

#vehicle-details .box {
  margin-top: 1px; }
#vehicle-details .details-category-name {
  padding: 4px 16px; }

.category-vehicle-box {
  overflow: hidden;
  -webkit-transition: height 0.25s ease-in-out;
  -moz-transition: height 0.25s ease-in-out;
  transition: height 0.25s ease-in-out; }
  .category-vehicle-box .vehicle_unlock {
    display: block;
    margin: 0 auto; }

.category-vehicles-list li {
  margin-top: 1px;
  padding: 5px 10px;
  background-color: rgba(7, 7, 7, 0.5);
  font-size: 12px; }
  .category-vehicles-list li span {
    float: left;
    color: #a8a8a8;
    text-transform: uppercase; }
  .category-vehicles-list li strong {
    float: right; }
  .category-vehicles-list li.active span {
    color: #fff; }
  .category-vehicles-list li.total span, .category-vehicles-list li.total strong {
    color: #fff;
    font-weight: bold;
    font-size: 14px;
    text-transform: uppercase;
    padding: 5px 0; }
  .category-vehicles-list li[data-guid] {
    cursor: pointer; }
    .category-vehicles-list li[data-guid]:hover {
      background-color: #fff;
      color: #000; }
      .category-vehicles-list li[data-guid]:hover span {
        color: #000; }

#vehicle-category-details .track-button {
  margin-bottom: 0; }
#vehicle-category-details .info {
  margin-top: 16px; }

body #base-container #user .profile-stats-blaze-down {
  text-align: center;
  font-size: 14px;
  height: 200px;
  line-height: 200px;
  color: #a8a8a8; }
body #base-container #user .profile-info {
  position: relative;
  position: relative; }
  body #base-container #user .profile-info.premium .box.username {
    background-image: url(../base/bf4/overlay-p.png);
    background-position: top center;
    background-repeat: no-repeat;
    color: #f4d07d; }
    body #base-container #user .profile-info.premium .box.username .icon-premium-p-big {
      margin-top: 4px;
      position: relative;
      left: 10px; }
  body #base-container #user .profile-info .box {
    margin-bottom: 1px;
    width: 815px;
    height: 39px; }
    body #base-container #user .profile-info .box .box-content {
      height: 39px;
      line-height: 39px;
      padding: 0 14px; }
    body #base-container #user .profile-info .box.username {
      background-color: rgba(7, 7, 7, 0.6);
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600;
      font-size: 36px; }
    body #base-container #user .profile-info .box.userinfo {
      font-family: Arial;
      font-size: 14px; }
      body #base-container #user .profile-info .box.userinfo .infotext {
        color: #a8a8a8; }
      body #base-container #user .profile-info .box.userinfo .box-content:empty {
        height: 41px;
        position: relative;
        top: -1px; }
    body #base-container #user .profile-info .box.soldiers {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600;
      font-size: 19px; }
      body #base-container #user .profile-info .box.soldiers .allsoldiers {
        width: 680px;
        height: 39px;
        overflow: hidden; }
    body #base-container #user .profile-info .box.last .box-content {
      height: 56px;
      line-height: 56px; }
  body #base-container #user .profile-info h1 {
    margin: 0;
    padding: 0 14px;
    overflow: hidden;
    width: 100%;
    text-transform: none; }
    body #base-container #user .profile-info h1 span.premium {
      color: #E4B744; }
  body #base-container #user .profile-info .presentation {
    line-height: 25px; }
  body #base-container #user .profile-info .avatar-container {
    float: left;
    margin-right: 1px;
    height: 176px;
    width: 176px; }
    body #base-container #user .profile-info .avatar-container .avatar {
      height: 176px;
      width: 176px; }
  body #base-container #user .profile-info .user-container {
    float: left;
    width: 815px; }
  body #base-container #user .profile-info .interact {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400; }
    body #base-container #user .profile-info .interact .btn {
      margin-right: 8px; }
    body #base-container #user .profile-info .interact .avatar {
      margin-left: 6px; }
body #base-container #user .profile-overview .presentation {
  line-height: 22px;
  color: #a8a8a8;
  font-size: 14px; }
body #base-container #user .profile-playing {
  background: #2f84b1;
  height: 72px; }
  body #base-container #user .profile-playing .map {
    margin: 6px; }
    body #base-container #user .profile-playing .map .map-image {
      height: 60px; }
  body #base-container #user .profile-playing .info {
    padding-top: 8px;
    margin: 0 10px; }
    body #base-container #user .profile-playing .info .servername {
      text-transform: none; }
    body #base-container #user .profile-playing .info h1 {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400;
      font-weight: 600;
      font-size: 19px;
      color: #fff;
      line-height: 14px;
      margin: 6px 0;
      margin-bottom: 4px; }
    body #base-container #user .profile-playing .info h2 {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400;
      font-weight: 600;
      font-size: 16px;
      color: #fff;
      line-height: 14px;
      margin-bottom: 4px; }
    body #base-container #user .profile-playing .info h3 {
      font-family: Arial;
      font-weight: normal;
      font-size: 12px;
      color: #d7d7d7;
      line-height: 14px; }
  body #base-container #user .profile-playing .btn {
    margin: 13px 16px; }
body #base-container #user .join-flow {
  background-color: rgba(7, 7, 7, 0.5);
  margin-bottom: 16px; }
  body #base-container #user .join-flow .server-info {
    float: left;
    padding: 16px; }
    body #base-container #user .join-flow .server-info header {
      margin-bottom: 14px; }
  body #base-container #user .join-flow .join-button {
    padding-right: 16px;
    float: right; }
body #base-container #user .soldier-info {
  position: relative;
  height: 294px;
  background-color: rgba(7, 7, 7, 0.6);
  padding-left: 16px;
  padding-top: 16px; }
  body #base-container #user .soldier-info div {
    margin-bottom: 14px; }
  body #base-container #user .soldier-info .avatar {
    z-index: 10;
    position: absolute;
    right: 5px; }
  body #base-container #user .soldier-info .dogtags {
    position: absolute;
    right: 40px;
    top: 0px; }
body #base-container #user #soldiers header {
  margin-bottom: 1px; }
body #base-container #user #soldiers .banned .rank {
  display: none; }
body #base-container #user #soldiers .soldier-data-container.premium {
  background-image: url(../base/bf4/overlay-p.png);
  background-position: top center;
  background-repeat: no-repeat; }
  body #base-container #user #soldiers .soldier-data-container.premium .soldier-name {
    color: #f4d07d; }
body #base-container #user #soldiers h2 {
  font-size: 22px;
  margin: 0;
  line-height: 1; }
  body #base-container #user #soldiers h2.soldier-name {
    position: relative;
    text-transform: none;
    z-index: 2; }
  body #base-container #user #soldiers h2 .count {
    float: right; }
body #base-container #user #soldiers .soldier-name-banned {
  font-size: 12px;
  text-transform: uppercase;
  color: #f00; }
body #base-container #user #soldiers h3 {
  font-size: 30px;
  line-height: 1; }
  body #base-container #user #soldiers h3.skill {
    margin-bottom: 20px; }
  body #base-container #user #soldiers h3.rank {
    font-size: 40px;
    font-weight: 400; }
body #base-container #user #soldiers h5 {
  font-size: 16px;
  line-height: 1;
  font-weight: 400; }
body #base-container #user #soldiers .soldier-emblem {
  position: absolute;
  top: 40px;
  right: 90px;
  z-index: 0; }
body #base-container #user #soldiers .rank, body #base-container #user #soldiers .dogtags {
  -webkit-transition: 0.5s opacity;
  -moz-transition: 0.5s opacity;
  transition: 0.5s opacity; }
body #base-container #user #soldiers .rank {
  position: absolute;
  top: 30px;
  left: 6px; }
  body #base-container #user #soldiers .rank.other {
    top: 60px; }
body #base-container #user #soldiers .hidden {
  opacity: 0; }
body #base-container #user #soldiers .soldier-hidden {
  display: none; }
body #base-container #user #soldiers .box-padding {
  z-index: 3; }
body #base-container #user #soldiers .profile-soldier-image {
  position: absolute;
  z-index: 1;
  right: -80px;
  top: 5px; }
body #base-container #user #soldiers h3.rank {
  font-size: 30px;
  line-height: 1; }
  body #base-container #user #soldiers h3.rank img {
    vertical-align: middle; }
body #base-container #user #soldiers .details {
  display: none; }
body #base-container #user #soldiers .dogtags {
  position: absolute;
  left: 95px;
  top: 130px; }
  body #base-container #user #soldiers .dogtags img {
    position: absolute;
    width: 75px; }
    body #base-container #user #soldiers .dogtags img:first-child {
      z-index: 1;
      -webkit-transform: rotate(10deg);
      -moz-transform: rotate(10deg);
      -ms-transform: rotate(10deg);
      -o-transform: rotate(10deg);
      transform: rotate(10deg);
      top: 3px; }
    body #base-container #user #soldiers .dogtags img:last-child {
      left: 45px; }
body #base-container #user #soldiers .icon-platform {
  display: inline-block; }
body #base-container #user #soldiers .soldier {
  cursor: pointer;
  height: 127px;
  margin-bottom: 1px;
  position: relative;
  overflow: hidden; }
  body #base-container #user #soldiers .soldier > a:hover {
    text-decoration: none; }
  body #base-container #user #soldiers .soldier.big {
    height: 279px; }
    body #base-container #user #soldiers .soldier.big .rank {
      position: absolute;
      top: 35px;
      left: 6px; }
      body #base-container #user #soldiers .soldier.big .rank.other {
        top: 65px; }
    body #base-container #user #soldiers .soldier.big .details {
      display: block;
      position: absolute;
      bottom: 16px;
      left: 16px;
      /* This is necessary since the soldier image is placed at z-index 1 */
      z-index: 2; }
    body #base-container #user #soldiers .soldier.big .profile-soldier-image {
      bottom: -60px; }
  body #base-container #user #soldiers .soldier:hover {
    text-decoration: none; }
body #base-container #user .veteran-score .box-content h1, body #base-container #user .connected-devices .box-content h1 {
  text-align: center; }
body #base-container #user .veteran-score .box-content p, body #base-container #user .connected-devices .box-content p {
  font-size: 12px; }
  body #base-container #user .veteran-score .box-content p span.red, body #base-container #user .connected-devices .box-content p span.red {
    color: red;
    padding-left: 1px;
    padding-right: 1px; }
  body #base-container #user .veteran-score .box-content p span.green, body #base-container #user .connected-devices .box-content p span.green {
    color: #78c753; }
body #base-container #user .friends ul {
  margin-right: -11px;
  margin-bottom: -8px; }
  body #base-container #user .friends ul li {
    display: inline-block;
    margin-right: 11px;
    margin-bottom: 8px; }
body #base-container #user .friends footer {
  padding: 0; }
  body #base-container #user .friends footer a {
    padding: 16px;
    display: block;
    text-decoration: none; }
  body #base-container #user .friends footer:hover {
    background-color: rgba(7, 7, 7, 0.6); }
body #base-container #user .friends .facebook-friendfinder {
  background: url(../facebook/icon-fb-l.png) no-repeat;
  background-position: center 0px;
  padding-top: 60px;
  text-align: center;
  position: relative;
  z-index: 1; }
  body #base-container #user .friends .facebook-friendfinder p {
    margin-bottom: 12px;
    text-transform: none;
    font-family: Arial;
    font-size: 14px;
    line-height: 1.5em;
    color: #a8a8a8; }
  body #base-container #user .friends .facebook-friendfinder button {
    cursor: pointer; }
body #base-container #user .wallpost.profile-others textarea {
  padding: 8px; }

.right-column .friends header h1 a {
  color: #d5dde5;
  text-decoration: none; }

/* All friends */
#profile-friends .friend {
  margin-top: 1px; }
#profile-friends .interact {
  margin-top: 13px; }
#profile-friends .text {
  margin-left: 76px;
  margin-top: 20px; }
  #profile-friends .text .username {
    text-decoration: none;
    display: block;
    margin-top: 6px;
    color: #a8a8a8;
    font-size: 12px; }
#profile-friends .playing .text {
  line-height: 20px;
  margin-top: 9px; }

#game-stats > .submenu li a {
  font-size: 16px; }
#game-stats .loading-box, #game-stats .profile-stats-blaze-down {
  padding: 50px;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.45);
  font-size: 16px; }
#game-stats .box.no-results {
  text-align: center; }

#game-stats-head {
  margin-bottom: 8px;
  height: 64px; }
  #game-stats-head:before, #game-stats-head:after {
    display: table;
    content: "";
    line-height: 0; }
  #game-stats-head:after {
    clear: both; }
  #game-stats-head .avatar-container {
    float: left;
    margin-right: 16px; }
  #game-stats-head h1 {
    margin-bottom: 4px;
    font-size: 36px;
    line-height: 32px; }
  #game-stats-head .soldier-info-name span.premium {
    color: #E4B744; }
  #game-stats-head .user {
    min-width: 650px; }
    #game-stats-head .user:before, #game-stats-head .user:after {
      display: table;
      content: "";
      line-height: 0; }
    #game-stats-head .user:after {
      clear: both; }
    #game-stats-head .user .common-gameicon-hori {
      text-decoration: none; }
    #game-stats-head .user .common-gameicon-hori, #game-stats-head .user a.profile-link {
      line-height: 13px;
      font-size: 13px; }
    #game-stats-head .user .common-gameicon-hori, #game-stats-head .user .icon-premium-wide {
      margin-right: 5px;
      float: left; }
    #game-stats-head .user .icon-premium-wide {
      margin-top: 4px; }

#stats-header-challenges {
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 400; }
  #stats-header-challenges:before, #stats-header-challenges:after {
    display: table;
    content: "";
    line-height: 0; }
  #stats-header-challenges:after {
    clear: both; }
  #stats-header-challenges > div {
    margin-top: 14px; }
  #stats-header-challenges > div:nth-child(2) {
    margin-right: 16px;
    height: 29px;
    padding-top: 3px; }
    #stats-header-challenges > div:nth-child(2) i:nth-of-type(1) {
      margin-right: 16px; }
    #stats-header-challenges > div:nth-child(2) i:nth-of-type(2) {
      float: right;
      margin-left: 16px; }

#stats-list-container li {
  clear: both;
  height: 26px;
  line-height: 26px;
  padding: 0 10px; }
  #stats-list-container li:nth-child(odd) {
    background-color: rgba(0, 0, 0, 0.3); }
  #stats-list-container li span {
    float: left; }
  #stats-list-container li strong {
    float: right; }

.overview-small-list-box .box-content {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 64px;
  padding: 14px 16px 0; }
  .overview-small-list-box .box-content.alpha {
    height: 79px;
    padding: 15px 15px 0; }
.overview-small-list-box .no-data {
  width: 100%;
  margin-top: 12px;
  text-align: center;
  font-size: 12px;
  color: #a8a8a8; }

.overview-small-solo-box .box-content {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 144px; }

.empty-overview-top-box .box-content {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 143px; }
.empty-overview-top-box .no-data {
  width: 100%;
  margin-top: 64px;
  text-align: center;
  font-size: 12px;
  color: #a8a8a8; }

.overview-top-box .box-content {
  background: transparent;
  position: relative;
  height: 143px; }
.overview-top-box .item-highlighted {
  position: absolute;
  top: 0;
  right: 85px;
  bottom: 0;
  left: 0; }
  .overview-top-box .item-highlighted .top-item {
    width: 100%;
    height: 100%; }
    .overview-top-box .item-highlighted .top-item .info {
      right: 10px;
      bottom: 13px;
      left: 16px;
      text-align: left; }
      .overview-top-box .item-highlighted .top-item .info .service-stars {
        position: absolute;
        right: 0;
        bottom: 0;
        text-align: right;
        font-size: 19px;
        height: 21px;
        padding-left: 22px;
        padding-top: 0;
        background: url(../profile/warsaw/stats/servicestars/servicestar-20x20.png) 0 1px no-repeat;
        background-size: 18px 18px;
        font-family: Purista, sans-serif;
        font-style: normal;
        font-weight: 600; }
.overview-top-box .items-highlighted {
  float: right;
  margin-top: -1px;
  width: 84px; }
  .overview-top-box .items-highlighted .top-item {
    margin-top: 1px; }
    .overview-top-box .items-highlighted .top-item .item-image {
      margin-top: 6px; }
    .overview-top-box .items-highlighted .top-item .info .title {
      display: none; }
    .overview-top-box .items-highlighted .top-item .info .score {
      font-size: 14px;
      text-transform: capitalize;
      font-weight: normal;
      font-family: inherit;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      max-width: 100%; }
.overview-top-box .top-item {
  width: 84px;
  height: 71px;
  position: relative;
  background-color: rgba(0, 0, 0, 0.4); }
  .overview-top-box .top-item.is-linked:hover {
    background-color: rgba(7, 7, 7, 0.6); }
  .overview-top-box .top-item > a {
    width: 100%;
    height: 100%;
    text-decoration: none;
    display: block;
    text-align: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
  .overview-top-box .top-item.list-head {
    text-align: center;
    font-size: 18px;
    line-height: 55px; }
  .overview-top-box .top-item .info {
    position: absolute;
    right: 0;
    bottom: 8px;
    left: 0;
    text-align: center; }
    .overview-top-box .top-item .info .title {
      font-size: 14px;
      line-height: 1;
      margin-bottom: 4px;
      text-transform: uppercase;
      color: #a8a8a8; }
    .overview-top-box .top-item .info .score {
      font-size: 19px;
      line-height: 1;
      text-transform: uppercase;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600; }
    .overview-top-box .top-item .info .service-stars {
      font-size: 12px;
      line-height: 1;
      display: inline-block;
      font-weight: bold;
      height: 13px;
      padding-top: 1px;
      padding-left: 16px;
      background: url(../profile/warsaw/stats/servicestars/servicestar-18x18.png) 0 0 no-repeat;
      background-size: 13px 13px; }
    .overview-top-box .top-item .info + span {
      float: right;
      margin: 10px 10px 0 0; }
  .overview-top-box .top-item span {
    font-size: 12px;
    color: #a8a8a8; }
.overview-top-box .top-leaderboards .leaderboard-icons img {
  margin: 4px;
  margin-top: 12px; }
.overview-top-box .top-leaderboards .items-highlighted .lb-item-image {
  position: absolute;
  right: 8px;
  top: 4px;
  height: 40px; }
.overview-top-box .top-leaderboards .items-highlighted .division-rank {
  position: absolute;
  left: 8px;
  bottom: 4px;
  z-index: 1;
  font-weight: bold;
  font-size: 12px; }
  .overview-top-box .top-leaderboards .items-highlighted .division-rank .division {
    height: 32px; }
  .overview-top-box .top-leaderboards .items-highlighted .division-rank .area {
    height: 20px; }
  .overview-top-box .top-leaderboards .items-highlighted .division-rank .rank {
    line-height: 10px;
    vertical-align: 50%; }
.overview-top-box .battlereport-minicard {
  padding: 7px; }
  .overview-top-box .battlereport-minicard:hover {
    background-color: rgba(0, 0, 0, 0.35);
    cursor: pointer; }

#overview-battlereport-favorites > a {
  display: inline-block;
  margin: 4px 10px 0 0; }
  #overview-battlereport-favorites > a:last-child {
    margin-right: 0; }
#overview-battlereport-favorites .no-data {
  margin-top: 18px; }

.dimmed {
  height: 223px;
  background-color: rgba(0, 0, 0, 0.45);
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  text-align: center;
  text-transform: uppercase;
  line-height: 212px; }

#overview-top-modes:hover {
  background-color: rgba(7, 7, 7, 0.6); }
#overview-top-modes ul {
  padding: 4px 16px;
  margin: 0; }

#overview-completion {
  margin-top: 16px; }
  #overview-completion .box-content {
    background-color: inherit; }
  #overview-completion ul li {
    height: 40px;
    margin-bottom: 1px;
    padding: 6px 0;
    background-color: rgba(0, 0, 0, 0.4); }
    #overview-completion ul li:hover {
      background-color: rgba(7, 7, 7, 0.6); }
    #overview-completion ul li i {
      float: left;
      margin-top: 6px; }
    #overview-completion ul li .completion-content {
      padding: 8px 0 12px 20px;
      overflow: hidden; }
      #overview-completion ul li .completion-content h6 {
        color: #fff;
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 0;
        margin-top: 3px;
        float: left;
        width: 150px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap; }
      #overview-completion ul li .completion-content .progress-bar {
        width: 700px;
        margin-top: 3px;
        margin-bottom: 0;
        float: right; }
      #overview-completion ul li .completion-content p {
        float: right;
        width: 90px;
        padding-left: 10px;
        font-size: 12px;
        position: relative;
        top: 3px;
        padding-top: 3px; }
        #overview-completion ul li .completion-content p.completed {
          background-image: url(../profile/warsaw/checkbox.png);
          background-repeat: no-repeat;
          background-position: 74px 0;
          height: 16px; }

.stat-latest-game h6 {
  font-size: 16px;
  line-height: 20px;
  margin: 0;
  padding: 0; }
.stat-latest-game i {
  display: inline-block;
  height: 42px;
  width: 42px; }
.stat-latest-game .info {
  text-align: left; }
  .stat-latest-game .info p:first-child {
    font-size: 12px;
    line-height: 12px;
    margin-bottom: 6px;
    text-transform: uppercase;
    color: #a8a8a8; }
  .stat-latest-game .info p:last-child {
    line-height: 14px; }

#filter-options {
  display: none;
  margin-bottom: 20px; }
  #filter-options .ui-widget-content {
    border: 0;
    background-color: rgba(0, 0, 0, 0.6); }
  #filter-options .ui-slider-handle {
    width: 6px;
    height: 9px;
    top: -2px;
    margin-left: -5px; }
  #filter-options .ui-widget-header {
    background-color: #148ec1;
    background-image: -webkit-linear-gradient(left, #148ec1 50%, transparent 50%), -webkit-linear-gradient(left, #44d7ff 50%, transparent 50%);
    background-image: linear-gradient(to right, #148ec1 50%, transparent 50%), linear-gradient(to right, #44d7ff 50%, transparent 50%);
    background-size: 1px 1px, 2px 2px, 3px 3px;
    box-shadow: 0 0 3px 1px #148ec1 inset; }
  #filter-options .filter-list li {
    margin-bottom: 10px; }
  #filter-options .filter-list span {
    font-size: 12px;
    text-transform: uppercase; }
    #filter-options .filter-list span:last-child {
      float: right;
      margin-top: 4px;
      color: #a8a8a8; }
  #filter-options .filter-list .filter-slider {
    margin-top: 6px; }
  #filter-options h3 {
    color: #8A8A8A;
    font-size: 13px;
    line-height: 1.2; }
  #filter-options section {
    float: left; }
    #filter-options section.attributes-filter {
      width: 480px; }
    #filter-options section.category-filter {
      width: 430px;
      margin-left: 50px; }
      #filter-options section.category-filter li {
        display: inline-block;
        width: 190px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap; }

/* Shared stuff for stat pages
* ---------------------------------------------------------------- */
.stat-box {
  margin-bottom: 16px; }
  .stat-box > header + .box-content {
    padding: 0;
    background-color: inherit; }

.stat-list-col > li {
  position: relative;
  display: inline-block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  margin: 0 1px 1px 0;
  text-align: center;
  cursor: pointer; }
  .stat-list-col > li:hover {
    background-color: rgba(7, 7, 7, 0.6); }
  .stat-list-col > li.active {
    color: black;
    background-color: white;
    background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    box-shadow: 0 0 7px 0 #e0f4f8;
    opacity: 1; }
.stat-list-col.col6 > li {
  width: 108px; }
  .stat-list-col.col6 > li:nth-child(6n+4), .stat-list-col.col6 > li:nth-child(6n+5) {
    width: 109px; }
  .stat-list-col.col6 > li:nth-child(6n) {
    width: 109px;
    margin-right: 0; }
.stat-list-col.col5 > li {
  width: 130px; }
  .stat-list-col.col5 > li:nth-child(5n+4) {
    width: 131px; }
  .stat-list-col.col5 > li:nth-child(5n) {
    width: 131px;
    margin-right: 0; }

.box-list {
  margin-bottom: 1px; }
  .box-list li {
    margin-top: 1px;
    padding: 8px 10px;
    background-color: rgba(7, 7, 7, 0.5);
    font-size: 12px; }

/* Common link class ? */
a.box-link {
  padding: 2px 5px;
  background-color: rgba(0, 0, 0, 0.3);
  color: #fff;
  font-size: 12px;
  text-decoration: none; }
  a.box-link:hover {
    background-color: rgba(255, 255, 255, 0.8);
    box-shadow: 0 0 6px 0 rgba(255, 255, 255, 0.5);
    color: #000; }

#profile-status-message-edit {
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 14px;
  padding: 7px 8px;
  margin-bottom: 8px; }

#profile-status-message {
  position: relative; }
  #profile-status-message .profile-status-message-text {
    display: inline-block; }
  #profile-status-message .profile-status-message-date {
    font-size: 12px;
    color: #a8a8a8; }
  #profile-status-message.profile-your .message {
    border: 1px solid #8a8a8a;
    background-color: rgba(0, 0, 0, 0.3); }
    #profile-status-message.profile-your .message #profile-status-message-area {
      font-size: 14px;
      padding: 8px; }
  #profile-status-message.profile-your:hover .message {
    cursor: text;
    border-color: rgba(250, 246, 246, 0.6); }
  #profile-status-message #profile-edit-status-button {
    background-image: url(../comcenter/chat-edit.png);
    background-repeat: no-repeat;
    width: 14px;
    height: 14px;
    position: absolute;
    right: 11px;
    top: 11px;
    cursor: pointer; }
    #profile-status-message #profile-edit-status-button:hover {
      background-position: 0 -14px; }
  #profile-status-message:hover #profile-edit-status-button {
    background-position: 0 -14px; }
  #profile-status-message .feed-update-status-terms {
    cursor: pointer; }

#profile-edit-full-form .soldier-row.premium {
  background-image: url(../base/bf4/overlay-p.png);
  background-position: top center;
  background-repeat: no-repeat; }
  #profile-edit-full-form .soldier-row.premium .icon-premium-wide {
    position: relative;
    top: 2px;
    margin-right: 6px; }
#profile-edit-full-form .profile-edit-full-form-loader {
  float: left;
  margin-right: 16px;
  margin-top: 8px;
  display: none; }
#profile-edit-full-form #profile-edit-blocked-users .base-profile-link {
  font-size: 12px;
  font-weight: bold; }
#profile-edit-full-form #profile-edit-blocked-users .profile-removeblock {
  margin-top: 4px; }
#profile-edit-full-form .profile-edit-gravatar-container {
  float: left;
  margin-right: 16px;
  background: rgba(0, 0, 0, 0.5);
  color: #d5dde5; }
#profile-edit-full-form p {
  font-size: 12px;
  line-height: 1.2; }
  #profile-edit-full-form p a {
    text-decoration: underline; }
  #profile-edit-full-form p a:hover {
    text-decoration: none; }
#profile-edit-full-form label {
  font-size: 12px; }
#profile-edit-full-form #profile-edit-gravatar {
  margin-top: 10px;
  line-height: 26px;
  width: 340px; }
#profile-edit-full-form #profile-edit-remove-gravatar, #profile-edit-full-form #profile-edit-change-gravatar {
  font-size: 12px;
  text-decoration: underline;
  margin-right: 16px;
  line-height: 40px; }
#profile-edit-full-form .blockbox {
  width: 100%;
  margin-top: 1px; }
#profile-edit-full-form .profile-personas-playing-game li {
  clear: both; }
  #profile-edit-full-form .profile-personas-playing-game li .profile-tag-soldier-name {
    clear: both;
    font-size: 14px;
    font-weight: bold;
    padding: 8px 0; }
    #profile-edit-full-form .profile-personas-playing-game li .profile-tag-soldier-name .soldiername {
      float: left;
      margin-right: 5px; }
    #profile-edit-full-form .profile-personas-playing-game li .profile-tag-soldier-name .profile-soldier-game {
      margin-top: 2px; }
  #profile-edit-full-form .profile-personas-playing-game li .profile-edit-clantag-input-container {
    position: relative;
    top: 10px;
    left: 10px;
    float: left; }
  #profile-edit-full-form .profile-personas-playing-game li .soldier-dogtags {
    position: relative;
    left: 20px; }
#profile-edit-full-form .profile-edit-dogtag-text {
  display: inline-block;
  position: absolute;
  top: 30px;
  font-size: 12px;
  cursor: pointer;
  margin-left: 10px; }
#profile-edit-full-form .profile-edit-dogtag-text:hover {
  text-decoration: underline; }
#profile-edit-full-form .profile-edit-picture .profile-soldier-image {
  cursor: inherit; }
#profile-edit-full-form .profile-edit-soldier-text {
  display: inline-block;
  position: absolute;
  top: 30px;
  font-size: 12px;
  cursor: pointer;
  margin-left: 10px; }
#profile-edit-full-form .profile-edit-soldier-text:hover {
  text-decoration: underline; }
#profile-edit-full-form .profile-edit-presentation-text {
  float: left;
  width: 104px;
  display: inline-block;
  font-size: 12px;
  position: relative;
  top: 5px; }
#profile-edit-full-form #profile-edit-forumsignature, #profile-edit-full-form #profile-edit-presentation {
  overflow-y: auto;
  font-size: 12px;
  font-family: arial, sans-serif;
  color: #434343;
  padding: 8px;
  width: 438px;
  max-width: 438px;
  height: 100px;
  color: #fff;
  margin: 0; }
#profile-edit-full-form p.edit-profile-user-details-text {
  line-height: 1.2;
  padding-bottom: 15px; }
#profile-edit-full-form #profile-edit-row-name {
  margin-bottom: 16px; }
#profile-edit-full-form #profile-edit-row-location label {
  float: left; }
#profile-edit-full-form .profile-presentation-box {
  margin-top: 10px; }
#profile-edit-full-form .profile-edit-dateformat-label {
  width: 150px; }
#profile-edit-full-form .profile-edit-row {
  min-height: 22px; }
#profile-edit-full-form .profile-edit-row > label:first-child {
  min-width: 170px;
  text-transform: uppercase;
  font-weight: bold;
  float: left;
  position: relative;
  line-height: 22px; }
#profile-edit-full-form #profile-edit-clantag-input {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 26px;
  height: 34px;
  width: 105px; }
#profile-edit-full-form #profile-edit-clantag-input.greyedout {
  background: rgba(255, 255, 255, 0.05); }
#profile-edit-full-form .profile-edit-row-birthday .ui-select {
  margin-right: 8px;
  text-transform: capitalize; }
#profile-edit-full-form .profile-warsawstats-resetstatsbutton {
  position: relative;
  top: 5px;
  margin-right: 6px; }
#profile-edit-full-form .switch {
  margin: 0;
  margin-right: 10px;
  position: relative;
  top: 3px; }
#profile-edit-full-form .profile-edit-invisible-label.label-hidden {
  display: none; }
#profile-edit-full-form .extra-info {
  margin-left: 170px;
  margin-right: 170px;
  margin-top: 16px;
  color: #a8a8a8;
  font-size: 12px;
  line-height: 18px; }
  #profile-edit-full-form .extra-info.hidden {
    display: none; }
#profile-edit-full-form .profile-edit-row .soundevents, #profile-edit-full-form .profile-edit-row .local-settings {
  float: left; }
  #profile-edit-full-form .profile-edit-row .soundevents .profile-edit-sound-notification-option, #profile-edit-full-form .profile-edit-row .soundevents .profile-edit-local-setting, #profile-edit-full-form .profile-edit-row .local-settings .profile-edit-sound-notification-option, #profile-edit-full-form .profile-edit-row .local-settings .profile-edit-local-setting {
    margin-bottom: 4px; }
    #profile-edit-full-form .profile-edit-row .soundevents .profile-edit-sound-notification-option:last-child, #profile-edit-full-form .profile-edit-row .soundevents .profile-edit-local-setting:last-child, #profile-edit-full-form .profile-edit-row .local-settings .profile-edit-sound-notification-option:last-child, #profile-edit-full-form .profile-edit-row .local-settings .profile-edit-local-setting:last-child {
      margin: 0; }
#profile-edit-full-form .profile-edit-row span {
  font-size: 12px; }
#profile-edit-full-form .profile-edit-row .profile-edit-privacy-option-labels {
  margin-left: 16px;
  margin-bottom: 8px; }
#profile-edit-full-form .profile-edit-row .ui-select {
  margin-right: 6px; }
#profile-edit-full-form .profile-edit-row div.label label {
  font-size: 14px;
  font-weight: bold; }
#profile-edit-full-form .profile-edit-privacy-option-label a {
  color: #a8a8a8; }

.soldierbox-hidden {
  display: none; }

#soldierbox-footer {
  padding: 0;
  color: #fff;
  cursor: pointer; }
  #soldierbox-footer p {
    padding: 16px; }
  #soldierbox-footer:hover {
    background-color: rgba(7, 7, 7, 0.6); }

#favorite-battlereports-table {
  width: 327px;
  font-size: 10px; }
  #favorite-battlereports-table .favmapname {
    padding-bottom: 5px;
    font-size: 11px; }
  #favorite-battlereports-table .map-info p {
    white-space: normal;
    word-wrap: break-word;
    width: 99px; }

.profile-location-display {
  font-size: 12px;
  padding: 0px 0;
  width: 400px;
  margin-left: 5px;
  font-weight: bold;
  float: left; }
  .profile-location-display a {
    font-weight: normal;
    font-size: 12px; }
  .profile-location-display p {
    font-weight: normal; }

.profile-editsoldier {
  padding: 0 !important;
  margin-top: 1px; }
  .profile-editsoldier .dogtag1 {
    position: relative;
    left: 14px; }

.profile-editsoldier-icon {
  position: relative;
  top: 3px; }

.profile-editsoldier-table {
  margin-bottom: 0 !important; }
  .profile-editsoldier-table .game-title {
    color: #fff;
    font-size: 16px;
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600; }

.profile-editprivacy-table {
  margin-bottom: 0 !important; }

#friend-unblock-button.hidden {
  display: none; }

#friend-block-button.hidden {
  display: none; }

td.profile-edit-primary .switch {
  position: relative;
  left: 12px; }

td#profile-edit-soldier-name {
  width: 400px; }
  td#profile-edit-soldier-name a {
    font-size: 14px; }

span.edit-profile-back {
  margin-left: 10px; }

h1.primary.soldier-info-name span, h1.primary.soldier-info-name #base-container .content > section > header h1.soldier-info-name.wrappable, #base-container .content > section > header h1.primary.soldier-info-name h1.soldier-info-name.wrappable, h1.primary.soldier-info-name .forum-start-title h1.soldier-info-name, .forum-start-title h1.primary.soldier-info-name h1.soldier-info-name, h1.primary.soldier-info-name .forum-page-title h1.soldier-info-name, .forum-page-title h1.primary.soldier-info-name h1.soldier-info-name, h1.primary.soldier-info-name .missions-details .header h1.soldier-info-name.wrappable, .missions-details .header h1.primary.soldier-info-name h1.soldier-info-name.wrappable, h1.primary.soldier-info-name .devblog .header h1.soldier-info-name, .devblog .header h1.primary.soldier-info-name h1.soldier-info-name, h1.primary.soldier-info-name #battlereport > header h1.soldier-info-name, #battlereport > header h1.primary.soldier-info-name h1.soldier-info-name {
  text-transform: none;
  line-height: 40px; }

.overview-info-box .box-content {
  position: relative; }

#profile-customize-dropdown-button {
  position: relative; }
  #profile-customize-dropdown-button .btn {
    padding-left: 10px;
    white-space: nowrap;
    padding-right: 10px; }
    #profile-customize-dropdown-button .btn img {
      position: relative;
      top: -3px;
      right: -2px;
      opacity: 0.85; }
    #profile-customize-dropdown-button .btn:hover img {
      opacity: 1; }

.btn.set-as-active {
  padding: 0 10px;
  margin-right: 10px; }

.profile.underage {
  text-align: center; }
  .profile.underage .box-content {
    padding-top: 200px;
    min-height: 300px; }

.profile-custom .popover .popover-body {
  border: 1px solid #d5dde5;
  background: #0a0e14; }
  .profile-custom .popover .popover-body ul li > a {
    color: #a8a8a8; }

.dogtags-chain {
  text-align: left;
  position: relative; }
  .dogtags-chain .dog-tag-name-overlay, .dogtags-chain .dog-tag-stat-overlay {
    position: absolute;
    z-index: 3;
    color: rgba(200, 200, 200, 0.4);
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text; }
  .dogtags-chain .dog-tag-name-overlay {
    font-size: 14px;
    top: 16px;
    left: 51px;
    text-shadow: -1px -1px 0.1px rgba(0, 0, 0, 0.6), 1px 1px 0.1px rgba(255, 255, 255, 0.3);
    -webkit-transform: rotate(11deg);
    -moz-transform: rotate(11deg);
    -ms-transform: rotate(11deg);
    -o-transform: rotate(11deg);
    transform: rotate(11deg);
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0; }
    .dogtags-chain .dog-tag-name-overlay.inverted {
      color: rgba(255, 255, 255, 0.3);
      text-shadow: 0px 0px 0.1px rgba(255, 255, 255, 0.3), 0px -1px 0.1px rgba(0, 0, 0, 0.9); }
  .dogtags-chain .dog-tag-stat-overlay {
    font-size: 11px;
    text-align: right;
    top: 60px;
    right: 28px;
    text-shadow: 0px 1px 0.1px rgba(0, 0, 0, 0.7), -1px 0px 0.1px rgba(255, 255, 255, 0.7); }

.profile-twitch-stream .box-content {
  position: relative;
  margin-bottom: 1px; }
  .profile-twitch-stream .box-content img {
    position: absolute;
    top: 10px;
    right: 10px; }
  .profile-twitch-stream .box-content p {
    font-family: Purista;
    font-size: 23px;
    text-transform: uppercase; }
    .profile-twitch-stream .box-content p .twitch-viewers {
      font-size: 11px;
      color: #a8a8a8;
      padding-left: 20px;
      text-transform: none; }

#stats-detailed > .row > [class*="span"] {
  display: inline-block;
  float: none;
  margin-left: 13px; }
  #stats-detailed > .row > [class*="span"] header {
    margin-bottom: 1px; }

#stats-detailed tr.totalScore td {
  background-color: rgba(7, 7, 7, 0.6); }
  #stats-detailed tr.totalScore td.score:before {
    content: "= "; }

.clubs-list .box-content {
  margin-top: 1px; }
.clubs-list .friends {
  margin-top: 8px; }

.club-link .emblem, .club-link .club-info {
  float: left;
  margin-right: 16px; }
.club-link .name {
  margin: 8px 0;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 19px;
  white-space: nowrap;
  max-width: 196px;
  text-overflow: ellipsis;
  overflow: hidden; }
.club-link .info {
  font-size: 12px; }

#game-stats .loading-box {
  text-transform: uppercase;
  font-size: 16px;
  padding: 200px 0;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }
  #game-stats .loading-box .loader {
    margin-top: -4px; }
#game-stats #player-win-stats {
  position: relative;
  margin-top: -2px; }
#game-stats #player-squad-score {
  text-align: center;
  margin: 0;
  padding: 14px 0; }
  #game-stats #player-squad-score li {
    text-align: center; }
    #game-stats #player-squad-score li.last {
      margin-right: 0; }
    #game-stats #player-squad-score li span {
      display: block;
      color: #a8a8a8;
      font-size: 14px;
      text-transform: uppercase; }
    #game-stats #player-squad-score li strong {
      display: block;
      font-weight: bold;
      line-height: 30px;
      font-size: 14px; }
      #game-stats #player-squad-score li strong.focus {
        font-size: 23px;
        font-family: Purista, sans-serif;
        font-style: normal;
        font-weight: 600; }
#game-stats #player-win-percentage {
  position: absolute;
  left: 183px;
  top: 30px; }
  #game-stats #player-win-percentage header {
    display: block;
    color: #a8a8a8;
    font-size: 14px;
    text-transform: uppercase; }
  #game-stats #player-win-percentage strong {
    display: block;
    font-weight: bold;
    line-height: 30px;
    font-size: 14px; }
    #game-stats #player-win-percentage strong.focus {
      font-size: 23px;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600; }
#game-stats #player-stats-winrate {
  width: 100px;
  height: 100px;
  position: absolute;
  left: 89px; }
  #game-stats #player-stats-winrate svg {
    position: relative; }
#game-stats #weapon-details-accessories {
  display: block;
  margin-top: 1px; }

#soldierportraits-container #soldierimage {
  text-align: center; }
  #soldierportraits-container #soldierimage li {
    float: left;
    margin: 10px;
    cursor: pointer; }
    #soldierportraits-container #soldierimage li.disabled {
      opacity: 0.4;
      cursor: inherit; }
    #soldierportraits-container #soldierimage li:hover {
      background: rgba(255, 255, 255, 0.1); }
    #soldierportraits-container #soldierimage li.selected {
      background: #fff; }
    #soldierportraits-container #soldierimage li img {
      display: block; }
    #soldierportraits-container #soldierimage li .unlock-info {
      position: absolute;
      right: 0;
      bottom: 0;
      left: 0; }
    #soldierportraits-container #soldierimage li .icon-premium-p {
      right: 6px;
      bottom: 100%;
      margin-bottom: 8px; }
    #soldierportraits-container #soldierimage li .icon-battlepack {
      position: absolute;
      right: 6px;
      bottom: 100%;
      margin-bottom: 8px; }
      #soldierportraits-container #soldierimage li .icon-battlepack + .icon-premium-p {
        right: 26px; }
    #soldierportraits-container #soldierimage li .battlepack-desc {
      background: rgba(0, 0, 0, 0.75);
      color: #fff;
      line-height: 16px;
      font-size: 11px; }

.common-reportbutton, .common-reportbutton-container .common-reportbutton {
  background: url(../common/icon-report-s.png); }

.common-reportbutton-container.active .common-reportbutton {
  background-position: 0 0; }

.common-reportbutton.bright {
  background-position: 0 0; }

.profile-expansion-icon {
  position: relative;
  top: 2px; }
  .profile-expansion-icon a:hover {
    text-decoration: none; }

.club-link {
  font-size: 13px; }

.profile-solder-picture {
  cursor: pointer; }

.profile-stats-table th {
  cursor: pointer; }
  .profile-stats-table th .arrow {
    display: none; }
  .profile-stats-table th.headerSortUp, .profile-stats-table th.headerSortDown {
    background: url(../common/box-title-gradient-with-lin-active.png) center top;
    color: #000; }
    .profile-stats-table th.headerSortUp .arrow, .profile-stats-table th.headerSortDown .arrow {
      display: inline-block;
      height: 11px;
      width: 10px;
      float: right;
      margin-right: 8px; }
  .profile-stats-table th.headerSortUp .arrow {
    background: url(../main/warsaw/loggedout/tablearrow-up.png) no-repeat; }
  .profile-stats-table th.headerSortDown .arrow {
    background: url(../main/warsaw/loggedout/tablearrow-down.png) no-repeat; }

.devblog {
  font-family: Arial, sans-serif; }
  .devblog .header {
    margin-bottom: 15px; }
  .devblog section.pagination {
    margin-top: 10px; }
  .devblog .no-caps {
    text-transform: none; }
  .devblog .devblog-topstories-container {
    margin-bottom: 16px; }
    .devblog .devblog-topstories-container .devblog-topstory-wrapper .devblog-topstory {
      display: block;
      background-repeat: no-repeat;
      background-size: 100% auto;
      position: relative;
      height: 224px;
      background-color: black; }
      .devblog .devblog-topstories-container .devblog-topstory-wrapper .devblog-topstory .devblog-topstory-overlay {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        bottom: 0;
        background-image: -webkit-linear-gradient( rgba(19, 22, 26, 0.5), #13161a 50%);
        background-image: linear-gradient( rgba(19, 22, 26, 0.5), #13161a 50%); }
      .devblog .devblog-topstories-container .devblog-topstory-wrapper .devblog-topstory .devblog-topstory-content {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        bottom: 0;
        margin-top: 16px;
        padding: 0 16px 16px 16px; }
        .devblog .devblog-topstories-container .devblog-topstory-wrapper .devblog-topstory .devblog-topstory-content .devblog-topstory-votes {
          display: inline-block;
          margin: 0 0 12px 0;
          padding: 0 6px 0 0;
          line-height: 18px;
          font-size: 14px; }
          .devblog .devblog-topstories-container .devblog-topstory-wrapper .devblog-topstory .devblog-topstory-content .devblog-topstory-votes .icon {
            display: block;
            float: left;
            background: url('../feed/icon-hooah-activitystream.png') 0 -54px no-repeat;
            width: 18px;
            height: 18px;
            margin: 0 6px 0 0; }
        .devblog .devblog-topstories-container .devblog-topstory-wrapper .devblog-topstory .devblog-topstory-content .devblog-topstory-comments {
          display: inline-block;
          margin: 0 0 12px 0;
          padding: 0 6px 0 0;
          line-height: 18px;
          font-size: 14px; }
          .devblog .devblog-topstories-container .devblog-topstory-wrapper .devblog-topstory .devblog-topstory-content .devblog-topstory-comments .icon {
            display: block;
            float: left;
            background-image: url('../devblog/icon-comments.png');
            background-repeat: no-repeat;
            background-position: 0 -10px;
            width: 18px;
            height: 13px;
            margin: 3px 6px 0 0; }
        .devblog .devblog-topstories-container .devblog-topstory-wrapper .devblog-topstory .devblog-topstory-content h2 {
          font-family: purista;
          font-size: 20px;
          max-height: 61px;
          overflow: hidden;
          text-transform: none;
          line-height: inherit;
          font-weight: normal;
          min-height: 40px; }
    .devblog .devblog-topstories-container .devblog-topstory-wrapper .info-box {
      padding: 16px;
      position: absolute;
      bottom: 0px;
      left: 0px; }
      .devblog .devblog-topstories-container .devblog-topstory-wrapper .info-box .comments {
        padding-left: 16px;
        background-color: rgba(7, 7, 7, 0.6);
        width: 20px; }
  .devblog .devblog-post {
    font-size: 14px;
    line-height: 20px; }
    .devblog .devblog-post h1 {
      font-size: 30px;
      line-height: 32px;
      margin-bottom: 16px;
      text-transform: none;
      font-weight: bold; }
    .devblog .devblog-post .devblog-index-iteminfo {
      position: relative; }
      .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-avatar {
        display: inline-block;
        margin-right: 10px; }
      .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo {
        display: inline-block;
        line-height: 35px; }
        .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo .username {
          font-weight: bold;
          color: #fff;
          padding-right: 10px; }
        .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo .ago {
          color: #a8a8a8;
          padding-right: 10px; }
        .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo .devblog-comment-icon {
          color: #fff;
          text-decoration: none;
          display: inline-block;
          line-height: 15px;
          cursor: pointer;
          opacity: 0.5;
          background: url("../devblog/icon-comments.png") no-repeat scroll 0 -10px transparent;
          padding-left: 20px;
          height: 12px;
          margin: 0 6px 0 0; }
          .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo .devblog-comment-icon:hover {
            opacity: 1; }
          .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo .devblog-comment-icon .comments {
            color: #fff;
            padding-right: 10px; }
        .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo .devblog-toggle-vote {
          color: #fff;
          display: inline-block; }
          .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo .devblog-toggle-vote .devblog-vote-icon {
            color: #fff;
            text-decoration: none;
            display: inline-block;
            line-height: 26px;
            height: 20px;
            cursor: pointer;
            opacity: 0.5;
            background: url("../feed/icon-hooah-activitystream.png") no-repeat scroll 0 -50px transparent;
            padding-left: 20px; }
            .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo .devblog-toggle-vote .devblog-vote-icon:hover {
              background-position: 0 -50px;
              opacity: 1; }
            .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo .devblog-toggle-vote .devblog-vote-icon.voted:hover {
              background-position: 0 -50px;
              opacity: 1; }
            .devblog .devblog-post .devblog-index-iteminfo .devblog-index-iteminfo-textinfo .devblog-toggle-vote .devblog-vote-icon.voted {
              background-position: 0 -50px;
              opacity: 1; }
      .devblog .devblog-post .devblog-index-iteminfo .share-widgets {
        padding: 7px 0 0 0;
        height: 20px;
        float: right; }
      .devblog .devblog-post .devblog-index-iteminfo .share-widgets li {
        float: left; }
    .devblog .devblog-post .devblog-index-content {
      color: white;
      padding-bottom: 0; }
      .devblog .devblog-post .devblog-index-content p {
        margin-bottom: 1em; }
      .devblog .devblog-post .devblog-index-content .wp-caption.alignnone img, .devblog .devblog-post .devblog-index-content img.alignnone, .devblog .devblog-post .devblog-index-content .wp-caption.aligncenter img, .devblog .devblog-post .devblog-index-content img.aligncenter {
        margin: 0 -16px 0 -16px;
        width: 656px;
        height: auto; }
      .devblog .devblog-post .devblog-index-content p.wp-caption-text {
        margin: -10px -16px 10px -16px;
        width: 656px;
        padding: 5px 16px;
        font-size: 12px;
        color: #a8a8a8;
        font-style: italic; }
      .devblog .devblog-post .devblog-index-content table {
        border: 1px solid white; }
        .devblog .devblog-post .devblog-index-content table td {
          padding: 10px 10px;
          border: 1px solid white; }
    .devblog .devblog-post .preamble {
      display: none; }
  .devblog .voting {
    float: left; }
  .devblog .reply-item {
    position: relative;
    padding-left: 40px;
    height: 40px; }
  .devblog .right-column {
    line-height: 16px;
    margin-bottom: 1px; }
    .devblog .right-column .item {
      padding-bottom: 16px; }
      .devblog .right-column .item:before, .devblog .right-column .item:after {
        display: table;
        content: "";
        line-height: 0; }
      .devblog .right-column .item:after {
        clear: both; }
    .devblog .right-column h2 {
      font-size: 12px;
      line-height: 16px;
      text-transform: none; }
    .devblog .right-column .iteminfo {
      font-size: 11px;
      line-height: 16px;
      color: #a8a8a8; }
      .devblog .right-column .iteminfo .post-title {
        font-size: 12px;
        font-weight: bold; }
      .devblog .right-column .iteminfo .common-square {
        margin: 0 2px 2px 2px; }
    .devblog .right-column .thumbnail {
      float: right;
      margin-left: 16px; }
      .devblog .right-column .thumbnail img {
        max-height: 53px; }

.devblog-postlistsmall {
  margin-bottom: 16px; }
  .devblog-postlistsmall .devblog-item .details {
    line-height: 1.8;
    font-size: 11px;
    color: #898989; }
  .devblog-postlistsmall footer {
    padding: 0; }
    .devblog-postlistsmall footer a {
      display: block;
      padding: 16px;
      text-decoration: none; }
    .devblog-postlistsmall footer:hover {
      background: rgba(7, 7, 7, 0.6); }

.devblog-comments-title {
  color: #353535;
  font-size: 12px;
  font-weight: bold; }

.devblog-view-border {
  background: #dadada;
  height: 1px;
  margin: 0px;
  width: 100%;
  clear: both; }

.devblog-view-comments-divider {
  height: 3px;
  background: #dfdfdf;
  border-bottom: 1px solid #fbfbfb;
  margin-bottom: 15px; }

.devblog-comment-bottom {
  height: 23px;
  margin-top: 8px;
  background: url(../devblog/blogbox-bottom.png) repeat-x; }

.devblog-list-bottom {
  height: 41px;
  margin-top: 0px;
  line-height: 41px; }

.devblog-noposts {
  font-size: 14px;
  padding: 9px 20px 16px 2px;
  color: #353535; }

#base-all-body .devblog-post h1 {
  color: #308DBF; }

.devblog-comments .pagination-pagination-right {
  float: left; }

.devblog-sidebar {
  float: right;
  width: 320px;
  overflow: hidden; }
  .devblog-sidebar .common-secondary-column-line {
    margin-bottom: 11px; }

.devblog-main {
  float: left;
  width: 656px; }

.devblog-post.expansion-premium {
  background: url(../premium/avatar-premium-corner-supersize2.png) 100% 0 no-repeat;
  min-height: 66px; }

.devblog-postlistsmall .expansion-premium a {
  display: inline-block;
  background: url(../premium/icon-p-s.png) 0 1px no-repeat;
  padding-left: 21px; }

.devblog-post .battlelog-wordpress {
  padding: 16px 0 16px 0; }
  .devblog-post .battlelog-wordpress ul, .devblog-post .battlelog-wordpress ol {
    margin: -1em 0 1em 0;
    padding: 0 2.5em; }
    .devblog-post .battlelog-wordpress ul li, .devblog-post .battlelog-wordpress ol li {
      padding: 3px 0; }
  .devblog-post .battlelog-wordpress ul {
    list-style: disc; }
  .devblog-post .battlelog-wordpress ol {
    list-style: decimal; }
  .devblog-post .battlelog-wordpress a {
    text-decoration: underline;
    color: #a8a8a8; }
    .devblog-post .battlelog-wordpress a:hover {
      color: #fff; }

/* Straight from .css and IDE reformated */
.forum-middle {
  position: relative;
  clear: both;
  width: 100%;
  background: url(//d34ymitoc1pg7m.cloudfront.net/common/backgrounds/light-bg-26fc61c7.jpg) repeat-x scroll center top #F3f3f3; }

.forum-create-post-similar-threads {
  margin-top: 16px; }

.forum-start-container {
  width: 990px;
  float: left;
  min-height: 400px; }
  .forum-start-container .common-box-container {
    width: auto; }
  .forum-start-container .common-box-inner {
    padding: 0; }

.forum-start-border {
  padding: 0;
  margin-bottom: 8px; }

.forum-start-info {
  height: 27px;
  color: #a8a8a8; }

.forum-start-info-bottom {
  height: 1px;
  width: 100%;
  background-color: #f2f2f2; }

.forum-start-sticky-thread-separator {
  height: 4px;
  background: #f4f4f4;
  margin-left: -2px;
  margin-right: -2px;
  border-top: 1px solid #e8e8e8;
  border-bottom: 1px solid #e8e8e8; }

.forum-activity .forum-start-sticky-thread-separator {
  height: 1px;
  border-top: none;
  margin: 0;
  background: none; }

.forum-start-forum {
  position: relative;
  height: 56px; }

.forum-start-forum-has-official {
  border-left: 3px solid #cce3f9; }

.forum-start-forum-separator {
  height: 1px;
  background-color: #e8e8e8;
  width: 100%;
  margin-top: 1px;
  margin-bottom: 1px; }

.forum-start-forum-title {
  float: left;
  margin-left: 39px;
  margin-top: 10px;
  width: 550px;
  overflow: hidden;
  white-space: nowrap;
  position: relative; }

.forum-start-container .forum-start-forum-bodycell a {
  font-size: 12px;
  font-weight: normal; }
.forum-start-container .forum-start-forum-title a {
  font-size: 14px;
  font-weight: bold; }
.forum-start-container .forum-start-forum-title p a {
  font-size: 11px;
  font-weight: normal; }

.forum-title-quicklinks {
  font-size: 11px;
  position: relative;
  color: #8b8b8b;
  margin-left: 10px; }

.forum-title-quicklinks a {
  font-size: 11px; }

.forum-forumlist .forum-start-forum-title {
  padding-left: 0;
  margin-left: 16px;
  width: 590px; }
  .forum-forumlist .forum-start-forum-title:hover {
    text-decoration: none; }
  .forum-forumlist .forum-start-forum-title h4:hover {
    text-decoration: underline; }

.forum-start-forum-title-prefix {
  display: inline-block;
  vertical-align: top;
  margin-top: 3px;
  margin-right: 3px;
  font-size: 12px;
  color: #a8a8a8; }

.forum-start-forum-title p, .forum-start-forum-title p a {
  font-size: 12px;
  margin-top: 6px;
  font-weight: normal;
  padding-bottom: 1px; }

.forum-start-forum-title p {
  color: #353535;
  width: 97%;
  word-wrap: normal;
  text-overflow: ellipsis;
  overflow: hidden; }

.forum-start-forum-title-block {
  display: inline-block;
  width: 90%; }

.forum-start-forum-title .forum-icons {
  float: left;
  margin-right: 6px; }
  .forum-start-forum-title .forum-icons div {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 29px;
    top: 10px;
    left: -3px; }
    .forum-start-forum-title .forum-icons div.premium {
      background: url(../premium/icon-p-s.png) no-repeat; }
    .forum-start-forum-title .forum-icons div.locked {
      background: url(../forum/locked-icon-white.png) no-repeat; }
    .forum-start-forum-title .forum-icons div.linked {
      background: url(../forum/linked-icon-white.png) no-repeat;
      left: -2px; }

.forum-thread-icons {
  position: absolute;
  height: 15px;
  top: 13px;
  left: 2px;
  text-align: center;
  width: 36px;
  z-index: 5; }

.forum-thread-icons .icon {
  display: block;
  margin-left: 10px;
  margin-bottom: 3px; }

.forum-thread-icons .sticky {
  background: url(../forum/sticky-icon-white.png) no-repeat;
  width: 14px;
  height: 15px; }

.forum-thread-icons .locked {
  background: url(../forum/locked-icon-white.png) no-repeat;
  width: 14px;
  height: 15px; }

.forum-start-forum-unread {
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 56px;
  background-color: #b6b6b6; }

.forum-start-forum-latest {
  width: 232px; }

.forum-start-forum-topics {
  width: 77px;
  text-align: center; }

.forum-start-forum-posts {
  width: 65px;
  text-align: center; }

.forum-start-forum-headercell {
  float: right;
  height: 27px; }

.forum-start-forum-headercellleft {
  border: 0;
  /*margin-left: 10px;*/ }

.forum-start-forum-bodycell {
  float: right;
  height: 58px;
  margin-top: -1px;
  margin-bottom: -1px;
  border-left: 1px solid #f2f2f2; }

.forum-start-forum-forum {
  float: left; }

.forum-start-forum-headercell p {
  font-weight: normal;
  line-height: 30px;
  color: #8b8b8b;
  margin-left: 9px;
  margin-right: 14px;
  font-size: 11px; }

.forum-start-forum-bodycell p {
  line-height: 56px;
  color: #a8a8a8;
  font-size: 12px; }

.forum-start-forum-latest .avatar {
  float: left; }

.forum-start-forum-latest-info {
  font-size: 11px;
  width: 186px;
  overflow: hidden;
  height: 38px;
  color: #a8a8a8;
  margin-left: 0;
  margin-top: 16px;
  float: right; }

.forum-start-forum-latest-info a {
  white-space: nowrap;
  font-size: 11px;
  font-weight: normal; }

.forum-start-forum-latest-info a.forum-start-forum-latest-info-title {
  text-overflow: ellipsis;
  overflow: hidden;
  width: 179px;
  float: left;
  height: 15px; }

.forum-start-forum-latest-info div {
  margin-top: 4px; }

.forum-start-forum-latest-info .forum-ago {
  float: left;
  line-height: 14px; }

.forum-start-forum-latest-info .forum-username {
  max-width: 100px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  float: right;
  color: #a8a8a8;
  height: 14px;
  line-height: 14px; }
  .forum-start-forum-latest-info .forum-username a {
    font-size: 11px; }

.forum-start-forum-latest .avatar {
  float: right;
  margin-top: 16px;
  margin-right: 8px; }

.forum-start-latest-container {
  float: right;
  width: 247px; }

.forum-start-latest-container h2 {
  color: #a8a8a8;
  font-size: 11px;
  margin-bottom: 8px;
  font-family: Tahoma, Arial, sans-serif; }

.forum-start-latest-container .forum-start-forum-latest {
  padding-top: 4px;
  padding-bottom: 5px;
  width: 247px; }

.forum-start-latest-container .forum-start-forum-latest-info {
  width: 210px;
  height: 30px;
  margin-left: 0;
  margin-top: 0;
  margin-bottom: 0; }

.forum-start-latest-container .forum-start-forum-latest .avatar {
  margin-top: 0;
  margin-right: 0; }

.forum-search-container {
  float: right; }

.forum-index-page {
  position: relative; }
  .forum-index-page .forum-search-container {
    position: absolute;
    top: 0px;
    right: 0; }

.forum-sidebar-search-form-input {
  background-color: #fff;
  border: 1px solid #cccccc;
  border-top-color: #ababab;
  font-size: 12px;
  height: 16px;
  line-height: 16px;
  padding: 4px 6px;
  width: 204px;
  float: left;
  margin-right: 4px; }

.forum-sidebar-search-input::-webkit-input-placeholder, .forum-sidebar-search-input:-moz-placeholder {
  color: #a8a8a8; }

.forum-sidebar-search-form-line {
  margin-bottom: 11px; }

.forum-search-form {
  margin: 16px 0 15px; }

.forum-search-form-input {
  background-color: #fff;
  border: 1px solid #cccccc;
  border-top-color: #ababab;
  font-size: 14px;
  height: 18px;
  line-height: 18px;
  padding: 4px 10px;
  width: 203px;
  margin-right: 4px; }

.forum-search-form-input::-webkit-input-placeholder, .forum-search-form-input:-moz-placeholder {
  color: #a8a8a8; }

.forum-search-form .forum-advanced-search select {
  padding: 5px;
  width: 150px;
  margin-top: 4px;
  margin-bottom: 4px; }

.forum-post-preview-container {
  clear: both;
  margin-top: 16px; }

.forum-postreply-container {
  margin-top: 12px;
  position: relative;
  z-index: 1; }

.forum-postreply {
  position: relative; }

.forum-postreply .avatar {
  position: relative;
  float: left;
  top: 40px; }

.forum-postreply textarea {
  resize: none;
  font-size: 12px;
  font-family: arial, sans-serif;
  position: relative;
  float: left;
  left: 16px;
  margin-top: 5px;
  width: 875px;
  height: 97px; }

.forum-postreply-container .forum-postreply textarea {
  height: 395px; }

.forum-postreply input[type=submit] {
  float: right;
  margin-top: 15px; }

.forum-postreply-official-selector {
  float: right;
  font-size: 12px;
  margin-right: 10px;
  margin-top: 4px; }

.forum-postreply-official-selector input {
  position: relative;
  top: 1px; }

.forum-postreply-error {
  background: #FFE3E3;
  border: 1px solid #FFA0A0;
  color: #666666;
  font-weight: bold;
  font-size: 12px;
  padding: 7px 32px 7px 32px;
  width: 320px;
  position: relative;
  left: 13px;
  top: 8px; }

.forum-postreply-disabled {
  font-size: 16px;
  font-weight: bold;
  color: #353535;
  text-align: center;
  margin-top: 50px;
  margin-bottom: 50px; }

.forum-preview-post {
  float: right;
  margin-right: 5px;
  margin-left: 10px; }

.forum-postreply .forum-preview-post {
  margin-top: 15px; }

.forum-bbcode-edit {
  position: relative;
  float: right; }

.forum-bbcode-quickreply {
  position: relative;
  float: right; }

.forum-bbcode-reply {
  position: relative;
  float: right;
  margin-top: 8px; }

.forum-quickreply {
  padding-top: 0;
  margin-top: 16px; }

.forum-quickreply .common-replyform-avatar {
  width: 60px;
  height: 60px;
  position: absolute;
  top: 54px;
  left: 16px; }

textarea.forum-quickreply {
  width: 868px;
  margin-top: 10px;
  padding-top: 10px;
  left: 70px;
  position: relative; }

.forum-newthread-container .forum-preview-post {
  margin-top: 0; }

.forum-postreply-container .forum-preview-post {
  margin-right: 10px; }

.forum-breadcrumbs {
  margin-top: -6px; }

.forum-start-container .forum-breadcrumbs a {
  font-size: 11px;
  font-weight: normal; }

.forum-breadcrumbs span {
  font-size: 9px;
  color: #666;
  margin-left: 5px;
  margin-right: 5px; }

.forum-editpost-official-selector {
  float: right;
  margin-top: 20px;
  font-size: 12px;
  margin-right: 5px; }

.forum-newthread-container {
  width: 988px;
  margin-top: 16px;
  float: left; }

.forum-newthread {
  position: relative; }

.forum-newthread .avatar {
  position: absolute;
  left: 16px;
  top: 42px; }

.forum-newthread textarea {
  overflow-y: auto;
  font-size: 12px;
  font-family: arial, sans-serif;
  color: #434343;
  padding: 5px;
  width: 944px;
  max-width: 944px;
  height: 305px; }

.forum-newthread input[type=text] {
  padding: 5px;
  width: 301px;
  color: #434343;
  font-size: 12px;
  font-family: arial, sans-serif; }

.forum-newthread input[type=submit] {
  float: right; }

.forum-newthread label {
  display: block;
  font-size: 12px;
  font-weight: bold;
  color: #666; }

.forum-newthread .forum-newthread-bodylabel {
  width: 200px;
  padding-top: 14px; }

.forum-newthread-official-selector {
  float: right;
  margin-right: 10px;
  margin-top: 5px; }

.forum-newthread-official-selector label {
  font-weight: normal; }

.forum-newthread-official-selector input {
  position: relative;
  top: 1px; }

.forum-newthread-error {
  background: #FFE3E3;
  border: 1px solid #FFA0A0;
  color: #666666;
  font-weight: bold;
  font-size: 12px;
  padding: 7px 32px 7px 32px;
  position: absolute;
  left: 13px;
  bottom: 19px; }

.forum-newthread-label-cell {
  padding-right: 14px; }

.forum-newthread-label-cell.vtop {
  vertical-align: top; }

.forum-newthread-form-table td {
  padding-top: 10px; }

.forum-threadview-post {
  background: transparent none;
  display: table;
  margin: 0 -3px -2px -1px;
  border-spacing: 1px;
  border-collapse: separate; }

.forum-threadview-post-ea {
  background: #e6f3ff;
  border: 3px solid #cce3f9;
  border-right-width: 1px;
  border-left-width: 1px; }

.forum-threadview-post-censored {
  opacity: 0.5;
  filter: alpha(opacity=50); }

.forum-threadview-post-poster {
  background: rgba(7, 7, 7, 0.7);
  display: table-cell;
  width: 200px;
  padding-left: 92px;
  margin: 0;
  position: relative;
  float: none; }

.forum-threadview-post-content {
  width: 780px;
  float: left;
  font-size: 13px;
  color: #353535;
  padding: 12px 0 16px;
  line-height: 18px;
  word-wrap: break-word;
  max-width: 734px; }

.forum-threadview-post-administrate {
  width: 50px;
  float: left;
  font-size: 12px;
  color: #353535;
  padding-top: 12px;
  line-height: 18px; }

.forum-threadview-post-poster-name {
  margin-left: 16px;
  width: 140px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 16px; }

.forum-threadview-post-text {
  min-height: 56px;
  word-break: break-word; }
  .forum-threadview-post-text a {
    text-decoration: underline; }

.forum-threadview-post-censored .forum-threadview-post-text {
  font-style: italic; }

.forum-editpost-preview .common-box-inner {
  padding: 0px; }

#forum-preview-post-area .spoiler, .forum-threadview-post-text .spoiler {
  background: #353535;
  color: #353535;
  cursor: pointer; }

#forum-preview-post-area h1, .forum-threadview-post-text h1 {
  font-size: 20px;
  line-height: 22px; }
  #forum-preview-post-area h1 + br, .forum-threadview-post-text h1 + br {
    display: none; }

.is-touch #forum-preview-post-area .spoiler:before, .is-touch .forum-threadview-post-text .spoiler:before {
  content: attr(data-tooltip);
  color: rgba(255, 255, 255, 0.75);
  padding-left: 8px; }

.forum-threadview-post-text .spoiler a {
  color: #353535; }

.forum-threadview-post-signature {
  border-top: 1px solid #646464;
  padding-top: 5px;
  margin-top: 5px;
  color: #898989;
  word-break: break-word; }

.forum-threadview-post-tags {
  margin: 0px 0 0px 16px;
  float: left; }
  .forum-threadview-post-tags ul {
    clear: both; }
    .forum-threadview-post-tags ul li {
      float: left;
      margin-right: 2px; }

.forum-threadview-avatar-container {
  position: absolute;
  top: 34px;
  left: 16px;
  height: 60px;
  width: 60px; }

.forum-threadview-post-poster .avatar {
  display: block;
  margin-top: 8px;
  margin-left: 16px;
  clear: both;
  position: relative; }

.forum-threadview-post-content blockquote {
  background: #fafafa;
  border: 1px solid #e8e8e8;
  padding: 10px;
  margin-top: 4px;
  margin-bottom: 4px;
  color: #a8a8a8; }

.forum-threadview-post-content blockquote em {
  font-style: normal;
  color: #a8a8a8;
  font-size: 11px;
  font-weight: bold; }

.forum-threadview-post-poster-country {
  margin-left: 36px;
  position: relative;
  margin-top: 11px;
  font-size: 11px;
  color: #757575; }

.forum-threadview-post-poster-country img {
  position: absolute;
  left: -20px;
  bottom: 50%;
  margin-bottom: -6px; }

.forum-threadview-post-poster-posts, .forum-threadview-post-poster-enlisted {
  margin-top: 8px;
  font-size: 11px;
  color: #acacac;
  margin-left: 16px; }

.forum-threadview-post-poster-posts em, .forum-threadview-post-poster-enlisted em {
  font-style: normal;
  font-size: 11px;
  color: #a8a8a8; }

.forum-threadview-post-poster-enlisted {
  margin-bottom: 12px; }

.forum-threadview-post-poster-enlisted img {
  margin-bottom: -1px;
  margin-right: 2px; }

.forum-threadview-post-quote {
  float: right; }

.forum-threadview-post-edit {
  float: right; }

.forum-view-latest-posts {
  padding-top: 5px; }

.forum-view-latest-posts a {
  font-weight: normal;
  font-size: 11px; }

.forum-threadview-post-report {
  height: 14px;
  float: right;
  border-right: 1px solid #ccc;
  padding-right: 5px;
  margin-top: 2px; }

.forum-threadview-post-ago {
  color: #acacac;
  font-size: 11px;
  margin-bottom: 12px; }

.forum-threadview-separator {
  height: 1px;
  margin-left: 16px;
  margin-right: 16px;
  border-top: 1px solid #f2f2f2; }

.forum-threadview-pages-top, .forum-threadview-pages-bottom {
  height: 43px;
  background: #f3f3f3 url(../forum/title-shade.png) no-repeat center center;
  border: 1px solid #dbdbdb; }

.forum-threadview-pages-bottom {
  margin-top: 1px;
  border-top: 1px solid #dbdbdb; }

.forum-post-select-checkbox {
  float: right; }

.forum-no-found {
  margin: 50px;
  text-align: center;
  color: #fff; }

.forum-page-title {
  color: #000;
  font-size: 25px;
  font-weight: bold;
  margin: 8px 0 12px;
  font-family: Arial, sans-serif; }
  .forum-page-title h1 {
    margin-bottom: 0; }

.forum-focus-bar-view-bottom {
  position: relative;
  /*height: 26px;*/
  margin-top: 8px; }

.forum-focus-bar-view-top {
  position: relative;
  /*height: 26px;*/
  margin-bottom: 8px; }

.forum-search-sort-container span {
  text-transform: uppercase;
  color: #a8a8a8;
  font-size: 11px;
  font-weight: bold; }

.forum-search-sort-container select {
  padding: 5px;
  margin-left: 7px;
  min-width: 150px; }

.forum-admin-multi-container {
  float: right;
  font-size: 12px; }

.forum-start-latest-separator {
  height: 26px;
  float: right;
  width: 200px; }

.forum-report-container {
  position: absolute;
  right: 110px;
  top: 9px; }

.forum-thread-title-edit {
  margin: 9px 0 12px 0;
  position: relative;
  top: -7px;
  left: -4px; }

.forum-thread-title-edit input[type=text] {
  font-size: 22px;
  font-weight: bold; }

.forum-edit-title {
  position: absolute;
  right: 140px;
  top: 7px; }

.forum-edit-title a {
  font-weight: normal;
  font-size: 11px; }

.forum-reply-container {
  float: right; }

.forum-hidden-post {
  display: none; }

.forum-thread-is-locked {
  padding-left: 20px;
  background: url(../forum/locked-icon-white.png) no-repeat scroll 0 6px transparent;
  padding-top: 6px;
  font-weight: bold;
  font-size: 16px; }
  .forum-thread-is-locked.top {
    float: right;
    margin-top: 20px; }

.forum-sticky-separator {
  height: 16px; }

.forum-start-forum .forum-start-forum-title-username {
  color: #a8a8a8;
  white-space: nowrap;
  overflow: hidden;
  max-width: 350px; }

.forum-search-results-heading {
  font-size: 12px;
  font-family: Tahoma, sans-serif;
  font-weight: bold;
  line-height: 23px; }
  .forum-search-results-heading span {
    word-break: break-word; }

.forum-search-results-none {
  padding: 40px 0 !important;
  font-size: 30px;
  font-weight: bold;
  text-align: center;
  width: 100%; }

.forum-search-results-item {
  padding: 0 0 12px; }

.forum-search-results-item-title {
  float: none;
  display: block; }

.forum-search-results-item-title .forum-search-results-icons {
  float: left;
  margin-right: 4px; }

.forum-search-subline {
  margin-top: 5px;
  font-size: 11px;
  font-weight: normal; }

.forum-search-subline a {
  font-size: 11px;
  font-weight: normal; }

.forum-search-results-item-title h3 {
  float: left;
  text-transform: none;
  margin: 0;
  font-family: Arial, sans-serif;
  font-size: 12px; }

.forum-search-results-item-title a {
  font-weight: normal;
  font-size: 14px;
  line-height: 19px;
  float: left; }

.forum-search-results-item-title span {
  float: left;
  padding-left: 10px;
  font-size: 11px;
  color: #a8a8a8;
  line-height: 14px;
  font-weight: normal;
  padding-top: 3px; }

.forum-search-results-item-post {
  color: #353535;
  font-size: 12px;
  padding-top: 4px;
  float: none;
  display: block;
  line-height: 19px; }

.forum-search-results-item-post b {
  background-color: #fbf2d4;
  font-weight: bold;
  padding: 0 1px; }

.forum-posthistory-container {
  padding-bottom: 10px; }

.forum-posthistory-container b {
  font-size: 12px; }

.forum-posthistory-container .forum-start-border {
  margin-top: 5px; }

.forum-posthistory-container .forum-posthistory-revisions .forum-threadview-post {
  background-color: #fafafa; }

/* forum auto-search
 ------------------------------------------------------------------ */
.forum-postsimilarlist {
  float: right;
  width: 318px;
  margin: 15px 0 19px 16px;
  position: relative; }

.forum-postsimilarlist h2 {
  font-family: Tahoma, Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  color: #a8a8a8;
  margin-bottom: 12px; }

.forum-postsimilarlist-hr {
  height: 1px;
  margin-top: 8px;
  margin-bottom: 8px;
  border: 0px;
  background-color: #808080;
  opacity: 0.2;
  filter: alpha(opacity=20); }

.forum-postsimilarlist-sticky {
  position: relative;
  top: 3px; }

.forum-postsimilarlist a {
  line-height: 16px;
  margin-right: 5px; }

.forum-postsimilarlist span {
  white-space: nowrap;
  color: #6C6C6C;
  line-height: 16px;
  font-size: 11px; }

.forum-disabled-container {
  width: 600px;
  padding: 30px;
  margin: auto;
  text-align: center; }

.forum-activity {
  position: relative;
  margin-top: 16px; }

.forum-activity .common-box-inner {
  padding: 0px; }

#forum-activity-view-more {
  display: block;
  text-align: center;
  border-bottom: 1px solid #fff;
  margin: 4px 0 6px; }

#forum-activity-view-more a {
  text-decoration: none;
  display: block; }

#forum-activity-view-more .common-cleanbutton-middle {
  width: 972px; }

#forum-activity-view-more a:hover {
  background-position: 0 100%; }

.forum-start-container {
  width: auto;
  float: none; }
  .forum-start-container .common-replyform-form-body {
    color: #FFF; }
  .forum-start-container .pagination-paginationbutton-extra {
    display: none;
    background: url(../forum/pagination-icons-white.png) no-repeat;
    width: 8px;
    height: 9px;
    top: 6px;
    position: relative; }
  .forum-start-container .forum-edit-title a {
    cursor: pointer; }
  .forum-start-container .forum-base-button-search {
    padding: 0 10px;
    margin-left: -1px; }
  .forum-start-container .forum-sidebar-search-form-input {
    height: 24px;
    border: 1px solid #d5dde5; }
  .forum-start-container .pagination-pagination-left {
    float: right;
    /* http://i.imgur.com/UkVej.gif */ }
  .forum-start-container .pagination-pagination-right {
    float: left;
    /* http://i.imgur.com/UkVej.gif */ }
  .forum-start-container .common-box-bottom-border {
    display: none; }
  .forum-start-container .common-cleanbutton {
    border: 0;
    cursor: pointer; }
    .forum-start-container .common-cleanbutton a {
      display: inline-block;
      height: 29px;
      line-height: 29px;
      text-decoration: none;
      text-transform: uppercase;
      font-size: 16px;
      padding: 1px 20px;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      color: #d5dde5;
      border: 1px solid #d5dde5;
      background-color: transparent;
      background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.3) 100%);
      background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.3) 100%); }
      .forum-start-container .common-cleanbutton a:hover:not([disabled]):not(.disabled) {
        background-image: -webkit-linear-gradient(top, rgba(12, 12, 12, 0.6) 0%, rgba(63, 63, 63, 0.8) 100%);
        background-image: linear-gradient(to bottom, rgba(12, 12, 12, 0.6) 0%, rgba(63, 63, 63, 0.8) 100%);
        color: white;
        text-shadow: 0 0 0.5em rgba(255, 255, 255, 0.8);
        border-color: white; }
      .forum-start-container .common-cleanbutton a:active:not([disabled]):not(.disabled), .forum-start-container .common-cleanbutton a.active:not([disabled]):not(.disabled) {
        background-color: rgba(0, 0, 0, 0);
        background-image: -webkit-linear-gradient(top, #ffffff 0%, #d5dde5 50%, #b79d83 100%);
        background-image: linear-gradient(to bottom, #ffffff 0%, #d5dde5 50%, #b79d83 100%);
        text-shadow: none;
        color: black;
        border: 1px solid #b79d83; }
  .forum-start-container .common-cleanbuttonsmall {
    margin-left: 16px;
    cursor: pointer; }
  .forum-start-container .forum-threadview-post-report {
    border-right: none;
    padding-right: 0; }

#forum-activity-view-more {
  border: 0;
  margin: 1px 0 17px; }
  #forum-activity-view-more a {
    border: 0;
    display: block;
    background: rgba(7, 7, 7, 0.5); }
    #forum-activity-view-more a:hover {
      background: rgba(7, 7, 7, 0.6); }

.forum-search-form {
  margin: 0; }
  .forum-search-form > input {
    margin-bottom: 10px;
    margin-right: 10px; }
  .forum-search-form .forum-advanced-search {
    margin-bottom: 10px; }
    .forum-search-form .forum-advanced-search > .ui-select {
      margin-right: 10px; }

.forum-focus-bar-view-top {
  margin: 7px 0; }

.forum-search-results-item {
  padding: 16px; }

.forum-search-results-item-title span {
  color: #a8a8a8; }

.forum-search-subline {
  color: #a8a8a8; }

.forum-search-sort-container span {
  color: #fff; }

.forum-hottopics .forum-start-border {
  margin-bottom: 16px; }

.forum-activity {
  margin-top: 0; }
  .forum-activity .forum-start-border {
    margin-bottom: 1px; }

.forum-start-forum-has-official {
  border-left: 0; }

.forum-threadview-post-ea {
  border: 0; }

.forum-start-sticky-thread-separator {
  background: 0;
  border: 0;
  margin: 0;
  padding: 0;
  height: 8px; }

.forum-threadview-post-ea, .forum-start-forum-has-official {
  position: relative; }
  .forum-threadview-post-ea:after, .forum-start-forum-has-official:after {
    content: "";
    display: block;
    position: absolute;
    top: 1px;
    bottom: 1px;
    left: 1px;
    background-color: #1b61bf;
    width: 2px; }
  .forum-threadview-post-ea .forum-threadview-post-poster, .forum-start-forum-has-official .forum-threadview-post-poster {
    background: #16263f !important; }
  .forum-threadview-post-ea .forum-threadview-post-content, .forum-start-forum-has-official .forum-threadview-post-content {
    background: rgba(22, 38, 63, 0.7) !important; }

.forum-post-select-checkbox {
  margin-left: 16px; }

.forum-start-title {
  position: relative; }

/*
    The following is a hack to make longer titles wrap dynamically and also
    be wrapped by the buttons to the right of the title.
*/
.forum-start-title, .forum-page-title {
  margin: 16px 0; }

.forum-start-forum-separator {
  background: transparent;
  margin: 0; }

.forum-threadview-separator {
  display: none; }

.forum-start-info {
  height: 30px; }

.forum-start-forum-headercell {
  height: auto; }
  .forum-start-forum-headercell p {
    line-height: 30px;
    color: #a8a8a8; }

.forum-thread-icons .sticky {
  background: url(../forum/sticky-icon-white.png) no-repeat; }

.forum-thread-icons .locked {
  background: url(../forum/locked-icon-white.png) no-repeat; }

.forum-start-border .common-box-title {
  color: #a8a8a8;
  text-transform: uppercase;
  font-size: 11px;
  margin-bottom: 1px;
  padding-top: 1px; }
  .forum-start-border .common-box-title .forum-start-forum-headercell {
    background: rgba(7, 7, 7, 0.8);
    box-sizing: border-box; }
.forum-start-border .forum-start-forum-title {
  width: 665px;
  height: 55px;
  background-color: rgba(7, 7, 7, 0.5);
  padding-left: 16px;
  padding-top: 10px;
  height: 45px;
  margin: 0;
  position: relative; }
  .forum-start-border .forum-start-forum-title h4 {
    font-size: 14px;
    line-height: normal;
    margin: 0;
    font-family: Arial, sans-serif;
    font-weight: bold;
    display: inline-block;
    word-wrap: normal;
    text-overflow: ellipsis;
    overflow: hidden; }
  .forum-start-border .forum-start-forum-title:hover {
    text-decoration: none;
    background-color: rgba(7, 7, 7, 0.3); }
    .forum-start-border .forum-start-forum-title:hover h4 {
      text-decoration: underline; }
.forum-start-border .forum-start-form-thread-links {
  position: absolute;
  left: 40px;
  top: 31px;
  font-size: 12px; }
.forum-start-border .forum-start-forum:not(.forum-forumlist) .forum-start-forum-title {
  width: 641px;
  padding-left: 40px; }
.forum-start-border .forum-start-forum-bodycell {
  margin: 0;
  border-left: 0;
  margin-left: 1px;
  background: rgba(7, 7, 7, 0.5);
  height: 55px; }
  .forum-start-border .forum-start-forum-bodycell p {
    color: #fff; }
.forum-start-border .forum-start-forum-forum {
  width: 681px; }
.forum-start-border .forum-start-forum-latest {
  width: 232px;
  margin-left: 1px; }
.forum-start-border .forum-start-forum-topics {
  width: 77px;
  margin-left: 1px; }
.forum-start-border .forum-start-forum-posts {
  width: 65px;
  margin-left: 1px; }

.forum-start-info .forum-start-forum-forum {
  width: 615px; }

.forum-start-forum-forum p {
  padding-left: 7px; }

.forum-start-white-title p {
  color: #fff;
  font-size: 16px;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }

.common-box-title.forum-box-title .forum-start-forum-forum {
  width: 681px; }

.forum-no-found {
  background: rgba(7, 7, 7, 0.5);
  margin: 0;
  padding: 50px; }

.forum-start-forum {
  height: 55px; }

.forum-start-info-bottom {
  display: none; }

.forum-forumlist .forum-start-forum-title {
  width: 599px; }
  .forum-forumlist .forum-start-forum-title p {
    color: #a8a8a8; }
.forum-forumlist .forum-start-forum-latest-info > div {
  width: 186px; }
.forum-forumlist .forum-start-forum-latest-info span {
  display: inline-block; }
.forum-forumlist .forum-start-forum-latest-info .forum-ago {
  float: none; }
.forum-forumlist .forum-start-forum-latest-info .forum-username {
  padding-right: 3px;
  float: left; }
  .forum-forumlist .forum-start-forum-latest-info .forum-username:after {
    content: "-"; }

.forum-threadview-post {
  background: transparent none;
  display: table;
  margin: 0 -2px -2px -1px;
  border-spacing: 1px;
  border-collapse: separate;
  position: relative;
  min-height: 142px; }
  .forum-threadview-post .forum-threadview-post-edit, .forum-threadview-post .forum-threadview-post-quote, .forum-threadview-post .forum-threadview-post-report {
    opacity: 0; }
  .forum-threadview-post:hover .forum-threadview-post-edit, .forum-threadview-post:hover .forum-threadview-post-quote, .forum-threadview-post:hover .forum-threadview-post-report {
    opacity: 1; }
  .forum-threadview-post .forum-threadview-post-poster {
    background: none rgba(7, 7, 7, 0.8);
    padding-left: 16px;
    display: table-cell;
    margin: 0;
    position: relative;
    float: none;
    vertical-align: top;
    width: 200px; }
    .forum-threadview-post .forum-threadview-post-poster .avatar {
      margin: 0; }
    .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-poster-name, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-tags, .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-poster-enlisted {
      margin-left: 0;
      margin-right: 0;
      float: none; }
    .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-poster-name {
      font-size: 12px;
      font-weight: bold;
      padding-top: 12px; }
    .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-tags {
      padding-left: 70px;
      min-height: 60px; }
    .forum-threadview-post .forum-threadview-post-poster .forum-threadview-post-poster-enlisted {
      padding-left: 0; }
  .forum-threadview-post .forum-threadview-post-content {
    width: 734px;
    padding: 20px;
    background: rgba(7, 7, 7, 0.6);
    display: table-cell;
    float: none;
    vertical-align: top;
    padding: 12px 20px;
    word-break: break-word;
    max-width: 734px; }
    .forum-threadview-post .forum-threadview-post-content .forum-threadview-post-ago {
      color: #a8a8a8;
      margin-bottom: 8px;
      border-bottom: 1px solid rgba(168, 168, 168, 0.5); }
    .forum-threadview-post .forum-threadview-post-content .forum-threadview-post-text {
      color: #fff; }
    .forum-threadview-post .forum-threadview-post-content blockquote {
      background: rgba(0, 0, 0, 0.3);
      border: 1px solid rgba(167, 167, 167, 0.3); }
    .forum-threadview-post .forum-threadview-post-content .forum-post-select-checkbox {
      margin-left: 15px;
      margin-top: 0; }
  .forum-threadview-post.forum-threadview-post-censored .forum-threadview-post-poster, .forum-threadview-post.forum-threadview-post-censored .forum-threadview-post-content {
    opacity: 0.5; }

.forum-postreply-disabled {
  color: white; }

.forum-newthread-container {
  float: none;
  width: auto; }

.forum-newthread-height form {
  padding: 0; }

.forum-newthread-form-table tr:first-child td {
  padding-top: 0; }

.forum-newthread label {
  color: #fff; }
  .forum-newthread label.upper {
    text-transform: uppercase;
    font-size: 14px; }
.forum-newthread textarea {
  width: 948px;
  max-width: 948px;
  color: #fff; }
.forum-newthread input[type=text] {
  color: #fff; }

/*
    Activitystream component CSS resource
*/
.activity-stream {
  position: relative;
  /*.activitystream-item.large > .share {*/
  /*top: 0;*/
  /*margin-top: 0;*/
  /*}*/
  /*.activitystream-item .award-item img {*/
  /*max-height: 52px;*/
  /*max-width: 100%;*/
  /*}*/ }
  .activity-stream ul.activitystream-list {
    padding: 0; }
  .activity-stream .activitystream-list .activitystream-item {
    position: relative;
    padding: 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
  .activity-stream .activitystream-item.shareable {
    padding-right: 22px; }
  .activity-stream .activitystream-list.shareable-only .item:not(.shareable) {
    display: none; }
  .activity-stream .activitystream-list .activitystream-item:last-child {
    margin-bottom: 0;
    border-bottom: 0;
    padding-bottom: 0; }
  .activity-stream .activitystream-item > .item-body {
    position: relative;
    padding-left: 52px;
    color: #fff; }
    .activity-stream .activitystream-item > .item-body .clear.spacing {
      height: 4px; }
  .activity-stream .activitystream-item.large > .item-body .clear.spacing {
    height: 8px; }
  .activity-stream .activitystream-item.medium > .item-body .clear.spacing {
    height: 0; }
  .activity-stream .activitystream-item > .avatar {
    position: absolute;
    left: 16px;
    height: auto;
    width: auto;
    padding: 0; }
  .activity-stream .activitystream-item .item-body > .user {
    font-size: 12px;
    margin-bottom: 1px; }
    .activity-stream .activitystream-item .item-body > .user .description {
      line-height: 16px; }
    .activity-stream .activitystream-item .item-body > .user a {
      font-size: 12px;
      font-weight: normal; }
    .activity-stream .activitystream-item .item-body > .user .name {
      font-weight: bold; }
  .activity-stream .activitystream-item .item-body > .details {
    line-height: 1.8;
    font-size: 11px;
    color: #a8a8a8; }
    .activity-stream .activitystream-item .item-body > .details a {
      font-size: 11px;
      font-weight: normal; }
  .activity-stream .activitystream-item > .share {
    width: 14px;
    height: 14px;
    position: absolute;
    right: 16px;
    top: 16px;
    display: none;
    background: url(../profile/profile-icons.png) -140px 0 no-repeat;
    cursor: pointer;
    opacity: 0.8;
    -webkit-transition: opacity 0.1s ease-out;
    -moz-transition: opacity 0.1s ease-out;
    -ms-transition: opacity 0.1s ease-out;
    -o-transition: opacity 0.1s ease-out;
    transition: opacity 0.1s ease-out; }
    .activity-stream .activitystream-item > .share:hover {
      opacity: 1; }
  .activity-stream .activitystream-item.shareable > .share {
    display: block; }
  .activity-stream .activitystream-item.shareable.shared > .share {
    cursor: default;
    background-position: -126px 0;
    opacity: 1; }
  .activity-stream .activitystream-item .item-body > .details .like {
    cursor: pointer;
    opacity: 0.5;
    margin-top: -2px;
    display: inline-block;
    background: url(../feed/icon-hooah-activitystream.png) no-repeat;
    width: 18px;
    height: 18px; }
    .activity-stream .activitystream-item .item-body > .details .like.mohw {
      background-image: url(../feed/icon-salute.png); }
    .activity-stream .activitystream-item .item-body > .details .like:hover {
      background-position: 0 -18px;
      opacity: 1; }
  .activity-stream .activitystream-item.liked .item-body > .details .like {
    background-position: 0 -36px;
    cursor: default;
    opacity: 1; }
    .activity-stream .activitystream-item.liked .item-body > .details .like:hover {
      background-position: 0 -36px;
      cursor: default;
      opacity: 1; }
  .activity-stream .activitystream-item .likes-count[data-numlikes="0"] {
    display: none; }
  .activity-stream .activitystream-item .solo-link {
    margin: 4px 0 0; }
    .activity-stream .activitystream-item .solo-link a {
      font-size: 12px;
      font-weight: normal; }
  .activity-stream .activitystream-item .record-item {
    margin: 2px 0 0 0;
    background-repeat: no-repeat; }
    .activity-stream .activitystream-item .record-item img {
      float: left;
      margin: 0 4px 0 0;
      max-height: 30px; }
    .activity-stream .activitystream-item .record-item .description {
      color: #353535;
      font-size: 11px;
      line-height: 16px; }
  .activity-stream .activitystream-list .activitystream-item .record-item .record:before {
    content: " \A ";
    white-space: pre; }
  .activity-stream .activitystream-item .record-item .record .value {
    font-weight: bold;
    font-size: 12px;
    color: #353535; }
  .activity-stream .activitystream-item .tour-item {
    margin: 2px 0 0 0;
    background-repeat: no-repeat;
    color: #353535;
    font-size: 11px; }
    .activity-stream .activitystream-item .tour-item img {
      float: left;
      margin: 0 4px 0 0;
      max-height: 30px; }
    .activity-stream .activitystream-item .tour-item .level {
      font-weight: bold; }
  .activity-stream .feed-sharedgameevent-body {
    margin: 10px 0; }
    .activity-stream .feed-sharedgameevent-body.activitystream-item {
      margin: 2px 0;
      display: table-cell; }
      .activity-stream .feed-sharedgameevent-body.activitystream-item .rank-icon {
        display: table-cell; }
        .activity-stream .feed-sharedgameevent-body.activitystream-item .rank-icon img {
          vertical-align: middle; }
        .activity-stream .feed-sharedgameevent-body.activitystream-item .rank-icon h1 {
          vertical-align: middle;
          margin-top: 6px;
          display: inline-block;
          font-family: "BebasNeueRegular", Arial, sans-serif;
          font-size: 48px;
          font-weight: normal;
          color: #3c3c3c; }
        .activity-stream .feed-sharedgameevent-body.activitystream-item .rank-icon h2 {
          font-size: 14px;
          color: #3c3c3c; }
        .activity-stream .feed-sharedgameevent-body.activitystream-item .rank-icon h3 {
          font-size: 11px;
          font-weight: normal; }
        .activity-stream .feed-sharedgameevent-body.activitystream-item .rank-icon .info {
          margin-left: 10px;
          display: inline-block;
          vertical-align: middle; }
      .activity-stream .feed-sharedgameevent-body.activitystream-item .record-item {
        width: 450px;
        height: 45px;
        margin: 6px 0 8px 0; }
        .activity-stream .feed-sharedgameevent-body.activitystream-item .record-item img {
          margin-right: 9px;
          width: 45px;
          height: 45px;
          max-height: 45px;
          display: block; }
        .activity-stream .feed-sharedgameevent-body.activitystream-item .record-item .description {
          color: #353535;
          font-size: 12px;
          line-height: 16px;
          display: block;
          font-weight: bold;
          margin-bottom: 4px; }
        .activity-stream .feed-sharedgameevent-body.activitystream-item .record-item .record .value {
          font-size: 18px;
          color: #353535; }
        .activity-stream .feed-sharedgameevent-body.activitystream-item .record-item .record .plus {
          font-size: 18px;
          color: #8a8a8a; }
  .activity-stream .activitystream-item.large[data-type="BF3RANKUP"], .activity-stream .activitystream-item.large[data-type="BF4RANKUP"], .activity-stream .activitystream-item.large[data-type="RANKUP"] {
    min-height: 128px; }
  .activity-stream .activitystream-item[data-type="BF3RANKUP"] > .item-body, .activity-stream .activitystream-item[data-type="BF4RANKUP"] > .item-body, .activity-stream .activitystream-item[data-type="RANKUP"] > .item-body {
    padding-right: 39px; }
  .activity-stream .activitystream-item.large[data-type="BF3RANKUP"] > .item-body, .activity-stream .activitystream-item.large[data-type="BF4RANKUP"] > .item-body, .activity-stream .activitystream-item.large[data-type="RANKUP"] > .item-body {
    padding-right: 138px; }
  .activity-stream .activitystream-item.large[data-type="BF3RANKUP"] .rank-icon, .activity-stream .activitystream-item.large[data-type="BF4RANKUP"] .rank-icon, .activity-stream .activitystream-item.large[data-type="RANKUP"] .rank-icon {
    width: 128px;
    height: 128px;
    top: 0;
    margin-top: 10px;
    position: relative; }
  .activity-stream .common-selector {
    float: right; }

.activitystream-item {
  padding: 10px 0 0 0; }
  .activitystream-item .rank-icon {
    display: inline-block;
    vertical-align: middle; }
  .activitystream-item .assignment-item, .activitystream-item .award-item, .activitystream-item .track-item {
    display: inline-block;
    margin: 4px 4px 0 0;
    overflow: hidden;
    vertical-align: middle;
    text-align: center; }
  .activitystream-item .track-item {
    position: relative; }
    .activitystream-item .track-item .image-container {
      min-width: 100px; }
    .activitystream-item .track-item .progress-bar {
      width: 80px; }
    .activitystream-item .track-item .green-check-small {
      background-image: url(../battledash/images/icons/green-check-small.png);
      width: 12px;
      height: 12px;
      position: absolute;
      right: 0px;
      bottom: 7px; }

/* Geoleaderboard elements are absolute positioned on top of the map to keep map functionality intact (pan, zoom, etc) */
@-webkit-keyframes bar-left-animation {
  0% {
    opacity: 0;
    right: 66px; }

  100% {
    opacity: 1;
    right: 16px; } }

@-moz-keyframes bar-left-animation {
  0% {
    opacity: 0;
    right: 66px; }

  100% {
    opacity: 1;
    right: 16px; } }

-o-keyframes bar-left-animation 0% {
  opacity: 0;
  right: 66px; }
-o-keyframes bar-left-animation 100% {
  opacity: 1;
  right: 16px; }

@-ms-keyframes bar-left-animation {
  0% {
    opacity: 0;
    right: 66px; }

  100% {
    opacity: 1;
    right: 16px; } }

@keyframes bar-left-animation {
  0% {
    opacity: 0;
    right: 66px; }

  100% {
    opacity: 1;
    right: 16px; } }

@-webkit-keyframes bar-right-animation {
  0% {
    opacity: 0;
    left: 66px; }

  100% {
    opacity: 1;
    left: 16px; } }

@-moz-keyframes bar-right-animation {
  0% {
    opacity: 0;
    left: 66px; }

  100% {
    opacity: 1;
    left: 16px; } }

-o-keyframes bar-right-animation 0% {
  opacity: 0;
  left: 66px; }
-o-keyframes bar-right-animation 100% {
  opacity: 1;
  left: 16px; }

@-ms-keyframes bar-right-animation {
  0% {
    opacity: 0;
    left: 66px; }

  100% {
    opacity: 1;
    left: 16px; } }

@keyframes bar-right-animation {
  0% {
    opacity: 0;
    left: 66px; }

  100% {
    opacity: 1;
    left: 16px; } }

@-webkit-keyframes skull-marker {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-moz-keyframes skull-marker {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

-o-keyframes skull-marker 0% {
  opacity: 0; }
-o-keyframes skull-marker 100% {
  opacity: 1; }

@-ms-keyframes skull-marker {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@keyframes skull-marker {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

.geoleaderboard #base-background {
  background-image: none;
  background-color: #090d16; }
  .geoleaderboard #base-background .video-container {
    display: none; }

.geoleaderboard-loggedout {
  margin-top: -112px;
  background: #080a14;
  padding-top: 96px; }
  .geoleaderboard-loggedout .usp.geoleaderboards .content {
    width: 100%;
    height: 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat; }
  .geoleaderboard-loggedout .usp.geoleaderboards .friends .content {
    background-image: url("../geoleaderboard/geo-friend-bright.png"); }
  .geoleaderboard-loggedout .usp.geoleaderboards .city .content {
    background-image: url("../geoleaderboard/geo-friend-bright.png"); }
  .geoleaderboard-loggedout .usp.geoleaderboards .country .content {
    background-image: url("../geoleaderboard/geo-friend-bright.png"); }
  .geoleaderboard-loggedout .usp.geoleaderboards .world .content {
    background-image: url("../geoleaderboard/geo-friend-bright.png"); }
  .geoleaderboard-loggedout .usp.footer {
    z-index: 1;
    padding-bottom: 44px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0; }

.no-comcenter #geomap {
  right: 0; }

#skull-content {
  cursor: pointer;
  width: 14px;
  height: 18px;
  text-align: center;
  opacity: 0.4; }
  #skull-content:hover {
    opacity: 0.6; }

#skull-container {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.95);
  z-index: 10000;
  color: #5bafd2;
  padding: 25px;
  font-size: 12px;
  font-family: "Lucida Console", "Courier New", monospace;
  overflow-y: auto; }
  #skull-container #skull-marker {
    -webkit-animation: skull-marker cubic-bezier(1, 0, 0, 1) 1s infinite;
    -moz-animation: skull-marker cubic-bezier(1, 0, 0, 1) 1s infinite;
    -ms-animation: skull-marker cubic-bezier(1, 0, 0, 1) 1s infinite;
    -o-animation: skull-marker cubic-bezier(1, 0, 0, 1) 1s infinite;
    animation: skull-marker cubic-bezier(1, 0, 0, 1) 1s infinite; }
  #skull-container #skull-close {
    position: absolute;
    top: 16px;
    right: 16px;
    background: url('../unifiedgamemanager/close.png') no-repeat 0 0 transparent;
    width: 15px;
    height: 15px;
    cursor: pointer; }

span.mapinfo-dialog {
  color: #a8a8a8; }

#geomap {
  position: absolute;
  top: 96px;
  left: 0;
  height: 950px;
  z-index: 1;
  background: #1c1f24;
  margin-bottom: 200px; }
  #geomap .leaflet-tile-pane {
    opacity: 0.6; }
  #geomap .cross-hair {
    outline: none; }
  #geomap.index {
    height: 750px; }
  #geomap:before {
    content: "";
    background: url("../geoleaderboard/lb-overlay-top.png") repeat-x;
    z-index: 2;
    height: 185px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0; }
  #geomap:after {
    content: "";
    background: url("../geoleaderboard/lb-overlay-bottom.png") repeat-x;
    height: 185px;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0; }
  #geomap .user-marker-container {
    background: transparent;
    cursor: normal;
    outline: none; }
    #geomap .user-marker-container .user-marker {
      border: 1px solid rgba(110, 174, 224, 0.5);
      background-color: rgba(32, 97, 150, 0.25);
      box-shadow: 0px 0px 10px rgba(42, 98, 150, 0.5);
      position: relative;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box; }
      #geomap .user-marker-container .user-marker.viewing-user {
        border: 1px solid rgba(224, 154, 0, 0.5);
        background-color: rgba(224, 154, 0, 0.25);
        box-shadow: 0px 0px 10px rgba(224, 154, 0, 0.5); }
      #geomap .user-marker-container .user-marker div {
        position: absolute;
        width: 30px;
        height: 30px;
        top: 50%;
        margin-top: -15px;
        left: 50%;
        margin-left: -15px;
        background-color: rgba(0, 0, 0, 0.5); }
      #geomap .user-marker-container .user-marker.combined {
        cursor: pointer; }
        #geomap .user-marker-container .user-marker.combined div {
          width: 58px;
          margin-left: -29px; }
          #geomap .user-marker-container .user-marker.combined div img.lb-icon {
            border-left: 0; }
      #geomap .user-marker-container .user-marker img {
        display: inline;
        border: 2px solid rgba(0, 0, 0, 0.5);
        width: 26px;
        height: 26px; }
    #geomap .user-marker-container.highlight .user-marker {
      border: 2px solid rgba(110, 174, 224, 0.75);
      background-color: rgba(32, 97, 150, 0.35);
      box-shadow: 0px 0px 10px #2a6296; }
      #geomap .user-marker-container.highlight .user-marker.viewing-user {
        border: 2px solid rgba(224, 154, 0, 0.75);
        background-color: rgba(224, 154, 0, 0.35);
        box-shadow: 0px 0px 10px #e09a00; }

#geoleaderboard-container {
  /* SHARED */
  width: 992px;
  height: 0px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 2;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* CATEGORY PAGES */
  /* OVERVIEW PAGE */
  /* CHOOSE POSITION PAGE */ }
  #geoleaderboard-container > header {
    position: absolute; }
    #geoleaderboard-container > header .avatar-container {
      float: left;
      height: 40px;
      background-color: rgba(7, 7, 7, 0.6); }
      #geoleaderboard-container > header .avatar-container img {
        margin: 2px;
        margin-right: 0; }
    #geoleaderboard-container > header .main-about-icon {
      margin-left: 4px;
      margin-right: 4px; }
  #geoleaderboard-container .location-container {
    position: absolute;
    right: 0;
    top: 24px;
    font-size: 11px; }
    #geoleaderboard-container .location-container .flag {
      float: left;
      margin-top: 2px;
      margin-left: 5px; }
    #geoleaderboard-container .location-container .city {
      float: left;
      margin-top: 3px;
      margin-left: 3px; }
    #geoleaderboard-container .location-container .set-position {
      float: left;
      margin-left: 5px;
      margin-top: 1px; }
  #geoleaderboard-container .submenu {
    position: absolute;
    top: 56px; }
    #geoleaderboard-container .submenu ul li a {
      height: 32px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis; }
  #geoleaderboard-container .notification, #geoleaderboard-container .next-goal {
    position: absolute;
    width: 960px;
    padding-left: 16px;
    padding-right: 16px;
    line-height: 40px;
    font-size: 12px; }
  #geoleaderboard-container #map-viewport {
    position: absolute;
    top: 216px;
    width: 656px;
    height: 0; }
  #geoleaderboard-container #map-details, #geoleaderboard-container .leaderboard-details, #geoleaderboard-container .num-competing {
    position: absolute;
    font-family: Purista;
    text-transform: uppercase;
    font-size: 23px; }
    #geoleaderboard-container #map-details .location, #geoleaderboard-container .leaderboard-details .location, #geoleaderboard-container .num-competing .location {
      color: #ff9900; }
  #geoleaderboard-container #map-details, #geoleaderboard-container .leaderboard-details {
    left: 16px; }
  #geoleaderboard-container .num-competing {
    color: #fff;
    font-size: 16px;
    line-height: 16px;
    top: 541px;
    right: 16px; }
    #geoleaderboard-container .num-competing.above-leaderboard-message {
      top: 496px; }
  #geoleaderboard-container #zoom-indicator {
    width: 32px;
    height: 19px;
    line-height: 19px;
    position: absolute;
    margin-top: -9px;
    left: 1050px;
    top: 2px;
    padding: 0 4px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-left: none;
    color: rgba(255, 255, 255, 0.3);
    font-family: Purista;
    font-size: 16px;
    text-align: right;
    z-index: 100;
    display: none;
    -webkit-transition: top 0.3s ease-out, opacity 0.5s 0.3s ease-out;
    -moz-transition: top 0.3s ease-out, opacity 0.5s 0.3s ease-out;
    transition: top 0.3s ease-out, opacity 0.5s 0.3s ease-out; }
    #geoleaderboard-container #zoom-indicator:before {
      content: "";
      display: block;
      width: 10px;
      height: 19px;
      background: url(../geoleaderboard/indicator-arrows.png) -6px 0 no-repeat;
      position: absolute;
      left: -10px;
      top: 0;
      opacity: 0.3; }
    #geoleaderboard-container #zoom-indicator:after {
      content: "";
      display: block;
      width: 6px;
      height: 11px;
      background: url(../geoleaderboard/indicator-arrows.png) 0 0 no-repeat;
      position: absolute;
      left: -1064px;
      top: 50%;
      margin-top: -6px;
      opacity: 0.3; }
  #geoleaderboard-container .side-bar {
    position: absolute;
    top: 0px;
    height: 600px;
    width: 20px; }
    #geoleaderboard-container .side-bar .ruler {
      position: absolute;
      width: 32px;
      height: 572px;
      opacity: 0; }
    #geoleaderboard-container .side-bar.left {
      right: 100%; }
      #geoleaderboard-container .side-bar.left .ruler {
        background-image: url(../geoleaderboard/map-ruler-left.png);
        background-position: top right;
        right: 16px; }
      #geoleaderboard-container .side-bar.left.animate .ruler {
        opacity: 1;
        -webkit-animation: bar-left-animation ease-in-out 0.5s 1;
        -moz-animation: bar-left-animation ease-in-out 0.5s 1;
        -ms-animation: bar-left-animation ease-in-out 0.5s 1;
        -o-animation: bar-left-animation ease-in-out 0.5s 1;
        animation: bar-left-animation ease-in-out 0.5s 1; }
    #geoleaderboard-container .side-bar.right {
      left: 992px; }
      #geoleaderboard-container .side-bar.right .ruler {
        background-image: url(../geoleaderboard/map-ruler-right.png);
        background-repeat: no-repeat;
        left: 16px; }
      #geoleaderboard-container .side-bar.right.animate .ruler {
        opacity: 1;
        -webkit-animation: bar-right-animation ease-in-out 0.5s 1;
        -moz-animation: bar-right-animation ease-in-out 0.5s 1;
        -ms-animation: bar-right-animation ease-in-out 0.5s 1;
        -o-animation: bar-right-animation ease-in-out 0.5s 1;
        animation: bar-right-animation ease-in-out 0.5s 1; }
  #geoleaderboard-container .map-corner {
    position: absolute;
    background-image: url(../geoleaderboard/map-corners.png);
    width: 24px;
    height: 24px; }
    #geoleaderboard-container .map-corner.top-left {
      background-position: top left;
      left: 0; }
    #geoleaderboard-container .map-corner.top-right {
      background-position: top right;
      left: 632px; }
    #geoleaderboard-container .map-corner.bottom-left {
      background-position: bottom left;
      top: 549px;
      left: 0; }
    #geoleaderboard-container .map-corner.bottom-right {
      background-position: bottom right;
      top: 549px;
      left: 632px; }
  #geoleaderboard-container .map-controls {
    position: absolute;
    top: 16px;
    left: 592px; }
    #geoleaderboard-container .map-controls button {
      font-size: 32px;
      display: block;
      height: 32px;
      line-height: 32px;
      width: 48px;
      padding: 0;
      margin-bottom: 1px;
      text-align: center; }
      #geoleaderboard-container .map-controls button > div {
        margin-top: -4px; }
    #geoleaderboard-container .map-controls .disabled {
      pointer: normal;
      opacity: 0.2; }
  #geoleaderboard-container #map-info {
    position: absolute;
    top: 573px;
    right: -336px;
    margin-top: 16px;
    margin-bottom: 8px;
    padding-right: 84px;
    padding-left: 8px;
    font-size: 11px;
    background: rgba(7, 7, 7, 0.3);
    height: 24px;
    line-height: 24px; }
    #geoleaderboard-container #map-info span {
      color: #a8a8a8; }
    #geoleaderboard-container #map-info img {
      position: absolute;
      top: 2px;
      right: 8px;
      opacity: 0.75; }
    #geoleaderboard-container #map-info:hover {
      cursor: pointer; }
      #geoleaderboard-container #map-info:hover span {
        color: #fff; }
      #geoleaderboard-container #map-info:hover img {
        opacity: 1; }
  #geoleaderboard-container #skull-content {
    position: absolute;
    top: 573px;
    left: 0;
    margin-top: 16px; }
  #geoleaderboard-container .division {
    height: 66px;
    width: 57px;
    background-repeat: no-repeat; }
    #geoleaderboard-container .division.locality-1 {
      background-image: url("../geoleaderboard/divisions/city-1.png"); }
    #geoleaderboard-container .division.country-1 {
      background-image: url("../geoleaderboard/divisions/country-1.png"); }
    #geoleaderboard-container .division.state1 {
      background-image: url("../geoleaderboard/divisions/state-1.png"); }
    #geoleaderboard-container .division.world-1 {
      background-image: url("../geoleaderboard/divisions/world-1.png"); }
    #geoleaderboard-container .division.locality-2 {
      background-image: url("../geoleaderboard/divisions/city-2.png"); }
    #geoleaderboard-container .division.country-2 {
      background-image: url("../geoleaderboard/divisions/country-2.png"); }
    #geoleaderboard-container .division.state2 {
      background-image: url("../geoleaderboard/divisions/state-2.png"); }
    #geoleaderboard-container .division.world-2 {
      background-image: url("../geoleaderboard/divisions/world-2.png"); }
    #geoleaderboard-container .division.locality-3 {
      background-image: url("../geoleaderboard/divisions/city-3.png"); }
    #geoleaderboard-container .division.country-3 {
      background-image: url("../geoleaderboard/divisions/country-3.png"); }
    #geoleaderboard-container .division.state3 {
      background-image: url("../geoleaderboard/divisions/state-3.png"); }
    #geoleaderboard-container .division.world-3 {
      background-image: url("../geoleaderboard/divisions/world-3.png"); }
    #geoleaderboard-container .division.locality-4 {
      background-image: url("../geoleaderboard/divisions/city-4.png"); }
    #geoleaderboard-container .division.country-4 {
      background-image: url("../geoleaderboard/divisions/country-4.png"); }
    #geoleaderboard-container .division.state4 {
      background-image: url("../geoleaderboard/divisions/state-4.png"); }
    #geoleaderboard-container .division.world-4 {
      background-image: url("../geoleaderboard/divisions/world-4.png"); }
    #geoleaderboard-container .division.locality-5 {
      background-image: url("../geoleaderboard/divisions/city-5.png"); }
    #geoleaderboard-container .division.country-5 {
      background-image: url("../geoleaderboard/divisions/country-5.png"); }
    #geoleaderboard-container .division.state5 {
      background-image: url("../geoleaderboard/divisions/state-5.png"); }
    #geoleaderboard-container .division.world-5 {
      background-image: url("../geoleaderboard/divisions/world-5.png"); }
    #geoleaderboard-container .division.locality-6 {
      background-image: url("../geoleaderboard/divisions/city-6.png"); }
    #geoleaderboard-container .division.country-6 {
      background-image: url("../geoleaderboard/divisions/country-6.png"); }
    #geoleaderboard-container .division.state6 {
      background-image: url("../geoleaderboard/divisions/state-6.png"); }
    #geoleaderboard-container .division.world-6 {
      background-image: url("../geoleaderboard/divisions/world-6.png"); }
    #geoleaderboard-container .division.locality-7 {
      background-image: url("../geoleaderboard/divisions/city-7.png"); }
    #geoleaderboard-container .division.country-7 {
      background-image: url("../geoleaderboard/divisions/country-7.png"); }
    #geoleaderboard-container .division.state7 {
      background-image: url("../geoleaderboard/divisions/state-7.png"); }
    #geoleaderboard-container .division.world-7 {
      background-image: url("../geoleaderboard/divisions/world-7.png"); }
    #geoleaderboard-container .division.locality-8 {
      background-image: url("../geoleaderboard/divisions/city-8.png"); }
    #geoleaderboard-container .division.country-8 {
      background-image: url("../geoleaderboard/divisions/country-8.png"); }
    #geoleaderboard-container .division.state8 {
      background-image: url("../geoleaderboard/divisions/state-8.png"); }
    #geoleaderboard-container .division.world-8 {
      background-image: url("../geoleaderboard/divisions/world-8.png"); }
    #geoleaderboard-container .division.locality-9 {
      background-image: url("../geoleaderboard/divisions/city-9.png"); }
    #geoleaderboard-container .division.country-9 {
      background-image: url("../geoleaderboard/divisions/country-9.png"); }
    #geoleaderboard-container .division.state9 {
      background-image: url("../geoleaderboard/divisions/state-9.png"); }
    #geoleaderboard-container .division.world-9 {
      background-image: url("../geoleaderboard/divisions/world-9.png"); }
    #geoleaderboard-container .division.locality-10 {
      background-image: url("../geoleaderboard/divisions/city-10.png"); }
    #geoleaderboard-container .division.country-10 {
      background-image: url("../geoleaderboard/divisions/country-10.png"); }
    #geoleaderboard-container .division.state10 {
      background-image: url("../geoleaderboard/divisions/state-10.png"); }
    #geoleaderboard-container .division.world-10 {
      background-image: url("../geoleaderboard/divisions/world-10.png"); }
  #geoleaderboard-container .leaderboard-details {
    top: 8px;
    left: 16px;
    line-height: 32px; }
    #geoleaderboard-container .leaderboard-details .leaderboard-name {
      width: 568px;
      height: 32px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis; }
    #geoleaderboard-container .leaderboard-details .star {
      font-family: Arial, sans-serif;
      display: inline-block;
      cursor: pointer; }
      #geoleaderboard-container .leaderboard-details .star:after {
        position: relative;
        z-index: 1;
        content: "★";
        font-size: 22px;
        color: rgba(255, 255, 255, 0.4); }
      #geoleaderboard-container .leaderboard-details .star:hover:after {
        color: rgba(255, 255, 255, 0.7); }
      #geoleaderboard-container .leaderboard-details .star.starred:after {
        color: white; }
    #geoleaderboard-container .leaderboard-details span.location {
      padding-left: 3px; }
    #geoleaderboard-container .leaderboard-details .pr-description {
      font-size: 16px;
      line-height: 16px;
      margin-bottom: 16px; }
    #geoleaderboard-container .leaderboard-details .division {
      float: left;
      height: 33px;
      width: 29px;
      background-size: 29px 33px;
      background-repeat: no-repeat;
      cursor: pointer;
      margin-left: -5px; }
    #geoleaderboard-container .leaderboard-details .description {
      font-size: 16px;
      float: left;
      line-height: 16px;
      margin-left: 4px; }
      #geoleaderboard-container .leaderboard-details .description span {
        display: block;
        font-weight: 600; }
        #geoleaderboard-container .leaderboard-details .description span.goal {
          font-weight: normal;
          max-width: 500px; }
      #geoleaderboard-container .leaderboard-details .description .division-info {
        display: inline-block;
        vertical-align: top;
        background-image: url(../loadout/icon-info-s.png);
        background-size: 14px 28px;
        height: 14px;
        width: 15px;
        cursor: pointer; }
  #geoleaderboard-container .geoleaderboard-selector {
    width: 992px;
    position: absolute;
    top: -120px; }
    #geoleaderboard-container .geoleaderboard-selector .scroll-container-outer {
      height: 112px; }
    #geoleaderboard-container .geoleaderboard-selector .scroll-left, #geoleaderboard-container .geoleaderboard-selector .scroll-right {
      line-height: 138px; }
    #geoleaderboard-container .geoleaderboard-selector .scrollable {
      height: 102px;
      width: 190px;
      font-family: Purista;
      font-size: 13px; }
      #geoleaderboard-container .geoleaderboard-selector .scrollable .thumb {
        height: 64px; }
        #geoleaderboard-container .geoleaderboard-selector .scrollable .thumb img {
          margin-top: 5px;
          opacity: 0.9; }
      #geoleaderboard-container .geoleaderboard-selector .scrollable .description {
        height: 40px;
        padding-top: 6px; }
      #geoleaderboard-container .geoleaderboard-selector .scrollable .score {
        text-transform: none;
        font-family: Arial;
        font-size: 12px;
        color: #a8a8a8; }
      #geoleaderboard-container .geoleaderboard-selector .scrollable .title {
        white-space: nowrap;
        height: 13px;
        overflow: hidden;
        color: #fff; }
      #geoleaderboard-container .geoleaderboard-selector .scrollable.selected {
        height: 101px;
        width: 188px;
        background: rgba(0, 0, 0, 0.5);
        border: 1px solid #fff;
        border-bottom: 0; }
        #geoleaderboard-container .geoleaderboard-selector .scrollable.selected .description {
          background: url(../veteranprogram/boxselected.png) repeat-x #fff; }
          #geoleaderboard-container .geoleaderboard-selector .scrollable.selected .description .title {
            color: #000;
            font-weight: bold; }
        #geoleaderboard-container .geoleaderboard-selector .scrollable.selected .thumb img {
          opacity: 1;
          margin-top: 4px; }
      #geoleaderboard-container .geoleaderboard-selector .scrollable:hover {
        background-color: rgba(7, 7, 7, 0.7); }
        #geoleaderboard-container .geoleaderboard-selector .scrollable:hover .thumb img {
          opacity: 1; }
  #geoleaderboard-container #location-selector {
    position: absolute;
    top: 128px;
    left: 8px;
    font-family: Purista;
    font-size: 16px;
    line-height: 24px; }
    #geoleaderboard-container #location-selector a {
      display: block; }
    #geoleaderboard-container #location-selector .area-button {
      height: 28px;
      line-height: 28px;
      width: 48px;
      overflow: hidden;
      text-transform: uppercase;
      background-color: rgba(0, 0, 0, 0.5);
      cursor: pointer;
      background-position: 15px 50%;
      background-repeat: no-repeat;
      margin-bottom: 1px;
      text-decoration: none;
      font-family: Purista;
      font-size: 13px;
      font-weight: 600; }
      #geoleaderboard-container #location-selector .area-button span {
        margin-left: 48px;
        padding-left: 8px;
        padding-right: 8px; }
      #geoleaderboard-container #location-selector .area-button:hover {
        background-color: rgba(150, 150, 150, 0.5);
        width: auto; }
      #geoleaderboard-container #location-selector .area-button.friend {
        background-image: url("../geoleaderboard/geo-friend-bright.png"); }
      #geoleaderboard-container #location-selector .area-button.locality {
        background-position: 17px 50%;
        background-image: url("../geoleaderboard/geo-locality-bright.png"); }
      #geoleaderboard-container #location-selector .area-button.state {
        background-image: url("../geoleaderboard/geo-state-bright.png"); }
      #geoleaderboard-container #location-selector .area-button.country {
        background-image: url("../geoleaderboard/geo-country-bright.png"); }
      #geoleaderboard-container #location-selector .area-button.world {
        background-image: url("../geoleaderboard/geo-world-bright.png"); }
      #geoleaderboard-container #location-selector .area-button.selected {
        background-color: rgba(255, 255, 255, 0.9);
        color: #000; }
        #geoleaderboard-container #location-selector .area-button.selected.friend {
          background-image: url("../geoleaderboard/geo-friend-dark.png"); }
        #geoleaderboard-container #location-selector .area-button.selected.locality {
          background-image: url("../geoleaderboard/geo-locality-dark.png"); }
        #geoleaderboard-container #location-selector .area-button.selected.state {
          background-image: url("../geoleaderboard/geo-state-dark.png"); }
        #geoleaderboard-container #location-selector .area-button.selected.country {
          background-image: url("../geoleaderboard/geo-country-dark.png"); }
        #geoleaderboard-container #location-selector .area-button.selected.world {
          background-image: url("../geoleaderboard/geo-world-dark.png"); }
  #geoleaderboard-container .standings {
    position: absolute;
    top: 0px;
    height: 573px;
    right: -336px;
    width: 327px; }
    #geoleaderboard-container .standings .header {
      font-family: Purista;
      font-size: 16px;
      color: #d5dde5;
      padding-left: 8px;
      text-transform: uppercase;
      line-height: 23px;
      background-color: rgba(0, 0, 0, 0.65);
      margin-bottom: 1px; }
    #geoleaderboard-container .standings table {
      margin-bottom: 0; }
    #geoleaderboard-container .standings tr.active a {
      color: #000; }
    #geoleaderboard-container .standings td {
      height: 47px;
      font-size: 12px;
      padding: 0; }
    #geoleaderboard-container .standings #standings-list {
      position: relative;
      height: 464px;
      overflow: hidden;
      margin-bottom: 14px; }
      #geoleaderboard-container .standings #standings-list .jspVerticalBar {
        width: 8px;
        right: 1px;
        background: rgba(0, 0, 0, 0.5); }
      #geoleaderboard-container .standings #standings-list .jspDrag {
        background: #fff;
        opacity: 0.7; }
        #geoleaderboard-container .standings #standings-list .jspDrag:hover {
          opacity: 1; }
    #geoleaderboard-container .standings .standing {
      width: 45px;
      font-family: Purista;
      font-size: 16px; }
      #geoleaderboard-container .standings .standing.current-user {
        background-color: #ff9900;
        color: #000; }
      #geoleaderboard-container .standings .standing .division {
        height: 33px;
        width: 100%;
        background-size: 29px 33px;
        background-position: 50% 50%;
        background-repeat: no-repeat;
        cursor: pointer; }
    #geoleaderboard-container .standings .avatarcontainer {
      width: 45px; }
    #geoleaderboard-container .standings .rankcontainer {
      width: 35px;
      overflow: hidden;
      line-height: 0; }
      #geoleaderboard-container .standings .rankcontainer .rank {
        margin-top: 8px; }
    #geoleaderboard-container .standings .name {
      width: 142px; }
      #geoleaderboard-container .standings .name .common-playername-personaname {
        font-weight: bold;
        margin-bottom: 2px; }
      #geoleaderboard-container .standings .name .common-playername-username {
        font-size: 11px;
        color: #a8a8a8; }
    #geoleaderboard-container .standings .score {
      width: 44px;
      padding-right: 16px;
      font-size: 14px;
      font-weight: bold;
      text-align: right; }
  #geoleaderboard-container .leaderboard-message {
    position: absolute;
    top: 512px;
    left: 8px;
    right: 16px;
    background: rgba(0, 0, 0, 0.5);
    line-height: 40px;
    font-size: 12px;
    font-family: Arial, sans-serif;
    margin-left: 8px;
    margin-top: 8px;
    padding-left: 8px;
    text-transform: none;
    color: #ebc6b5;
    text-shadow: -1px -1px 4px #b74b19, 1px 1px 4px #b74b19; }
    #geoleaderboard-container .leaderboard-message i {
      vertical-align: middle;
      width: 24px;
      height: 22px;
      margin-top: -4px;
      background: url(../ui/icons/icon-error.png) no-repeat;
      margin-right: 5px;
      display: inline-block; }
  #geoleaderboard-container .next-goal {
    border: 1px solid rgba(128, 128, 128, 0.5);
    background: rgba(0, 0, 0, 0.5);
    top: 589px; }
  #geoleaderboard-container .notification {
    top: -48px;
    background: rgba(0, 0, 0, 0.5); }
    #geoleaderboard-container .notification .date {
      float: right;
      font-size: 11px;
      color: #a8a8a8; }
    #geoleaderboard-container .notification a {
      font-weight: bold; }
    #geoleaderboard-container .notification a:hover {
      text-decoration: none; }
    #geoleaderboard-container .notification img {
      float: left;
      margin-top: 10px;
      margin-right: 10px; }
  #geoleaderboard-container #map-details {
    top: 16px;
    line-height: 24px; }
    #geoleaderboard-container #map-details .title {
      display: block; }
    #geoleaderboard-container #map-details .description {
      display: block;
      font-size: 16px; }
  #geoleaderboard-container #user-details-container {
    display: none;
    position: absolute;
    top: 521px;
    left: 16px;
    line-height: 16px;
    font-family: Purista;
    font-size: 16px;
    text-transform: uppercase; }
    #geoleaderboard-container #user-details-container img {
      float: left;
      border: 1px solid #fff; }
    #geoleaderboard-container #user-details-container div {
      margin-left: 44px;
      height: 35px;
      padding-top: 4px; }
    #geoleaderboard-container #user-details-container span.username {
      display: block;
      font-weight: 600;
      text-transform: none; }
    #geoleaderboard-container #user-details-container span.description {
      color: #a8a8a8; }
  #geoleaderboard-container .performances {
    position: absolute;
    top: 589px;
    margin-bottom: 24px;
    width: 100%; }
    .ugm-showing #geoleaderboard-container .performances {
      padding-bottom: 64px; }
    #geoleaderboard-container .performances .row-tight {
      margin-top: 1px; }
    #geoleaderboard-container .performances .header div {
      background: rgba(0, 0, 0, 0.4);
      text-transform: uppercase;
      color: #d5dde5;
      line-height: 23px;
      font-size: 15px;
      font-weight: 600;
      font-family: Purista;
      padding-left: 8px; }
    #geoleaderboard-container .performances .boxes .span1 {
      background: rgba(0, 0, 0, 0.4);
      padding: 8px;
      text-align: center;
      text-transform: uppercase;
      line-height: 16px;
      overflow-x: hidden;
      overflow-y: hidden;
      height: 240px;
      text-decoration: none; }
      #geoleaderboard-container .performances .boxes .span1 .name {
        font-size: 11px; }
      #geoleaderboard-container .performances .boxes .span1 .score {
        font-size: 11px;
        color: #a8a8a8; }
      #geoleaderboard-container .performances .boxes .span1 .icon {
        margin-top: 8px;
        margin-bottom: 8px;
        height: 56px;
        overflow: hidden;
        background-position: 50% 50%;
        background-repeat: no-repeat; }
      #geoleaderboard-container .performances .boxes .span1 .division {
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 8px;
        width: 57px; }
      #geoleaderboard-container .performances .boxes .span1 .position {
        font-family: Purista;
        font-size: 19px;
        line-height: 24px; }
      #geoleaderboard-container .performances .boxes .span1 .location {
        margin-top: 5px;
        display: inline-block;
        padding-left: 25px;
        background-repeat: no-repeat;
        background-position: left center;
        font-size: 11px;
        line-height: 19px; }
        #geoleaderboard-container .performances .boxes .span1 .location.locality {
          background-image: url("../geoleaderboard/geo-locality-bright.png"); }
        #geoleaderboard-container .performances .boxes .span1 .location.country {
          background-image: url("../geoleaderboard/geo-country-bright.png"); }
        #geoleaderboard-container .performances .boxes .span1 .location.world {
          background-image: url("../geoleaderboard/geo-world-bright.png"); }
  #geoleaderboard-container.overview #map-viewport, #geoleaderboard-container.choose-position #map-viewport {
    top: 104px;
    width: 992px; }
  #geoleaderboard-container.overview .top-right, #geoleaderboard-container.choose-position .top-right {
    left: 968px; }
  #geoleaderboard-container.overview .bottom-right, #geoleaderboard-container.choose-position .bottom-right {
    left: 968px; }
  #geoleaderboard-container.overview .map-controls, #geoleaderboard-container.choose-position .map-controls {
    left: 928px; }
  #geoleaderboard-container.overview #location-selector, #geoleaderboard-container.choose-position #location-selector {
    top: 88px; }
  #geoleaderboard-container.overview #map-info {
    position: relative;
    top: 0;
    right: 0;
    float: right; }
  #geoleaderboard-container.overview #skull-content {
    position: relative;
    top: auto;
    left: auto; }
  #geoleaderboard-container.overview.has-latest-update #map-viewport {
    top: 152px; }
  #geoleaderboard-container.choose-position header {
    text-align: center;
    width: 992px; }
  #geoleaderboard-container.choose-position h1 {
    font-size: 40px; }
  #geoleaderboard-container.choose-position h3 {
    font-size: 23px;
    font-weight: normal; }
  #geoleaderboard-container.choose-position #map-details {
    position: absolute;
    top: 328px;
    text-align: center;
    height: 0;
    width: 960px;
    overflow: visible;
    color: #ff9900; }
  #geoleaderboard-container.choose-position #map-info {
    top: 677px;
    right: 0; }
  #geoleaderboard-container.choose-position #skull-content {
    top: 677px;
    left: 0;
    margin-top: 16px; }
  #geoleaderboard-container .set-location-box {
    height: 104px;
    position: absolute;
    top: 453px;
    left: 16px;
    right: 16px;
    background-color: rgba(0, 0, 0, 0.5); }
    #geoleaderboard-container .set-location-box .privacy-settings {
      margin: 16px;
      width: 400px; }
      #geoleaderboard-container .set-location-box .privacy-settings span {
        margin-top: 9px;
        display: block;
        line-height: 16px; }
    #geoleaderboard-container .set-location-box .continue {
      position: absolute;
      top: 16px;
      right: 16px;
      text-align: center; }
      #geoleaderboard-container .set-location-box .continue a {
        margin-top: 16px;
        display: block; }
    #geoleaderboard-container .set-location-box span, #geoleaderboard-container .set-location-box a {
      color: #a8a8a8;
      font-size: 12px; }

.geo-location-dialog {
  text-align: center; }
  .geo-location-dialog span, .geo-location-dialog button {
    margin-top: 16px;
    margin-bottom: 16px;
    display: block; }
  .geo-location-dialog button {
    margin-left: auto;
    margin-right: auto; }

#geoleaderboard-divisions {
  position: relative; }
  #geoleaderboard-divisions h3 {
    font-family: Purista;
    font-size: 16px;
    line-height: 16px;
    text-transform: uppercase;
    color: #a8a8a8;
    font-weight: normal;
    margin-bottom: 16px; }
  #geoleaderboard-divisions .divisions, #geoleaderboard-divisions .score-needed {
    font-family: Purista;
    font-size: 16px;
    line-height: 16px;
    color: #fff; }
  #geoleaderboard-divisions .divisions {
    margin-bottom: 16px; }
    #geoleaderboard-divisions .divisions .division {
      height: 24px; }
      #geoleaderboard-divisions .divisions .division .num {
        float: left;
        width: 24px; }
      #geoleaderboard-divisions .divisions .division .bar {
        float: left;
        width: 250px; }
        #geoleaderboard-divisions .divisions .division .bar .progress-bar {
          margin-bottom: 8px; }
      #geoleaderboard-divisions .divisions .division .details {
        float: left;
        margin-left: 8px; }
      #geoleaderboard-divisions .divisions .division .clear {
        clear: left; }
  #geoleaderboard-divisions .score-needed {
    position: absolute;
    top: 0;
    left: 400px; }
    #geoleaderboard-divisions .score-needed .score {
      height: 24px; }
  #geoleaderboard-divisions .description {
    font: Arial 12px white; }

/* required styles */
.leaflet-map-pane, .leaflet-tile, .leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-tile-pane, .leaflet-tile-container, .leaflet-overlay-pane, .leaflet-shadow-pane, .leaflet-marker-pane, .leaflet-popup-pane, .leaflet-overlay-pane svg, .leaflet-zoom-box, .leaflet-image-layer, .leaflet-layer {
  position: absolute;
  left: 0;
  top: 0; }

.leaflet-container {
  overflow: hidden;
  -ms-touch-action: none; }

.leaflet-tile, .leaflet-marker-icon, .leaflet-marker-shadow {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -webkit-user-drag: none; }

.leaflet-marker-icon, .leaflet-marker-shadow {
  display: block; }

/* map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container img {
  max-width: none !important; }

/* stupid Android 2 doesn't understand "max-width: none" properly */
.leaflet-container img.leaflet-image-layer {
  max-width: 15000px !important; }

.leaflet-tile {
  filter: inherit;
  visibility: hidden; }

.leaflet-tile-loaded {
  visibility: inherit; }

.leaflet-zoom-box {
  width: 0;
  height: 0; }

/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
  -moz-user-select: none; }

.leaflet-tile-pane {
  z-index: 2; }

.leaflet-objects-pane {
  z-index: 3; }

.leaflet-overlay-pane {
  z-index: 4; }

.leaflet-shadow-pane {
  z-index: 5; }

.leaflet-marker-pane {
  z-index: 6; }

.leaflet-popup-pane {
  z-index: 7; }

/* control positioning */
.leaflet-control {
  position: relative;
  z-index: 7;
  pointer-events: auto; }

.leaflet-top, .leaflet-bottom {
  position: absolute;
  z-index: 1000;
  pointer-events: none; }

.leaflet-top {
  top: 0; }

.leaflet-right {
  right: 0; }

.leaflet-bottom {
  bottom: 0; }

.leaflet-left {
  left: 0; }

.leaflet-control {
  float: left;
  clear: both; }

.leaflet-right .leaflet-control {
  float: right; }

.leaflet-top .leaflet-control {
  margin-top: 10px; }

.leaflet-bottom .leaflet-control {
  margin-bottom: 10px; }

.leaflet-left .leaflet-control {
  margin-left: 10px; }

.leaflet-right .leaflet-control {
  margin-right: 10px; }

/* zoom and fade animations */
.leaflet-fade-anim .leaflet-tile, .leaflet-fade-anim .leaflet-popup {
  opacity: 0;
  -webkit-transition: opacity 0.2s linear;
  -moz-transition: opacity 0.2s linear;
  -o-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear; }

.leaflet-fade-anim .leaflet-tile-loaded, .leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
  opacity: 1; }

.leaflet-zoom-anim .leaflet-zoom-animated {
  -webkit-transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.25, 1);
  -moz-transition: -moz-transform 0.25s cubic-bezier(0, 0, 0.25, 1);
  -o-transition: -o-transform 0.25s cubic-bezier(0, 0, 0.25, 1);
  transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1); }

.leaflet-zoom-anim .leaflet-tile, .leaflet-pan-anim .leaflet-tile, .leaflet-touching .leaflet-zoom-animated {
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: none;
  transition: none; }

.leaflet-zoom-anim .leaflet-zoom-hide {
  visibility: hidden; }

/* cursors */
.leaflet-clickable {
  cursor: pointer; }

.leaflet-container {
  cursor: -webkit-grab;
  cursor: -moz-grab; }

.leaflet-popup-pane, .leaflet-control {
  cursor: auto; }

.leaflet-dragging, .leaflet-dragging .leaflet-clickable, .leaflet-dragging .leaflet-container {
  cursor: move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing; }

/* visual tweaks */
.leaflet-container {
  background: #ddd;
  outline: 0; }

.leaflet-container a {
  color: #0078A8; }

.leaflet-container a.leaflet-active {
  outline: 2px solid orange; }

.leaflet-zoom-box {
  border: 2px dotted #05f;
  background: white;
  opacity: 0.5; }

/* general typography */
.leaflet-container {
  font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif; }

/* general toolbar styles */
.leaflet-bar {
  box-shadow: 0 1px 7px rgba(0, 0, 0, 0.65);
  -webkit-border-radius: 4px;
  border-radius: 4px; }

.leaflet-bar a, .leaflet-bar a:hover {
  background-color: #fff;
  border-bottom: 1px solid #ccc;
  width: 26px;
  height: 26px;
  line-height: 26px;
  display: block;
  text-align: center;
  text-decoration: none;
  color: black; }

.leaflet-bar a, .leaflet-control-layers-toggle {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  display: block; }

.leaflet-bar a:hover {
  background-color: #f4f4f4; }

.leaflet-bar a:first-child {
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px; }

.leaflet-bar a:last-child {
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom: none; }

.leaflet-bar a.leaflet-disabled {
  cursor: default;
  background-color: #f4f4f4;
  color: #bbb; }

.leaflet-touch .leaflet-bar {
  -webkit-border-radius: 10px;
  border-radius: 10px; }

.leaflet-touch .leaflet-bar a {
  width: 30px;
  height: 30px; }

.leaflet-touch .leaflet-bar a:first-child {
  -webkit-border-top-left-radius: 7px;
  border-top-left-radius: 7px;
  -webkit-border-top-right-radius: 7px;
  border-top-right-radius: 7px; }

.leaflet-touch .leaflet-bar a:last-child {
  -webkit-border-bottom-left-radius: 7px;
  border-bottom-left-radius: 7px;
  -webkit-border-bottom-right-radius: 7px;
  border-bottom-right-radius: 7px;
  border-bottom: none; }

/* zoom control */
.leaflet-control-zoom-in {
  font: bold 18px 'Lucida Console', Monaco, monospace; }

.leaflet-control-zoom-out {
  font: bold 22px 'Lucida Console', Monaco, monospace; }

.leaflet-touch .leaflet-control-zoom-in {
  font-size: 22px;
  line-height: 30px; }

.leaflet-touch .leaflet-control-zoom-out {
  font-size: 28px;
  line-height: 30px; }

/* layers control */
.leaflet-control-layers {
  box-shadow: 0 1px 7px rgba(0, 0, 0, 0.4);
  background: #f8f8f9;
  -webkit-border-radius: 5px;
  border-radius: 5px; }

.leaflet-control-layers-toggle {
  background-image: url(images/layers.png);
  width: 36px;
  height: 36px; }

.leaflet-retina .leaflet-control-layers-toggle {
  background-image: url(images/layers-2x.png);
  background-size: 26px 26px; }

.leaflet-touch .leaflet-control-layers-toggle {
  width: 44px;
  height: 44px; }

.leaflet-control-layers .leaflet-control-layers-list, .leaflet-control-layers-expanded .leaflet-control-layers-toggle {
  display: none; }

.leaflet-control-layers-expanded .leaflet-control-layers-list {
  display: block;
  position: relative; }

.leaflet-control-layers-expanded {
  padding: 6px 10px 6px 6px;
  color: #333;
  background: #fff; }

.leaflet-control-layers-selector {
  margin-top: 2px;
  position: relative;
  top: 1px; }

.leaflet-control-layers label {
  display: block; }

.leaflet-control-layers-separator {
  height: 0;
  border-top: 1px solid #ddd;
  margin: 5px -10px 5px -6px; }

/* attribution and scale controls */
.leaflet-container .leaflet-control-attribution {
  background-color: rgba(255, 255, 255, 0.7);
  box-shadow: 0 0 5px #bbb;
  margin: 0; }

.leaflet-control-attribution, .leaflet-control-scale-line {
  padding: 0 5px;
  color: #333; }

.leaflet-container .leaflet-control-attribution, .leaflet-container .leaflet-control-scale {
  font-size: 11px; }

.leaflet-left .leaflet-control-scale {
  margin-left: 5px; }

.leaflet-bottom .leaflet-control-scale {
  margin-bottom: 5px; }

.leaflet-control-scale-line {
  border: 2px solid #777;
  border-top: none;
  color: black;
  line-height: 1.1;
  padding: 2px 5px 1px;
  font-size: 11px;
  text-shadow: 1px 1px 1px #fff;
  background-color: rgba(255, 255, 255, 0.5);
  box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);
  white-space: nowrap;
  overflow: hidden; }

.leaflet-control-scale-line:not(:first-child) {
  border-top: 2px solid #777;
  border-bottom: none;
  margin-top: -2px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); }

.leaflet-control-scale-line:not(:first-child):not(:last-child) {
  border-bottom: 2px solid #777; }

.leaflet-touch .leaflet-control-attribution, .leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-control-zoom {
  box-shadow: none; }

.leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-control-zoom {
  border: 4px solid rgba(0, 0, 0, 0.3); }

/* popup */
.leaflet-popup {
  position: absolute;
  text-align: center; }

.leaflet-popup-content-wrapper {
  padding: 1px;
  text-align: left;
  -webkit-border-radius: 12px;
  border-radius: 12px; }

.leaflet-popup-content {
  margin: 13px 19px;
  line-height: 1.4; }

.leaflet-popup-content p {
  margin: 18px 0; }

.leaflet-popup-tip-container {
  margin: 0 auto;
  width: 40px;
  height: 20px;
  position: relative;
  overflow: hidden; }

.leaflet-popup-tip {
  width: 17px;
  height: 17px;
  padding: 1px;
  margin: -10px auto 0;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg); }

.leaflet-popup-content-wrapper, .leaflet-popup-tip {
  background: white;
  box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4); }

.leaflet-container a.leaflet-popup-close-button {
  position: absolute;
  top: 0;
  right: 0;
  padding: 4px 4px 0 0;
  text-align: center;
  width: 18px;
  height: 14px;
  font: 16px/14px Tahoma, Verdana, sans-serif;
  color: #c3c3c3;
  text-decoration: none;
  font-weight: bold;
  background: transparent; }

.leaflet-container a.leaflet-popup-close-button:hover {
  color: #999; }

.leaflet-popup-scrolled {
  overflow: auto;
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd; }

/* div icon */
.leaflet-div-icon {
  background: #fff;
  border: 1px solid #666; }

.leaflet-editing-icon {
  -webkit-border-radius: 2px;
  border-radius: 2px; }

/* Icon sprites */
.mapbox-icon {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAACcCAYAAABho7sLAAACz0lEQVR42u2YTWgTQRiGE2lRQRAktGovagMFCyW/DbkFEQt6EVTwpPYi8eZBpQcNgh48tOJVUKJQEFGhorWKCnoRQkEEL71Uqh7qD4QiQgqlGd+BT3YJu7jdmV2ovAMPk/m+ZZ6ZzOzuJAmlVCxQRBFF/7Mon88vaOIQKc36FsnXpXxYiE3ENVrT9uaTgSKKKKKIIoooCgIPkNwMFFFEEUUUUUSRnCtuJBKJDXGIVKFQeFQulzdbE6Ek0ekJ8BaCn0BpRPYOdSqwSEY51dHJrMTHgfIjl8s9W6tIuSkWi/vBID6vuOMGM/L/bw6jfSwdzuDzaCaT2eW1RsYitD+DCb1OWgLZKeNd5xZJuxujfuWXF8xF6XR6I0SViEUOEYn8sSly7iP/7XyZT2+KKKKIIooAXgs7cEbYp2vrIhH0y2FR/UXa/dZEpVKpV06jLczmNupDUrd0XOetiNBZXWYw7I7rtsyubks0Dxo+uYbO2xI1waRPbhIs2hK9Bi0cdbe547ot63TXiggLPyJr8TSbzZZ1TNe6LfGaFZEs/AXXL4gfQLlYQf6oFZHMbAidXgJ3QBXtNOoHgWQiCk2lUukKJBORNRlmeS8ikSOD5Kyu+ZqgiCKKKPJnABwOyICJqKmCl2ZoUYCOb4JrzoDsi76BTa7r5qISXZd8FbwHy1GJqpKfcUJ2RV9ABeyU/JC0W7ZFcx7XpKKY0SpYAqOSfwh+ARX1Gj0HiiIvxsCUByOSr7liY3xNUEQRRRStE1EXSJqKtoMjPrlh0AC6LIKr4BbYG0Z0DLTBFY9RvwSd5SM4GUZUUE55A06D3aAPtD1E0yAZRtQLnnh0+FV5l/Nh12gQrKrg5YDJrpsOKGmDHhNRH3gRQFQ3vY+6wew/JEugx0gkbAFnwHKnQWLHTW/YPeAguAi+e0jmQc7GIygFauAD+C2dfwL3wTmwlU9viiiKV/QHn/TDxm/TaPYAAAAASUVORK5CYII=');
  background-repeat: no-repeat;
  background-size: 26px 156px; }

/* Retina icon */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .mapbox-icon {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAAE4CAYAAAAUzdAkAAAGAklEQVR42uzdb2hVdRzH8bl0MXIpLVOjEmQRtLpsd/9cywoSwsonzfUHklhQ9mBJBMkoCISiJyXtSQirB0H/tSxYOIggjfakB5v2oElg2UaJjhSjls7t9PnCCX4curv3rHvu+d3T+8B7znt/Z/5eO+ee3bv91JogCDIVIECAAAECBAgQIECAAAECBCgboLa2tlEVhI1mARS4AQIEKOOg6NVsiY36CAr+S4A45f7vFwVAgADx8oFXrIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAglpexAJAVjUUb5aIACBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAA+Q6y5QGv19TU1GYJFLS3t3/c3d1dnxlQiBrTr1dnAuT0Qz6fb/Ie1NHRsU4TfU69pb7RxGcMUKAzra2t3V6Cmpub63Qq7dYkz6sgRn8K/kCiIP0ht2pyh4tMZLKvr++yELNSvx9XwRKbF+qZxEBFMUpjtttYbcvsymW3eQsqAfOtM/bpuIBCp1xqID3wt4RHp1a/P7FUjHtRqChokVPz3uhYdVF9qPt6BW/RtrrYZdsbkD2Vccdpgl/YZTvOF1avQAJ85ox7V62I+9THtyP0XTjmNbva/XO7Hhftum1YTahzBZ6cegn6XZ/xQ3H39xJkjwE1p6NxcyZAgqzRfW/Y+5kANTU1Xa7T7ZZMgNwApQ+KH6CwFF4+xM8+Vqog9wVeOTD2sfhGIyBAgAABAgQIECBAgAABAgQIECBAgAABAgRo8fQD42u16OJ+/WThRcvet9uqDqSJbxZgcrE1dDbGe5AtZdFE99q6thLXvu21fbwFaZIHI5P+TY2oPWEjdltkzEEvQfop3CORib7X2dnZGB1nt9l97ljb1ytQLpe7JrKq95Vi+9gYZ/yMfQxfQHZ0djqTO2Yrf0tZHWxjnaO00xuQLRFzFvf1x7ga9jufiGGfQBMOKBcDlHNAE96A3EXlPT09DaXuZ2Md0B8+PYbGnIl1xThCm5z9jvt0hIacie2Ksd8uZ78Rb0D6TD/qTOwXffW/qtg+NsbGOle5x70B2dMXO2Uc1P7FVv7afTbGGX/aFgp6A7Js5XvkOdxRlf8XTD68L3Ca8XKtj069l2yCkaZt3bZl76ugQKcN5QvIRT3oPA2KV4jyCmR1dXWt1cTeLnBEZtWbOkXvsKc+SaCS/vt063XUtoVHLm9/KcpdAp0Eyt6kUHIoe5MplL3xGfWlv6D4qGN2W9WCXJSLqVqQi7L4zikgQIAAAQIECBAgQIAAAQIECBAgQICqEtShhtS+MjekOtIATamktqkUQMlugFIEzagB1aKuVI1qgzpSjaApVegfwRutRlCvqskS6Apn/1p1n3Pp/7naQNOR/bdU+0VhMrL/7qyBBqsRdFwNhj0R2X+TGnQ6Ww2gUv9H9lp1IUugDSrIEujuagFdUKfCvo7sP+Dcd46rHCBAgAABitl4gqDxNECNql89VWIPRfZvKTCuXzXynVNAgAABAgQIECBAgAABAgQIECBAgAABAuQZaJXaqHLqelVfYNyySoFWq3VL2G+N+kBFt0tqj1qurlPPq0NqRaVAfer7mKgG9ZNabDup5tWC6q3kKTesghC1vsR99qlStr/Uy+pZtaNSoDFnAmfUw0XG16s5FWf7RC2vFOhVFd0+VU0Fxt8WEzOi6ip5ym1dZDKH1WNqpTN+e0zQjZW+bNepr4pMakGdUJ+rAzFBaysN2qE2q6Oq3NslVVtp0IiybTYB0HQazxReUElt+9MANahfEwI9mQbIukudLTNmXt2QFsi6SR1QF8sE+ijtZ9uDIehkGTALKpc26PZwIuXY3vHl9dBAGTA/qlW+gKx71MQSMXOq29dXrFvVqRiYWbXNx5fgG9X7MR9P59WdPnxPoUX93Y4dmwAIQ2EQhqxi4xSOIGQcC8dwBKfIAIJdRrB3AxvP3sZUT7jAN8DBa/JnTFhRcTV8D7ooI0lCxoavr2KMvPoMWFBwvJzciR0z+r/OWOnh0GiQQQYZZJBBBhlkkEEGBXcD/NcD18JsKswAAAAASUVORK5CYII='); } }

a.mapbox-icon-share {
  background-position: 0 -52px; }

a.mapbox-icon-geocoder {
  background-position: 0 -78px; }

a.mapbox-icon-facebook {
  background-position: 0 -104px; }

a.mapbox-icon-twitter {
  background-position: 0 -130px; }

/* Map legends */
.map-legends {
  border: 1px solid #bbb;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #fff;
  -webkit-border-radius: 3px;
  border-radius: 3px; }

.map-legends {
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); }

.map-legends .map-legend {
  padding: 10px; }

.map-tooltip {
  z-index: 999999;
  padding: 10px;
  max-width: 300px;
  opacity: 1;
  -webkit-transition: opacity 150ms;
  -moz-transition: opacity 150ms;
  -ms-transition: opacity 150ms;
  -o-transition: opacity 150ms;
  transition: opacity 150ms;
  -webkit-user-select: auto;
  -moz-user-select: auto;
  user-select: auto;
  border: 1px solid #bbb;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #fff;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  min-width: 180px;
  max-width: 280px;
  max-height: 400px;
  overflow: auto;
  width: 220px\8;
  /*< IE 9*/
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  color: #222;
  font: normal 13px/20px Arial, sans-serif; }

.map-tooltip .close {
  text-indent: -999em;
  background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJYAAAAeCAYAAADO4udXAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAHFSURBVHic7dpBbsIwEAXQoZpbwKKz8Bm66EFyjUicI1KuwUF6Ci/cBbmFJbqoLbluJezgMSn8JyGhJMRAvmZiw+5yuRBAay/3fgPwmBAsUIFggQoEC1QgWKACwQIVCBaoQLCgiIiMIjKWHo9gbVy4oJ/po9e42fPiUBERcemBxpiD935i5qO19ly6rzUR+SAics69a46zFc65WUSIKi9sA2MYN449O+fm0hcXVyzv/UREb977kzHmELeHUJ3Cvqn0fDfYhwfoi5WqKlREFRWLmY8hQPsQroGIKG4jooWZjzWDw3VJG4oXtnflWqU4WNbaszFmSMMVdsVQDdpt8NmkoYoVI2lPPY0iQjVVa1f774ak9cV2pBqqcE91rfUtre+57jGuiIxJgFa3oS0orljQxU03zGv8NeNzzr3eet6qipVVqyVs7toK43S7xYffmmwpoVulysPV4rstnhXmoWLmgZkH+g7YPp8twnOrXW74UZ2stecsXD2WG55F1Ur3Wtmss1mFrF1u+LUImswWp07LDcv1Q/6n3u1dc9ZZPSuExxErosa9HIIFKvAjNKhAsEAFggUqECxQgWCBCgQLVCBYoALBAhVfpi7sxwlEhWYAAAAASUVORK5CYII=) no-repeat 0 0;
  overflow: hidden;
  display: none; }

.map-tooltip.closable .close:active {
  border-color: #b0b0b0;
  background-color: #f0f0f0; }

.map-tooltip.closable .close {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 20px;
  height: 20px;
  background-position: -5px -5px;
  border-radius: 10px; }

.map-tooltip.closable .close {
  display: block; }

.map-tooltip small {
  font-size: 11px; }

.map-tooltip h1, .map-tooltip h2, .map-tooltip h3, .map-tooltip h4, .map-tooltip h5, .map-tooltip h6 {
  font-size: 16px; }

.map-tooltip h1, .map-tooltip h2, .map-tooltip h3, .map-tooltip h4, .map-tooltip h5, .map-tooltip h6, .map-tooltip p {
  margin: 0px 0px 10px; }

/* Leaflet Overrides */
.leaflet-control-interaction {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 300px; }

.leaflet-popup {
  pointer-events: none; }

.leaflet-popup-close-button {
  pointer-events: all; }

.leaflet-popup-content-wrapper {
  border-radius: 2px;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  pointer-events: all; }

.leaflet-popup-content {
  line-height: 1.6em;
  margin: 12px 16px; }

.leaflet-popup-content .marker-title {
  font-weight: bold;
  line-height: 2em; }

.leaflet-popup-tip {
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); }

.leaflet-control .mapbox-button {
  border-radius: 4px;
  font-weight: bold;
  padding: 5px 8px; }

/* General Toolbar Overrides */
.leaflet-bar, .leaflet-touch .leaflet-bar {
  box-shadow: none;
  -webkit-border-radius: 2px;
  border-radius: 2px; }

.leaflet-bar a:first-child, .leaflet-touch .leaflet-bar a:first-child {
  -webkit-border-top-left-radius: 2px;
  border-top-left-radius: 2px;
  -webkit-border-top-right-radius: 2px;
  border-top-right-radius: 2px; }

.leaflet-bar a:last-child, .leaflet-touch .leaflet-bar a:last-child {
  -webkit-border-bottom-left-radius: 2px;
  border-bottom-left-radius: 2px;
  -webkit-border-bottom-right-radius: 2px;
  border-bottom-right-radius: 2px; }

/* Cursors */
.leaflet-container {
  cursor: default;
  cursor: -webkit-default;
  cursor: -moz-default; }

.leaflet-popu a, .map-tooltip a, .map-legend a {
  color: #489;
  text-decoration: none; }

.leaflet-dragging {
  cursor: move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing; }

.leaflet-clickable, .leaflet-container.map-clickable {
  cursor: pointer;
  cursor: -webkit-pointer;
  cursor: -moz-pointer; }

/* Sharing */
.mapbox-share-buttons {
  clear: both;
  border-bottom: 1px solid #e2e2e2;
  margin-bottom: 10px;
  padding: 15px 0; }

.mapbox-share-buttons a {
  border-radius: 2px;
  display: inline-block;
  font-weight: bold;
  height: 26px;
  line-height: 26px;
  padding-left: 30px;
  text-decoration: none;
  width: 48%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.mapbox-share-buttons a.mapbox-share-facebook {
  color: #fff;
  background-color: #3B5998;
  margin-right: 4%; }

.mapbox-share-buttons a.mapbox-share-facebook:hover {
  background-color: #466EB2; }

.mapbox-share-buttons a.mapbox-share-twitter {
  color: #fff;
  background-color: #4099FF; }

.mapbox-share-buttons a.mapbox-share-twitter:hover {
  background-color: #64B2FF; }

.mapbox-share-popup {
  background: #fff;
  padding: 20px;
  z-index: 1000;
  box-sizing: border-box;
  -moz-box-sizing: border-box; }

.mapbox-share-popup h3 {
  margin: 0px; }

.mapbox-share-popup small {
  color: #666; }

.mapbox-share-popup textarea {
  width: 100%;
  height: 50px; }

/* Light Theme (default) */
.leaflet-control .mapbox-button {
  background-color: #fff;
  border: 1px solid #bbb; }

.leaflet-control .mapbox-button:hover {
  background-color: #F4F4F4;
  cursor: pointer; }

.leaflet-bar, .leaflet-touch .leaflet-bar {
  border: 1px solid #bbb; }

.leaflet-bar a:active, .leaflet-control .mapbox-button:active {
  background-color: #e2e2e2; }

/* geocoder */
.leaflet-control-mapbox-geocoder {
  position: relative; }

.leaflet-control-mapbox-geocoder.searching:before {
  content: '';
  background: #cccccc;
  background: rgba(224, 224, 224, 0.5);
  position: absolute;
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
  z-index: 100; }

.leaflet-control-mapbox-geocoder .leaflet-control-mapbox-geocoder-wrap {
  background: #fff;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  position: absolute;
  -webkit-transition: width 100ms;
  -moz-transition: width 100ms;
  -ms-transition: width 100ms;
  -o-transition: width 100ms;
  transition: width 100ms;
  border: 1px solid #ccc;
  overflow: hidden;
  top: -1px;
  left: 27px;
  width: 0;
  height: 28px;
  opacity: 0; }

.leaflet-control-mapbox-geocoder.active .leaflet-control-mapbox-geocoder-wrap {
  width: 175px;
  border-radius: 0 2px 2px 0;
  border-left: 0;
  opacity: 1; }

.leaflet-bar .leaflet-control-mapbox-geocoder-toggle, .leaflet-bar .leaflet-control-mapbox-geocoder-toggle:hover {
  border-bottom: none; }

.leaflet-control-mapbox-geocoder-toggle {
  border-radius: 2px;
  -webkit-border-radius: 2px; }

.leaflet-control-mapbox-geocoder.active, .leaflet-control-mapbox-geocoder.active .leaflet-control-mapbox-geocoder-toggle {
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  -webkit-border-top-right-radius: 0px;
  -webkit-border-bottom-right-radius: 0px; }

.leaflet-control-mapbox-geocoder .leaflet-control-mapbox-geocoder-form input {
  border: 0;
  width: 175px;
  padding-left: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 26px;
  outline: none; }

.leaflet-control-mapbox-geocoder .mapbox-geocoder-toggle {
  position: absolute;
  top: 0;
  left: 0; }

.leaflet-control-mapbox-geocoder input:focus {
  border-color: #888; }

.leaflet-control-mapbox-geocoder-results {
  position: absolute;
  left: 26px;
  top: 26px; }

.leaflet-control-mapbox-geocoder-results a, .leaflet-control-mapbox-geocoder-results span, .leaflet-control-mapbox-geocoder-results a:hover {
  width: 176px;
  padding: 0 10px;
  text-overflow: ellipsis;
  border: 1px solid #ccc;
  border-top: 0;
  white-space: nowrap;
  display: block;
  background: #fff;
  line-height: 26px;
  overflow: hidden;
  text-align: center;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.leaflet-control-mapbox-geocoder-results a:hover {
  background: #eee; }

.leaflet-control-mapbox-geocoder-results a:last-child, .leaflet-control-mapbox-geocoder-results span:last-child {
  border-bottom: 1px solid #ccc; }

/* Dark Theme */
.leaflet-container.dark .leaflet-bar {
  border-color: #000; }

.leaflet-container.dark .leaflet-bar a, .leaflet-container.dark .leaflet-control .mapbox-button {
  background-color: #404040;
  color: #fff;
  border-color: #000; }

.leaflet-container.dark .leaflet-bar a:hover, .leaflet-container.dark .leaflet-control .mapbox-button:hover {
  background-color: #565656; }

.leaflet-container.dark .leaflet-bar a:active, .leaflet-container.dark .leaflet-control .mapbox-button:active {
  background-color: #6B6B6B; }

.leaflet-container.dark .leaflet-bar a.leaflet-disabled, .leaflet-container.dark .leaflet-control .mapbox-button.disabled {
  background-color: #252525;
  color: #474747; }

.leaflet-container.dark .leaflet-control-mapbox-geocoder input[type=text] {
  background-color: #565656;
  border-color: #000;
  color: #fff; }

.leaflet-container.dark .leaflet-control-mapbox-geocoder input:focus {
  border-color: #ccc; }

.marker-cluster .marker-cluster-container {
  position: relative;
  width: 58px;
  height: 58px; }
  .marker-cluster .marker-cluster-container div {
    position: absolute;
    width: 58px;
    height: 58px;
    top: 50%;
    left: 50%;
    margin-top: -29px;
    margin-left: -29px;
    border-radius: 29px;
    background: url("../geoleaderboard/icon-cluster.png");
    text-align: center;
    font: 13px Purista; }
  .marker-cluster .marker-cluster-container.current-user div {
    background: url("../geoleaderboard/icon-cluster-yellow.png"); }
  .marker-cluster .marker-cluster-container span {
    line-height: 58px; }
.marker-cluster.highlight .marker-cluster-container div {
  background: url("../geoleaderboard/icon-cluster-hover.png"); }
.marker-cluster.highlight .marker-cluster-container.current-user div {
  background: url("../geoleaderboard/icon-cluster-yellow-hover.png"); }

.leaflet-cluster-anim .leaflet-marker-icon, .leaflet-cluster-anim .leaflet-marker-shadow {
  -webkit-transition: -webkit-transform 0.2s ease-out, opacity 0.2s ease-in;
  -moz-transition: -moz-transform 0.2s ease-out, opacity 0.2s ease-in;
  -o-transition: -o-transform 0.2s ease-out, opacity 0.2s ease-in;
  transition: transform 0.2s ease-out, opacity 0.2s ease-in; }

#clubs {
  position: relative;
  width: 992px;
  margin: 0 auto;
  font-family: Arial;
  font-size: 14px; }
  #clubs header {
    position: relative; }
  #clubs #memberbox-footer {
    padding: 0;
    background-color: rgba(7, 7, 7, 0.4);
    margin-top: 1px;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    cursor: pointer; }
    #clubs #memberbox-footer p {
      padding: 16px; }
    #clubs #memberbox-footer:hover {
      background-color: rgba(7, 7, 7, 0.6); }
  #clubs .empty-message {
    text-align: center;
    color: #a8a8a8; }
  #clubs .club-delete {
    background: url(../base/shared/row_icon_chat_light.png) 0 -26px;
    width: 13px;
    height: 13px;
    position: absolute;
    right: 16px;
    cursor: pointer;
    top: 16px; }
    #clubs .club-delete:hover {
      background-position: 0 -39px; }
  #clubs .public-wall-title {
    margin-bottom: 1px; }
  #clubs textarea {
    font-family: Arial;
    font-size: 13px; }
  #clubs .club-message-area {
    margin-bottom: 0px; }
    #clubs .club-message-area textarea {
      font-size: 14px;
      height: 22px;
      line-height: 22px; }
    #clubs .club-message-area button, #clubs .club-message-area label, #clubs .club-message-area .bbarea {
      display: none; }
    #clubs .club-message-area.expanded textarea {
      height: 100px;
      overflow-y: auto; }
      #clubs .club-message-area.expanded textarea.comment-reply {
        height: 50px; }
    #clubs .club-message-area.expanded button, #clubs .club-message-area.expanded label, #clubs .club-message-area.expanded .bbarea {
      display: block; }
  #clubs .wall-message-author a {
    font-weight: bold; }
  #clubs .wall-message {
    margin: 8px 0 16px;
    line-height: 18px; }
  #clubs .wall-message-add {
    padding-bottom: 0; }
  #clubs .wall-message-ago {
    font-size: 11px;
    color: #8a8a8a; }
  #clubs .wall-message-right {
    float: left;
    width: 548px; }
  #clubs .wall-message-left {
    float: left;
    margin-right: 16px; }
  #clubs nav.submenu {
    margin-bottom: 8px; }
  #clubs .wall-comment-right {
    float: left;
    width: 480px; }
  #clubs .wall-comment-left {
    float: left;
    margin-right: 16px; }
  #clubs .club-wall-help {
    padding: 32px 16px;
    text-align: center; }
  #clubs .wall-post-message-form textarea, #clubs .wall-sticky-form textarea {
    width: 606px;
    max-width: 606px; }
  #clubs .wall-post-comment-form textarea {
    width: 530px;
    max-width: 530px;
    font-size: 12px; }
  #clubs #club-wall-messages {
    margin-top: 1px; }
  #clubs .club-wall-comments {
    position: relative; }
  #clubs .club-wall-comments-container {
    margin-bottom: 1px; }
  #clubs .comments-info .box-content {
    padding: 6px;
    margin-bottom: 1px;
    font-size: 11px;
    color: #a8a8a8; }
    #clubs .comments-info .box-content a {
      font-weight: bold; }
  #clubs .club-report-message-container, #clubs .club-report-comment-container {
    position: absolute;
    right: 16px;
    display: none; }
  #clubs .admin .club-report-message-container {
    right: 60px; }
  #clubs .admin .club-report-comment-container {
    right: 36px;
    top: 12px; }
  #clubs .create-club-btn {
    position: absolute;
    top: 0;
    right: 0; }
    #clubs .create-club-btn .icon-premium-shield {
      position: relative;
      left: -7px;
      top: 4px; }
  #clubs .clubs-list .box-content {
    cursor: pointer;
    margin-top: 1px; }
    #clubs .clubs-list .box-content:hover {
      background-color: rgba(7, 7, 7, 0.6); }
  #clubs .clubs-list .friends {
    margin-top: 8px; }
  #clubs .reports a {
    position: relative;
    display: inline-block; }
  #clubs .club-link .emblem, #clubs .club-link .club-info {
    float: left;
    margin-right: 16px; }
  #clubs .club-link .name {
    margin: 8px 0;
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 19px; }
  #clubs .club-link .info {
    font-size: 12px; }
  #clubs #club-sticky-container {
    position: absolute;
    right: 0;
    top: 0; }
  #clubs .club-index .no-friends-yet {
    height: 100px;
    padding-top: 90px;
    text-align: center;
    color: #a8a8a8; }
  #clubs .club-index .myclubs {
    text-align: center; }
    #clubs .club-index .myclubs .divider {
      width: 1px;
      height: 20px;
      float: left; }
    #clubs .club-index .myclubs .box-content {
      height: 360px;
      float: left;
      width: 298px;
      margin-bottom: 1px; }
      #clubs .club-index .myclubs .box-content .name {
        margin: 10px 0;
        font-family: Purista, sans-serif;
        font-style: normal;
        font-weight: 600;
        font-size: 19px;
        white-space: nowrap;
        max-width: 300px;
        text-overflow: ellipsis;
        overflow: hidden; }
      #clubs .club-index .myclubs .box-content .active {
        color: #ff9900;
        text-transform: uppercase;
        font-size: 12px;
        font-weight: bold;
        margin-top: 8px; }
  #clubs .club-create .form-title, #clubs .club-create .form-value, #clubs .club-create .form-desc {
    float: left; }
  #clubs .club-create .form-value {
    margin-right: 16px; }
  #clubs .club-create .form-desc {
    color: #a8a8a8;
    line-height: 36px; }
  #clubs .club-create .wide-input {
    width: 360px;
    float: left;
    padding: 10px; }
  #clubs .club-create .bbarea {
    clear: both; }
  #clubs .club-create textarea {
    height: 150px;
    max-width: 360px; }
  #clubs .club-create .box-content {
    margin-top: 1px; }
  #clubs .club-create .form-title {
    width: 200px;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
    line-height: 36px; }
  #clubs .club-create .form-value .switch {
    margin-bottom: 8px; }
  #clubs .club-member-row {
    margin-bottom: 1px; }
    #clubs .club-member-row button.member-join {
      padding: 0 11px;
      width: 32px; }
      #clubs .club-member-row button.member-join i.icon-join-member {
        margin-top: 8px;
        background: url("../base/shared/icon-join.png") no-repeat scroll 0 -10px rgba(0, 0, 0, 0);
        width: 10px;
        height: 11px; }
    #clubs .club-member-row .club-member-info {
      padding: 0 16px; }
      #clubs .club-member-row .club-member-info .club-member-text-row {
        margin-top: 8px;
        line-height: 15px; }
        #clubs .club-member-row .club-member-info .club-member-text-row .base-profile-link {
          font-weight: bold; }
        #clubs .club-member-row .club-member-info .club-member-text-row .club-member-separator {
          margin-left: 8px;
          margin-right: 8px; }
  #clubs .membersbox ul.new-row {
    min-height: 74px; }
    #clubs .membersbox ul.new-row li.club-member {
      margin-right: 16px; }
      #clubs .membersbox ul.new-row li.club-member:last-child {
        margin-right: 0; }
      #clubs .membersbox ul.new-row li.club-member .club-member-level {
        text-align: center; }
    #clubs .membersbox ul.new-row:last-child {
      min-height: 60px; }
  #clubs .club-member {
    float: left;
    margin-right: 8px; }
    #clubs .club-member.expanded {
      float: none;
      margin-right: 0; }
  #clubs .btn-close {
    margin: 15px 0 0 20px;
    border: none;
    outline: none;
    background: url('../unifiedgamemanager/close.png') no-repeat 0 0 transparent;
    width: 15px;
    height: 15px;
    box-shadow: none; }
  #clubs .emblembox {
    position: relative; }
    #clubs .emblembox .emblem-edit-hover {
      display: none; }
      #clubs .emblembox .emblem-edit-hover a {
        padding: 8px;
        background-color: rgba(7, 7, 7, 0.6);
        color: whiteSmoke;
        font-size: 11px;
        cursor: pointer;
        display: block; }
      #clubs .emblembox .emblem-edit-hover .edit-link {
        position: absolute;
        top: 8px;
        left: 8px; }
      #clubs .emblembox .emblem-edit-hover .sync-link {
        position: absolute;
        bottom: 8px;
        right: 8px; }
      #clubs .emblembox .emblem-edit-hover:hover {
        text-decoration: underline; }
    #clubs .emblembox:hover .emblem-edit-hover {
      display: block; }
  #clubs .club-members-playing {
    display: block;
    margin-bottom: 16px;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 36px;
    text-align: center;
    background-color: #2f84b1; }
  #clubs .sync-width {
    width: 320px; }
  #clubs .npxarea {
    background: url(../clubs/club-npx.jpg);
    text-align: center;
    margin-bottom: 16px;
    width: 991px;
    height: 371px;
    font-size: 14px;
    position: relative; }
    #clubs .npxarea h1 {
      line-height: 50px;
      padding-top: 100px;
      display: block;
      font-size: 46px;
      min-height: 150px;
      text-shadow: 0 1px #000; }
    #clubs .npxarea div {
      bottom: 16px;
      width: 660px;
      margin: 0 auto;
      line-height: 24px; }
    #clubs .npxarea .clubs-npx-button {
      position: absolute;
      top: 0px;
      right: 8px; }
  #clubs .report-help {
    text-align: center; }
    #clubs .report-help h1 {
      margin-left: 16px; }
    #clubs .report-help p {
      color: #a8a8a8;
      line-height: 20px; }
  #clubs .battlereports-table .map-info {
    max-width: 550px; }
  #clubs .battlereports-table .players {
    margin-left: 56px;
    margin-top: 8px; }
    #clubs .battlereports-table .players span {
      margin-left: 4px; }
  #clubs .club-report {
    position: absolute;
    right: 16px;
    top: 16px; }
  #clubs .club-info {
    margin-bottom: 1px;
    position: relative; }
  #clubs .show-members {
    color: #a8a8a8;
    display: inline-block;
    float: right; }
  #clubs .info-icon {
    background: url('../loadout/icon-info-s.png') 0 0 no-repeat;
    width: 17px;
    height: 17px;
    cursor: pointer;
    opacity: 0;
    display: inline-block;
    vertical-align: middle;
    margin: 0 6px;
    -webkit-transition: opacity 0.2s ease-out;
    -moz-transition: opacity 0.2s ease-out;
    transition: opacity 0.2s ease-out;
    position: absolute;
    top: 30px;
    right: 4px; }
    #clubs .info-icon:hover {
      opacity: 1 !important; }
  #clubs .box:hover .info-icon {
    opacity: 0.4; }
  #clubs .club-wall-help {
    line-height: 20px;
    color: #a8a8a8; }
  #clubs .club-member-level {
    font-size: 12px;
    color: #d5dde5;
    margin: 8px 0; }
  #clubs .club-interact-area {
    position: absolute;
    top: 0;
    right: 0; }
  #clubs .max-amount-reached {
    line-height: 20px; }
  #clubs .stats {
    height: 202px;
    text-align: center; }
    #clubs .stats .club-rank {
      font-size: 79px;
      padding: 8px;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600; }
    #clubs .stats .club-span50 {
      width: 326px;
      margin-left: 0px; }
      #clubs .stats .club-span50:first-child {
        width: 329px; }
      #clubs .stats .club-span50:last-child {
        margin-left: 1px; }
    #clubs .stats .rankscore {
      position: relative;
      height: 170px; }
      #clubs .stats .rankscore #overview-rank {
        margin-top: 14px; }
        #clubs .stats .rankscore #overview-rank .progress-bar-info {
          font-size: 12px; }
      #clubs .stats .rankscore .value {
        font-size: 34px;
        padding-top: 60px; }
    #clubs .stats .title {
      text-transform: uppercase;
      font-size: 12px;
      margin-bottom: 6px;
      color: #a8a8a8;
      white-space: nowrap; }
    #clubs .stats .value {
      font-size: 14px; }
    #clubs .stats .score {
      height: 105px; }
      #clubs .stats .score .value {
        font-family: Purista, sans-serif;
        font-style: normal;
        font-weight: 600;
        font-size: 34px;
        padding-top: 26px; }
    #clubs .stats .right-area {
      position: relative; }
      #clubs .stats .right-area .box-content {
        margin-left: 0; }
    #clubs .stats .club-span1 {
      position: relative;
      margin-top: 1px;
      margin-left: 0;
      width: 108px;
      margin-right: 1px; }
      #clubs .stats .club-span1:last-child {
        margin-right: 0px; }
  #clubs .club-link {
    margin-bottom: 6px;
    display: block; }
    #clubs .club-link:hover {
      text-decoration: none; }
      #clubs .club-link:hover .name {
        text-decoration: underline; }
    #clubs .club-link .ui-emblem {
      display: inline;
      margin-right: 6px; }
  #clubs .wallmessage, #clubs .wallcomment, #clubs .wallsticky {
    position: relative; }
    #clubs .wallmessage.leader, #clubs .wallcomment.leader, #clubs .wallsticky.leader {
      box-shadow: 0 0 5px white; }
    #clubs .wallmessage:hover .club-delete, #clubs .wallcomment:hover .club-delete, #clubs .wallsticky:hover .club-delete {
      display: block; }
  #clubs .wallmessage {
    margin-bottom: 1px; }
    #clubs .wallmessage .sticky {
      position: absolute;
      top: 0;
      right: 20px;
      width: 15px;
      height: 16px;
      background: url(../clubs/sticky.png); }
    #clubs .wallmessage .add-sticky {
      display: none;
      cursor: pointer; }
    #clubs .wallmessage .remove-sticky {
      cursor: pointer; }
    #clubs .wallmessage:hover .add-sticky, #clubs .wallmessage:hover .message-interact, #clubs .wallmessage:hover .club-report-message-container {
      display: block; }
  #clubs .wall-message-container {
    position: relative; }
  #clubs .wall-likes {
    margin-top: 16px;
    margin-bottom: 1px; }
    #clubs .wall-likes .box-content {
      padding: 4px 5px 4px;
      font-size: 11px;
      color: #a8a8a8; }
      #clubs .wall-likes .box-content .base-profile-link {
        font-weight: bold; }
      #clubs .wall-likes .box-content a {
        cursor: pointer; }
  #clubs .message-interact {
    display: none;
    position: absolute;
    bottom: 0;
    right: 0; }
    #clubs .message-interact .interact-item {
      margin-left: 3px;
      border: 1px solid rgba(255, 255, 255, 0.15);
      padding: 4px 0;
      display: inline; }
      #clubs .message-interact .interact-item a {
        font-weight: normal;
        font-size: 12px;
        color: white;
        display: inline-block;
        padding: 0 8px;
        cursor: pointer; }
        #clubs .message-interact .interact-item a.hide {
          display: none; }
        #clubs .message-interact .interact-item a i.icon {
          height: 15px;
          width: 15px;
          display: inline-block;
          background: url(../feed/feed-icons.png);
          position: relative;
          top: 3px;
          margin-right: 4px; }
          @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
            #clubs .message-interact .interact-item a i.icon {
              background-image: url("../feed/feed-icons@2x.png");
              background-size: 45px 15px; } }
          #clubs .message-interact .interact-item a i.icon.comment {
            background-position: 30px 0; }
          #clubs .message-interact .interact-item a i.icon.hooah {
            background-position: 15px 0; }
          #clubs .message-interact .interact-item a i.icon.share {
            background-position: 0 0; }
        #clubs .message-interact .interact-item a span.icon {
          background: url(../base/shared/row_icon_chat_light.png) right -26px no-repeat;
          width: 13px;
          height: 13px;
          display: inline-block;
          margin: 0 -4px -2px 4px; }
        #clubs .message-interact .interact-item a:hover span.icon {
          background-position: right -39px; }
  #clubs .wallcomment {
    clear: both;
    line-height: 18px;
    color: #a8a8a8;
    margin-bottom: 1px;
    font-size: 12px; }
    #clubs .wallcomment .box-content {
      padding: 8px; }
    #clubs .wallcomment:hover .club-report-comment-container {
      display: block; }
    #clubs .wallcomment .wall-comment-content {
      padding-right: 50px; }
    #clubs .wallcomment .new-indicator {
      width: 0px;
      height: 0px;
      border-style: solid;
      border-width: 0 10px 10px 0;
      border-color: transparent #f90 transparent transparent;
      -webkit-transition: 0.2s ease-out;
      -webkit-transition-property: opacity;
      position: absolute;
      top: 0;
      right: 0; }
  #clubs .presentation {
    line-height: 20px;
    margin: 1px 0; }
    #clubs .presentation .preswrapper {
      max-height: 120px;
      overflow: hidden; }
    #clubs .presentation .view-more-btn {
      display: none; }
    #clubs .presentation.minified .view-more-btn {
      display: block; }
      #clubs .presentation.minified .view-more-btn a {
        cursor: pointer;
        color: #a8a8a8; }
    #clubs .presentation.expanded .preswrapper {
      overflow: auto;
      max-height: none; }
  #clubs #clubs-battlereports {
    min-height: 480px;
    position: relative; }
  #clubs .club-server-row .club-server .club-server-content {
    padding: 16px;
    background-color: rgba(0, 0, 0, 0.2);
    margin-bottom: 1px;
    position: relative; }
    #clubs .club-server-row .club-server .club-server-content .club-server-join {
      position: absolute;
      bottom: 16px;
      right: 16px;
      z-index: 1; }
      #clubs .club-server-row .club-server .club-server-content .club-server-join .club-server-slots {
        display: inline-block;
        font-family: Purista, sans-serif;
        font-weight: 600;
        font-size: 18px;
        margin-right: 8px;
        line-height: 32px;
        position: relative;
        bottom: -2px;
        text-transform: lowercase;
        color: #fff; }
    #clubs .club-server-row .club-server .club-server-content .club-server-map-icon {
      float: left;
      margin-right: 16px; }
      #clubs .club-server-row .club-server .club-server-content .club-server-map-icon img {
        display: block; }
    #clubs .club-server-row .club-server .club-server-content .club-server-desc a {
      color: #8a8a8a; }
    #clubs .club-server-row .club-server .club-server-content .club-server-desc .name {
      font-size: 14px;
      line-height: 16px; }
    #clubs .club-server-row .club-server .club-server-content .club-server-desc .mapmode {
      margin-top: 3px;
      color: #a8a8a8;
      font-size: 11px; }
    #clubs .club-server-row .club-server .club-server-content .club-server-desc .ping {
      margin-left: 3px; }
    #clubs .club-server-row .club-server .club-server-content .club-server-desc .gameicon {
      vertical-align: bottom; }
    #clubs .club-server-row .club-server .club-server-content .club-server-friends {
      position: absolute;
      bottom: 16px;
      left: 179px; }
      #clubs .club-server-row .club-server .club-server-content .club-server-friends .avatars {
        padding: 0; }
  #clubs .club-server-row .club-server.expanded {
    padding-top: 200px; }
    #clubs .club-server-row .club-server.expanded .club-server-content {
      background-color: rgba(0, 0, 0, 0.7); }
  #clubs .club-server-row.last .club-server-content {
    margin-bottom: 0; }
  #clubs .empty-servers {
    text-align: center; }
    #clubs .empty-servers p {
      color: #a8a8a8;
      line-height: 20px;
      margin-bottom: 32px; }
  #clubs .big-box {
    padding-top: 100px;
    padding-bottom: 100px; }

#clubs-dialogsoldiers {
  width: 528px; }
  #clubs-dialogsoldiers tr {
    background: #202026;
    opacity: 0.5;
    cursor: pointer; }
    #clubs-dialogsoldiers tr td {
      color: #fff;
      background-image: none; }
    #clubs-dialogsoldiers tr.active {
      background: #eee;
      opacity: 1; }
      #clubs-dialogsoldiers tr.active td {
        color: #2a3b44; }

aside.clubs .box ul.report-stats {
  display: table;
  width: 100%;
  font-size: 12px; }
  aside.clubs .box ul.report-stats li {
    display: table-row; }
    aside.clubs .box ul.report-stats li span {
      text-align: left;
      display: table-cell;
      padding: 8px 0 0 0; }
      aside.clubs .box ul.report-stats li span:first-child {
        width: 30%;
        color: #a8a8a8; }
aside.clubs .box ul.avatars {
  padding: 0;
  margin-left: -7px; }
  aside.clubs .box ul.avatars li {
    margin-left: 6px;
    display: block;
    min-height: 42px; }
aside.clubs footer {
  padding: 0; }
  aside.clubs footer a {
    display: block;
    text-decoration: none; }
  aside.clubs footer:hover {
    background-color: rgba(7, 7, 7, 0.6); }

#clubs-dialogrank tr.current td {
  background-color: #fff;
  color: #000; }

.clubmember-dropdown-container {
  position: relative; }
  .clubmember-dropdown-container .clubmember-dropdown {
    padding: 0;
    position: relative;
    height: 14px;
    width: 14px;
    background: url(../common/report.png);
    cursor: pointer;
    z-index: 10; }
    .clubmember-dropdown-container .clubmember-dropdown.cogwheel {
      background: url(../ui/icons-small.png) no-repeat;
      background-position: -14px -42px; }
    .clubmember-dropdown-container .clubmember-dropdown.bright {
      background-position: 0 28px; }
  .clubmember-dropdown-container.active .clubmember-dropdown.cogwheel {
    background-position: -14px -42px; }
  .clubmember-dropdown-container:hover .clubmember-dropdown.cogwheel {
    background-position: -28px -42px; }

.clubmember-dropdown-dropdown {
  position: absolute;
  width: 195px;
  top: 14px;
  left: -183px;
  z-index: 100;
  display: none;
  background-color: white;
  border: 1px solid #aaa;
  min-height: 25px; }

.clubmember-dropdown-container.active .clubmember-dropdown-dropdown {
  display: block; }

.clubmember-dropdown-dropdown li {
  border-bottom: 1px solid #ebebeb; }

.clubmember-dropdown-dropdown .ajax-loader {
  width: 16px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -8px;
  margin-top: -8px; }

.clubmember-dropdown-dropdown li > a {
  font-size: 11px;
  height: 25px;
  font-family: Arial;
  line-height: 25px;
  padding: 0 10px;
  outline: none;
  display: block;
  width: 100%;
  box-sizing: border-box;
  cursor: pointer;
  color: #000; }

/* challenges component CSS resource */
h1.mission-overviewstats-empty {
  text-align: center; }

.loggedout-usp-container.missions-loggedout {
  overflow: visible; }
  .loggedout-usp-container.missions-loggedout .usp.missions {
    background: none;
    margin-top: 0;
    margin-bottom: 0; }
  .loggedout-usp-container.missions-loggedout .usp.footer {
    padding-bottom: 44px; }

.create-mission-info {
  line-height: 18px;
  padding: 6px 12px;
  font-size: 12px; }
  .create-mission-info a {
    text-decoration: underline; }

#missions-overview {
  position: relative;
  font-family: Purista, sans-serif; }
  #missions-overview #no-results {
    text-align: center; }
  #missions-overview .mission-tight {
    margin-top: 8px; }
  #missions-overview .challenge-element {
    cursor: pointer;
    position: relative; }
    #missions-overview .challenge-element .thumb {
      width: 55px;
      float: left;
      text-align: center;
      padding: 3px 0; }
      #missions-overview .challenge-element .thumb img {
        width: 40px;
        height: 40px; }
    #missions-overview .challenge-element.challenge-selected {
      color: black;
      background-color: white;
      background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
      background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
      box-shadow: 0 0 7px 0 #e0f4f8; }
      #missions-overview .challenge-element.challenge-selected .info .challenge-type {
        font-weight: bold; }
    #missions-overview .challenge-element .info {
      float: left;
      line-height: 18px;
      padding-top: 6px; }
      #missions-overview .challenge-element .info .challenge-type {
        text-transform: uppercase; }
      #missions-overview .challenge-element .info .challenge-info {
        font-family: Arial, sans-serif;
        font-size: 12px;
        color: #a8a8a8; }
    #missions-overview .challenge-element .users {
      float: right;
      padding: 6px; }
      #missions-overview .challenge-element .users .avatar {
        display: block;
        float: left;
        margin-left: 2px; }
    #missions-overview .challenge-element a {
      position: relative;
      z-index: 2; }
      #missions-overview .challenge-element a.hover-wrapper {
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 1;
        top: 0;
        left: 0; }
  #missions-overview .mission-create-button {
    margin-left: 16px; }
  #missions-overview .missions-details .box-content {
    position: relative; }
  #missions-overview .missions-details .thumb {
    float: left;
    width: 158px; }
  #missions-overview .missions-details .header {
    margin-left: 164px; }
    #missions-overview .missions-details .header h1 {
      text-transform: uppercase;
      font-size: 26px;
      line-height: 28px;
      margin: 0; }
    #missions-overview .missions-details .header h2 {
      margin-top: 8px;
      font-size: 16px;
      line-height: 18px;
      margin-bottom: 0;
      font-weight: 200; }
  #missions-overview .missions-details .invite-response-buttons {
    position: absolute;
    left: 180px;
    bottom: 16px; }
    #missions-overview .missions-details .invite-response-buttons button + button {
      margin-left: 3px; }
  #missions-overview .missions-details .comments .writecomment form {
    padding-bottom: 24px; }
    #missions-overview .missions-details .comments .writecomment form textarea {
      font-family: Arial, sans-serif;
      font-size: 12px;
      font-style: normal;
      resize: none; }
    #missions-overview .missions-details .comments .writecomment form .submit-missioncomment {
      margin-top: 4px;
      position: relative;
      float: right; }
  #missions-overview .missions-details .comments .writecomment #message {
    width: 470px;
    height: 40px; }
    #missions-overview .missions-details .comments .writecomment #message.disabled {
      color: #555; }
  #missions-overview .missions-details .comments .viewmore {
    margin-top: 5px;
    float: right;
    cursor: pointer; }
  #missions-overview .missions-details .comments .comment {
    margin-left: 0;
    background: rgba(7, 7, 7, 0.5);
    font-family: arial;
    font-size: 12px; }
    #missions-overview .missions-details .comments .comment .gravatar {
      margin: 5px;
      float: left; }
    #missions-overview .missions-details .comments .comment .msgbox {
      margin: 5px 5px 8px 52px; }
      #missions-overview .missions-details .comments .comment .msgbox .username {
        margin-bottom: 4px; }
      #missions-overview .missions-details .comments .comment .msgbox .message {
        word-break: break-word;
        color: #aaa; }
    #missions-overview .missions-details .comments .comment .ago {
      font-size: 11px;
      font-family: Arial;
      margin-left: 52px;
      margin-bottom: 5px;
      color: #aaa; }
  #missions-overview .details-info {
    margin-top: 1px; }
    #missions-overview .details-info .span2, #missions-overview .details-info .span4 {
      margin-bottom: 1px;
      background: rgba(7, 7, 7, 0.5);
      padding: 8px;
      text-transform: uppercase; }
    #missions-overview .details-info .span2 {
      margin-left: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      max-width: auto; }
    #missions-overview .details-info .span4 {
      margin-left: 1px;
      width: 335px; }
  #missions-overview .progress-bar-inner {
    text-indent: 4px; }
  #missions-overview .players .mission-row {
    margin-bottom: 1px;
    background: rgba(7, 7, 7, 0.5);
    text-transform: uppercase;
    margin-bottom: 1px; }
    #missions-overview .players .mission-row .player {
      height: 48px;
      line-height: 28px; }
    #missions-overview .players .mission-row .position {
      padding: 10px;
      float: left;
      width: 49px;
      text-align: center; }
    #missions-overview .players .mission-row.active {
      background: #ccc; }
    #missions-overview .players .mission-row .member-avatar a {
      float: left;
      margin-top: 4px;
      width: 40px;
      height: 40px; }
    #missions-overview .players .mission-row .username {
      float: left;
      width: 160px;
      font-size: 12px;
      font-family: arial;
      font-weight: bold;
      margin-top: 11px;
      overflow: hidden;
      padding-left: 10px;
      text-transform: none; }
    #missions-overview .players .mission-row .played-rounds {
      color: #808080;
      float: left;
      padding: 10px;
      width: 65px; }
      #missions-overview .players .mission-row .played-rounds .dots > li {
        width: 7px;
        height: 7px;
        display: inline-block;
        border: 1px solid #717171;
        box-sizing: border-box;
        -moz-box-sizing: border-box; }
        #missions-overview .players .mission-row .played-rounds .dots > li.active {
          background: #fff;
          border: none; }
    #missions-overview .players .mission-row .score {
      float: left;
      font-family: Purista, arial;
      font-size: 26px;
      line-height: 50px;
      width: 105px;
      text-align: right;
      margin-right: 8px; }

/****** CREATE Mission *******/
#missions-create .mission-tight {
  margin-top: 8px; }
#missions-create #mission-description, #missions-create #map-description, #missions-create #attempts-description {
  font-family: Purista, arial;
  font-size: 17px; }
#missions-create .selectmission, #missions-create .selectmap, #missions-create .numrounds, #missions-create .invitefriends {
  display: inline-block;
  height: 23px;
  margin-bottom: 1px;
  padding: 0 10px; }
#missions-create .subheader {
  text-transform: uppercase;
  font-size: 19px;
  font-family: Purista, arial; }
#missions-create .scroll-container .scrollable {
  background: none;
  border: 1px solid rgba(7, 7, 7, 0.5);
  height: 169px; }
  #missions-create .scroll-container .scrollable .imagebox {
    background: rgba(7, 7, 7, 0.5);
    margin-bottom: 1px; }
  #missions-create .scroll-container .scrollable img {
    padding: 4px 0px; }
  #missions-create .scroll-container .scrollable .title {
    font-family: Purista, arial;
    background: rgba(7, 7, 7, 0.5);
    line-height: 30px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
  #missions-create .scroll-container .scrollable.selected {
    border: 1px solid #fff; }
    #missions-create .scroll-container .scrollable.selected .title {
      background: url(../challenges/boxselected.png);
      font-weight: bold; }
    #missions-create .scroll-container .scrollable.selected .description {
      display: none; }
#missions-create .scroll-left.disabled, #missions-create .scroll-right.disabled {
  opacity: 0.6;
  background-color: rgba(0, 0, 0, 0.8);
  cursor: default; }
#missions-create #challenge-type-select {
  height: 181px; }
#missions-create #map-select {
  height: 118px;
  position: relative;
  margin-bottom: 10px; }
  #missions-create #map-select .scroll-left, #missions-create #map-select .scroll-right {
    line-height: 144px; }
  #missions-create #map-select .scrollables .scrollable {
    height: 106px;
    overflow: visible; }
    #missions-create #map-select .scrollables .scrollable .title {
      line-height: 28px; }
    #missions-create #map-select .scrollables .scrollable:hover:not(.selected) {
      background-color: rgba(0, 0, 0, 0.35); }
    #missions-create #map-select .scrollables .scrollable .thumb {
      position: relative;
      height: 78px; }
      #missions-create #map-select .scrollables .scrollable .thumb img {
        height: 77px;
        padding: 0; }
      #missions-create #map-select .scrollables .scrollable .thumb .xp-icon {
        position: absolute;
        right: 2px;
        bottom: 3px; }
#missions-create #rounds-select > div {
  margin-left: 0; }
  #missions-create #rounds-select > div ul li {
    background-color: none; }
    #missions-create #rounds-select > div ul li a {
      font-size: 16px;
      background-color: rgba(7, 7, 7, 0.5); }
    #missions-create #rounds-select > div ul li.active a {
      background-color: #fff; }
#missions-create #friend-select {
  margin-bottom: 20px; }
  #missions-create #friend-select .friend-box {
    width: 96px;
    height: 96px;
    float: left;
    background: rgba(0, 0, 0, 0.5);
    margin-right: 2px;
    margin-bottom: 2px;
    font-size: 80px;
    text-align: center;
    position: relative; }
    #missions-create #friend-select .friend-box .box-delete-hover {
      display: none; }
    #missions-create #friend-select .friend-box:hover .box-delete-hover {
      display: block;
      position: absolute;
      cursor: pointer;
      width: 16px;
      height: 16px;
      line-height: 16px;
      font-size: 14px;
      font-weight: bold;
      right: 0;
      background: rgba(0, 0, 0, 0.7);
      color: #fff;
      float: right; }
    #missions-create #friend-select .friend-box .avatar.large {
      height: 96px;
      width: 96px; }
    #missions-create #friend-select .friend-box.invite-friend:after {
      content: '+';
      line-height: 100px; }
    #missions-create #friend-select .friend-box.invite-friend {
      cursor: pointer; }
      #missions-create #friend-select .friend-box.invite-friend:hover {
        background-color: rgba(0, 0, 0, 0.35); }
#missions-create a.cancel {
  font-family: Arial;
  font-size: 12px;
  text-transform: uppercase;
  margin-left: 8px; }

#friend-invite-popup {
  background-color: #222;
  padding: 1px;
  max-height: 300px; }
  #friend-invite-popup .jspTrack {
    background: rgba(0, 0, 0, 0.5); }
  #friend-invite-popup .jspDrag {
    background: #ccc; }
  #friend-invite-popup .friend-row {
    color: #666;
    border-bottom: 1px solid #333;
    height: 36px;
    overflow: hidden;
    cursor: pointer; }
    #friend-invite-popup .friend-row:hover {
      background: rgba(255, 255, 255, 0.5);
      color: #000 !important; }
    #friend-invite-popup .friend-row.friend-row-online {
      color: #c8c8c8; }
    #friend-invite-popup .friend-row.selected {
      background: #eee;
      color: #000; }
    #friend-invite-popup .friend-row:last-child {
      border-bottom: 0; }
    #friend-invite-popup .friend-row .friend-avatar {
      float: left;
      margin: 3px;
      padding-right: 10px; }
      #friend-invite-popup .friend-row .friend-avatar img {
        width: 30px;
        height: 30px; }
    #friend-invite-popup .friend-row .friend-name {
      float: left;
      line-height: 35px;
      font-size: 13px; }

#missions-top-boxes .dogtags-header h1.dogtags-dimmed {
  opacity: 0.2; }
#missions-top-boxes .box-content {
  position: relative;
  height: 33px; }
  #missions-top-boxes .box-content h1 {
    line-height: 34px;
    margin-bottom: 0; }
    #missions-top-boxes .box-content h1 .secondary {
      color: #a8a8a8; }
  #missions-top-boxes .box-content h2, #missions-top-boxes .box-content h3 {
    margin-left: 50px;
    font-size: 16px;
    line-height: 12px; }
  #missions-top-boxes .box-content h3 {
    font-weight: 400; }
  #missions-top-boxes .box-content .thumb {
    position: absolute;
    left: 8px;
    top: 7px; }
    #missions-top-boxes .box-content .thumb img {
      width: 50px;
      height: 50px; }
  #missions-top-boxes .box-content .nemesis-score {
    position: absolute;
    top: 6px;
    left: 16px; }
    #missions-top-boxes .box-content .nemesis-score h1 {
      font-size: 30px;
      line-height: 22px; }
  #missions-top-boxes .box-content .nemesis-user {
    position: absolute;
    top: 32px;
    left: 16px; }
    #missions-top-boxes .box-content .nemesis-user .username {
      font-size: 13px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap; }

.score span.win {
  color: #94cdf3; }
.score span.loss {
  color: #ff9f80; }

#missions-top5-nemesis .box-content {
  position: relative;
  height: 146px; }
  #missions-top5-nemesis .box-content > div {
    height: 88px; }
#missions-top5-nemesis .avatar {
  position: absolute;
  right: 15px;
  top: 36px; }
#missions-top5-nemesis p {
  font-size: 13px;
  line-height: 16px; }
  #missions-top5-nemesis p.gray {
    color: #a8a8a8; }
#missions-top5-nemesis h6 {
  margin-bottom: 2px;
  margin-top: -6px;
  width: 166px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: normal; }
#missions-top5-nemesis h1 {
  font-size: 30px;
  line-height: 26px;
  font-weight: 400;
  width: 100px; }

#missions-dogtags {
  font-size: 16px; }
  #missions-dogtags .dogtags {
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative; }
  #missions-dogtags .midtag {
    text-align: center; }
  #missions-dogtags .cent {
    width: 110px;
    height: 60px; }
    #missions-dogtags .cent td {
      padding-left: 30px;
      text-align: left;
      overflow: hidden;
      text-overflow: ellipsis; }
  #missions-dogtags .locked .dogtags {
    opacity: 0.4; }
  #missions-dogtags .progress-bar {
    margin-bottom: 0; }

/*
Game Feature complete styling. "h1" design. This should be removed later on.
 */
#platoons-menu {
  margin-top: 1px;
  margin-bottom: 16px; }

#platoons-friendsplatoons-box {
  margin-top: 16px; }

#platoons-findplatoons-box {
  margin-top: 16px; }

.platoon-invite-body-user {
  float: left;
  padding-right: 20px; }

.platoon-invite-body-user-checkbox {
  float: left; }

.platoon-member-invites-invited {
  float: left;
  width: 50%; }

.platoon-member-invites-waiting {
  float: right;
  width: 50%; }

.platoons-leave-link {
  cursor: pointer; }

.platoons-top-info {
  float: left;
  width: 50%; }

.platoons-top-actions {
  float: right;
  width: 50%; }

.platoon-top-actions-button {
  float: right; }

.box > header + .box-content.platoons-invites-list-wrapper {
  padding-bottom: 6px; }

body.base-premium #profile-user .soldier-name .common-gameicon-hori {
  float: left;
  margin-right: 3px; }

i.icon.premium-badge {
  display: inline-block;
  background: url(../premium/icon-p-s.png) no-repeat;
  width: 14px;
  height: 14px; }

.base-avatar-container .base-avatar-premium-overlay-supersize2 {
  background: url(../premium/avatar-premium-corner-supersize-topleft.png) no-repeat scroll 0 0 transparent;
  height: 66px;
  width: 66px;
  position: absolute;
  z-index: 50;
  left: 0;
  top: 0; }

.base-avatar-container .base-avatar-premium-overlay-large {
  background: url(../premium/avatar-premium-corner-large.png) no-repeat scroll 0 0 transparent;
  height: 21px;
  width: 21px;
  position: absolute;
  z-index: 50;
  right: 0;
  top: 0; }

.forum-forumlist.premium {
  border-left: 4px solid #ffc17f; }

.devblog-item.posts-premium {
  background: url(../premium/avatar-premium-corner-supersize2.png) 100% 0 no-repeat;
  min-height: 66px; }

.devblog-postlistsmall .posts-premium a {
  display: inline-block;
  background: url(../premium/icon-p-s.png) 0 1px no-repeat;
  padding-left: 21px; }

.about-loggedin-header-puff-info-premium {
  color: #fff;
  font-size: 11px;
  line-height: 2;
  width: 268px;
  margin: 20px auto;
  padding: 5px; }

label.premium-label {
  background: url(../premium/icon-p-s.png) no-repeat 100% 100%;
  padding-right: 8px; }

.premium-calendar-container {
  position: relative; }
  .premium-calendar-container .calendar-progress {
    position: absolute;
    top: 146px;
    left: 0px;
    height: 24px;
    background-color: rgba(7, 7, 7, 0.7); }
    .premium-calendar-container .calendar-progress .progress {
      background-image: url(../premium/calender-overlay.png);
      height: 24px;
      border-right: 1px solid rgba(255, 153, 0, 0.2);
      max-width: 100%; }

.premium-calendar {
  width: 100%;
  font-size: 18px;
  font-weight: normal;
  color: white;
  border-collapse: collapse;
  border: 0;
  margin-bottom: 30px; }

.premium-calendar-unavailable {
  position: absolute;
  z-index: 100;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0; }

.premium-calendar-unavailable-background {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #000;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  filter: alpha(opacity=70);
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7; }

.premium-calendar-unavailable-message {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 200px;
  text-align: center;
  color: #fff; }

.premium-calendar-head .premium-calendar-cell {
  height: 27px;
  line-height: 27px;
  font-family: Tahoma, Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  background: #515152;
  background-image: linear, bottom, #49494a 38%, #5b5b5c 69%;
  background-image: -o-linear-gradient(bottom, #49494a 38%, #5b5b5c 69%);
  background-image: -moz-linear-gradient(bottom, #49494a 38%, #5b5b5c 69%);
  background-image: -webkit-linear-gradient(bottom, #49494a 38%, #5b5b5c 69%);
  background-image: -ms-linear-gradient(bottom, #49494a 38%, #5b5b5c 69%);
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.38, #49494a), color-stop(0.69, #5b5b5c)); }

.premium-calendar-body .premium-calendar-cell {
  height: 64px;
  background: #212121; }

.premium-calendar-body .new-premium-calendar-expansion .premium-calendar-cell-inner {
  height: 142px; }

.premium-calendar-body .premium-calendar-cell-inner {
  visibility: hidden;
  height: 62px;
  border: 1px solid #c5710e;
  position: relative;
  background: #42311d; }

.premium-calendar-body .premium-calendar-cell.valued:hover {
  background: #5b5b5c; }

.premium-calendar-body .premium-calendar-cell.valued:hover .premium-calendar-cell-inner {
  visibility: visible; }

.premium-calendar-cell-icon {
  visibility: hidden;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 54px;
  height: 59px;
  margin: -29px 0 0 -28px;
  background: url(../premium/calendar-icons.png) no-repeat;
  cursor: pointer;
  z-index: 1; }

.valued .premium-calendar-cell-icon {
  visibility: visible; }

/*
.released .premium-calendar-cell-icon {
    background-image: url(../premium/calendar-icons-released.png)
}*/
.premium-calendar-typecell-head {
  background: #000; }

.premium-calendar-cell {
  width: 64px;
  border: 0; }

.premium-calendar-body .premium-calendar-typecell {
  width: 165px;
  vertical-align: middle;
  font-family: Arial;
  font-weight: bold;
  font-size: 14px;
  background: #353535;
  text-align: left;
  padding-left: 10px;
  padding-right: 10px;
  line-height: 17px;
  text-transform: uppercase; }

.premium-calendar-type0 .premium-calendar-cell-icon {
  background-position: 0 0; }

.premium-calendar-type1 .premium-calendar-cell-icon {
  background-position: -54px 0; }

.premium-calendar-type2 .premium-calendar-cell-icon {
  background-position: -108px 0; }

.premium-calendar-type3 .premium-calendar-cell-icon {
  background-position: -162px 0; }

.premium-calendar-type4 .premium-calendar-cell-icon {
  background-position: -216px 0; }

.premium-calendar-type5 .premium-calendar-cell-icon {
  background-position: -324px 0; }

.premium-calendar-type0 .premium-calendar-cell.multiple .premium-calendar-cell-icon {
  background-position: -0 -59px; }

.premium-calendar-type1 .premium-calendar-cell.multiple .premium-calendar-cell-icon {
  background-position: -54px -59px; }

.premium-calendar-type2 .premium-calendar-cell.multiple .premium-calendar-cell-icon {
  background-position: -108px -59px; }

.premium-calendar-type3 .premium-calendar-cell.multiple .premium-calendar-cell-icon {
  background-position: -162px -59px; }

.premium-calendar-type4 .premium-calendar-cell.multiple .premium-calendar-cell-icon {
  background-position: -216px -59px; }

.premium-calendar-type5 .premium-calendar-cell.multiple .premium-calendar-cell-icon {
  background-position: -324px -59px; }

.premium-calendar-item-type {
  color: #fff; }

.premium-calendar-item-link {
  margin-top: 1em; }

.premium-calendar-item-link a {
  font-size: 14px;
  font-weight: normal;
  color: #3AADE3; }

.premium-calendar-hover {
  display: none;
  position: absolute;
  left: 100%;
  bottom: 39px;
  z-index: 2;
  background: #000;
  width: 250px;
  text-align: left;
  font-family: Arial;
  font-size: 11px;
  color: #fff;
  padding: 10px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  text-transform: none; }

.premium-calendar-hover .premium-calendar-item-andmore {
  margin-top: 5px;
  text-align: right; }

.premium-calendar-hover .premium-calendar-item-image {
  width: 56px;
  height: 90px;
  float: left;
  margin-right: 10px; }

.premium-calendar-hover .premium-calendar-item-title {
  font-weight: 600;
  font-size: 19px;
  margin-bottom: 0;
  line-height: 24px; }

.premium-calendar-hover .premium-calendar-item-subtitle {
  font-weight: normal;
  margin: 0 0;
  font-size: 12px;
  line-height: 26px;
  font-family: Arial, sans-serif; }

.premium-calendar-hover .premium-calendar-item-content {
  color: #ababab;
  line-height: 14px; }

.premium-calendar-cell.rightside .premium-calendar-hover {
  left: auto;
  right: 100%; }

.premium-calendar-cell.valued:hover .premium-calendar-hover {
  display: block; }

.premium-calendar-hover-arrow {
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  position: absolute;
  bottom: 10px; }

.premium-featured-item.rightside .premium-calendar-hover, .premium-calendar-cell.rightside .premium-calendar-hover {
  margin-right: -10px; }

.premium-featured-item.rightside .premium-calendar-hover-arrow, .premium-calendar-cell.rightside .premium-calendar-hover-arrow {
  border-left: 5px solid #000;
  right: -5px; }

.premium-featured-item.leftside .premium-calendar-hover, .premium-calendar-cell.leftside .premium-calendar-hover {
  margin-left: -10px; }

.premium-featured-item.leftside .premium-calendar-hover-arrow, .premium-calendar-cell.leftside .premium-calendar-hover-arrow {
  border-right: 5px solid #000;
  left: -5px; }

.premium-calendar-popup-container {
  box-shadow: 0 5px 15px rgba(23, 23, 23, 0.5);
  border: 1px solid #5d5d5d;
  background: #353535;
  width: 800px !important; }

.premium-calendar-popup-container .common-popup-content-container {
  margin-bottom: 10px; }

.premium-calendar-popup {
  margin: 0 5px;
  max-height: 500px;
  overflow: auto;
  width: 755px;
  background: #353535;
  padding: 0 20px !important; }

.premium-calendar-popup .premium-calendar-item-image {
  width: 187px;
  height: 300px;
  float: right;
  margin-left: 10px; }

.premium-calendar-popup .premium-calendar-item-body {
  font-family: Arial;
  font-size: 14px;
  color: #999999; }

.premium-calendar-popup .premium-calendar-item-type {
  text-transform: uppercase;
  font-weight: bold;
  margin: 0 0 10px 0; }

.premium-calendar-popup .premium-calendar-item-title {
  font-size: 35px;
  font-weight: normal;
  color: #f88613; }

.premium-calendar-popup .premium-calendar-item-subtitle {
  margin: 8px 0 12px 0;
  font-weight: normal; }

.premium-calendar-popup .premium-calendar-item-content {
  font-size: 14px;
  color: #fff;
  line-height: 18px;
  width: 550px; }

.premium-calendar-popup .premium-calendar-item-content p {
  margin: 10px 0; }

.premium-calendar-popup .premium-calendar-item-content ul {
  list-style: disc inside;
  margin: 10px 0; }

.premium-calendar-popup-switchbutton {
  float: left;
  margin-right: 5px; }

.premium-calendar-popup-closebutton {
  float: right; }

.premium-calendar-footer {
  background: #353535; }

.premium-calendar-popup-container .common-popup-footer-container {
  display: none; }

.premium-calendar-popup-container .common-popup-title-container {
  background: #353535 !important;
  height: 32px; }

.premium-calendar-popup-container .common-popup-title-container .common-popup-close-container {
  top: 0 !important;
  right: 0 !important; }

.premium-calendar-progress-container {
  position: absolute;
  top: 29px;
  left: 0;
  width: 100%;
  height: 389px; }

.premium-calendar-progress-padder {
  padding-left: 183px;
  height: 100%; }

.premium-calendar-progress {
  height: 100%;
  background: url(../premium/premium-calendar-progress-highlight.png);
  border-right: 1px solid #965d23; }

.premium-index-box {
  border: 0; }

.premium-index-box div.buy-buttons {
  width: 320px;
  margin: 30px auto 0;
  text-align: left;
  position: relative; }

.premium-index-box button[disabled='disabled'] a {
  text-decoration: none;
  color: gray;
  text-shadow: none;
  cursor: default; }

.premium-index-box div.buy-buttons button p {
  margin: 0 !important;
  color: #000 !important; }

.premium-index-box div.buy-buttons button[disabled] p {
  color: #c3c3c3 !important; }

.premium-index-box div.buy-buttons span.platform, .premium-index-box div.buy-buttons span.action {
  bottom: -2px;
  position: relative; }

.premium-index-box div.buy-buttons button.common-button-xlarge {
  width: 100%;
  display: block; }

.premium-index-box div.buy-buttons .common-button-xlarge span.platform {
  float: right;
  margin: 0 0 0 5px;
  line-height: 1; }

.premium-index-box div.buy-buttons .common-button-xlarge span.platform span.common-title {
  font-size: 22px !important;
  line-height: 55px;
  padding: 0; }

.premium-index-box div.buy-buttons .common-button-xlarge span.action {
  float: left;
  line-height: 1; }

.premium-index-box div.buy-buttons .common-button-xlarge span.action span.common-title {
  font-size: 32px;
  font-weight: normal;
  line-height: 55px; }

.premium-index-wrapper {
  padding: 0 100px;
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/bg-page-p2-4309b1e0.jpg) no-repeat #000; }

.premium-index-wrapper-bottom {
  background: #fff;
  padding-bottom: 20px; }

.premium-index-wrapper-bottom-background {
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/bg-page-p-bottom-df6df16f.jpg) no-repeat;
  position: absolute;
  height: 378px;
  width: 100%;
  z-index: 0;
  margin-top: -62px; }

.premium-index-buybutton {
  margin: auto;
  display: block;
  float: none; }

.premium-index-buybutton > img {
  position: relative;
  top: 9px;
  left: 10px; }

.premium-index-header {
  color: #fff;
  text-transform: uppercase;
  padding: 20px 0 0 0; }

.premium-index-header-logo {
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/premium-logo-189bfa35.png) no-repeat;
  width: 519px;
  height: 174px;
  margin: auto; }

.premium-index-header-description {
  font-size: 23px;
  line-height: 23px;
  height: 23px;
  text-align: center;
  margin: 20px auto 0 auto; }

.premium-index-header-divider {
  border-bottom: 1px solid #333;
  padding-bottom: 18px; }

.premium-owned .premium-index-header-divider {
  border: 0; }

.premium-index-header .premium-index-buybutton {
  margin-top: 20px;
  z-index: 10;
  position: relative; }

.premium-index-header .premium-index-section {
  margin: 25px 0 0 0; }

.premium-index-section .span-five-in-row {
  cursor: pointer;
  width: 197px;
  margin-top: 1px; }
  .premium-index-section .span-five-in-row:hover {
    background-color: rgba(7, 7, 7, 0.3); }
  .premium-index-section .span-five-in-row.rightmost {
    width: 200px; }
  .premium-index-section .span-five-in-row .box {
    position: relative;
    height: 100%; }
    .premium-index-section .span-five-in-row .box .cell-item-info {
      text-transform: uppercase;
      font-size: 16px;
      font-weight: 600; }
      .premium-index-section .span-five-in-row .box .cell-item-info .cell-item-title {
        height: 26px; }
    .premium-index-section .span-five-in-row .box .box-content {
      height: 225px; }

.premium-index-header .premium-index-section > h1 {
  color: #fff;
  margin-bottom: 10px; }

.premium-index-header-whatyouget {
  padding: 20px 0 0 0;
  line-height: 28px;
  margin: 0 0 25px 0; }

.premium-index-header-whatyouget > h1 {
  font-size: 35px;
  color: white;
  font-weight: normal; }

.premium-index-header-whatyouget > h2 {
  font-size: 23px;
  color: #f88613;
  border: 0;
  font-weight: normal; }

.premium-index-wrapper.premium-owned {
  background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/bg-page-p1-aa324515.jpg); }

.premium-index-wrapper.premium-owned .premium-index-buybutton {
  position: absolute;
  top: 15px;
  right: 30px; }

.premium-index-header .premium-index-section-top > h1 {
  color: #F88613; }

.premium-index-header .premium-index-section-top > h2 {
  color: #fff; }

.premium-index-header .premium-index-section-top > h1, .premium-index-header .premium-index-section-top > h2 {
  padding-left: 48px;
  top: 5px;
  position: relative; }

.premium-index-section-top-icon {
  top: 24px;
  left: 19px;
  position: absolute; }

.premium-index-expansions-boxes {
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/premium-expansions-899bd651.png) no-repeat;
  width: 817px;
  height: 300px; }

.premium-index-expansions-boxes a.box {
  width: 155px;
  height: 295px;
  float: left; }

.premium-index-expansion {
  float: left;
  margin: 15px 0 0 13px;
  width: 142px;
  text-transform: none;
  font-family: Arial;
  font-size: 12px;
  font-weight: normal;
  color: #898989;
  line-height: 20px; }

.premium-index-expansion img {
  width: 90px;
  height: 150px;
  margin-bottom: -17px;
  position: relative; }

.premium-index-expansion h1, .premium-index-expansion h2 {
  font-family: Arial;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 5px;
  color: #fff;
  padding-left: 5px; }

.premium-index-expansion h2 {
  color: #898989;
  line-height: 10px;
  margin-top: -2px; }

.premium-index-expansion.premium-isexpout h2 {
  color: #fff; }

.premium-index-expansion ul {
  list-style: disc inside;
  text-align: left;
  left: 6px;
  position: relative; }

.premium-index-expansions-padding {
  padding: 0 39px; }

.premium-index-section {
  clear: both;
  margin-top: 0px;
  position: relative;
  z-index: 1; }

.premium-index-section > legend {
  width: 258px;
  height: 300px;
  float: right;
  background-repeat: no-repeat; }

.premium-index-section > h1 {
  font-size: 43px;
  font-weight: normal;
  color: #353535;
  margin-bottom: 10px; }

.premium-index-section > h2 {
  font-size: 31px;
  font-weight: normal;
  color: #f88613;
  margin: -8px 0 15px 0; }

.premium-index-section > ul {
  margin-right: 280px; }

.premium-index-section > ul > li {
  font-family: Arial;
  font-size: 16px;
  color: #8a8a8a;
  padding: 5px 5px 5px 39px;
  line-height: 29px;
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/premium-icon-feature-56172962.png) no-repeat 0 50%;
  border-top: 1px solid #ededed; }

.premium-index-section > ul > li.premium-featurenote {
  font-family: Arial;
  font-size: 12px;
  font-style: italic;
  background: none;
  padding-left: 0; }

.premium-index-section.featureset-content > legend {
  background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/premium-icon-featurespotlight-content-39ca4aae.png);
  height: 201px; }

.premium-index-section.featureset-battlelog > legend {
  background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/premium-icon-featurespotlight-content-39ca4aae.png);
  height: 201px; }

.premium-index-section.featureset-vip > legend {
  background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/premium-icon-featurespotlight-vip-894453d4.png);
  height: 281px; }

.premium-index-section-grid {
  float: left;
  width: 33.33%;
  clear: none;
  font-size: 75%; }

.premium-index-section-grid > ul {
  margin-right: 10px; }

.premium-index-section-grid > h1 {
  font-size: 25px; }

.premium-index-section-grid > h2 {
  font-size: 15px;
  margin-bottom: 10px; }

.premium-index-section-grid > ul > li {
  font-size: 12px;
  padding: 3px 3px 3px 27px;
  line-height: 22px; }

.premium-index-andmuchmore {
  margin-top: 25px; }

.premium-index-andmuchmore > h1 {
  margin: 0px 0 -5px 0; }

.premium-index-footer {
  margin-bottom: 30px; }

.premium-subpage-container {
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/premium-background-subpage-6c45d8e0.png) no-repeat #fff;
  padding: 0 100px; }

.premium-subpage-backlink {
  position: absolute;
  top: 15px;
  left: 15px; }

.premium-subpage-title {
  font-size: 32px;
  top: -14px;
  display: inline;
  position: relative; }

.premium-subpage-container .premium-index-header-divider {
  text-align: center;
  padding: 45px 20px 10px 20px;
  margin-bottom: 20px; }

.premium-subpage-container .premium-index-header .premium-calendar-cell-icon {
  position: inherit;
  display: inline;
  padding: 41px 54px 0 0;
  cursor: default; }

.premium-subpage-servicenotavailable {
  color: white;
  font-size: 14px;
  text-align: center;
  margin: 20px; }

.premium-subpage-extrabox {
  width: 495px;
  padding: 14px 16px;
  margin: 20px 0 16px; }

.premium-subpage-extrabox.toggled {
  background: #333333; }

.premium-subpage-extrabox > .toggler {
  margin-bottom: 14px;
  font-weight: normal;
  font-size: 12px;
  display: block;
  position: relative;
  padding-left: 16px; }

.premium-subpage-extrabox.toggled > .toggler {
  color: #fff; }

.premium-subpage-extrabox > .toggler:before {
  content: "+";
  color: #9f9f9f;
  font-size: 16px;
  line-height: 20px;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -8px;
  font-weight: bold; }

.premium-subpage-extrabox.toggled > .toggler:before {
  content: "–";
  font-size: 14px;
  margin-top: -10px; }

.premium-subpage-extrabox-body {
  display: none;
  margin-top: 6px;
  position: relative; }

.toggled > .premium-subpage-extrabox-body {
  display: block; }

.premium-subpage-extrabox-body > .highlighted {
  font-size: 24px;
  color: #cdad5b;
  text-align: center;
  line-height: 65px;
  background: #5c5c5c;
  margin-bottom: 20px; }

.premium-subpage-extrabox-body > .info {
  min-height: 85px;
  padding-right: 66px;
  position: relative; }

.premium-subpage-extrabox-body > .info > p {
  color: #898989;
  font-size: 12px;
  line-height: 16px;
  margin: 0;
  padding: 0 67px 0 0; }

.premium-subpage-extrabox-body > .info > p a {
  font-weight: normal; }

.premium-subpage-extrabox-body > .info > .icon {
  position: absolute;
  top: 0;
  right: 0; }

.premium-subpage-extrabox-body > .info > .icon img {
  width: 51px;
  height: 85px; }

.premium-generallist-item {
  color: #fff;
  position: relative;
  padding-bottom: 30px;
  min-height: 92px; }

.premium-generallist-item > article {
  padding-left: 80px; }

.premium-generallist-item > article > h1 {
  font-size: 22px;
  color: #F78513; }

.premium-generallist-item > article > h1 > a {
  color: inherit;
  font-size: inherit; }

.premium-generallist-item > article > h2 {
  font-size: 12px;
  text-transform: uppercase;
  margin: 8px 0 5px 0; }

.premium-generallist-item > comment {
  color: #898989;
  font-size: 12px; }

.premium-generallist-item > comment p {
  margin-top: 1em; }

.premium-generallist-item.locked > h1 {
  color: #898989; }

.premium-generallist-item-icon-container {
  float: left;
  width: 165px;
  height: 92px;
  margin: 0 20px 15px 0;
  position: relative; }

.premium-generallist-item-icon-container > img {
  width: 100%;
  height: 100%; }

.premium-generallist-item-icon-container > span {
  background: url(../feed/icon-play.png) no-repeat;
  width: 34px;
  height: 34px;
  position: absolute;
  display: block;
  top: 50%;
  left: 50%;
  margin-left: -17px;
  margin-top: -17px; }

.active .premium-generallist-item-icon-container:hover > span {
  background-position: 0 -34px;
  cursor: pointer; }

.locked .premium-generallist-item-icon-container > span {
  background: url(../feed/icon-play-locked.png) no-repeat; }

.premium-subpage-bonuscontent, .premium-subpage-strategyguides {
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/premium-background-subpage-notransition-ed032869.png) no-repeat #000; }

.premium-subpage-bonuscontent .premium-generallist-item-icon-container, .premium-subpage-strategyguides .premium-generallist-item-icon-container {
  width: 65px;
  height: 100px; }

.premium-subpage-bonuscontent .active .premium-generallist-item-icon-container > span, .premium-subpage-strategyguides .active .premium-generallist-item-icon-container > span {
  display: none; }

.premium-subpage-videos {
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/premium-background-subpage-notransition-ed032869.png) no-repeat #000; }

.premium-subpage-video .premium-generallist-item {
  padding-bottom: 30px;
  min-height: 0; }

#premium-subpage-video-fullscreentoggle {
  position: absolute;
  top: 0;
  right: 0;
  background: url(../premium/icon-fullscreen-on.png) no-repeat;
  width: 33px;
  height: 29px;
  opacity: 0;
  -webkit-transition: opacity 0.1s;
  -moz-transition: opacity 0.1s;
  -ms-transition: opacity 0.1s;
  -o-transition: opacity 0.1s;
  transition: opacity 0.1s;
  cursor: pointer;
  display: none; }

#premium-subpage-video-container {
  height: 461px;
  border: 2px solid #8b8d93;
  margin-bottom: 30px;
  position: relative; }

#premium-subpage-video-container.premium-video-fullscreen {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 9999;
  background: black; }

#premium-subpage-video-container.premium-video-fullscreen #premium-subpage-video-fullscreentoggle {
  background-image: url(../premium/icon-fullscreen-off.png); }

#premium-subpage-video-container:hover #premium-subpage-video-fullscreentoggle {
  opacity: 1; }

.premium-salebox {
  height: 40px;
  background: url(//d34ymitoc1pg7m.cloudfront.net/mohw/popup/premium-popup-bg-c415fdff.png);
  line-height: 40px;
  font-size: 12px;
  color: #fff;
  font-weight: normal;
  line-height: 40px;
  padding-left: 16px; }

.premium-salebox-small {
  margin: 10px auto 0;
  width: 50%; }

.premium-salebox .premium-logo {
  float: right;
  margin-right: 16px;
  margin-top: 15px; }

.premium-salebox a {
  color: #8a8a8a;
  font-weight: normal; }

.premium-prepage-container {
  background: #000 url(../premium/bg-page-empty.jpg) no-repeat;
  padding: 35px 0 200px;
  text-align: center;
  position: relative; }

.premium-prepage-container:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: #fff;
  opacity: 0.1; }

.premium-prepage-container h1 {
  font-size: 30px;
  margin: 30px 16px 6px;
  color: #fff;
  font-weight: bold;
  font-family: Arial, sans-serif; }

.premium-prepage-info a, .premium-prepage-info {
  font-weight: normal;
  font-size: 16px;
  line-height: 32px; }

.premium-prepage-info {
  color: #898989;
  margin: 0 0 25px; }

.premium-icon-small {
  background: url(../premium/icon-p-s.png) left top no-repeat;
  height: 14px;
  width: 14px;
  float: left;
  margin-right: 6px;
  margin-top: 6px; }

.premium-index-topbox {
  width: auto;
  margin: 0;
  padding: 15px;
  background: url(../premium/p-box-l.png) no-repeat #111; }

.premium-index-topbox h1 {
  font-size: 30px;
  font-weight: normal;
  color: #f78513;
  margin-bottom: 10px;
  position: relative; }

.premium-index-featurebox {
  float: left;
  position: relative;
  cursor: default;
  padding: 0;
  width: 404px;
  margin: 0 16px 16px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15); }

.premium-index-featurebox.with-link:hover p {
  color: #a9a9a9; }

.premium-index-featurebox:nth-child(-n+2) {
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.15); }

.premium-index-featurebox.with-link:hover {
  text-decoration: none;
  cursor: pointer; }

.premium-index-featurebox.with-link:hover * {
  cursor: pointer; }

.premium-index-featurebox:nth-child(even) {
  margin-right: 0; }

.premium-index-featurebox.bottommost {
  margin-bottom: 0; }

.premium-index-featurebox-inner {
  background: no-repeat 100% 50%;
  height: 162px;
  padding: 0 0 16px;
  position: relative;
  cursor: auto; }

.premium-index-featurebox-inner h1 {
  font-size: 30px;
  line-height: 40px;
  font-weight: normal;
  color: #f78513; }

.premium-index-featurebox-inner p {
  font-size: 12px;
  color: #898989;
  font-weight: normal;
  line-height: 18px;
  padding: 6px 150px 6px 0;
  text-transform: none;
  -webkit-transition: color 0.5s ease;
  -moz-transition: color 0.5s ease;
  -ms-transition: color 0.5s ease;
  -o-transition: color 0.5s ease;
  transition: color 0.5s ease; }

.premium-index-featurebox-bottom {
  color: #898989;
  line-height: 22px;
  font-size: 14px;
  text-transform: none;
  font-weight: normal; }

a.premium-index-featurebox-bottom, .premium-index-featurebox-bottom a {
  color: #3aade3;
  text-transform: none;
  line-height: 22px;
  font-size: 14px;
  font-weight: normal; }

.premium-index-featurebox:hover {
  opacity: 1; }

.premium-index-featurebox-popupdata {
  display: none; }

.premium-index-featurebox-inner.feature-videos {
  background-image: url(../premium/p-item-videos.png); }

.premium-index-featurebox-inner.feature-community {
  background-image: url(../premium/p-item-standout.png); }

.premium-index-featurebox-inner.feature-queue {
  background-image: url(../premium/p-item-queue.png); }

.premium-index-featurebox-inner.feature-knife {
  background-image: url(../premium/p-item-knife.png); }

.premium-index-featurebox-inner.feature-dogtags {
  background-image: url(../premium/p-item-dogtags.png); }

.premium-index-featurebox-inner.feature-assignments {
  background-image: url(../premium/p-item-assignments.png); }

.premium-index-featurebox-inner.feature-stats {
  background-image: url(../premium/p-item-reset.png); }

.premium-index-featurebox-inner.feature-guides {
  background-image: url(../premium/p-item-guides.png); }

.premium-index-featurebox-inner.feature-bonus {
  background-image: url(../premium/p-item-bonus.png); }

.premium-index-featurebox-inner.feature-events {
  background-image: url(../premium/p-item-events.png); }

.premium-calendar > h1 {
  color: #fff; }

.premium-required-container {
  padding-bottom: 20px; }

.premium-required-container .premium-index-header .premium-calendar-cell-icon {
  display: none; }

.premium-required-message {
  color: #fff;
  font-size: 12px;
  text-align: center;
  min-height: 236px; }

#premium-subpage-video-mediabutton {
  position: absolute;
  background: url(../premium/premium-video-playbutton.png) no-repeat;
  width: 139px;
  height: 139px;
  left: 50%;
  top: 50%;
  margin: -70px 0 0 -70px;
  opacity: 0.8;
  cursor: pointer;
  -moz-transition: opacity 0.25s ease;
  -webkit-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease; }

#premium-subpage-video-mediabutton:hover {
  opacity: 1; }

#premium-subpage-video-loader {
  position: absolute;
  background: url(../base/shared/ajax-loader-large.gif) no-repeat;
  width: 32px;
  height: 32px;
  left: 50%;
  top: 50%;
  margin: -16px 0 0 -16px;
  display: none; }

#premium-subpage-video-errormessage {
  color: white;
  text-align: center;
  position: absolute;
  width: 100%;
  height: 25px;
  top: 50%;
  margin-top: -25px;
  font-size: 12px;
  line-height: 25px;
  background: black;
  display: none; }

.premium-video-isplaying #premium-subpage-video-mediabutton {
  opacity: 0;
  background: url(../premium/premium-video-pausebutton.png) no-repeat; }

.premium-video-isplaying:hover #premium-subpage-video-mediabutton {
  opacity: 0.8; }

.premium-video-isplaying #premium-subpage-video-mediabutton:hover {
  opacity: 1; }

.premium-video-isloading #premium-subpage-video-mediabutton {
  display: none; }

.premium-video-isloading #premium-subpage-video-loader {
  display: block; }

.premium-video-error #premium-subpage-video-loader {
  display: none; }

.premium-video-error #premium-subpage-video-errormessage {
  display: block; }

.premium-video-error #premium-subpage-video-mediabutton {
  display: none; }

.premium-video-isplaying.premium-video-mouseinactive #premium-subpage-video-mediabutton {
  opacity: 0; }

.premium-feature-popup {
  line-height: 18px;
  color: #fff;
  min-height: 300px; }

.premium-feature-popup-image {
  float: right; }

.premium-feature-popup-title {
  font-size: 42px;
  font-weight: normal;
  color: #F78513;
  margin-bottom: 10px;
  position: absolute;
  z-index: 1000; }

.premium-feature-popup-content {
  font-size: 14px;
  line-height: 22px;
  color: #a7a7a7;
  margin-top: 35px; }

.premium-feature-popup-padder {
  margin-top: 42px; }

.premium-index-upcomingitem {
  float: left;
  position: relative;
  width: 269px;
  margin: 0 8px 0 0; }

.premium-index-upcomingitem > a {
  display: block;
  font-weight: normal;
  text-decoration: none;
  background: transparent;
  -webkit-transition: background 0.5s ease;
  -moz-transition: background 0.5s ease;
  -ms-transition: background 0.5s ease;
  -o-transition: background 0.5s ease;
  transition: background 0.5s ease; }

.premium-index-upcomingitem > a:hover {
  background: rgba(255, 255, 255, 0.1); }

.premium-index-upcomingitem > div {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  background: #353535;
  opacity: 0.5;
  filter: alpha(opacity=50);
  z-index: 0; }

.premium-index-upcomingitem legend {
  height: 28px;
  line-height: 28px;
  background: url(../premium/bg-upcomingitem-header.png) no-repeat;
  padding-left: 32px;
  width: 237px;
  position: relative;
  z-index: 1;
  color: #F78513;
  font-size: 12px;
  font-family: Arial, sans-serif;
  text-transform: uppercase;
  font-weight: bold; }

.premium-index-upcomingitem legend > .icon {
  bottom: auto;
  left: -1px;
  top: -1px; }

.premium-index-upcomingitem article {
  position: relative;
  padding: 12px;
  z-index: 1;
  height: 359px; }

.premium-index-upcomingitem article > h1 {
  font-family: Arial, sans-serif;
  text-transform: none;
  color: #F78513;
  font-size: 18px; }

.premium-index-upcomingitem article > h2 {
  font-size: 12px;
  margin-top: 5px;
  text-transform: none;
  color: #fff; }

.premium-index-upcomingitem article > img {
  margin: auto;
  display: block;
  width: 196px;
  height: 324px; }

.premium-index-upcomingitem.rightmost {
  margin-right: 0; }

.premium-strategyguides-downloadbutton, .premium-bonuscontent-downloadbutton {
  display: block;
  margin: 10px 0 0 0;
  float: left; }

.premium-strategyguides-downloadbutton a, .premium-bonuscontent-downloadbutton a {
  color: inherit; }

.premium-recentlistsmall {
  border-top: 2px solid #E1E1E1;
  padding: 10px 0 6px 0;
  margin-top: 6px; }

.premium-recentlistsmall .premium-item {
  overflow: hidden; }

.premium-recentlistsmall h2 {
  color: #8A8A8A;
  font-size: 11px;
  margin-bottom: 6px;
  font-family: Tahoma, Arial, sans-serif;
  text-transform: uppercase; }

.premium-recentlistsmall img {
  float: right;
  margin-top: -20px; }

.premium-recentlistsmall .premium-all-items {
  font-size: 11px;
  font-weight: normal; }

/* Premium calendar icons */
.icon.premium-calendar-icon {
  background-image: url(../main/upcoming-calendar-typeicons.png);
  background-repeat: no-repeat;
  width: 27px;
  height: 30px;
  position: absolute;
  bottom: 10px;
  left: 10px; }

.icon.premium-calendar-icon.type-0 {
  background-position: 0 0; }

.icon.premium-calendar-icon.type-1 {
  background-position: -27px 0; }

.icon.premium-calendar-icon.type-2 {
  background-position: -54px 0; }

.icon.premium-calendar-icon.type-3 {
  background-position: -81px 0; }

.icon.premium-calendar-icon.type-4 {
  background-position: -108px 0; }

.icon.premium-calendar-icon.type-5 {
  background-position: -162px 0; }

#premium-content .premium-now {
  position: absolute;
  top: 10px;
  right: 6px;
  z-index: 1;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }
#premium-content .premium-offer {
  position: absolute;
  bottom: 0px; }
  #premium-content .premium-offer .box-content {
    width: 960px;
    padding: 12px 16px;
    padding-bottom: 0px;
    height: 186px; }
  #premium-content .premium-offer .gamelogo {
    float: left;
    margin-right: 12px;
    position: relative;
    top: 2px; }
  #premium-content .premium-offer .expansionlogos {
    position: absolute;
    right: 16px;
    bottom: 16px; }
  #premium-content .premium-offer .btn {
    margin-top: -9px; }
#premium-content .friends-container {
  height: 82px; }
  #premium-content .friends-container .friends h3 {
    line-height: 16px;
    color: #fff;
    font-size: 16px;
    text-transform: uppercase;
    margin: 0;
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: normal;
    text-align: center; }
  #premium-content .friends-container .friends .outer-center {
    float: right;
    right: 50%;
    position: relative; }
  #premium-content .friends-container .friends .inner-center {
    float: right;
    right: -50%;
    position: relative; }
  #premium-content .friends-container .friends .clear {
    clear: both; }
  #premium-content .friends-container .friends .avatars {
    float: left;
    padding: 0;
    padding-top: 6px; }
  #premium-content .friends-container .friends .more-friends {
    float: left;
    text-align: center;
    font-size: 14px;
    font-family: Purista, sans-serif;
    width: 34px;
    height: 34px;
    overflow: hidden;
    line-height: 34px;
    margin-top: 8px;
    background: rgba(0, 0, 0, 0.8);
    border: 1px solid #606870;
    margin-left: 3px; }
#premium-content .premium-top {
  width: 992px;
  height: 462px;
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/store-premium-bg-8c709c38.jpg);
  position: relative;
  margin-bottom: 1px; }
  #premium-content .premium-top .premium-overlay {
    background: url(../premium/upcoming-overlay.png);
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 992px;
    height: 239px; }
  #premium-content .premium-top #premium-products .product .platforms, #premium-content .premium-top #premium-products .release-date {
    display: none; }
  #premium-content .premium-top .more-info-text {
    line-height: 18px;
    font-family: Arial;
    font-size: 16px;
    color: #a8a8a8;
    float: left; }
    #premium-content .premium-top .more-info-text h2 {
      font-size: 35px; }
    #premium-content .premium-top .more-info-text .detailed {
      width: 578px;
      font-size: 14px;
      line-height: 20px; }
      #premium-content .premium-top .more-info-text .detailed a {
        text-decoration: underline; }
  #premium-content .premium-top .price {
    float: left;
    color: #fff;
    font-weight: 600;
    text-transform: none;
    font-family: Purista, sans-serif;
    font-size: 32px;
    margin-right: 16px; }
    #premium-content .premium-top .price .strike {
      opacity: 0.7;
      display: inline-block;
      text-decoration: line-through;
      font-size: 70%;
      font-weight: normal; }
#premium-content .premium-calendar-cell.month {
  height: 24px;
  line-height: 24px;
  text-align: center;
  font-family: Purista, sans-serif;
  font-size: 14px; }

.premium-calendar-body .premium-calendar-cell {
  background: none;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.5); }
.premium-calendar-body .premium-calendar-cell.month {
  height: 32px;
  line-height: 32px; }
.premium-calendar-body .premium-calendar-cell-icon {
  cursor: default; }

table.premium-calendar {
  border-collapse: separate;
  border-spacing: 1px 1px;
  position: relative;
  margin-left: -1px;
  width: 994px;
  margin-bottom: 8px; }

.premium-calendar-section header {
  margin-bottom: -1px; }

.premium-featured-item {
  position: relative;
  width: 200px;
  height: 280px;
  display: inline-block;
  background-color: rgba(0, 0, 0, 0.5);
  color: #FFF;
  margin-right: 4px; }
  .premium-featured-item img {
    position: absolute;
    left: 16px;
    height: 260px;
    width: 168px; }
  .premium-featured-item h1 {
    text-align: center;
    width: 100%;
    position: relative; }

.premium-featured-item.rightmost {
  margin-right: -8px; }

.premium-featured-item.full {
  display: block;
  width: 100%;
  height: 320px;
  margin-bottom: 16px; }
  .premium-featured-item.full img {
    width: 958px;
    height: 288px;
    top: 16px; }
  .premium-featured-item.full h1 {
    line-height: 24px;
    font-size: 24px; }

.premium-featured-item:hover .premium-calendar-hover {
  display: block; }

#premium-content .premium-calendar-cell-inner img {
  position: relative;
  top: 5px; }

#premium-content .premium-calendar-cell-inner a {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2; }

.premium-calendar-image-container {
  text-align: center; }

#premium-content .premium-calendar .premium-calendar-image-container {
  visibility: visible;
  text-align: center; }

#premium-content .premium-calendar > h1, #premium-content .premium-featured > h1 {
  color: #fff; }

.premium-index-section .cell-item-info {
  text-align: center;
  font-size: 14px;
  font-family: Purista, sans-serif; }
  .premium-index-section .cell-item-info .cell-item-title {
    clear: both;
    font-weight: 600;
    padding-top: 8px;
    padding-bottom: 8px; }
  .premium-index-section .cell-item-info .cell-item-type {
    clear: both;
    color: #EC7600;
    padding-bottom: 5px;
    font-weight: normal;
    font-size: 14px;
    font-family: Arial, sans-serif; }
  .premium-index-section .cell-item-info .cell-item-release {
    clear: both;
    font-weight: normal;
    color: #a8a8a8;
    font-size: 12px;
    font-family: Arial, sans-serif; }

.premium-content-change-disclaimer {
  font-size: 11px;
  color: #FFF;
  padding-bottom: 16px;
  padding-top: 16px; }

.dialog-premiumItem {
  font-size: 14px; }
  .dialog-premiumItem img {
    margin: 8px auto;
    display: block; }
  .dialog-premiumItem h3 {
    font-size: 23px;
    line-height: 1;
    margin-bottom: 0; }
  .dialog-premiumItem h5 {
    color: #a8a8a8;
    font-size: 16px;
    margin-bottom: 0;
    line-height: 1;
    padding: 5px 0; }

.dialog-premium .dialog-body {
  padding: 0;
  overflow: hidden; }
.dialog-premium .dialog-premium-content {
  width: 560px;
  height: 326px;
  background: url(//d34ymitoc1pg7m.cloudfront.net/bf3/premium/bg-pop-p-d6cd5cfb.jpg);
  position: relative; }
  .dialog-premium .dialog-premium-content .info {
    position: absolute;
    bottom: 0;
    height: 160px;
    text-align: center;
    width: 560px;
    left: 0; }
    .dialog-premium .dialog-premium-content .info .buttons {
      position: absolute;
      bottom: 16px;
      left: 146px; }
      .dialog-premium .dialog-premium-content .info .buttons .btn-primary {
        margin-right: 8px; }
    .dialog-premium .dialog-premium-content .info h4 {
      font-weight: bold;
      font-family: Arial;
      font-size: 16px;
      text-transform: uppercase;
      line-height: 24px;
      margin: 0;
      padding: 0;
      margin-top: 12px; }
    .dialog-premium .dialog-premium-content .info h5 {
      font-weight: normal;
      font-family: Arial;
      font-size: 14px;
      text-transform: none;
      line-height: 24px; }

#premium-content .scroll-container-outer {
  height: 438px; }
#premium-content .scroll-left, #premium-content .scroll-right {
  line-height: 438px; }
#premium-content .scrollable {
  height: 438px; }

#campaign {
  /* MENU */ }
  #campaign > header h1 {
    float: left; }
  #campaign > header button {
    float: right; }
  #campaign .loggedout-usp-container .usp.footer {
    margin-top: 44px;
    padding-bottom: 44px; }
  #campaign table.menu {
    width: 100%;
    margin-bottom: 16px; }
    #campaign table.menu td {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600;
      width: 106px;
      border-right: 1px solid transparent; }
      #campaign table.menu td:last-child {
        border: 0; }
      #campaign table.menu td .box-content {
        height: 49px;
        background: rgba(0, 0, 0, 0.4) url("../campaign/padlock.png") center no-repeat; }
      #campaign table.menu td footer {
        background-color: rgba(0, 0, 0, 0.4);
        padding: 4px 6px;
        color: #fff;
        text-transform: uppercase;
        font-size: 16px;
        line-height: 14px;
        font-weight: 400; }
        #campaign table.menu td footer .difficulties {
          float: right; }
          #campaign table.menu td footer .difficulties li {
            float: left;
            width: 12px;
            height: 12px;
            margin-left: 2px;
            line-height: 12px;
            background-color: rgba(255, 255, 255, 0.2);
            text-indent: -9999px;
            color: #000; }
            #campaign table.menu td footer .difficulties li.completed {
              text-indent: 0;
              text-align: center; }
      #campaign table.menu td:not(.overview) footer {
        text-align: left; }
      #campaign table.menu td.unlocked {
        cursor: pointer; }
        #campaign table.menu td.unlocked .box-content {
          background-size: cover;
          background-position: center center; }
        #campaign table.menu td.unlocked.overview .box-content {
          background-image: url('//d34ymitoc1pg7m.cloudfront.net/bf4/campaign/levels/sp_overview-1b0b92eb.jpg'); }
        #campaign table.menu td.unlocked.sp1 .box-content {
          background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/campaign/levels/thumb/sp_01_thumb-29f4af1a.jpg); }
        #campaign table.menu td.unlocked.sp2 .box-content {
          background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/campaign/levels/thumb/sp_02_thumb-6f115c2b.jpg); }
        #campaign table.menu td.unlocked.sp3 .box-content {
          background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/campaign/levels/thumb/sp_03_thumb-4a541ea5.jpg); }
        #campaign table.menu td.unlocked.sp4 .box-content {
          background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/campaign/levels/thumb/sp_04_thumb-d64bea3e.jpg); }
        #campaign table.menu td.unlocked.sp5 .box-content {
          background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/campaign/levels/thumb/sp_05_thumb-66ecc794.jpg); }
        #campaign table.menu td.unlocked.sp6 .box-content {
          /* No image for #6, use overview */
          background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/campaign/levels/sp_overview-1b0b92eb.jpg); }
        #campaign table.menu td.unlocked.sp7 .box-content {
          background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/campaign/levels/thumb/sp_07_thumb-096e3dd0.jpg); }
        #campaign table.menu td.unlocked.sp8 .box-content {
          background-image: url(//d34ymitoc1pg7m.cloudfront.net/bf4/campaign/levels/thumb/sp_08_thumb-bebba64b.jpg); }
        #campaign table.menu td.unlocked footer {
          background-color: rgba(0, 0, 0, 0.75); }
      #campaign table.menu td.active .box-content {
        box-shadow: 0 0 7px 0 #e0f4f8; }
      #campaign table.menu td.active footer {
        color: black;
        background-color: white;
        background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
        background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
        box-shadow: 0 0 7px 0 #e0f4f8; }
        #campaign table.menu td.active footer .difficulties li {
          background-color: rgba(0, 0, 0, 0.2); }
      #campaign table.menu td footer .difficulties > span.completed {
        background-color: #54b270; }
  #campaign .campaign-level-head {
    height: 345px;
    position: relative;
    overflow: hidden; }
    #campaign .campaign-level-head .footer {
      background-color: rgba(0, 0, 0, 0.75);
      position: absolute;
      z-index: 1;
      bottom: 0px;
      width: 100%; }
      #campaign .campaign-level-head .footer span.score {
        font-family: Purista, sans-serif;
        font-style: normal;
        font-weight: 600;
        font-size: 24px; }
      #campaign .campaign-level-head .footer h1 {
        font-size: 24px;
        line-height: 22px;
        font-weight: 400; }
      #campaign .campaign-level-head .footer h2 {
        font-size: 16px;
        line-height: 14px;
        font-weight: 400;
        margin-bottom: 0; }
      #campaign .campaign-level-head .footer > div {
        padding: 16px; }
        #campaign .campaign-level-head .footer > div p:nth-child(1) span {
          font-size: 17px;
          float: right; }
    #campaign .campaign-level-head .level-background {
      position: absolute;
      width: 992px;
      height: 345px;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      opacity: 1;
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      transition: all 0.5s ease; }
      #campaign .campaign-level-head .level-background.show-on-load {
        opacity: 0; }

/*********** General campaign stuff ***********/
.campaign-info {
  margin-top: 8px; }
  .campaign-info .box {
    padding: 0; }
    .campaign-info .box .box-content {
      padding: 0; }
  .campaign-info header span {
    float: right;
    margin-top: 4px;
    font-size: 14px; }

.campaign-progress-list li {
  position: relative;
  height: 33px;
  line-height: 33px;
  background-color: rgba(0, 0, 0, 0.45);
  margin-top: 1px;
  font-size: 14px; }
  .campaign-progress-list li span {
    float: left;
    text-align: center;
    margin-left: 10px; }
  .campaign-progress-list li strong {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 22px;
    line-height: 31px;
    float: right;
    margin-right: 10px; }
  .campaign-progress-list li.total-score {
    font-size: 16px;
    padding: 5px 0; }
  .campaign-progress-list li.disabled {
    color: #a8a8a8; }

.li-progress {
  z-index: 10;
  background-color: rgba(0, 0, 0, 0.45);
  position: absolute;
  top: 0;
  left: 0;
  height: 100%; }

.li-content {
  position: absolute;
  width: 100%;
  z-index: 20; }

/*********** Overview ***********/
#campaign-assignments-list {
  margin-top: 1px; }
  #campaign-assignments-list li {
    cursor: pointer;
    width: 159px;
    height: 100px;
    float: left;
    position: relative;
    background-color: rgba(7, 7, 7, 0.5);
    text-align: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 1px 1px 0; }
    #campaign-assignments-list li:nth-child(2n) {
      margin-right: 0;
      width: 160px; }
    #campaign-assignments-list li:hover {
      background-color: rgba(7, 7, 7, 0.6); }
    #campaign-assignments-list li.locked .award_mission {
      opacity: 0.4; }
    #campaign-assignments-list li .progress-bar {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      margin-bottom: 0; }

/*********** Level ***********/
#campaign-progression {
  margin-bottom: 16px; }
  #campaign-progression li.box-content {
    float: left;
    position: relative;
    width: 186px;
    height: 112px;
    margin-right: 1px;
    margin-top: 0;
    padding-top: 16px; }
    #campaign-progression li.box-content img {
      position: absolute;
      left: 16px;
      top: 0; }
    #campaign-progression li.box-content:nth-child(3n) {
      margin-right: 0; }
    #campaign-progression li.box-content h1 {
      font-size: 16px;
      line-height: 16px;
      font-weight: 400;
      text-align: center;
      text-transform: none;
      margin: 0; }
    #campaign-progression li.box-content .progress-bar {
      position: absolute;
      left: 0;
      bottom: 0;
      right: 0;
      margin: 0;
      height: 19px; }
    #campaign-progression li.box-content.locked img {
      opacity: 0.3; }
    #campaign-progression li.box-content .weapon_unlock {
      position: absolute;
      bottom: 32px;
      right: 16px; }

#campaign-collectibles #campaign-weapons > div, #campaign-collectibles #campaign-dogtags > div {
  padding: 8px 16px;
  font-size: 14px;
  line-height: 15px; }
#campaign-collectibles ul {
  height: 0;
  opacity: 0;
  overflow: hidden;
  -webkit-transition: height 0.2s ease, opacity 0.3s ease;
  -moz-transition: height 0.2s ease, opacity 0.3s ease;
  transition: height 0.2s ease, opacity 0.3s ease; }
  #campaign-collectibles ul.active {
    opacity: 1;
    height: auto; }
#campaign-collectibles li.box-content {
  float: left;
  width: 159px;
  margin: 0 1px 1px 0;
  cursor: pointer;
  height: 101px; }
  #campaign-collectibles li.box-content:nth-child(2n) {
    width: 160px;
    margin-right: 0; }
  #campaign-collectibles li.box-content.not-found .dogtags {
    opacity: 0.3; }
  #campaign-collectibles li.box-content .dogtags {
    margin-left: 16px;
    margin-top: 20px; }

#campaign-weapons li.box-content {
  height: 101px; }
  #campaign-weapons li.box-content.not-found .weapon_unlock {
    opacity: 0.3; }
  #campaign-weapons li.box-content .weapon_unlock {
    margin-left: 6px;
    margin-top: 8px; }

#campaign-leaderboard .avatarcontainer {
  padding: 0;
  width: 46px; }
  #campaign-leaderboard .avatarcontainer a {
    margin: 5px 0 5px 10px; }
#campaign-leaderboard .common-playername-username {
  color: #a8a8a8;
  max-width: 180px; }
#campaign-leaderboard .common-playername-personaname, #campaign-leaderboard .common-playername-username {
  max-width: 160px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

#campaign-stats {
  margin-left: 0; }
  #campaign-stats .box-content {
    padding: 8px 16px;
    font-size: 14px;
    line-height: 15px; }

/* comment component CSS resource */
.comments-listing {
  margin-top: 16px; }

.comment-main {
  font-size: 12px;
  position: relative; }
  .comment-main .comment-main-separator {
    margin-top: 10px;
    margin-bottom: 10px; }
  .comment-main .comment-main-header {
    height: 38px;
    line-height: 40px;
    margin-bottom: 10px; }
    .comment-main .comment-main-header h3 {
      float: left;
      color: #a8a8a8;
      font-family: Tahoma, sans-serif;
      font-size: 12px; }
  .comment-main .comment-main-header-write-link {
    float: right;
    text-align: right;
    font-weight: normal; }
  .comment-main .comment-main-avatar {
    position: absolute;
    top: 16px;
    left: 16px;
    width: 60px;
    height: 60px; }
  .comment-main .comment-post-form-wrapper {
    padding-left: 74px;
    width: 549px; }
  .comment-main .comment-body {
    margin: 1px 0;
    padding-bottom: 9px;
    padding: 16px 8px 8px 80px;
    min-height: 68px;
    position: relative; }
    .comment-main .comment-body .avatar {
      position: absolute;
      top: 16px;
      left: 16px; }
    .comment-main .comment-body a {
      font-weight: bold; }
    .comment-main .comment-body:last-child {
      border-bottom: none; }
  .comment-main .comment-reply-report-container {
    float: right;
    display: none; }
  .comment-main .comment-report-container {
    position: absolute;
    top: 10px;
    right: 10px;
    display: none; }
  .comment-main .comment-body:hover .comment-report-container, .comment-main .show-report .comment-report-container {
    display: block; }
  .comment-main .comment-hasnext {
    clear: both; }
  .comment-main .comment-body-left {
    margin-top: 5px;
    margin-left: 15px;
    float: left;
    width: 570px; }
  .comment-main .comment-body-name {
    float: left;
    width: 350px;
    font-weight: bold; }
  .comment-main .comment-body-points {
    float: right;
    margin-left: 20px; }
  .comment-main .comment-write-commenttext {
    height: 90px;
    width: 98%;
    padding: 1%;
    font-family: Arial, sans-serif;
    font-size: 12px;
    resize: vertical; }
  .comment-main .comment-body-left-text {
    color: #d3d3d3;
    width: 495px;
    float: left;
    margin-left: 15px;
    line-height: 18px;
    font-size: 12px;
    margin-top: 2px;
    word-wrap: break-word; }
  .comment-main .comment-body-left-avatar {
    float: left;
    width: 52px;
    margin-right: 10px; }
  .comment-main .comment-footer {
    color: #a8a8a8;
    font-size: 11px; }
  .comment-main .comment-body .comment-show-reply-form {
    font-weight: normal;
    font-size: 11px;
    cursor: pointer; }
  .comment-main .comment-body-votes .comment-vote-icon {
    cursor: pointer;
    opacity: 0.5;
    background: url(../feed/icon-hooah-activitystream.png) no-repeat;
    width: 18px;
    height: 18px;
    background-position: 0 -54px;
    float: left; }
    .comment-main .comment-body-votes .comment-vote-icon:hover {
      background-position: 0 -54px;
      opacity: 1; }
  .comment-main .comment-body-votes.voted .comment-vote-icon {
    background-position: 0 -54px;
    opacity: 1; }
  .comment-main .comment-body-votes .comment-point-count {
    font-weight: bold;
    float: left;
    margin-right: 3px; }
  .comment-main .comment-body-votes.voted .comment-point-count {
    color: #fff; }
  .comment-main .comment-body-right {
    float: right;
    width: 100px;
    text-align: right;
    color: #AFAFAF;
    line-height: 16px;
    font-size: 11px; }
  .comment-main .comment-write-comment {
    background: none; }
  .comment-main .comment-button {
    background: url(../comment/postbutton.png);
    width: 72px;
    height: 23px;
    float: right;
    border: 0px;
    cursor: pointer;
    margin-top: 8px; }
  .comment-main .comment-write-comment {
    padding-left: 15px;
    font-weight: bold;
    color: #fff;
    line-height: 37px;
    width: 656px;
    position: relative;
    height: 37px;
    left: -15px;
    background: url(../base/bfbc2/subheader_x2.png) no-repeat; }
  .comment-main .comment-replies {
    margin-top: 8px; }
  .comment-main .comment-reply-text-not-clicked {
    font-family: Arial, sans-serif;
    font-style: italic;
    height: 22px;
    line-height: 22px;
    padding: 0 5px;
    color: #a1a1a1;
    font-size: 11px;
    width: 378px;
    max-width: 378px; }
  .comment-main .comment-reply-text-clicked {
    font-family: Arial, sans-serif;
    height: 28px;
    line-height: 13px;
    padding: 5px;
    color: #fff;
    font-size: 11px;
    width: 378px;
    max-width: 378px;
    margin-bottom: 5px; }
  .comment-main .comment-reply-item {
    border-top: 1px solid #666666;
    padding: 5px 5px 5px 0;
    width: 390px; }
    .comment-main .comment-reply-item .avatar {
      position: static; }
    .comment-main .comment-reply-item .comment-reply-body {
      color: #d3d3d3; }
  .comment-main .comment-reply-submit-button-area {
    float: right;
    margin-right: 0px;
    margin-top: 0px;
    display: none;
    position: relative;
    width: 100%; }
    .comment-main .comment-reply-submit-button-area div {
      float: left;
      padding-top: 5px; }
    .comment-main .comment-reply-submit-button-area input {
      float: right; }
  .comment-main .comments-reply-show {
    padding: 5px 5px 5px 0;
    cursor: pointer;
    display: block;
    font-size: 11px; }
  .comment-main a.comments-reply-show {
    font-weight: normal; }
  .comment-main .comments-reply-show:hover {
    text-decoration: underline; }
  .comment-main .comment-reply-form-container {
    padding: 5px 5px 5px 0;
    margin-top: -1px;
    line-height: 0;
    width: 390px; }

.comment-pagination {
  margin-top: 16px;
  margin-bottom: 16px; }
  .comment-pagination .pagination-paginationbutton {
    cursor: pointer; }

/*
.devblog-comments {

    .common-reportbutton {
        float: right;
    }

 .avatar {
            position: absolute;
            top: 16px;
            left: 16px;
        }
    .comment-body {
        position: relative;
        padding: 16px 8px 8px 80px;
        min-height: 68px;

        font-size: 12px;
        line-height: 18px;
        color: $color-grey-on-dark;





        .comment-vote-icon {
            background: url(../feed/icon-hooah-activitystream.png) no-repeat;
        }

    }

}
*/
nav.submenu {
  margin-bottom: 16px; }

#loadout-message {
  display: none;
  margin-bottom: 8px;
  text-align: center; }
  #loadout-message p + p {
    margin-top: 8px; }

.loadout-save-dialog-container footer {
  display: none; }
.loadout-save-dialog-container .btn-group {
  text-align: center;
  padding: 8px 0 0; }
.loadout-save-dialog-container form {
  vertical-align: top; }
  .loadout-save-dialog-container form input {
    line-height: 24px;
    width: 510px; }
  .loadout-save-dialog-container form .btn {
    vertical-align: top; }
  .loadout-save-dialog-container form.error .error-message {
    display: block;
    padding: 6px 0 0; }
  .loadout-save-dialog-container form.error input {
    border: 1px solid #af0000; }
  .loadout-save-dialog-container form .error-message {
    display: none;
    padding: 6px 0 0;
    font-size: 12px;
    font-weight: bold;
    color: #c30000; }
.loadout-save-dialog-container p {
  padding-top: 7px;
  color: #a8a8a8; }
  .loadout-save-dialog-container p .icon {
    margin: 0 4px -2px 0; }
.loadout-save-dialog-container .no-preset-slots p:first-of-type {
  text-transform: none; }
.loadout-save-dialog-container footer {
  padding-top: 0; }

.loadout-delete-dialog-container .confirm-text {
  font-size: 13px; }
.loadout-delete-dialog-container .btn + .btn {
  margin-left: 16px; }
.loadout-delete-dialog-container footer {
  padding-top: 2px; }

#loadout {
  -webkit-perspective: 1000;
  -moz-perspective: 1000;
  perspective: 1000;
  text-transform: uppercase;
  font-weight: bold;
  padding-bottom: 30px; }
  #loadout #loadout-presets-dropdown-wrapper {
    position: relative;
    display: inline-block; }
  #loadout #loadout-flipper {
    position: relative;
    min-height: 630px; }
    #loadout #loadout-flipper.presets-active .front {
      display: none; }
    #loadout #loadout-flipper.presets-active .back {
      display: block; }
    #loadout #loadout-flipper .front, #loadout #loadout-flipper .back {
      position: relative;
      top: 0;
      left: 0; }
    #loadout #loadout-flipper .front {
      z-index: 2; }
    #loadout #loadout-flipper .back {
      display: none;
      position: absolute;
      top: 0;
      left: 0; }
    #loadout #loadout-flipper.animated {
      -webkit-transition: 0.4s ease;
      -moz-transition: 0.4s ease;
      transition: 0.4s ease;
      -webkit-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
      -o-transform-style: preserve-3d;
      transform-style: preserve-3d;
      -webkit-perspective: 1000;
      -moz-perspective: 1000;
      perspective: 1000; }
      #loadout #loadout-flipper.animated .front, #loadout #loadout-flipper.animated .back {
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        display: block; }
      #loadout #loadout-flipper.animated.presets-active {
        -webkit-transform: rotateY(180deg);
        -moz-transform: rotateY(180deg);
        -ms-transform: rotateY(180deg);
        -o-transform: rotateY(180deg);
        transform: rotateY(180deg); }
  #loadout #loadout-presets {
    text-align: left; }
    #loadout #loadout-presets .icon-premium-shield {
      margin-bottom: -6px;
      margin-right: 5px; }
    #loadout #loadout-presets .icon-premium-wide {
      margin-bottom: -2px; }
    #loadout #loadout-presets #presets-used {
      font-size: 12px;
      font-weight: normal; }
    #loadout #loadout-presets #apply-preset-btn {
      margin-right: 5px; }
    #loadout #loadout-presets .no-preset-slots {
      font-weight: normal;
      font-size: 13px;
      padding: 10px 0;
      line-height: 20px;
      text-align: center;
      min-height: 53px; }
    #loadout #loadout-presets #preset-list {
      margin-top: 1px; }
      #loadout #loadout-presets #preset-list .jspPane {
        width: 647px; }
      #loadout #loadout-presets #preset-list table {
        margin-bottom: 8px; }
      #loadout #loadout-presets #preset-list td {
        cursor: pointer;
        vertical-align: middle;
        position: relative; }
        #loadout #loadout-presets #preset-list td .icon-premium-p {
          display: none; }
        #loadout #loadout-presets #preset-list td.empty:not(.locked) {
          cursor: default; }
          #loadout #loadout-presets #preset-list td.empty:not(.locked):hover {
            background-color: rgba(7, 7, 7, 0.5); }
        #loadout #loadout-presets #preset-list td.empty:not(.premium) {
          color: #a8a8a8;
          cursor: default; }
        #loadout #loadout-presets #preset-list td .premium-glow {
          display: none; }
        #loadout #loadout-presets #preset-list td.premium .premium-glow {
          display: block;
          top: -10px; }
          #loadout #loadout-presets #preset-list td.premium .premium-glow:after {
            height: 60px; }
        #loadout #loadout-presets #preset-list td.premium .icon-premium-p {
          display: inline-block; }
        #loadout #loadout-presets #preset-list td .preset-name span {
          display: inline-block;
          width: 585px;
          overflow: hidden;
          text-transform: none;
          font-size: 14px;
          font-family: Arial, sans-serif;
          text-overflow: ellipsis;
          white-space: nowrap;
          line-height: 16px; }
        #loadout #loadout-presets #preset-list td:hover .action {
          opacity: 1; }
          #loadout #loadout-presets #preset-list td:hover .action:hover {
            background-position-y: 100%;
            background-color: rgba(0, 0, 0, 0.3); }
      #loadout #loadout-presets #preset-list .preset-slot-wrapper {
        position: relative; }
      #loadout #loadout-presets #preset-list .actions {
        position: absolute;
        right: 0;
        top: 2px; }
        #loadout #loadout-presets #preset-list .actions .action {
          float: right;
          font-size: 11px;
          line-height: 11px;
          font-weight: bold;
          cursor: pointer;
          width: 13px;
          height: 13px;
          background: url('../base/shared/editposition_sprite.png') no-repeat;
          background-position: 0 0;
          text-indent: -30px;
          overflow: hidden;
          opacity: 0.3;
          margin-left: 4px;
          border-radius: 5px; }
          #loadout #loadout-presets #preset-list .actions .action.action-remove {
            background-position: -39px 0;
            background-color: rgba(0, 0, 0, 0.8); }
    #loadout #loadout-presets #preset-types table {
      margin-bottom: 1px; }
    #loadout #loadout-presets #preset-types nav {
      margin-bottom: 0; }
    #loadout #loadout-presets #preset-preview p {
      font-weight: normal;
      font-size: 15px;
      padding-top: 8px;
      width: 200px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap; }
    #loadout #loadout-presets #preset-preview .box {
      margin-bottom: 1px; }
      #loadout #loadout-presets #preset-preview .box .box-content {
        padding: 8px 16px; }
    #loadout #loadout-presets #preset-preview .preview-info {
      background-color: transparent;
      padding: 0; }
      #loadout #loadout-presets #preset-preview .preview-info table {
        margin: 0; }
    #loadout #loadout-presets #preset-preview tbody .preview-thumbnail {
      text-align: center;
      width: 90px;
      max-width: 90px; }
    #loadout #loadout-presets #preset-preview tbody .preview-item-name {
      font-size: 14px; }
    #loadout #loadout-presets #preset-preview tbody th {
      border-bottom: 1px solid rgba(0, 0, 0, 0); }
    #loadout #loadout-presets #preset-preview #no-preview .box-content {
      height: 50px;
      padding-top: 114px;
      padding-bottom: 90px;
      font-weight: normal;
      color: #a8a8a8;
      text-transform: capitalize; }
    #loadout #loadout-presets #presets-footer {
      margin-top: 19px; }
    #loadout #loadout-presets td {
      font-size: 15px; }
    #loadout #loadout-presets th {
      font-size: 12px;
      padding: 8px;
      color: #a8a8a8; }
    #loadout #loadout-presets #no-presets {
      margin-bottom: 8px; }
      #loadout #loadout-presets #no-presets table {
        margin: 0; }
      #loadout #loadout-presets #no-presets .box-content {
        text-transform: none;
        font-weight: normal; }
      #loadout #loadout-presets #no-presets p {
        line-height: 24px;
        padding-bottom: 8px; }
    #loadout #loadout-presets .premium-requirement-box {
      height: 77px; }
    #loadout #loadout-presets #presets-list-wrapper {
      overflow-y: auto;
      margin-bottom: 8px;
      max-height: 535px; }
      #loadout #loadout-presets #presets-list-wrapper table:last-of-type {
        margin: 0; }
  #loadout.not-logged-in #loadout-actions {
    display: none; }
  #loadout header h1 {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden; }
  #loadout a {
    outline: none; }
  #loadout #copy-loadout {
    display: none; }
  #loadout.other-soldier #items-select-menu .items-select-item {
    cursor: default; }
    #loadout.other-soldier #items-select-menu .items-select-item.locked .item-unlock-info {
      display: none; }
  #loadout.other-soldier #reset-loadout, #loadout.other-soldier #random-loadout, #loadout.other-soldier #save-loadout {
    display: none; }
  #loadout.other-soldier #copy-loadout {
    display: inline-block; }
  #loadout .box-content {
    margin-bottom: 0; }
  #loadout #loadout-breadcrumbs i {
    margin-top: 9px;
    margin-left: -4px;
    vertical-align: top; }
    #loadout #loadout-breadcrumbs i.icon-angle-right {
      background-image: url('../loadout/right-angle.png'); }
  #loadout #loadout-breadcrumbs .breadcrumb li:first-of-type a {
    padding-left: 15px; }
  #loadout #loadout-menu-wpr {
    margin: 0 0 16px;
    min-height: 32px; }
  #loadout #loadout-menus {
    position: relative; }
  #loadout #weapon-loadout {
    display: none; }
  #loadout table.loadout-item-accessories td {
    min-width: 33%; }
  #loadout .preset-box {
    margin-bottom: 8px; }
    #loadout .preset-box .box-content {
      padding: 10px 10px 11px; }
    #loadout .preset-box input {
      line-height: 24px;
      text-align: left;
      width: 132px;
      float: left; }
    #loadout .preset-box .btn {
      padding: 0 10px;
      float: right; }
  #loadout .loadout-item-container {
    position: relative;
    margin-bottom: 9px;
    color: #FFF;
    font-size: 12px; }
    #loadout .loadout-item-container:after {
      clear: both;
      display: block;
      content: " "; }
    #loadout .loadout-item-container a {
      text-decoration: none;
      display: block; }
    #loadout .loadout-item-container .box-content {
      padding: 0; }
    #loadout .loadout-item-container .loadout-item-info {
      height: 31px;
      overflow: hidden;
      display: block; }
      #loadout .loadout-item-container .loadout-item-info .loadout-item-picture {
        float: left;
        height: 31px;
        width: 64px;
        overflow: hidden;
        display: table;
        padding-left: 5px; }
        #loadout .loadout-item-container .loadout-item-info .loadout-item-picture .loadout-item-picture-inner {
          display: table-cell;
          vertical-align: middle;
          text-align: center;
          padding-top: 1px; }
      #loadout .loadout-item-container .loadout-item-info .loadout-item-name {
        min-height: 12px;
        float: right;
        width: 165px; }
        #loadout .loadout-item-container .loadout-item-info .loadout-item-name span {
          padding: 9px 5px;
          display: block;
          font-weight: normal;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          max-width: auto; }
      #loadout .loadout-item-container .loadout-item-info .loadout-slot-info {
        padding: 4px 10px 5px;
        font-size: 11px; }
        #loadout .loadout-item-container .loadout-item-info .loadout-slot-info .description {
          font-size: 10px;
          text-align: center;
          padding-bottom: 4px; }
        #loadout .loadout-item-container .loadout-item-info .loadout-slot-info .item-stats-right-col-2 {
          width: 105px; }
        #loadout .loadout-item-container .loadout-item-info .loadout-slot-info .progress-bar {
          margin: 0; }
        #loadout .loadout-item-container .loadout-item-info .loadout-slot-info .item-extended-stats {
          padding: 5px 0 0;
          overflow: hidden; }
        #loadout .loadout-item-container .loadout-item-info .loadout-slot-info table {
          width: 100%;
          border: none; }
          #loadout .loadout-item-container .loadout-item-info .loadout-slot-info table tr + tr td {
            padding-bottom: 5px; }
          #loadout .loadout-item-container .loadout-item-info .loadout-slot-info table th {
            font-size: 10px;
            text-align: center;
            font-weight: bold; }
          #loadout .loadout-item-container .loadout-item-info .loadout-slot-info table td {
            height: 24px;
            font-size: 12px; }
            #loadout .loadout-item-container .loadout-item-info .loadout-slot-info table td:hover {
              background: transparent; }
            #loadout .loadout-item-container .loadout-item-info .loadout-slot-info table td:last-of-type {
              width: 120px; }
    #loadout .loadout-item-container.type-appearance .loadout-item-info .loadout-item-picture .loadout-item-picture-inner {
      padding-top: 4px;
      padding-left: 2px; }
    #loadout .loadout-item-container.active table {
      z-index: 1; }
  #loadout #loadout-overview .loadout-overview-container {
    position: relative; }
  #loadout #loadout-overview h1 {
    position: relative; }
  #loadout #loadout-overview .row {
    margin-bottom: 15px; }
  #loadout #loadout-overview .loadout-item-container {
    margin: 1px 0 0; }
  #loadout #items-select-menu .row-tight + .row-tight {
    margin-top: 0;
    margin-bottom: 7px; }
    #loadout #items-select-menu .row-tight + .row-tight.items-category {
      margin-bottom: 1px; }
  #loadout #items-select-menu .items-category {
    padding: 0; }
    #loadout #items-select-menu .items-category:not(:first-of-type) {
      margin-top: 9px;
      margin-left: 0; }
  #loadout #items-select-menu .row-tight:first-of-type {
    padding-left: 1px;
    margin-bottom: 1px; }
  #loadout #items-select-menu .items-select-item {
    cursor: pointer;
    position: relative;
    display: block; }
    #loadout #items-select-menu .items-select-item h1 {
      font-family: Arial, sans-serif;
      font-weight: bold;
      font-size: 14px; }
    #loadout #items-select-menu .items-select-item .items-select-item-name {
      padding: 0;
      height: 31px; }
      #loadout #items-select-menu .items-select-item .items-select-item-name h1 {
        padding: 4px 0 4px 0; }
        #loadout #items-select-menu .items-select-item .items-select-item-name h1 span {
          float: left; }
  #loadout .item-stats-info .item-stats-left-col {
    float: left;
    min-width: 80px; }
    #loadout .item-stats-info .item-stats-left-col span {
      padding: 4px 0 0;
      display: block; }
  #loadout .item-stats-info .item-stats-right-col-1 {
    width: 25px;
    padding-top: 4px;
    float: right;
    text-align: center;
    padding-left: 5px; }
  #loadout .item-stats-info .item-stats-right-col-2 {
    float: right;
    width: 115px;
    padding-top: 5px; }
    #loadout .item-stats-info .item-stats-right-col-2.rate-of-fire {
      float: left;
      width: 140px;
      font-size: 11px;
      padding: 4px 0 0; }
    #loadout .item-stats-info .item-stats-right-col-2 span {
      display: inline-block;
      position: relative;
      padding-left: 8px;
      margin-left: 1px;
      vertical-align: top; }
      #loadout .item-stats-info .item-stats-right-col-2 span:before {
        position: absolute;
        top: 0;
        left: 0; }
      #loadout .item-stats-info .item-stats-right-col-2 span.success {
        color: #9cca80; }
        #loadout .item-stats-info .item-stats-right-col-2 span.success:before {
          content: "+"; }
      #loadout .item-stats-info .item-stats-right-col-2 span.danger {
        color: #e9a789;
        padding-left: 5px; }
        #loadout .item-stats-info .item-stats-right-col-2 span.danger:before {
          top: -1px;
          content: "-"; }
  #loadout .item-stats-info li {
    padding: 0 0 4px;
    overflow: hidden; }

@-webkit-keyframes loadout-flash {
  0% {
    background-color: rgba(7, 7, 7, 0.5); }

  50% {
    background-color: rgba(205, 205, 205, 0.9); }

  100% {
    background-color: rgba(7, 7, 7, 0.5); } }

@-moz-keyframes loadout-flash {
  0% {
    background-color: rgba(7, 7, 7, 0.5); }

  50% {
    background-color: rgba(205, 205, 205, 0.9); }

  100% {
    background-color: rgba(7, 7, 7, 0.5); } }

-o-keyframes loadout-flash 0% {
  background-color: rgba(7, 7, 7, 0.5); }
-o-keyframes loadout-flash 50% {
  background-color: rgba(205, 205, 205, 0.9); }
-o-keyframes loadout-flash 100% {
  background-color: rgba(7, 7, 7, 0.5); }

@-ms-keyframes loadout-flash {
  0% {
    background-color: rgba(7, 7, 7, 0.5); }

  50% {
    background-color: rgba(205, 205, 205, 0.9); }

  100% {
    background-color: rgba(7, 7, 7, 0.5); } }

@keyframes loadout-flash {
  0% {
    background-color: rgba(7, 7, 7, 0.5); }

  50% {
    background-color: rgba(205, 205, 205, 0.9); }

  100% {
    background-color: rgba(7, 7, 7, 0.5); } }

#loadout #loadout-presets-dropdown-wrapper #loadout-presets-dropdown-button.popover-visible .btn {
  color: black;
  background-color: white;
  background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  box-shadow: 0 0 7px 0 #e0f4f8; }
#loadout #loadout-presets #preset-list td:hover, #loadout #loadout-presets #preset-list td:active {
  background-color: rgba(7, 7, 7, 0.8); }
#loadout #loadout-presets #preset-list td.active {
  color: black;
  background-color: white;
  background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  box-shadow: 0 0 7px 0 #e0f4f8; }
#loadout #grid-controls {
  display: -webkit-box;
  display: -moz-box;
  display: box; }
  #loadout #grid-controls .btn {
    float: left;
    border: none;
    padding: 1px 18px 0;
    height: 23px; }
    #loadout #grid-controls .btn:hover, #loadout #grid-controls .btn:active {
      background-color: rgba(7, 7, 7, 0.8); }
    #loadout #grid-controls .btn.active {
      color: black;
      background-color: white;
      background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
      background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
      box-shadow: 0 0 7px 0 #e0f4f8; }
  #loadout #grid-controls .btn + .btn {
    margin-left: 1px; }
  #loadout #grid-controls .box {
    margin-left: 1px;
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    box-flex: 1; }
    #loadout #grid-controls .box .box-content {
      padding: 0;
      height: 23px; }
#loadout .loadout-item-container header small {
  position: absolute;
  top: 0;
  right: 0;
  visibility: hidden; }
#loadout .loadout-item-container header.popover-visible small {
  visibility: visible; }
#loadout .loadout-item-container:hover header small {
  visibility: visible; }
#loadout .loadout-item-container:before {
  content: " ";
  position: absolute;
  border: 1px solid transparent;
  top: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
  right: 0;
  z-index: -1; }
#loadout .loadout-item-container table {
  margin: 0 0 1px 0;
  border-top: 1px solid transparent;
  border-collapse: separate;
  width: 236px; }
  #loadout .loadout-item-container table td {
    padding: 0;
    text-align: center;
    vertical-align: middle; }
    #loadout .loadout-item-container table td:hover, #loadout .loadout-item-container table td:active {
      background-color: rgba(7, 7, 7, 0.8); }
    #loadout .loadout-item-container table td a {
      padding: 7px 0 6px; }
  #loadout .loadout-item-container table img {
    height: 22px; }
#loadout .loadout-item-container .loadout-item-customize {
  display: none;
  float: right;
  height: 26px;
  padding: 5px 8px 0;
  width: 20px;
  z-index: 15; }
  #loadout .loadout-item-container .loadout-item-customize i {
    font-size: 10px;
    cursor: pointer; }
    #loadout .loadout-item-container .loadout-item-customize i.cog {
      -webkit-transition: opacity 0.2s ease 0s;
      -moz-transition: opacity 0.2s ease 0s;
      transition: opacity 0.2s ease 0s;
      content: "";
      background: url('../loadout/loadout_cog.png') no-repeat;
      width: 20px;
      height: 20px;
      display: block;
      opacity: 0.5; }
  #loadout .loadout-item-container .loadout-item-customize:hover, #loadout .loadout-item-container .loadout-item-customize:active {
    background-color: rgba(7, 7, 7, 0.8); }
    #loadout .loadout-item-container .loadout-item-customize:hover .cog, #loadout .loadout-item-container .loadout-item-customize:active .cog {
      opacity: 0.8; }
#loadout .loadout-item-container.item-configurable .customize-second.loadout-item-customize {
  display: block;
  margin-top: 0; }
#loadout .loadout-item-container.item-configurable header {
  margin-bottom: 1px; }
  #loadout .loadout-item-container.item-configurable header small {
    background-color: transparent; }
#loadout .loadout-item-container.item-configurable .loadout-item-info {
  margin-top: 0;
  float: left;
  width: 199px; }
  #loadout .loadout-item-container.item-configurable .loadout-item-info .loadout-item-name {
    width: 128px; }
#loadout .loadout-item-container .loadout-item-info:hover, #loadout .loadout-item-container .loadout-item-info:active {
  background-color: rgba(7, 7, 7, 0.8); }
#loadout .loadout-item-container.active:before {
  border-color: #FFF;
  z-index: 2; }
#loadout .loadout-item-container.active header {
  color: black;
  background-color: white;
  background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  box-shadow: 0 0 7px 0 #e0f4f8; }
  #loadout .loadout-item-container.active header h1 {
    color: #000; }
#loadout .loadout-item-container.active .loadout-item-info {
  height: 87px;
  margin: 0;
  display: table;
  width: 100%; }
  #loadout .loadout-item-container.active .loadout-item-info .loadout-item-picture {
    float: none;
    height: 65px;
    display: table;
    width: 100%;
    padding-left: 0; }
    #loadout .loadout-item-container.active .loadout-item-info .loadout-item-picture img {
      height: auto; }
  #loadout .loadout-item-container.active .loadout-item-info .loadout-item-name {
    float: none;
    display: table-row;
    width: 100%;
    background-color: #c6c9ca;
    background-image: -webkit-linear-gradient(top, #c6c9ca 0%, #777a7c 100%);
    background-image: linear-gradient(to bottom, #c6c9ca 0%, #777a7c 100%); }
    #loadout .loadout-item-container.active .loadout-item-info .loadout-item-name span {
      color: #000; }
#loadout .loadout-item-container.active.item-configurable header {
  margin-bottom: 0; }
#loadout .loadout-item-container.active.item-configurable small {
  color: #5c5c5c; }
  #loadout .loadout-item-container.active.item-configurable small:after {
    border-top-color: #5c5c5c; }
  #loadout .loadout-item-container.active.item-configurable small:hover {
    color: #3c3c3c; }
    #loadout .loadout-item-container.active.item-configurable small:hover:after {
      border-top-color: #3c3c3c; }
#loadout .loadout-item-container.active.item-configurable .popover-visible small {
  color: #000; }
  #loadout .loadout-item-container.active.item-configurable .popover-visible small:after {
    border-top-color: #000; }
#loadout .loadout-item-container.active.item-configurable .loadout-item-name-link {
  width: 200px;
  float: left;
  display: block; }
#loadout .loadout-item-container.active.item-configurable .loadout-item-customize {
  display: block;
  float: left; }
  #loadout .loadout-item-container.active.item-configurable .loadout-item-customize i {
    background-position: 0 -20px; }
#loadout .loadout-item-container.active.item-configurable .customize-second.loadout-item-customize {
  display: none; }
#loadout .loadout-item-container.active .loadout-item-info:hover, #loadout .loadout-item-container.active .loadout-item-info:active {
  background-color: rgba(7, 7, 7, 0.5); }
  #loadout .loadout-item-container.active .loadout-item-info:hover .loadout-item-customize:hover, #loadout .loadout-item-container.active .loadout-item-info:hover .loadout-item-customize:active, #loadout .loadout-item-container.active .loadout-item-info:active .loadout-item-customize:hover, #loadout .loadout-item-container.active .loadout-item-info:active .loadout-item-customize:active {
    background-color: transparent; }
#loadout #applyAll {
  display: none; }
#loadout:not(.other-soldier) #loadout-overview .make-active {
  display: block; }
#loadout:not(.other-soldier) #loadout-overview .active .active-border:before {
  display: block; }
#loadout:not(.other-soldier) #loadout-overview .active .active-kit {
  display: block; }
#loadout:not(.other-soldier) #loadout-overview .loadout-overview-container:hover header small {
  visibility: visible; }
#loadout:not(.other-soldier) #applyAll {
  display: block; }
#loadout:not(.other-soldier) .active-kit-box {
  display: block; }
#loadout .presets-dropdown {
  padding-right: 0;
  padding-left: 5px; }
  #loadout .presets-dropdown small {
    font-size: 11px;
    line-height: 23px;
    padding: 0 16px 0 6px;
    color: #bebebe;
    display: block;
    cursor: pointer;
    font-family: Arial, sans-serif;
    position: absolute;
    top: 0;
    right: 0;
    background-color: rgba(7, 7, 7, 0.8); }
    #loadout .presets-dropdown small:after {
      border: solid transparent;
      content: " ";
      height: 0;
      width: 0;
      position: absolute;
      pointer-events: none;
      border-top-color: #bebebe;
      border-width: 4px 4px 0px 4px;
      right: 5px;
      top: 9px; }
    #loadout .presets-dropdown small:hover {
      color: #d7d7d7;
      background-color: rgba(92, 92, 92, 0.9); }
      #loadout .presets-dropdown small:hover:hover {
        border-top-color: #d7d7d7; }
#loadout .presets-dropdown {
  padding-right: 0;
  padding-left: 5px; }
  #loadout .presets-dropdown small:after, #loadout .presets-dropdown .btn.dropdown:after {
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-width: 4px 4px 0px 4px; }
  #loadout .presets-dropdown .btn.dropdown:after {
    top: 14px;
    right: 11px;
    border-top-color: #FFF; }
  #loadout .presets-dropdown small {
    font-size: 11px;
    line-height: 23px;
    padding: 0 16px 0 6px;
    color: #bebebe;
    display: block;
    cursor: pointer;
    font-family: Arial, sans-serif;
    position: absolute;
    top: 0;
    right: 0;
    background-color: rgba(7, 7, 7, 0.8); }
    #loadout .presets-dropdown small:after {
      right: 5px;
      top: 9px;
      border-top-color: #bebebe; }
    #loadout .presets-dropdown small:hover {
      color: #d7d7d7;
      background-color: rgba(92, 92, 92, 0.9); }
      #loadout .presets-dropdown small:hover:after {
        border-top-color: #d7d7d7; }
#loadout .popover ul {
  list-style: none;
  min-width: 150px; }
  #loadout .popover ul li {
    position: relative; }
    #loadout .popover ul li:first-child a {
      border-bottom: 0;
      border-top: 0; }
    #loadout .popover ul li a {
      padding: 0 16px;
      border-top: 1px solid #3c4249;
      font-weight: normal;
      display: block;
      font-size: 12px;
      line-height: 34px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      max-width: 202px;
      text-transform: none;
      color: #FFF; }
      #loadout .popover ul li a:hover {
        background: rgba(255, 255, 255, 0.1); }
      #loadout .popover ul li a.active {
        border-top: 0;
        color: black;
        background-color: white;
        background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
        background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
        box-shadow: 0 0 7px 0 #e0f4f8; }
    #loadout .popover ul li .save-preset-button {
      cursor: pointer; }
    #loadout .popover ul li .empty {
      padding: 0 16px;
      border-top: 1px solid #3c4249;
      overflow: hidden;
      max-width: 202px;
      font-weight: normal;
      text-transform: none;
      font-size: 12px;
      line-height: 34px;
      color: #a8a8a8;
      font-style: italic; }
      #loadout .popover ul li .empty:hover {
        background: rgba(255, 255, 255, 0.1); }
    #loadout .popover ul li .premium-glow, #loadout .popover ul li .icon-premium-p {
      display: none; }
    #loadout .popover ul li .icon-premium-p {
      margin: -3px 0; }
    #loadout .popover ul li .premium {
      color: #f4d07d;
      cursor: pointer; }
      #loadout .popover ul li .premium .premium-glow {
        display: block; }
        #loadout .popover ul li .premium .premium-glow:after {
          height: 60px; }
      #loadout .popover ul li .premium .icon-premium-p {
        display: inline-block; }
    #loadout .popover ul li .toggle-presets {
      color: #a8a8a8; }
    #loadout .popover ul li.separator {
      border-top: 1px solid rgba(255, 255, 255, 0.5); }
    #loadout .popover ul li.separator + li a {
      border-top: 0; }
#loadout .popover .popover-body {
  border: 1px solid #d5dde5;
  background: black; }
#loadout .popover-visible small {
  color: black;
  background-color: white;
  background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  box-shadow: 0 0 7px 0 #e0f4f8; }
  #loadout .popover-visible small:hover {
    background-color: #FFF;
    color: #000; }
#loadout .popover-visible small:after, #loadout .popover-visible .btn.dropdown:after {
  border-top-color: #000; }
#loadout .popover-visible small:hover:after, #loadout .popover-visible .btn.dropdown:hover:after {
  border-top-color: #000; }
#loadout #loadout-overview header:not(.popover-visible) small {
  visibility: hidden; }
#loadout #loadout-overview .updated .box-content, #loadout #loadout-overview .updated td {
  -webkit-animation: loadout-flash 0.75s 1 forwards ease-in-out;
  -moz-animation: loadout-flash 0.75s 1 forwards ease-in-out;
  -ms-animation: loadout-flash 0.75s 1 forwards ease-in-out;
  -o-animation: loadout-flash 0.75s 1 forwards ease-in-out;
  animation: loadout-flash 0.75s 1 forwards ease-in-out; }
#loadout #loadout-overview h1 span {
  display: block;
  width: 226px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-wrap: nowrap; }
#loadout #loadout-overview h1 i {
  margin-bottom: -1px; }
  #loadout #loadout-overview h1 i.kit-32, #loadout #loadout-overview h1 i.kit-8 {
    margin-bottom: -2px; }
  #loadout #loadout-overview h1 i.vehicle-icon {
    margin-bottom: -3px; }
#loadout #loadout-overview .active-kit {
  display: none; }
#loadout #loadout-overview .make-active {
  display: none;
  cursor: pointer; }
  #loadout #loadout-overview .make-active .loadout-item-info {
    padding: 12px 0 11px;
    text-align: center;
    height: 12px; }
#loadout #loadout-overview .active .active-border {
  position: relative; }
  #loadout #loadout-overview .active .active-border:before {
    content: "";
    height: 100%;
    left: 0;
    display: none;
    margin: 0;
    outline: 1px solid #FFF;
    padding: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%; }
#loadout #loadout-overview .active .active-kit {
  margin-top: 1px;
  text-align: center;
  display: none;
  color: black;
  background-color: white;
  background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  box-shadow: 0 0 7px 0 #e0f4f8;
  color: #000;
  padding: 12px 0 11px;
  font-size: 12px; }
#loadout #loadout-overview .active .make-active {
  display: none; }
#loadout #loadout-overview .box-content:hover, #loadout #loadout-overview .box-content:active {
  background-color: rgba(7, 7, 7, 0.8); }
#loadout #loadout-overview .loadout-item-container:before {
  border: none;
  content: '';
  position: static;
  pointer-events: none; }
  #loadout #loadout-overview .loadout-item-container:before:hover, #loadout #loadout-overview .loadout-item-container:before:active {
    border: none; }
#loadout #loadout-overview .loadout-vehicle-container td a {
  padding: 8px 0 7px; }
#loadout #loadout-overview .loadout-overview-preset {
  margin-bottom: 1px; }
  #loadout #loadout-overview .loadout-overview-preset a {
    background-color: rgba(7, 7, 7, 0.7); }
    #loadout #loadout-overview .loadout-overview-preset a:hover {
      background-color: rgba(7, 7, 7, 0.9); }
  #loadout #loadout-overview .loadout-overview-preset .loadout-item-name {
    float: none;
    width: 100%;
    text-align: center;
    font-weight: normal;
    font-style: italic; }
#loadout #loadout-overview .loadout-item-expanded {
  padding-top: 1px;
  clear: both; }
#loadout #loadout-overview .loadout-item-customize {
  display: none; }
#loadout #loadout-overview .loadout-item-info-wpr {
  overflow: hidden; }
#loadout #loadout-overview .item-configurable .loadout-item-name {
  width: 128px; }
#loadout #loadout-overview .loadout-first-item .loadout-item-name {
  width: 197px; }
#loadout #loadout-overview .item-configurable .loadout-item-info {
  float: left;
  width: 199px; }
#loadout #loadout-overview .item-configurable .loadout-item-customize {
  float: right;
  margin: 0;
  display: block; }
#loadout #loadout-overview .item-configurable + .item-configurable {
  margin-top: 0; }
#loadout #loadout-overview .loadout-item-container table {
  margin: 0 0 1px 0;
  width: 236px; }
#loadout #loadout-overview .loadout-item-picture {
  padding-left: 5px; }
#loadout #loadout-overview .loadout-item-picture-big {
  overflow: hidden;
  display: table;
  height: 87px;
  padding: 0;
  width: 100%; }
  #loadout #loadout-overview .loadout-item-picture-big .loadout-item-picture-inner {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding-top: 1px; }
#loadout #items-select-menu #item-grid-wrapper.hide-images .row-tight + .row-tight {
  margin-bottom: 9px; }
  #loadout #items-select-menu #item-grid-wrapper.hide-images .row-tight + .row-tight.items-category {
    margin-bottom: 1px; }
#loadout #items-select-menu #item-grid-wrapper.hide-images .items-select-item {
  overflow: hidden; }
  #loadout #items-select-menu #item-grid-wrapper.hide-images .items-select-item .items-select-item-name {
    padding-top: 8px;
    padding-bottom: 8px; }
  #loadout #items-select-menu #item-grid-wrapper.hide-images .items-select-item .item-select-configure a, #loadout #items-select-menu #item-grid-wrapper.hide-images .items-select-item .item-kitshortcut-unlock a {
    padding: 14px 8px 7px; }
  #loadout #items-select-menu #item-grid-wrapper.hide-images .items-select-item .item-info-icon, #loadout #items-select-menu #item-grid-wrapper.hide-images .items-select-item .progress-bar, #loadout #items-select-menu #item-grid-wrapper.hide-images .items-select-item .items-select-item-content {
    display: none; }
#loadout #items-select-menu #item-grid-wrapper header {
  position: relative; }
  #loadout #items-select-menu #item-grid-wrapper header h6 {
    position: absolute;
    top: 0;
    right: 8px;
    bottom: 0;
    font-family: Purista;
    font-size: 12px;
    text-transform: none;
    font-weight: normal; }
    #loadout #items-select-menu #item-grid-wrapper header h6 i.kspadlock {
      background: url('//d34ymitoc1pg7m.cloudfront.net/bf4/store/header-icon-cdcdc3f3.png') no-repeat;
      background-position: 0px 5px;
      width: 13px;
      height: 20px;
      float: left;
      margin-right: 6px; }
    #loadout #items-select-menu #item-grid-wrapper header h6 a {
      text-decoration: none;
      color: #a8a8a8; }
#loadout #items-select-menu .loadout-item-grid {
  width: 246px;
  margin-left: 1px;
  float: left; }
#loadout #items-select-menu .items-compare .items-select-item:not(.active) .item-comparable .item-stats-comparison, #loadout #items-select-menu .items-select-item:hover .item-comparable .item-stats-comparison {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  padding: 6px 10px; }
#loadout #items-select-menu .items-compare .items-select-item:not(.active) .item-comparable .item-expansion-icon, #loadout #items-select-menu .items-compare .items-select-item:not(.active) .item-comparable .items-select-item-image, #loadout #items-select-menu .items-select-item:hover .item-comparable .item-expansion-icon, #loadout #items-select-menu .items-select-item:hover .item-comparable .items-select-item-image {
  opacity: 0.1; }
#loadout #items-select-menu .items-select-item header {
  background: none; }
#loadout #items-select-menu .items-select-item .item-kitshortcut-unlock {
  float: right;
  padding: 0;
  margin: 0 0 1px 1px; }
  #loadout #items-select-menu .items-select-item .item-kitshortcut-unlock a {
    display: block;
    height: 26px;
    padding: 5px 8px 0;
    width: 20px; }
  #loadout #items-select-menu .items-select-item .item-kitshortcut-unlock i {
    font-size: 10px;
    cursor: pointer; }
    #loadout #items-select-menu .items-select-item .item-kitshortcut-unlock i.kspadlock {
      -webkit-transition: opacity 0.2s ease 0s;
      -moz-transition: opacity 0.2s ease 0s;
      transition: opacity 0.2s ease 0s;
      content: "";
      background: url('//d34ymitoc1pg7m.cloudfront.net/bf4/store/icon-689a48db.png') no-repeat;
      background-position: center 1px;
      width: 20px;
      height: 20px;
      display: block;
      opacity: 0.8; }
      #loadout #items-select-menu .items-select-item .item-kitshortcut-unlock i.kspadlock:hover {
        background-image: url('//d34ymitoc1pg7m.cloudfront.net/bf4/store/icon-hover-e4fc4386.png'); }
  #loadout #items-select-menu .items-select-item .item-kitshortcut-unlock:hover .kspadlock, #loadout #items-select-menu .items-select-item .item-kitshortcut-unlock:active .kspadlock {
    opacity: 1; }
#loadout #items-select-menu .items-select-item .item-select-configure {
  float: right;
  padding: 0;
  margin: 0 0 1px 1px; }
  #loadout #items-select-menu .items-select-item .item-select-configure a {
    display: block;
    height: 26px;
    padding: 5px 8px 0;
    width: 20px; }
  #loadout #items-select-menu .items-select-item .item-select-configure i {
    font-size: 10px;
    cursor: pointer; }
    #loadout #items-select-menu .items-select-item .item-select-configure i.cog {
      -webkit-transition: opacity 0.2s ease 0s;
      -moz-transition: opacity 0.2s ease 0s;
      transition: opacity 0.2s ease 0s;
      content: "";
      background: url('../loadout/loadout_cog.png') no-repeat;
      width: 20px;
      height: 20px;
      display: block;
      opacity: 0.5; }
  #loadout #items-select-menu .items-select-item .item-select-configure:hover .cog, #loadout #items-select-menu .items-select-item .item-select-configure:active .cog {
    opacity: 0.8; }
#loadout #items-select-menu .items-select-item .track-icon {
  top: 7px;
  right: 5px; }
#loadout #items-select-menu .items-select-item .item-duplicated, #loadout #items-select-menu .items-select-item .info-tip, #loadout #items-select-menu .items-select-item .item-unlock-info, #loadout #items-select-menu .items-select-item .item-unlock-info-text, #loadout #items-select-menu .items-select-item .battlepack-unlock, #loadout #items-select-menu .items-select-item .item-incompatible {
  display: none; }
#loadout #items-select-menu .items-select-item:before {
  content: " ";
  position: absolute;
  border: 1px solid transparent;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  pointer-events: none;
  z-index: -1; }
#loadout #items-select-menu .items-select-item .items-select-item-content {
  clear: both;
  height: 132px;
  margin-top: 1px;
  padding-bottom: 6px;
  position: relative;
  overflow: hidden; }
  #loadout #items-select-menu .items-select-item .items-select-item-content .items-select-item-image-wrapper {
    display: table;
    height: 100%;
    width: 100%;
    position: relative; }
    #loadout #items-select-menu .items-select-item .items-select-item-content .items-select-item-image-wrapper .items-select-item-image {
      display: table-cell;
      vertical-align: middle;
      text-align: center; }
#loadout #items-select-menu .items-select-item .item-stats-data {
  position: absolute; }
  #loadout #items-select-menu .items-select-item .item-stats-data.item-unlocks {
    bottom: 13px;
    right: 15px;
    font-size: 11px;
    font-weight: normal;
    color: #A8A8A8; }
  #loadout #items-select-menu .items-select-item .item-stats-data.item-stars {
    bottom: 4px;
    left: 5px; }
#loadout #items-select-menu .items-select-item .item-desc {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  font-size: 11px;
  width: 229px;
  text-align: center;
  padding: 8px;
  line-height: 15px;
  height: 136px;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.7);
  font-weight: 500;
  text-transform: none; }
#loadout #items-select-menu .items-select-item .progress-bar {
  display: none;
  margin-bottom: 0; }
#loadout #items-select-menu .items-select-item:hover:not(.active):not(.duplicated):not(.locked):not(.incompatible) .box-content, #loadout #items-select-menu .items-select-item:active:not(.active):not(.duplicated):not(.locked):not(.incompatible) .box-content {
  background-color: rgba(7, 7, 7, 0.8); }
#loadout #items-select-menu .items-select-item:hover:not(.active):not(.duplicated):not(.locked):not(.incompatible):before, #loadout #items-select-menu .items-select-item:active:not(.active):not(.duplicated):not(.locked):not(.incompatible):before {
  z-index: 3;
  border-color: rgba(255, 255, 255, 0.7); }
#loadout #items-select-menu .items-select-item .item-expansion-icon {
  padding: 6px 0 3px 8px;
  vertical-align: top;
  float: left;
  margin: 0 0 1px 0; }
  #loadout #items-select-menu .items-select-item .item-expansion-icon i {
    margin-left: auto;
    margin-right: auto; }
#loadout #items-select-menu .items-select-item.accessory .item-expansion-icon {
  display: none; }
#loadout #items-select-menu .items-select-item.locked {
  cursor: default; }
  #loadout #items-select-menu .items-select-item.locked .items-select-item-image, #loadout #items-select-menu .items-select-item.locked h1 span {
    opacity: 0.4; }
  #loadout #items-select-menu .items-select-item.locked:before {
    z-index: 3;
    border-color: transparent; }
  #loadout #items-select-menu .items-select-item.locked .item-stats-data {
    display: none; }
  #loadout #items-select-menu .items-select-item.locked.show-progress .progress-bar {
    margin-top: 1px;
    display: block; }
  #loadout #items-select-menu .items-select-item.locked.show-progress .items-select-item-content {
    padding-bottom: 1px; }
  #loadout #items-select-menu .items-select-item.locked.show-progress .item-unlock-info {
    display: block; }
  #loadout #items-select-menu .items-select-item.locked .item-unlock-info {
    position: absolute;
    bottom: 8px;
    display: block;
    left: 8px;
    right: 8px;
    text-align: center; }
    #loadout #items-select-menu .items-select-item.locked .item-unlock-info a, #loadout #items-select-menu .items-select-item.locked .item-unlock-info span {
      text-transform: uppercase;
      font-size: 11px;
      color: #a8a8a8;
      text-align: right;
      font-weight: normal; }
    #loadout #items-select-menu .items-select-item.locked .item-unlock-info a:hover {
      text-decoration: none;
      color: #fff; }
    #loadout #items-select-menu .items-select-item.locked .item-unlock-info i {
      display: inline-block;
      font-size: 10px;
      vertical-align: middle;
      margin-left: 4px; }
      #loadout #items-select-menu .items-select-item.locked .item-unlock-info i.battlepack-icon {
        -webkit-transition: opacity 0.2s ease 0s;
        -moz-transition: opacity 0.2s ease 0s;
        transition: opacity 0.2s ease 0s;
        content: "";
        background: url('../loadout/icon-bp.png') no-repeat;
        width: 20px;
        height: 20px;
        display: inline-block;
        opacity: 0.5; }
      #loadout #items-select-menu .items-select-item.locked .item-unlock-info i.icon-premium-p, #loadout #items-select-menu .items-select-item.locked .item-unlock-info i.xp-icon, #loadout #items-select-menu .items-select-item.locked .item-unlock-info i.dependency-icon {
        margin-top: -2px; }
#loadout #items-select-menu .items-select-item.duplicated:not(.locked), #loadout #items-select-menu .items-select-item.incompatible:not(.locked) {
  cursor: default; }
  #loadout #items-select-menu .items-select-item.duplicated:not(.locked) .items-select-item-image, #loadout #items-select-menu .items-select-item.incompatible:not(.locked) .items-select-item-image {
    opacity: 0.4; }
  #loadout #items-select-menu .items-select-item.duplicated:not(.locked) .items-text, #loadout #items-select-menu .items-select-item.incompatible:not(.locked) .items-text {
    display: block;
    text-transform: uppercase;
    position: absolute;
    left: 0;
    bottom: 0;
    text-align: center;
    width: 100%;
    padding: 0 0 10px;
    font-size: 12px; }
  #loadout #items-select-menu .items-select-item.duplicated:not(.locked) header, #loadout #items-select-menu .items-select-item.incompatible:not(.locked) header {
    background-color: rgba(255, 0, 0, 0.5);
    background-image: -webkit-linear-gradient(top, rgba(227, 18, 0, 0.5) 0%, rgba(227, 18, 0, 0.3) 50%);
    background-image: linear-gradient(to bottom, rgba(227, 18, 0, 0.5) 0%, rgba(227, 18, 0, 0.3) 50%); }
    #loadout #items-select-menu .items-select-item.duplicated:not(.locked) header h1 span, #loadout #items-select-menu .items-select-item.incompatible:not(.locked) header h1 span {
      color: #000; }
  #loadout #items-select-menu .items-select-item.duplicated:not(.locked) .items-text.item-incompatible span, #loadout #items-select-menu .items-select-item.incompatible:not(.locked) .items-text.item-incompatible span {
    padding: 0 5px;
    display: block; }
  #loadout #items-select-menu .items-select-item.duplicated:not(.locked):before, #loadout #items-select-menu .items-select-item.incompatible:not(.locked):before {
    z-index: 3;
    border-color: rgba(255, 0, 0, 0.5); }
#loadout #items-select-menu .items-select-item.incompatible:not(.locked) .item-duplicated, #loadout #items-select-menu .items-select-item.incompatible:not(.locked) .battlepack-unlock {
  display: none; }
#loadout #items-select-menu .items-select-item.duplicated:not(.locked) .item-incompatible, #loadout #items-select-menu .items-select-item.duplicated:not(.locked) .battlepack-unlock {
  display: none; }
#loadout #items-select-menu .items-select-item .item-info-icon-container {
  padding: 0;
  margin: 0 0 0 1px;
  height: 31px;
  width: 31px;
  float: right;
  text-align: center; }
#loadout #items-select-menu .items-select-item .item-info-icon {
  background: no-repeat transparent 0 0 url('../loadout/icon-info-s.png');
  width: 17px;
  height: 17px;
  margin-top: 7px;
  margin-left: auto;
  margin-right: auto;
  cursor: pointer;
  opacity: 0.7; }
  #loadout #items-select-menu .items-select-item .item-info-icon:hover {
    opacity: 1; }
#loadout #items-select-menu .items-select-item .item-text {
  width: auto;
  overflow: hidden;
  padding: 0 0 0 8px;
  margin: 0; }
  #loadout #items-select-menu .items-select-item .item-text h1 span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%; }
#loadout #items-select-menu .items-select-item:not(.active) .item-text {
  background-color: rgba(7, 7, 7, 0.5); }
#loadout #items-select-menu .items-select-item.show-item-desc .item-desc {
  display: block; }
#loadout #items-select-menu .items-select-item.show-item-desc .items-select-item-image, #loadout #items-select-menu .items-select-item.show-item-desc .items-text, #loadout #items-select-menu .items-select-item.show-item-desc .item-stats-comparison {
  opacity: 0.4; }
#loadout #items-select-menu .items-select-item.show-item-desc .item-info-icon {
  opacity: 1; }
#loadout #items-select-menu .items-select-item.active:before {
  z-index: 3;
  border-color: #FFF; }
#loadout #items-select-menu .items-select-item.active header .item-expansion-icon, #loadout #items-select-menu .items-select-item.active header .item-text {
  color: black;
  background-color: white;
  background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
  box-shadow: 0 0 7px 0 #e0f4f8; }
  #loadout #items-select-menu .items-select-item.active header .item-expansion-icon h1, #loadout #items-select-menu .items-select-item.active header .item-text h1 {
    color: #000; }
#loadout #items-select-menu .items-select-item.active:hover .box-content:not(header .item-text), #loadout #items-select-menu .items-select-item.active:active .box-content:not(header .item-text) {
  background-color: rgba(7, 7, 7, 0.8); }
#loadout #items-select-menu .items-select-item .item-stats-comparison {
  display: none;
  font-size: 11px; }
  #loadout #items-select-menu .items-select-item .item-stats-comparison .progress-bar {
    overflow: hidden;
    display: block; }
#loadout #items-select-menu .category-group.highlight-ksunlockables .items-select-item {
  opacity: 0.5; }
#loadout #items-select-menu .category-group.highlight-ksunlockables .unlockable-via-kitshortcut {
  opacity: 1; }
  #loadout #items-select-menu .category-group.highlight-ksunlockables .unlockable-via-kitshortcut.items-select-item.active:before {
    border-color: transparent; }
  #loadout #items-select-menu .category-group.highlight-ksunlockables .unlockable-via-kitshortcut.items-select-item.active header.items-select-item-name {
    background-color: transparent;
    background-image: none;
    box-shadow: none; }
    #loadout #items-select-menu .category-group.highlight-ksunlockables .unlockable-via-kitshortcut.items-select-item.active header.items-select-item-name h1 {
      color: #d5dde5; }
  #loadout #items-select-menu .category-group.highlight-ksunlockables .unlockable-via-kitshortcut .kspadlock {
    background-image: url('//d34ymitoc1pg7m.cloudfront.net/bf4/store/icon-hover-e4fc4386.png'); }
  #loadout #items-select-menu .category-group.highlight-ksunlockables .unlockable-via-kitshortcut:before {
    z-index: -1;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(7, 7, 7, 0.8);
    opacity: 1; }
  #loadout #items-select-menu .category-group.highlight-ksunlockables .unlockable-via-kitshortcut .item-kitshortcut-unlock {
    opacity: 1; }
#loadout .item-stats-info .item-stats-right-col-2 span {
  display: inline-block;
  position: relative;
  padding-left: 8px;
  margin-left: 1px;
  vertical-align: top; }
  #loadout .item-stats-info .item-stats-right-col-2 span:before {
    position: absolute;
    top: 0;
    left: 0; }
  #loadout .item-stats-info .item-stats-right-col-2 span.success {
    color: #9cca80; }
    #loadout .item-stats-info .item-stats-right-col-2 span.success:before {
      content: "+"; }
  #loadout .item-stats-info .item-stats-right-col-2 span.danger {
    color: #e9a789;
    padding-left: 5px; }
    #loadout .item-stats-info .item-stats-right-col-2 span.danger:before {
      top: -1px;
      content: "-"; }
#loadout .active-kit-box {
  display: none;
  margin-bottom: 8px; }
  #loadout .active-kit-box .btn {
    width: 100%; }

.is-ie #loadout .loadout-item-container.active:before, .is-ie #loadout #items-select-menu .items-select-item:before {
  display: none; }

.is-touch #loadout #items-select-menu .items-select-item:hover .item-comparable .item-stats-comparison {
  display: none; }

/* ============================== @@ ============================= */
#battlereport > header:before, #battlereport > header:after {
  display: table;
  content: "";
  line-height: 0; }
#battlereport > header:after {
  clear: both; }
#battlereport > header h1 {
  float: left; }
#battlereport > header nav {
  float: right; }

#battlereport-top #add-as-favorite-battlereport {
  position: relative;
  padding-left: 40px; }
  #battlereport-top #add-as-favorite-battlereport .icon-premium-shield {
    position: absolute;
    top: 6px;
    left: 12px; }
  #battlereport-top #add-as-favorite-battlereport .star {
    position: absolute;
    left: 12px; }

#battlereport-metadata {
  margin-top: 1px; }
  #battlereport-metadata > .battlereport-metadata-inner {
    padding: 8px;
    font-size: 12px;
    background-color: rgba(7, 7, 7, 0.8); }
    #battlereport-metadata > .battlereport-metadata-inner .battlereport-header-info-gameicon {
      position: relative;
      top: 2px; }

#battlereport-prizes {
  margin-top: 1px;
  overflow: hidden; }
  #battlereport-prizes > div.span6 {
    width: 100%; }
  #battlereport-prizes > div > .box-content {
    padding: 8px 16px;
    padding-bottom: 200px;
    margin-bottom: -192px; }
    #battlereport-prizes > div > .box-content:before, #battlereport-prizes > div > .box-content:after {
      display: table;
      content: "";
      line-height: 0; }
    #battlereport-prizes > div > .box-content:after {
      clear: both; }
    #battlereport-prizes > div > .box-content.squad {
      padding-bottom: 7px; }
    #battlereport-prizes > div > .box-content h3 {
      font-size: 16px;
      line-height: 19px; }
    #battlereport-prizes > div > .box-content > a, #battlereport-prizes > div > .box-content > div {
      float: left; }
    #battlereport-prizes > div > .box-content > .content {
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400;
      color: #fff;
      font-size: 14px;
      line-height: 14px;
      margin-left: 16px;
      max-width: 156px; }
      #battlereport-prizes > div > .box-content > .content > p {
        margin-top: 4px; }
      #battlereport-prizes > div > .box-content > .content .score {
        font-size: 23px;
        line-height: 23px; }
      #battlereport-prizes > div > .box-content > .content .score-label {
        margin-left: 6px;
        font-size: 11px;
        font-family: Arial;
        color: #a8a8a8;
        word-break: break-word;
        max-width: 80px;
        margin-top: 5px;
        line-height: 10px; }
  #battlereport-prizes > div .avatar.large {
    width: 45px;
    height: 45px; }
  #battlereport-prizes > div .avatar.xsmall {
    width: 22px;
    height: 22px;
    margin-bottom: 1px; }
  #battlereport-prizes > div .squad-avatars {
    max-width: 75px; }

#battlereport-scoreboard nav li {
  cursor: pointer; }

.scoreboard-section {
  display: none; }

.scoreboard-section.active {
  display: block; }

table.scoreboard {
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  margin-bottom: 8px; }
  table.scoreboard .common-playername-personaname {
    width: 130px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap; }
  table.scoreboard.table > thead tr {
    height: 31px;
    line-height: 31px;
    background-repeat: repeat-x; }
    table.scoreboard.table > thead tr.tr-color-clubs {
      background-color: rgba(0, 0, 0, 0.6); }
    table.scoreboard.table > thead tr.tr-color-allied {
      background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAfCAIAAACgQJBPAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MjEwMzcyMTNDMkQ0MTFFMjhBN0U5NTVCRENERjNGRDAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MjEwMzcyMTRDMkQ0MTFFMjhBN0U5NTVCRENERjNGRDAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyMTAzNzIxMUMyRDQxMUUyOEE3RTk1NUJEQ0RGM0ZEMCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyMTAzNzIxMkMyRDQxMUUyOEE3RTk1NUJEQ0RGM0ZEMCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pq6HMfoAAACJSURBVHjaXMxbCoJQFEZhDcEyDdI83kbdaJpFM5AS8WCaQmDeeqjX1t5vH4t/m+fL1fg7q+gHOPU9+Na94ezowvlTdLHPu1H85/7ecB8ForcTrII9XDbs/old1zN8UOwP0d3QgVvRnXAH9/UC24r9pbm3IvZBr/Am3sKz6EZsw2v1gb8J+k+AAQCDxS//vRw2IwAAAABJRU5ErkJggg==); }
    table.scoreboard.table > thead tr.tr-color-enemy {
      background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAfCAIAAACgQJBPAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MEZGRjkzMDFDMkQ1MTFFMjhGOTlEQTkyNTZENjhCQ0MiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MEZGRjkzMDJDMkQ1MTFFMjhGOTlEQTkyNTZENjhCQ0MiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowRkZGOTJGRkMyRDUxMUUyOEY5OURBOTI1NkQ2OEJDQyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowRkZGOTMwMEMyRDUxMUUyOEY5OURBOTI1NkQ2OEJDQyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlzNY20AAACNSURBVHjaXJDNCoJAHAczFkH8agnLVXvkzr1RT5HSqgiiqC0dxEt6dNrbMAz/H2s9H/fD7ompfINPKgWbqgD7cQb+6Bc4TG70RU6fJvQ57wfZ9a/X7FXE/bqmv0j2VUMfhfR1S3926Zue+6RD347sAxs8dobeE9w/fPn/7pF+mtnj/ObNApbOb8+rAAMAwpMvZ6PnRjIAAAAASUVORK5CYII=); }
  table.scoreboard.table > thead th {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    color: #fff;
    font-size: 14px;
    background-color: transparent;
    padding: 0 10px; }
    table.scoreboard.table > thead th:first-child {
      font-size: 19px; }
    table.scoreboard.table > thead th:nth-child(2) {
      width: 35px; }
    table.scoreboard.table > thead th:nth-child(3) {
      width: 35px; }
    table.scoreboard.table > thead th:nth-child(4) {
      width: 90px; }
  table.scoreboard tbody > tr {
    cursor: pointer; }
    table.scoreboard tbody > tr.active {
      background-color: #fff; }
    table.scoreboard tbody > tr td:first-child {
      width: 45px;
      padding: 0; }
    table.scoreboard tbody > tr.active-player td:first-child {
      color: #000; }
    table.scoreboard tbody > tr.active-player:not(.active) td:first-child {
      background-color: #e09a00; }
    table.scoreboard tbody > tr.active-player:not(.active) td:not(:first-child) {
      color: #cbff5b; }
    table.scoreboard tbody > tr.active-squad:not(.active) td:not(:first-child) {
      color: #cbff5b; }
    table.scoreboard tbody > tr.myfriend:not(.active, .active-player, .active-squad) td:not(:first-child) {
      color: #94cdf3; }
  table.scoreboard tr.dnf {
    opacity: 0.5; }
  table.scoreboard tr.hiddenPlayer {
    display: none; }
  table.scoreboard td.soldier-name {
    /* Modifications to center content vertically inside player row */ }
    table.scoreboard td.soldier-name:before, table.scoreboard td.soldier-name:after {
      display: table;
      content: "";
      line-height: 0; }
    table.scoreboard td.soldier-name:after {
      clear: both; }
    table.scoreboard td.soldier-name > * {
      float: left; }
    table.scoreboard td.soldier-name .avatar {
      margin: 0; }
    table.scoreboard td.soldier-name .user-personarank {
      margin: 1px 5px 0 5px; }
    table.scoreboard td.soldier-name .common-playername-personaname.solo {
      line-height: 26px; }
    table.scoreboard td.soldier-name .common-playername-username {
      font-size: 12px; }
  table.scoreboard tr.squadrow-fillup {
    background: transparent; }
    table.scoreboard tr.squadrow-fillup td {
      border-top: 1px solid transparent;
      height: 46px;
      padding: 0; }
  table.scoreboard tfoot tr {
    background-color: rgba(0, 0, 0, 0.6); }

.table tr.battlereport-player-score {
  cursor: auto; }
  .table tr.battlereport-player-score td {
    padding: 0;
    border: 0;
    top: -1px; }
  .table tr.battlereport-player-score header {
    background-color: rgba(0, 0, 0, 0.4);
    height: 40px;
    line-height: 40px; }
    .table tr.battlereport-player-score header strong {
      margin-left: 17px; }
  .table tr.battlereport-player-score .player-score-container {
    border: 1px solid #fff;
    border-top: 0; }
    .table tr.battlereport-player-score .player-score-container.loading {
      height: 194px;
      line-height: 194px;
      text-align: center; }
  .table tr.battlereport-player-score .player-score-content:before, .table tr.battlereport-player-score .player-score-content:after {
    display: table;
    content: "";
    line-height: 0; }
  .table tr.battlereport-player-score .player-score-content:after {
    clear: both; }
  .table tr.battlereport-player-score .player-score-content .player-prize {
    line-height: 25px;
    padding-left: 15px;
    height: 25px;
    background-color: rgba(0, 0, 0, 0.4); }
    .table tr.battlereport-player-score .player-score-content .player-prize > span {
      text-transform: uppercase; }
    .table tr.battlereport-player-score .player-score-content .player-prize span.score-name {
      float: left; }
    .table tr.battlereport-player-score .player-score-content .player-prize span.score {
      float: right;
      margin-right: 4px; }
    .table tr.battlereport-player-score .player-score-content .player-prize span.score-label {
      float: right;
      color: #8a8a8a;
      margin-right: 8px; }
  .table tr.battlereport-player-score .player-score-content ul.player-stats {
    float: left;
    width: 70%;
    height: 130px; }
    .table tr.battlereport-player-score .player-score-content ul.player-stats li {
      margin-top: 1px;
      background-color: rgba(0, 0, 0, 0.4);
      height: 25px;
      line-height: 25px; }
      .table tr.battlereport-player-score .player-score-content ul.player-stats li:before, .table tr.battlereport-player-score .player-score-content ul.player-stats li:after {
        display: table;
        content: "";
        line-height: 0; }
      .table tr.battlereport-player-score .player-score-content ul.player-stats li:after {
        clear: both; }
      .table tr.battlereport-player-score .player-score-content ul.player-stats li span.label {
        float: left;
        margin-left: 17px;
        color: #8a8a8a;
        text-transform: uppercase; }
      .table tr.battlereport-player-score .player-score-content ul.player-stats li span.score {
        float: right;
        margin-right: 17px; }
  .table tr.battlereport-player-score .player-score-content .player-score-pie {
    float: right;
    width: 29.8%;
    height: 130px;
    margin-top: 1px;
    background-color: rgba(0, 0, 0, 0.4); }
  .table tr.battlereport-player-score .player-score-content .common-reportbutton-container {
    float: right;
    margin: 6px 6px 0 0; }
  .table tr.battlereport-player-score footer {
    margin-top: 1px;
    padding: 15px 0;
    background-color: rgba(0, 0, 0, 0.4); }
    .table tr.battlereport-player-score footer .btn {
      width: 30%;
      margin: 0 0.75%; }
      .table tr.battlereport-player-score footer .btn:first-child {
        margin-left: 3%; }
      .table tr.battlereport-player-score footer .btn:last-child {
        margin-right: 3%; }

/********** Player report ***********/
#playerreport {
  margin: 0 0 16px 0; }
  #playerreport > header {
    position: relative;
    height: 80px;
    background-color: rgba(0, 0, 0, 0.6); }
    #playerreport > header .avatar {
      position: absolute;
      top: 10px;
      left: 10px; }
    #playerreport > header h4 {
      position: absolute;
      top: 14px;
      left: 85px; }
    #playerreport > header .playerreport-soldierpic {
      max-width: 240px;
      height: 92px;
      overflow: hidden;
      position: absolute;
      bottom: 0;
      right: 8px; }
    #playerreport > header .common-playername-personaname {
      display: inline-block; }
    #playerreport > header .common-playername-username {
      display: inline-block;
      color: #a8a8a8;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 400; }
  #playerreport > div:before, #playerreport > div:after {
    display: table;
    content: "";
    line-height: 0; }
  #playerreport > div:after {
    clear: both; }
  #playerreport footer {
    margin-top: 1px;
    padding: 6px 0;
    background-color: rgba(0, 0, 0, 0.6);
    text-align: center;
    color: #fff;
    font-size: 13px;
    text-transform: uppercase;
    cursor: pointer; }
    #playerreport footer:hover {
      background-color: #fff;
      color: #000; }

#playerreport-additional {
  position: absolute;
  top: 50px;
  left: 85px; }
  #playerreport-additional .personal-prize-info {
    font-size: 12px;
    margin-left: 5px;
    position: relative;
    top: -1px;
    color: #a8a8a8; }

#playerreport-score {
  position: relative; }
  #playerreport-score svg {
    position: relative;
    z-index: 100; }
  #playerreport-score p {
    position: absolute;
    top: 78px;
    width: 100%;
    z-index: 90; }
    #playerreport-score p span {
      text-transform: uppercase;
      font-size: 14px; }
    #playerreport-score p strong {
      display: block;
      margin-top: 5px;
      font-size: 26px; }
  #playerreport-score #playerreport-pie-percent {
    font-size: 11px;
    margin-top: 5px; }

.playerreport-box {
  float: left;
  margin: 1px 0 0 1px; }
  .playerreport-box.small {
    width: 123px;
    height: 87px; }
    .playerreport-box.small > div {
      height: 63px;
      line-height: 64px;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600;
      font-size: 30px;
      color: #fff; }
  .playerreport-box.medium {
    width: 247px;
    height: 144px; }
    .playerreport-box.medium > div {
      height: 120px; }
    .playerreport-box.medium a {
      display: inline-block;
      width: 100%;
      height: 100%; }
      .playerreport-box.medium a:hover {
        background-color: rgba(0, 0, 0, 0.3); }
    .playerreport-box.medium span {
      position: absolute;
      bottom: 12px;
      color: #fff; }
      .playerreport-box.medium span.best-key {
        left: 15px; }
      .playerreport-box.medium span.best-value {
        right: 15px; }
  .playerreport-box.large {
    width: 248px;
    height: 231px; }
    .playerreport-box.large > div {
      height: 208px; }
  .playerreport-box.full {
    width: 100%;
    margin-left: 0; }
  .playerreport-box > div {
    position: relative;
    margin-top: 1px;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.45); }
    .playerreport-box > div.no-bg {
      background-color: inherit; }
    .playerreport-box > div .kit-icon, .playerreport-box > div .weapon, .playerreport-box > div .vehicle {
      margin-top: 12px; }
  .playerreport-box:first-child {
    margin-left: 0; }
  .playerreport-box header {
    height: 23px;
    background-color: rgba(0, 0, 0, 0.6);
    padding: 0 8px;
    text-align: center; }
    .playerreport-box header h5 {
      font-size: 14px;
      line-height: 24px;
      margin: 0;
      padding: 0; }
  .playerreport-box .best-stuff-no-image p {
    font-size: 14px;
    line-height: 100px;
    color: #a8a8a8; }

/********** Awards slider ***********/
#playerreport-awards {
  position: relative;
  left: 37px;
  width: 918px;
  height: 106px;
  /*overflow: hidden;*/
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none; }
  #playerreport-awards .arrow {
    position: absolute;
    top: 0;
    width: 36px;
    height: 106px;
    z-index: 200;
    background-color: rgba(0, 0, 0, 0.45);
    cursor: pointer;
    /*&:hover {
            background-color: rgba(#fff, 0.8);
            cursor: auto;
        }*/ }
    #playerreport-awards .arrow i {
      display: inline-block;
      width: 12px;
      height: 21px;
      margin-top: 42px;
      background-image: url(../battlereport/slider-arrows.png);
      background-repeat: no-repeat;
      text-indent: -9999px; }
    #playerreport-awards .arrow.sodaSlider-arrow-disabled {
      cursor: auto; }
      #playerreport-awards .arrow.sodaSlider-arrow-disabled i {
        opacity: 0.25; }
    #playerreport-awards .arrow.sodaSlider-arrow-left {
      left: -37px; }
      #playerreport-awards .arrow.sodaSlider-arrow-left i {
        background-position: 0 0; }
    #playerreport-awards .arrow.sodaSlider-arrow-right {
      right: -37px; }
      #playerreport-awards .arrow.sodaSlider-arrow-right i {
        background-position: -12px 0; }

.playerreport-no-awards {
  color: #fff;
  font-size: 12px;
  height: 50px;
  line-height: 50px; }

#sodaSlider-slider-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 918px;
  height: 106px;
  overflow: hidden;
  background-color: rgba(0, 0, 0, 0.45); }

#battlereport-personal-awards-slider {
  position: absolute;
  left: 0;
  height: 106px;
  white-space: nowrap; }
  #battlereport-personal-awards-slider li {
    display: inline-block;
    padding: 0 10px;
    position: relative;
    vertical-align: middle;
    height: 106px;
    min-width: 120px; }
    #battlereport-personal-awards-slider li .dogtags {
      margin-top: 11px; }
    #battlereport-personal-awards-slider li .kititem_unlock, #battlereport-personal-awards-slider li .weapon_unlock, #battlereport-personal-awards-slider li .weaponaccessory_unlock, #battlereport-personal-awards-slider li .vehicleunlock_unlock {
      margin-top: 18px; }
    #battlereport-personal-awards-slider li .battlepacks, #battlereport-personal-awards-slider li .award_star {
      margin-top: 5px; }
    #battlereport-personal-awards-slider li p {
      position: absolute;
      bottom: 18px;
      z-index: 100;
      font-size: 10px;
      width: 120px;
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap; }
      #battlereport-personal-awards-slider li p.weaponname {
        bottom: 6px;
        color: #a8a8a8; }
    #battlereport-personal-awards-slider li .weaponaccessory_unlock {
      margin-left: 16px; }
    #battlereport-personal-awards-slider li .bfh-weaponaccessory_unlock {
      margin-top: 30px; }

.playerreport-awards-ribbons {
  position: relative; }
  .playerreport-awards-ribbons span {
    position: absolute;
    bottom: 36px;
    right: 1px;
    z-index: 110;
    color: #fff;
    font-size: 11px;
    padding: 2px 5px; }

/* Round summary*/
#battlereport-round-summary {
  margin-bottom: 16px; }
  #battlereport-round-summary .team-bg-allied {
    background-color: #148ec1;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6M0IyQzI0NDNDMkQ5MTFFMkIxQTQ5RkI4MkQ5QzY1MTQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6M0IyQzI0NDRDMkQ5MTFFMkIxQTQ5RkI4MkQ5QzY1MTQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDozQjJDMjQ0MUMyRDkxMUUyQjFBNDlGQjgyRDlDNjUxNCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozQjJDMjQ0MkMyRDkxMUUyQjFBNDlGQjgyRDlDNjUxNCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pi3053IAAAAXSURBVHjaYhTpO8jAwMAYevY/kAIIMAAaFQOHzoI9LAAAAABJRU5ErkJggg==);
    box-shadow: 0 0 3px 1px #148ec1 inset; }
  #battlereport-round-summary .team-bg-enemy {
    background-color: #9e3a31;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RTczREY0RDNDMkQ5MTFFMjlDM0NENDIyNzQzOEM2NTkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RTczREY0RDRDMkQ5MTFFMjlDM0NENDIyNzQzOEM2NTkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpFNzNERjREMUMyRDkxMUUyOUMzQ0Q0MjI3NDM4QzY1OSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpFNzNERjREMkMyRDkxMUUyOUMzQ0Q0MjI3NDM4QzY1OSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PjvTtcAAAAAXSURBVHjaYpxnZcjAwMD4MzkMSAEEGAAWGQK+Adw+WAAAAABJRU5ErkJggg==);
    box-shadow: 0 0 3px 1px #9e3a31 inset; }
  #battlereport-round-summary .player-bar {
    background-color: #eea026;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MUY3NkU4QkNDMkRBMTFFMjgyNjRBMjkxRDg5OTcyNDQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MUY3NkU4QkRDMkRBMTFFMjgyNjRBMjkxRDg5OTcyNDQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxRjc2RThCQUMyREExMUUyODI2NEEyOTFEODk5NzI0NCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxRjc2RThCQkMyREExMUUyODI2NEEyOTFEODk5NzI0NCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pqc6tN8AAAAXSURBVHjaYny3QJWBgYGFU8YGSAEEGAAXFwIa9M2IIQAAAABJRU5ErkJggg==);
    box-shadow: 0 0 3px 1px #eea026 inset; }
  #battlereport-round-summary header {
    /* Same as playerreport-box header, should be combined.. */
    height: 23px;
    background-color: rgba(0, 0, 0, 0.6);
    padding: 0 8px;
    text-align: center; }
    #battlereport-round-summary header .legend {
      position: absolute;
      margin-top: 2px;
      text-align: left; }
      #battlereport-round-summary header .legend > div {
        display: inline-block;
        margin-right: 10px; }
        #battlereport-round-summary header .legend > div span {
          font-size: 11px; }
      #battlereport-round-summary header .legend .team-bg-allied, #battlereport-round-summary header .legend .team-bg-enemy, #battlereport-round-summary header .legend .player-bar {
        display: inline-block;
        width: 10px;
        height: 10px;
        top: 1px;
        position: relative; }
    #battlereport-round-summary header h5 {
      font-size: 14px;
      line-height: 24px;
      margin: 0;
      padding: 0; }
  #battlereport-round-summary #round-summary-content > div {
    background-color: rgba(0, 0, 0, 0.45);
    text-align: center; }
    #battlereport-round-summary #round-summary-content > div .round-summary-charts {
      margin-top: 25px;
      margin-bottom: 8px; }
    #battlereport-round-summary #round-summary-content > div div.label {
      text-transform: uppercase;
      font-size: 14px;
      margin-bottom: 8px;
      min-height: 28px; }

.round-summary-chart {
  position: relative;
  height: 120px;
  width: 60px;
  float: left; }
  .round-summary-chart:first-child {
    margin: 0 4px 0 18px; }
  .round-summary-chart .bar {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 0%;
    background-repeat: repeat; }
  .round-summary-chart .round-summary-value {
    display: none;
    position: absolute;
    left: 9%;
    bottom: 0;
    width: 82%;
    margin-bottom: 4px;
    padding: 4px 0;
    font-size: 11px;
    background-color: #000;
    border-radius: 4px; }
    .round-summary-chart .round-summary-value > span {
      font-size: 11px;
      display: block;
      margin-top: 1px;
      color: #f7bc61; }

/* Minicard */
.battlereport-minicard {
  font-size: 14px;
  line-height: 14px; }
  .battlereport-minicard > img {
    margin-right: 8px; }
  .battlereport-minicard .body {
    width: 175px; }
    .battlereport-minicard .body > div {
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap;
      height: 14px; }
      .battlereport-minicard .body > div:last-child {
        margin: 0; }
    .battlereport-minicard .body span {
      font-size: 11px;
      line-height: 12px; }
    .battlereport-minicard .body strong {
      font-size: 11px;
      color: #fff; }
  .battlereport-minicard .winstatus {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    text-transform: uppercase;
    text-align: right;
    color: #a8a8a8;
    margin: 14px 8px 0 0;
    width: 60px;
    overflow: hidden; }
    .battlereport-minicard .winstatus.winstatus-1 {
      color: #94cdf3; }
    .battlereport-minicard .winstatus.winstatus-2 {
      color: #ff9f80; }

.bf4-minicard .comcenter-notifications-moreinfo {
  padding-right: 0; }

/* Compare */
.battlereport-compare {
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 400; }
  .battlereport-compare div.players {
    margin-bottom: 16px; }
    .battlereport-compare div.players:before, .battlereport-compare div.players:after {
      display: table;
      content: "";
      line-height: 0; }
    .battlereport-compare div.players:after {
      clear: both; }
    .battlereport-compare div.players > div {
      width: 50%;
      float: left; }
      .battlereport-compare div.players > div:before, .battlereport-compare div.players > div:after {
        display: table;
        content: "";
        line-height: 0; }
      .battlereport-compare div.players > div:after {
        clear: both; }
      .battlereport-compare div.players > div > i, .battlereport-compare div.players > div > div {
        float: left; }
      .battlereport-compare div.players > div > div {
        padding: 0 8px;
        font-size: 20px;
        line-height: 60px; }
    .battlereport-compare div.players > div:last-child {
      float: right; }
      .battlereport-compare div.players > div:last-child > i, .battlereport-compare div.players > div:last-child > div {
        float: right; }
  .battlereport-compare .compare-row p {
    width: 174px;
    padding: 4px 1px;
    display: inline-block;
    text-transform: uppercase; }
  .battlereport-compare .compare-row p:nth-child(2) {
    text-align: center; }
  .battlereport-compare .compare-row p:nth-child(3) {
    text-align: right; }

#battlereport-commander-scoreboard {
  margin: 8px 0; }
  #battlereport-commander-scoreboard h3 {
    font-size: 19px;
    line-height: 19px; }

.gamereport-comment-delete {
  width: 13px;
  height: 13px;
  cursor: pointer;
  background: url(../base/shared/editposition_sprite.png) no-repeat;
  text-indent: -30px;
  overflow: hidden;
  background-position: -39px 0; }
  .gamereport-comment-delete:hover {
    background-position: -39px 100%; }

.star {
  display: inline-block;
  vertical-align: top;
  width: 20px;
  margin: 0 auto;
  padding: 0; }
  .star:after {
    position: relative;
    z-index: 1;
    content: "★";
    font-size: 22px;
    color: rgba(255, 255, 255, 0.3); }

/* ============================== EOR ============================*/
/* ============================== @@ ============================= */
.battlereport-section-container {
  margin-bottom: 16px; }

.eor-bg {
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  z-index: 0;
  height: 345px;
  opacity: 1; }
  .eor-bg.aside {
    width: 320px;
    height: 163px; }
  .eor-bg.mobile {
    width: 324px;
    height: 163px; }
  .eor-bg.feed, .eor-bg.battlereport-eor.battledash {
    width: 548px;
    height: 163px;
    opacity: 1 !important; }
  .eor-bg.battledash {
    width: 530px;
    height: 163px;
    opacity: 1 !important; }
  .eor-bg.hide {
    display: block !important;
    opacity: 0; }

.battlereport-eor.feed .teams > .team .name.flag-THIEVES, .battlereport-eor.feed .teams > .team .battlereport-eor.battledash, .battlereport-eor.aside .teams > .team .name.flag-THIEVES, .battlereport-eor .teams > .team .name.flag-THIEVES {
  background-image: url(//eaassets-a.akamaihd.net/battlelog/bb/bfh/badges/criminals-0d307da2.png); }

.battlereport-eor.feed .teams > .team .name.flag-SWAT, .battlereport-eor.feed .teams > .team .battlereport-eor.battledash, .battlereport-eor.aside .teams > .team .name.flag-SWAT, .battlereport-eor .teams > .team .name.flag-SWAT {
  background-image: url(//eaassets-a.akamaihd.net/battlelog/bb/bfh/badges/cops-e802ebde.png); }

.battlereport-eor.feed .teams > .team .name.flag-SWAT, .battlereport-eor.feed .teams > .team .battlereport-eor.battledash, .battlereport-eor.feed .teams > .team .name.flag-THIEVES, .battlereport-eor.feed .teams > .team .battlereport-eor.battledash, .battlereport-eor.aside .teams > .team .name.flag-SWAT, .battlereport-eor.aside .teams > .team .name.flag-THIEVES {
  height: 42px;
  line-height: 42px; }

.battlereport-eor {
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 1px;
  height: 345px;
  background-color: #000;
  color: #fff;
  overflow: hidden;
  position: relative; }
  .battlereport-eor .eor-bg {
    position: absolute;
    z-index: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover; }
  .battlereport-eor:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1; }
  .battlereport-eor p {
    padding: 0;
    margin: 0; }
  .battlereport-eor .winning-team {
    position: relative;
    z-index: 2;
    padding-top: 54px;
    text-align: center; }
    .battlereport-eor .winning-team h2 {
      font-size: 36px;
      margin-bottom: 16px;
      line-height: 36px;
      white-space: nowrap; }
  .battlereport-eor .info {
    position: relative;
    z-index: 2;
    text-align: center;
    text-transform: uppercase;
    font-size: 18px;
    margin-bottom: 16px; }
  .battlereport-eor .teams {
    position: relative;
    width: 440px;
    margin: 0 auto;
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 36px;
    line-height: 36px;
    z-index: 2; }
    .battlereport-eor .teams > .team {
      width: 200px;
      display: inline-block;
      margin-bottom: 2px; }
      .battlereport-eor .teams > .team .score-label {
        text-transform: uppercase;
        font-weight: normal;
        font-size: 18px;
        line-height: 22px;
        margin-bottom: 4px; }
        .battlereport-eor .teams > .team .score-label strong {
          font-family: Purista, sans-serif;
          font-style: normal;
          font-weight: 600; }
      .battlereport-eor .teams > .team:nth-child(n+3) {
        margin-top: 8px; }
      .battlereport-eor .teams > .team:nth-child(odd) .score {
        text-align: left; }
      .battlereport-eor .teams > .team:nth-child(odd) .score-label {
        text-align: right; }
      .battlereport-eor .teams > .team:nth-child(odd) .score-label + .score {
        text-align: right; }
      .battlereport-eor .teams > .team:nth-child(odd) [class*=flag-] {
        background-position: center left;
        padding-left: 96px; }
      .battlereport-eor .teams > .team:nth-child(even) {
        float: right; }
        .battlereport-eor .teams > .team:nth-child(even) .score, .battlereport-eor .teams > .team:nth-child(even) .name {
          text-align: right; }
        .battlereport-eor .teams > .team:nth-child(even) .score-label {
          text-align: left; }
        .battlereport-eor .teams > .team:nth-child(even) .score-label + .score {
          text-align: left; }
        .battlereport-eor .teams > .team:nth-child(even) [class*=flag-] {
          background-position: center right;
          padding-right: 96px; }
          .battlereport-eor .teams > .team:nth-child(even) [class*=flag-] + .score {
            float: right; }
      .battlereport-eor .teams > .team [class*=flag-] + .score {
        width: 80px;
        text-align: center; }
      .battlereport-eor .teams > .team .name {
        line-height: 64px; }
        .battlereport-eor .teams > .team .name[class*=flag-] {
          background-repeat: no-repeat; }
        .battlereport-eor .teams > .team .name.flag-US {
          background-image: url(../battlereport/flags/US.png); }
        .battlereport-eor .teams > .team .name.flag-RU {
          background-image: url(../battlereport/flags/RU.png); }
        .battlereport-eor .teams > .team .name.flag-CN {
          background-image: url(../battlereport/flags/CN.png); }
  .battlereport-eor .vs, .battlereport-eor .score-type {
    position: absolute;
    text-align: center;
    width: 100%;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: normal; }
  .battlereport-eor .vs {
    top: 16px; }
  .battlereport-eor .score-type {
    top: 64px;
    line-height: 36px; }
  .battlereport-eor.gamemode-8 .winning-team {
    padding-top: 32px; }
  .battlereport-eor.gamemode-8.full .teams {
    width: 560px; }
    .battlereport-eor.gamemode-8.full .teams > .team .name {
      line-height: 32px; }
    .battlereport-eor.gamemode-8.full .teams > .team:nth-child(n+2) {
      float: right; }
      .battlereport-eor.gamemode-8.full .teams > .team:nth-child(n+2) .score, .battlereport-eor.gamemode-8.full .teams > .team:nth-child(n+2) .name {
        text-align: left; }
    .battlereport-eor.gamemode-8.full .teams > .team:nth-child(n+4) {
      float: left; }
      .battlereport-eor.gamemode-8.full .teams > .team:nth-child(n+4) .score, .battlereport-eor.gamemode-8.full .teams > .team:nth-child(n+4) .name {
        text-align: right; }
    .battlereport-eor.gamemode-8.full .teams > .team:first-child {
      float: left; }
      .battlereport-eor.gamemode-8.full .teams > .team:first-child .score, .battlereport-eor.gamemode-8.full .teams > .team:first-child .name {
        text-align: right; }
  .battlereport-eor.aside, .battlereport-eor.feed, .battlereport-eor.battledash {
    height: 163px; }
    .battlereport-eor.aside .winning-team, .battlereport-eor.feed .winning-team, .battlereport-eor.feed .battlereport-eor.battledash {
      padding-top: 16px; }
    .battlereport-eor.aside .info, .battlereport-eor.feed .info, .battlereport-eor.feed .battlereport-eor.battledash {
      display: none; }
    .battlereport-eor.aside h2, .battlereport-eor.feed h2, .battlereport-eor.feed .battlereport-eor.battledash {
      font-size: 24px;
      line-height: 28px;
      margin-bottom: 2px; }
    .battlereport-eor.aside .teams, .battlereport-eor.feed .teams, .battlereport-eor.feed .battlereport-eor.battledash {
      top: 8px;
      font-size: 24px;
      line-height: 24px; }
      .battlereport-eor.aside .teams > .team .name, .battlereport-eor.feed .teams > .team .name, .battlereport-eor.feed .teams > .team .battlereport-eor.battledash {
        line-height: 24px;
        margin-bottom: 8px; }
        .battlereport-eor.aside .teams > .team .name[class*=flag-], .battlereport-eor.feed .teams > .team .name[class*=flag-], .battlereport-eor.feed .teams > .team .battlereport-eor.battledash {
          background-size: contain; }
        .battlereport-eor.aside .teams > .team .name.flag-US, .battlereport-eor.feed .teams > .team .name.flag-US, .battlereport-eor.feed .teams > .team .battlereport-eor.battledash {
          background-image: url(../battlereport/flags/US.png); }
        .battlereport-eor.aside .teams > .team .name.flag-RU, .battlereport-eor.feed .teams > .team .name.flag-RU, .battlereport-eor.feed .teams > .team .battlereport-eor.battledash {
          background-image: url(../battlereport/flags/RU.png); }
        .battlereport-eor.aside .teams > .team .name.flag-CN, .battlereport-eor.feed .teams > .team .name.flag-CN, .battlereport-eor.feed .teams > .team .battlereport-eor.battledash {
          background-image: url(../battlereport/flags/CN.png); }
      .battlereport-eor.aside .teams > .team:nth-child(n+3), .battlereport-eor.feed .teams > .team:nth-child(n+3), .battlereport-eor.feed .teams > .battlereport-eor.battledash {
        margin-top: 2px; }
      .battlereport-eor.aside .teams > .team:nth-child(odd) [class*=flag-], .battlereport-eor.feed .teams > .team:nth-child(odd) [class*=flag-], .battlereport-eor.feed .teams > .team:nth-child(odd) .battlereport-eor.battledash {
        padding-left: 55px; }
      .battlereport-eor.aside .teams > .team:nth-child(even) [class*=flag-], .battlereport-eor.feed .teams > .team:nth-child(even) [class*=flag-], .battlereport-eor.feed .teams > .team:nth-child(even) .battlereport-eor.battledash {
        padding-right: 55px; }
      .battlereport-eor.aside .teams > .team [class*=flag-] + .score, .battlereport-eor.feed .teams > .team [class*=flag-] + .score, .battlereport-eor.feed .teams > .team [class*=flag-] + .battlereport-eor.battledash {
        width: 70px;
        margin-right: -10px;
        margin-left: -10px; }
      .battlereport-eor.aside .teams > .team .score-label, .battlereport-eor.feed .teams > .team .score-label, .battlereport-eor.feed .teams > .team .battlereport-eor.battledash {
        padding: 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis; }
    .battlereport-eor.aside .vs, .battlereport-eor.aside .score-type, .battlereport-eor.feed .vs, .battlereport-eor.feed .battlereport-eor.battledash, .battlereport-eor.feed .score-type, .battlereport-eor.feed .battlereport-eor.battledash {
      font-size: 14px; }
    .battlereport-eor.aside .vs, .battlereport-eor.feed .vs, .battlereport-eor.feed .battlereport-eor.battledash {
      top: 1px; }
    .battlereport-eor.aside .score-type, .battlereport-eor.feed .score-type, .battlereport-eor.feed .battlereport-eor.battledash {
      top: 33px;
      line-height: 24px; }
    .battlereport-eor.aside.gamemode-8 .winning-team, .battlereport-eor.feed.gamemode-8 .winning-team, .battlereport-eor.feed.gamemode-8 .battlereport-eor.gamemode-8.battledash {
      padding-top: 12px; }
    .battlereport-eor.aside.gamemode-8 h2, .battlereport-eor.feed.gamemode-8 h2, .battlereport-eor.feed.gamemode-8 .battlereport-eor.gamemode-8.battledash {
      margin-bottom: 0; }
    .battlereport-eor.aside.gamemode-8 .teams, .battlereport-eor.feed.gamemode-8 .teams, .battlereport-eor.feed.gamemode-8 .battlereport-eor.gamemode-8.battledash {
      font-size: 20px;
      width: 320px; }
      .battlereport-eor.aside.gamemode-8 .teams > .team .name, .battlereport-eor.feed.gamemode-8 .teams > .team .name, .battlereport-eor.feed.gamemode-8 .teams > .team .battlereport-eor.gamemode-8.battledash {
        margin-bottom: 0; }
      .battlereport-eor.aside.gamemode-8 .teams > .team:nth-child(odd) .name, .battlereport-eor.aside.gamemode-8 .teams > .team:nth-child(odd) .score, .battlereport-eor.feed.gamemode-8 .teams > .team:nth-child(odd) .name, .battlereport-eor.feed.gamemode-8 .teams > .team:nth-child(odd) .battlereport-eor.gamemode-8.battledash, .battlereport-eor.feed.gamemode-8 .teams > .team:nth-child(odd) .score, .battlereport-eor.feed.gamemode-8 .teams > .team:nth-child(odd) .battlereport-eor.gamemode-8.battledash {
        text-align: right; }
      .battlereport-eor.aside.gamemode-8 .teams > .team:nth-child(even) .name, .battlereport-eor.aside.gamemode-8 .teams > .team:nth-child(even) .score, .battlereport-eor.feed.gamemode-8 .teams > .team:nth-child(even) .name, .battlereport-eor.feed.gamemode-8 .teams > .team:nth-child(even) .battlereport-eor.gamemode-8.battledash, .battlereport-eor.feed.gamemode-8 .teams > .team:nth-child(even) .score, .battlereport-eor.feed.gamemode-8 .teams > .team:nth-child(even) .battlereport-eor.gamemode-8.battledash {
        text-align: left; }
    .battlereport-eor.aside.gamemode-8 .score-type, .battlereport-eor.feed.gamemode-8 .score-type, .battlereport-eor.feed.gamemode-8 .battlereport-eor.gamemode-8.battledash {
      top: 22px; }
  .battlereport-eor.aside .teams {
    width: 292px; }
    .battlereport-eor.aside .teams > .team {
      width: 131px; }
      .battlereport-eor.aside .teams > .team .score-label {
        font-size: 12px;
        line-height: 14px; }
        .battlereport-eor.aside .teams > .team .score-label:nth-of-type(2) {
          font-size: 11px;
          line-height: 12px; }
  .battlereport-eor.aside.gamemode-8 {
    width: 320px; }
  .battlereport-eor.feed .teams, .battlereport-eor.feed .battlereport-eor.battledash {
    width: 360px; }
    .battlereport-eor.feed .teams > .team, .battlereport-eor.feed .teams > .battlereport-eor.battledash {
      width: 165px; }
      .battlereport-eor.feed .teams > .team .score-label, .battlereport-eor.feed .teams > .team .battlereport-eor.battledash {
        font-size: 14px;
        line-height: 16px; }
  .battlereport-eor.feed.gamemode-8 .teams, .battlereport-eor.feed.gamemode-8 .battlereport-eor.gamemode-8.battledash {
    width: 495px; }
    .battlereport-eor.feed.gamemode-8 .teams > .team, .battlereport-eor.feed.gamemode-8 .teams > .battlereport-eor.gamemode-8.battledash {
      width: 200px; }

#twitch-overview .twitch-stream-box {
  position: relative;
  float: left;
  width: 243px;
  margin-top: 1px;
  margin-left: 1px;
  padding-bottom: 16px;
  background-color: rgba(7, 7, 7, 0.5); }
  #twitch-overview .twitch-stream-box div {
    color: #a8a8a8;
    font-size: 12px;
    padding: 16px;
    overflow: hidden;
    width: 212px;
    height: 12px;
    white-space: nowrap;
    text-overflow: ellipsis; }
  #twitch-overview .twitch-stream-box img {
    cursor: pointer;
    padding: 0 16px; }
  #twitch-overview .twitch-stream-box.first {
    margin-left: 0;
    width: 244px; }
#twitch-overview table td.twitch-stream-box {
  padding: 0;
  margin-left: 0;
  margin-top: 0;
  width: 248px; }
  #twitch-overview table td.twitch-stream-box img {
    padding-bottom: 16px; }

#twitch-connect {
  background-color: #fff;
  padding: 10px;
  font-size: 11px; }
  #twitch-connect h1 {
    font-size: 35px;
    line-height: 38px;
    font-weight: bold;
    margin-bottom: 10px; }
  #twitch-connect .twitch-connect, #twitch-connect .twitch-connect-ok {
    display: none;
    margin-bottom: 10px; }
  #twitch-connect .twitch-connect-button {
    cursor: pointer; }

#profile-status-container .base-box-push-inner {
  position: relative; }
#profile-status-container.live-streaming .base-box-push-inner {
  padding-right: 90px; }
#profile-status-container.live-streaming #profile-twitch-streaming {
  display: block; }
#profile-status-container #profile-twitch-streaming {
  position: absolute;
  right: 5px;
  top: 5px;
  z-index: 1;
  display: none; }

.mostviewed-twitch-stream .box-content {
  position: relative;
  margin-bottom: 1px; }
  .mostviewed-twitch-stream .box-content img {
    position: absolute;
    top: 10px;
    right: 10px; }
  .mostviewed-twitch-stream .box-content div.twitch-channel-name {
    font-family: Purista;
    font-size: 23px;
    text-transform: uppercase;
    width: 275px;
    height: 46px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    float: left; }
  .mostviewed-twitch-stream .box-content div.twitch-viewers {
    font-size: 11px;
    color: #a8a8a8;
    padding-left: 20px;
    text-transform: none;
    float: left;
    padding-top: 10px; }

.battlefeed .feed-story-heading .feed-info-description.limit {
  width: auto; }
.battlefeed .list .feed-item-interaction-area {
  top: 5px;
  right: 5px; }
.battlefeed .list .item {
  padding: 16px;
  min-height: 60px; }
  .battlefeed .list .item ul {
    color: #a8a8a8; }
  .battlefeed .list .item:first-child {
    padding-top: 16px; }
  .battlefeed .list .item:last-child {
    padding-bottom: 16px; }
  .battlefeed .list .item:not(:hover) .feed-story-area-comment-and-like {
    display: none; }
  .battlefeed .list .item .feed-story {
    position: relative;
    padding-left: 76px; }
    .battlefeed .list .item .feed-story > .avatar {
      left: 0; }
    .battlefeed .list .item .feed-story .feed-story-heading {
      color: lightgrey;
      font-size: 14px; }
    .battlefeed .list .item .feed-story .feed-story-content .feed-story-area {
      line-height: 24px; }
    .battlefeed .list .item .feed-story .feed-story-content .feed-story-small-icon {
      display: none; }
    .battlefeed .list .item .feed-story .feed-story-content .feed-story-body {
      margin-bottom: 8px; }
    .battlefeed .list .item .feed-story .feed-story-content .feed-story-infoarea {
      position: relative;
      line-height: 26px; }
      .battlefeed .list .item .feed-story .feed-story-content .feed-story-infoarea, .battlefeed .list .item .feed-story .feed-story-content .feed-story-infoarea a {
        font-size: 12px;
        color: lightgrey; }
      .battlefeed .list .item .feed-story .feed-story-content .feed-story-infoarea .feed-story-creationDate {
        display: inline-block;
        margin-right: 4px; }
        .battlefeed .list .item .feed-story .feed-story-content .feed-story-infoarea .feed-story-creationDate, .battlefeed .list .item .feed-story .feed-story-content .feed-story-infoarea .feed-story-creationDate a, .battlefeed .list .item .feed-story .feed-story-content .feed-story-infoarea .feed-story-creationDate span {
          color: #a8a8a8; }
      .battlefeed .list .item .feed-story .feed-story-content .feed-story-infoarea .comment-and-like-container {
        position: absolute;
        right: 0;
        bottom: 1px; }
    .battlefeed .list .item .feed-story .feed-story-content .feed-story-infoarea-separator {
      display: none; }
    .battlefeed .list .item .feed-story .feed-story-content .feed-story-area-comment-and-like {
      margin-left: 2px;
      border: 1px solid rgba(255, 255, 255, 0.15);
      /* Hide share button until it works properly */ }
      .battlefeed .list .item .feed-story .feed-story-content .feed-story-area-comment-and-like a {
        font-weight: normal;
        font-size: 12px;
        color: white;
        display: inline-block;
        padding: 0 8px;
        cursor: pointer; }
        .battlefeed .list .item .feed-story .feed-story-content .feed-story-area-comment-and-like a i.icon {
          height: 15px;
          width: 15px;
          display: inline-block;
          background: url(../feed/feed-icons.png);
          position: relative;
          top: 3px;
          margin-right: 4px; }
          @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
            .battlefeed .list .item .feed-story .feed-story-content .feed-story-area-comment-and-like a i.icon {
              background-image: url("../feed/feed-icons@2x.png");
              background-size: 45px 15px; } }
          .battlefeed .list .item .feed-story .feed-story-content .feed-story-area-comment-and-like a i.icon.comment {
            background-position: 30px 0; }
          .battlefeed .list .item .feed-story .feed-story-content .feed-story-area-comment-and-like a i.icon.hooah {
            background-position: 15px 0; }
          .battlefeed .list .item .feed-story .feed-story-content .feed-story-area-comment-and-like a i.icon.share {
            background-position: 0 0; }
        .battlefeed .list .item .feed-story .feed-story-content .feed-story-area-comment-and-like a span.icon {
          background: url(../base/shared/row_icon_chat_light.png) right -26px no-repeat;
          width: 13px;
          height: 13px;
          display: inline-block;
          margin: 0 -4px -2px 4px; }
        .battlefeed .list .item .feed-story .feed-story-content .feed-story-area-comment-and-like a:hover span.icon {
          background-position: right -39px; }
      .battlefeed .list .item .feed-story .feed-story-content .feed-story-area-comment-and-like.feed-story-area-share {
        display: none; }
  .battlefeed .list .item .feed-item-likescontainer, .battlefeed .list .item .feed-story-comments {
    margin-left: 76px;
    width: auto; }
  .battlefeed .list .item .feed-story-likes {
    width: auto; }
    .battlefeed .list .item .feed-story-likes .feed-show-likes {
      cursor: pointer; }
  .battlefeed .list .item .feed-story-comments .feed-comments-show {
    color: lightgrey; }
  .battlefeed .list .item .feed-story-comments .feed-comments-item {
    padding: 0;
    position: relative;
    min-height: 38px; }
    .battlefeed .list .item .feed-story-comments .feed-comments-item .feed-avatar-container .avatar {
      width: 30px;
      height: 30px;
      margin: 8px 0 0 8px; }
    .battlefeed .list .item .feed-story-comments .feed-comments-item .feed-comment-body {
      margin-left: 46px;
      font-size: 12px;
      line-height: 14px;
      padding: 8px 100px 8px 0;
      color: #a8a8a8; }
      .battlefeed .list .item .feed-story-comments .feed-comments-item .feed-comment-body .base-profile-link {
        font-size: 12px;
        font-weight: normal !important; }
    .battlefeed .list .item .feed-story-comments .feed-comments-item .feed-story-creationDate {
      top: 3px;
      position: relative; }
      .battlefeed .list .item .feed-story-comments .feed-comments-item .feed-story-creationDate, .battlefeed .list .item .feed-story-comments .feed-comments-item .feed-story-creationDate span {
        color: #a8a8a8; }
  .battlefeed .list .item .feed-story-comments .feed-comment-form {
    background: 0;
    padding: 0;
    margin-top: 5px; }
    .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap {
      margin-bottom: 5px; }
      .battlefeed .list .item .feed-story-comments .feed-comment-form .feed-comment-form-textarea-wrap textarea {
        margin-top: 0;
        font-size: 12px;
        font-style: normal;
        width: 528px !important;
        max-width: 528px !important; }

#notificationsInbox .line {
  margin-bottom: 1px; }
#notificationsInbox .inbox-notification {
  position: relative;
  color: #a8a8a8;
  font-size: 14px; }
  #notificationsInbox .inbox-notification a.base-profile-link {
    font-weight: bold; }
  #notificationsInbox .inbox-notification .avatar {
    float: left;
    margin-right: 10px; }
  #notificationsInbox .inbox-notification .comcenter-notification-ago {
    margin-top: 5px; }
  #notificationsInbox .inbox-notification .notification-platoon-wrapper a:first-child {
    float: right; }
  #notificationsInbox .inbox-notification .iconbox {
    position: relative;
    float: left; }

.notification-platoon-wrapper {
  text-overflow: ellipsis;
  overflow: hidden; }
  .notification-platoon-wrapper .platoon-badge-item, .notification-platoon-wrapper .club-emblem {
    right: 0;
    top: 50%;
    margin-top: -13px;
    position: absolute; }

#community-bar #notifications .notification-platoon-wrapper {
  max-width: 180px; }

#emblem-edit-layers .layer {
  background: rgba(7, 7, 7, 0.5);
  color: #cacaca;
  margin-bottom: 1px; }
  #emblem-edit-layers .layer:hover {
    background: rgba(7, 7, 7, 0.6); }
    #emblem-edit-layers .layer:hover .actions .action {
      opacity: 1; }
  #emblem-edit-layers .layer.placeholder {
    opacity: 0.1; }
  #emblem-edit-layers .layer .color {
    border: 1px solid #cacaca;
    cursor: pointer; }
  #emblem-edit-layers .layer.selected {
    color: black;
    background-color: white;
    background-image: -webkit-linear-gradient(top, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    background-image: linear-gradient(to bottom, #c9c9c9, rgba(200, 200, 200, 0) 40%);
    box-shadow: 0 0 7px 0 #e0f4f8; }
    #emblem-edit-layers .layer.selected .actions .action.action-remove {
      background-position: 0 0; }
      #emblem-edit-layers .layer.selected .actions .action.action-remove:hover {
        background-position: 0 100%; }
    #emblem-edit-layers .layer.selected .actions .action.action-lock {
      background-position: -78px 0; }
      #emblem-edit-layers .layer.selected .actions .action.action-lock:hover {
        background-position: -78px 100%; }
    #emblem-edit-layers .layer.selected.locked .actions .action.action-lock {
      background-position: -92px 0;
      opacity: 1; }
      #emblem-edit-layers .layer.selected.locked .actions .action.action-lock:hover {
        background-position: -92px 100%; }
  #emblem-edit-layers .layer.locked .actions .action.action-lock {
    background-position: -120px 0;
    opacity: 1; }
    #emblem-edit-layers .layer.locked .actions .action.action-lock:hover {
      background-position: -120px 100%; }
  #emblem-edit-layers .layer .action {
    width: 13px;
    height: 13px;
    background: url(../base/shared/editposition_sprite.png) no-repeat;
    text-indent: -30px;
    overflow: hidden;
    opacity: 0; }
    #emblem-edit-layers .layer .action.action-remove {
      background-position: -39px 0; }
      #emblem-edit-layers .layer .action.action-remove:hover {
        background-position: -39px 100%; }
    #emblem-edit-layers .layer .action.action-lock {
      width: 14px;
      background-position: -106px 0; }
      #emblem-edit-layers .layer .action.action-lock:hover {
        background-position: -106px 100%; }

#shape-select-menu {
  margin-bottom: 8px; }
  #shape-select-menu li a {
    font-size: 12px; }

#emblem-edit-shapes .game-requirement-box, #emblem-edit-shapes .premium-requirement-box {
  width: 280px;
  margin-bottom: 1px;
  padding: 16px 8px;
  background-color: rgba(7, 7, 7, 0.5);
  text-align: center; }
  #emblem-edit-shapes .game-requirement-box p, #emblem-edit-shapes .premium-requirement-box p {
    font-size: 13px;
    padding-bottom: 16px;
    font-weight: 600;
    color: #a8a8a8; }
  #emblem-edit-shapes .game-requirement-box .btn, #emblem-edit-shapes .premium-requirement-box .btn {
    display: inline-block; }
#emblem-edit-shapes .premium-requirement-box {
  background-image: url(../base/bf4/overlay-p.png);
  background-position: top center;
  background-repeat: no-repeat; }
  #emblem-edit-shapes .premium-requirement-box p span {
    color: #E4B744; }
#emblem-edit-shapes .icon-premium-p {
  position: absolute;
  top: auto;
  bottom: 2px;
  left: 2px;
  pointer-events: none; }
  #emblem-edit-shapes .icon-premium-p + .icon-battlepack {
    left: 18px; }
#emblem-edit-shapes .icon-battlepack {
  position: absolute;
  bottom: 2px;
  left: 2px;
  opacity: 0.35;
  pointer-events: none; }
#emblem-edit-shapes .emblem-shapes-wrapper {
  display: none; }
  #emblem-edit-shapes .emblem-shapes-wrapper.active {
    display: block; }
  #emblem-edit-shapes .emblem-shapes-wrapper .emblem-shapes-header {
    width: 296px;
    background-color: rgba(7, 7, 7, 0.8);
    margin: 0 0 1px 0;
    padding: 0 8px;
    line-height: 23px;
    font-size: 16px;
    color: #d5dde5;
    text-transform: uppercase;
    cursor: default;
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
  #emblem-edit-shapes .emblem-shapes-wrapper .missing-ownership-information {
    width: 395px;
    margin: 0 0 1px 0;
    padding: 16px;
    background-color: rgba(7, 7, 7, 0.6);
    font-size: 14px;
    cursor: default;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
  #emblem-edit-shapes .emblem-shapes-wrapper .shape-wrapper {
    background-color: rgba(7, 7, 7, 0.5);
    margin: 0 1px 1px 0; }
    #emblem-edit-shapes .emblem-shapes-wrapper .shape-wrapper:hover {
      background-color: rgba(7, 7, 7, 0.6); }
    #emblem-edit-shapes .emblem-shapes-wrapper .shape-wrapper.locked .shape {
      opacity: 0.35; }

.keyboard-controls {
  margin-top: 1px; }
  .keyboard-controls .toggler {
    overflow: hidden;
    cursor: pointer;
    float: right;
    top: 1px;
    right: 10px;
    color: #aaa; }
    .keyboard-controls .toggler:after {
      float: right;
      text-align: center;
      content: "-";
      padding-right: 3px;
      font-size: 21px; }
    .keyboard-controls .toggler.controlsHidden:after {
      content: "+"; }
    .keyboard-controls .toggler:hover {
      color: #fff; }
  .keyboard-controls .box-content {
    padding-bottom: 0; }
  .keyboard-controls .keyboard-shortcut-info {
    font-size: 12px;
    width: 45%;
    float: left;
    padding-right: 10px;
    margin-bottom: 8px; }
    .keyboard-controls .keyboard-shortcut-info .controls {
      line-height: 23px;
      color: #d5dde5;
      text-transform: uppercase;
      margin: 0;
      font-family: Purista, sans-serif;
      font-style: normal;
      font-weight: 600;
      clear: both;
      font-size: 30px;
      margin-top: 4px; }
      .keyboard-controls .keyboard-shortcut-info .controls .icon {
        height: 30px;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: 0 50%;
        display: inline-block; }
      .keyboard-controls .keyboard-shortcut-info .controls .shift {
        background-image: url('//d34ymitoc1pg7m.cloudfront.net/bf4/emblems/shiftkey-4e5421ea.png');
        width: 45px; }
      .keyboard-controls .keyboard-shortcut-info .controls .plus {
        line-height: 30px;
        vertical-align: top; }
      .keyboard-controls .keyboard-shortcut-info .controls .move {
        background-image: url('//d34ymitoc1pg7m.cloudfront.net/bf4/emblems/movekey-477bd693.png');
        width: 16px; }
      .keyboard-controls .keyboard-shortcut-info .controls .alt {
        background-image: url('//d34ymitoc1pg7m.cloudfront.net/bf4/emblems/altkey-12a5366d.png');
        width: 45px; }
      .keyboard-controls .keyboard-shortcut-info .controls .arrowkeys {
        background-image: url('//d34ymitoc1pg7m.cloudfront.net/bf4/emblems/arrowkeys-177958f7.png');
        width: 43px;
        background-position: 0; }

.emblem-layer-options.disabled {
  opacity: 0.5; }
.emblem-layer-options .layer-actions .action .icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url(../emblem/warsaw/layer-action-icons.png) no-repeat;
  position: relative;
  top: 6px; }
.emblem-layer-options .layer-actions .action.action-duplicate .icon {
  background-position: -72px 0; }
.emblem-layer-options .layer-actions .action.action-flipx .icon {
  background-position: -48px 0; }
.emblem-layer-options .layer-actions .action.action-flipy .icon {
  background-position: -24px 0; }
.emblem-layer-options .layer-actions .action.action-rotate .icon {
  background-position: 0 0; }
.emblem-layer-options .layer-colors {
  background: rgba(7, 7, 7, 0.6); }
  .emblem-layer-options .layer-colors .color:hover {
    box-shadow: 0 0 0 1px #fff; }
.emblem-layer-options .layer-modinputs .modinput {
  background: rgba(7, 7, 7, 0.6);
  border: 1px solid rgba(7, 7, 7, 0.6); }
  .emblem-layer-options .layer-modinputs .modinput.color {
    color: #fff; }
    .emblem-layer-options .layer-modinputs .modinput.color input {
      color: #fff; }
    .emblem-layer-options .layer-modinputs .modinput.color.light {
      color: #000; }
      .emblem-layer-options .layer-modinputs .modinput.color.light input {
        color: #000; }
.emblem-layer-options .layer-modinputs .alpha-slider {
  width: 373px; }
  .emblem-layer-options .layer-modinputs .alpha-slider .slider {
    height: 7px;
    background: rgba(255, 255, 255, 0.5);
    border: 0;
    margin: 14px 10px 0;
    cursor: pointer; }
    .emblem-layer-options .layer-modinputs .alpha-slider .slider .ui-slider-handle {
      width: 6px;
      height: 16px;
      border: 0;
      outline: none;
      margin-left: -3px;
      cursor: pointer; }

.clubemblem {
  line-height: 19px;
  font-size: 14px; }
  .clubemblem .emblem-container {
    text-align: center; }
  .clubemblem .description {
    padding-top: 100px; }

.sharing-options {
  margin-bottom: 8px; }
  .sharing-options .ui-select {
    width: 100%; }

.emblems-list li form {
  display: none;
  position: absolute;
  top: -12px;
  right: 6px; }
.emblems-list li:hover form {
  display: block; }

#emblem-layers-premium {
  background: rgba(7, 7, 7, 0.5); }
  #emblem-layers-premium:hover {
    background: rgba(7, 7, 7, 0.6); }

#emblem-edit-layers .layer.selected .shape {
  -webkit-filter: invert(100%);
  -moz-filter: invert(100%);
  -ms-filter: invert(100%);
  -o-filter: invert(100%);
  filter: invert(100%); }

/* TODO: SASSify code */
/* friendrecommendation component CSS resource */
.axis path, .axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges; }

.line {
  fill: none;
  stroke-width: 1.5px; }

.queued {
  stroke: steelblue; }

.completed {
  stroke: maroon; }

#friendrecommendation-stats-vals {
  /*margin-left: 40px;*/
  margin: 0 auto; }

#friendrecommendation-stats-vals thead {
  font-weight: bold; }

#friendrecommendation-stats-vals td {
  text-align: right;
  padding-right: 14px;
  padding-top: 8px; }

/* recommendedfriends component CSS resource */
#friendrecommendation-main-container {
  display: none;
  margin-top: 15px;
  margin-bottom: 16px; }
  #friendrecommendation-main-container .box-content {
    padding-bottom: 4px; }
  #friendrecommendation-main-container .facebook-friendfinder {
    background: url(../facebook/icon-fb-m.png) no-repeat;
    margin-top: 1px;
    padding: 0 15px;
    padding-left: 63px;
    background-position: 16px center;
    font-size: 12px;
    text-align: left; }

#friendrecommendation-main-container a.avatar {
  margin-right: 10px; }

#friendrecommendation-main-container button.add-recommended-friend {
  float: right;
  margin-top: 4px;
  margin-right: 10px; }

#friendrecommendation-main-container .avatar {
  float: left; }

#friendrecommendation-main-container .textinfo {
  float: left;
  margin-bottom: 10px;
  color: #a8a8a8; }

#friendrecommendation-main-container .textinfo a {
  font-weight: bold; }

#friendrecommendation-main-container .remove-recommended-friend {
  float: right;
  margin-top: 9px; }
  #friendrecommendation-main-container .remove-recommended-friend:hover {
    cursor: pointer; }

#friendrecommendation-main-container .devblog-item {
  height: 50px; }
  #friendrecommendation-main-container .devblog-item .textinfo {
    font-size: 12px; }

@-webkit-keyframes battlescreen-capture {
  from {
    opacity: 1; }

  to {
    opacity: 0; } }

@-moz-keyframes battlescreen-capture {
  from {
    opacity: 1; }

  to {
    opacity: 0; } }

-o-keyframes battlescreen-capture from {
  opacity: 1; }
-o-keyframes battlescreen-capture to {
  opacity: 0; }

@-ms-keyframes battlescreen-capture {
  from {
    opacity: 1; }

  to {
    opacity: 0; } }

@keyframes battlescreen-capture {
  from {
    opacity: 1; }

  to {
    opacity: 0; } }

body.standalone-battlescreen {
  -ms-touch-action: none; }
  body.standalone-battlescreen .uioverlay {
    top: 0; }
    body.standalone-battlescreen .uioverlay .uioverlaycontent {
      top: 0;
      bottom: 100px; }
  body.standalone-battlescreen #battlescreen {
    margin-top: 0; }

/* Tablet specific css */
.is-touch .uioverlay {
  top: 0; }
  .is-touch .uioverlay .uioverlaycontent {
    top: 0;
    bottom: 100px; }
.is-touch #battlescreen {
  margin-top: 0; }

#dim_layer {
  display: none !important; }

#battlescreen {
  margin-top: -16px; }

#battlescreen-state {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 999;
  width: 500px;
  height: 140px;
  margin-left: -250px;
  margin-top: -70px;
  text-align: center; }
  @media only screen and (max-width: 800px) {
    #battlescreen-state {
      width: auto;
      margin-left: 0;
      left: 16px;
      right: 16px;
      min-width: 320px; } }
  #battlescreen-state h4 {
    text-transform: uppercase; }
  #battlescreen-state .troubleshoot {
    font-size: 13px;
    line-height: 16px;
    display: block;
    width: 350px;
    margin-left: auto;
    margin-right: auto; }
    #battlescreen-state .troubleshoot a {
      text-decoration: underline; }
  #battlescreen-state a {
    text-decoration: none; }
    #battlescreen-state a .browser-icon {
      margin-top: 15px;
      margin-left: 5px;
      margin-right: 5px;
      display: inline-block;
      background: url(//d34ymitoc1pg7m.cloudfront.net/common/icons/browser-icons-a7e3e12a.png) no-repeat;
      background-size: 195px 60px;
      width: 65px;
      height: 66px; }
      #battlescreen-state a .browser-icon.chrome {
        background-position: 0 0; }
      #battlescreen-state a .browser-icon.firefox {
        background-position: -65px 0; }
      #battlescreen-state a .browser-icon.ie {
        background-position: -130px 0; }

.battlescreen #battlescreen-state {
  display: block; }

.battlescreen-state-loading {
  margin: 10px; }

.battlescreen-state-errorheader {
  background: url(../gamemanager/error-triangle.png) left top no-repeat;
  width: 58px;
  height: 53px;
  margin: 10px auto;
  padding-top: 3px;
  text-indent: -9001px; }

.uioverlay {
  position: absolute;
  top: -16px;
  left: 0;
  bottom: 0;
  right: 0;
  margin: 0;
  font-family: Purista, sans-serif;
  font-weight: 600;
  background-image: url(../battlescreen/img/battlescreen-overlay.png);
  background-size: 100% 100%; }
  .uioverlay .uioverlaycontent {
    position: absolute;
    left: 5px;
    right: 5px;
    top: 0;
    bottom: 70px;
    margin: 0; }
  .uioverlay .uioverlaysectionleft, .uioverlay .uioverlaysectionright {
    position: absolute;
    margin: 0; }
  @media all and (orientation: landscape) {
    .uioverlay .uioverlaysectionleft {
      top: 0;
      left: 0;
      height: 100%; }
    .uioverlay .uioverlaysectionright {
      top: 0;
      right: 0;
      height: 100%; }
    .uioverlay .uioverlaysubsectionbottom {
      position: absolute;
      left: 0;
      bottom: 0;
      margin: 0;
      min-width: 100%; } }
  @media all and (orientation: portrait) {
    .uioverlay .uioverlaysectionleft {
      top: 0;
      left: 0;
      width: 100%; }
    .uioverlay .uioverlaysectionright {
      left: 0;
      bottom: 0;
      width: 100%; }
    .uioverlay .uioverlaysubsectionbottom {
      position: absolute;
      right: 0;
      top: 0;
      margin: 0;
      min-height: 100%; }
    .uioverlay .uioverlaygroup {
      display: inline-block;
      vertical-align: text-top; } }
  .uioverlay .ticketcounter {
    position: relative;
    min-width: 200px;
    padding: 5px; }
  .uioverlay .uioverlayspacer {
    width: 0;
    height: 20px; }
  .uioverlay .uioverlaybutton, .uioverlay .uioverlaysignalfeed, .uioverlay .uioverlayheader, .uioverlay .uioverlaybuttongroup, .uioverlay .squadlist, .uioverlay .ticketcounter {
    overflow: hidden;
    margin: 5px; }
  .uioverlay .uioverlaybutton, .uioverlay .uioverlaysignalfeed, .uioverlay .uioverlayheader, .uioverlay .uioverlaybuttongroupheader, .uioverlay .uioverlaybuttongrouphalfsize, .uioverlay .ticketcounter {
    color: #FCFEFE;
    text-align: center; }
  .uioverlay .uioverlaybutton, .uioverlay .uioverlaysignalfeed, .uioverlay .uioverlaybuttongroupsplitter, .uioverlay .uioverlaybuttongrouphalfsize {
    border: 1px solid #FCFEFE; }
  .uioverlay .uioverlaybutton, .uioverlay .uioverlaysignalfeed, .uioverlay .uioverlaybuttongrouphalfsize {
    cursor: pointer; }
  .uioverlay .uioverlaybutton, .uioverlay .uioverlayheader {
    padding: 5px 20px; }
  .uioverlay .uioverlaysignalfeed {
    width: 160px;
    height: 120px; }
  .uioverlay .uioverlaybuttongroupsplitter {
    white-space: nowrap;
    overflow: hidden; }
  .uioverlay .uioverlaybuttongroupsplitter:last-of-type {
    border-top: none; }
  .uioverlay .uioverlaybuttongrouphalfsize {
    border-right: none;
    border-top: none;
    border-bottom: none;
    width: 50%;
    display: inline-block; }
  .uioverlay .uioverlaybuttongrouphalfsize:first-child {
    border-left: none; }
  .uioverlay .disabledbutton {
    color: rgba(252, 254, 254, 0.25);
    cursor: default; }
  .uioverlay .disabledbutton img {
    opacity: 0.25; }
  .uioverlay .squadlist {
    position: absolute;
    bottom: 0;
    line-height: 26px;
    color: #cdedaf;
    text-shadow: 0 0 0.2em #74cb1f;
    width: 300px;
    overflow: hidden; }
  .uioverlay .squadavatar, .uioverlay .squadkit, .uioverlay .squadname, .uioverlay .squadleader, .uioverlay .squaddetails {
    padding: 0 5px;
    float: left;
    height: 28px; }
  .uioverlay .squadkit {
    padding-right: 0; }
    .uioverlay .squadkit img {
      margin-top: 3px; }
  .uioverlay .squadleader {
    padding-left: 0; }
    .uioverlay .squadleader img {
      margin-top: 6px; }
  .uioverlay .squaddetails {
    width: 40px;
    text-align: right; }
  .uioverlay .uioverlayscroll {
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    max-height: 100%; }
  .uioverlay .friendlyprogress, .uioverlay .friendlyteamname, .uioverlay .friendlyscore {
    color: #95dafc;
    text-shadow: 0 0 0.2em #00abff, 0 0 0.2em rgba(0, 171, 255, 0.5); }
  .uioverlay .enemyprogress, .uioverlay .enemyteamname, .uioverlay .enemyscore {
    color: #f6ae8b;
    text-shadow: 0 0 0.2em #ff5a00, 0 0 0.2em rgba(255, 90, 0, 0.5); }
  .uioverlay #roundtime {
    position: absolute;
    width: 100%;
    margin-left: -5px;
    text-align: center;
    color: #a8a8a8;
    font-size: 16px;
    bottom: 2px;
    font-weight: 400; }
  .uioverlay .changingcapturepoint {
    -webkit-animation-name: battlescreen-capture;
    -moz-animation-name: battlescreen-capture;
    -ms-animation-name: battlescreen-capture;
    -o-animation-name: battlescreen-capture;
    animation-name: battlescreen-capture;
    -webkit-animation-duration: 0.5s;
    -moz-animation-duration: 0.5s;
    -ms-animation-duration: 0.5s;
    -o-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -ms-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    animation-timing-function: linear; }
  .uioverlay #request_order, .uioverlay #request_asset_group, .uioverlay #squad_list_spacer, .uioverlay #gadgetscroller {
    display: none; }
  .uioverlay .friendlyteamname, .uioverlay .friendlyprogress {
    float: left;
    text-align: left; }
  .uioverlay .enemyteamname, .uioverlay .enemyprogress {
    float: right;
    text-align: right; }
  .uioverlay .friendlyteamname, .uioverlay .enemyteamname {
    width: 30px;
    font-size: 16px;
    font-weight: 400; }
  .uioverlay .friendlyprogress, .uioverlay .enemyprogress {
    width: 30%;
    margin-top: 4px; }
  .uioverlay .friendlyscore, .uioverlay .enemyscore {
    font-size: 19px; }
  .uioverlay .friendlyscore {
    float: left; }
  .uioverlay .enemyscore {
    float: right; }
  .uioverlay .icons {
    width: 38px;
    height: 38px;
    background: url(../battlescreen/img/objective-icons.png) no-repeat;
    display: inline-block;
    position: relative;
    margin: 0 -4px; }
    .uioverlay .icons.friendly {
      background-position: -0px 0; }
    .uioverlay .icons.enemy {
      background-position: -38px 0; }
    .uioverlay .icons.neutral {
      background-position: -76px 0; }
  .uioverlay .icons.friendly.bomb {
    background-position: -0px -190px; }
  .uioverlay .icons.enemy.bomb {
    background-position: -38px -190px; }
  .uioverlay .bases {
    position: absolute;
    top: 5px;
    left: 5px;
    width: 21px;
    height: 21px;
    background: url(../battlescreen/img/objective-bases.png) no-repeat; }
    .uioverlay .bases.a {
      background-position: -0px 0; }
    .uioverlay .bases.b {
      background-position: -29px 0; }
    .uioverlay .bases.c {
      background-position: -58px 0; }
    .uioverlay .bases.d {
      background-position: -87px 0; }
    .uioverlay .bases.e {
      background-position: -116px 0; }
    .uioverlay .bases.f {
      background-position: -145px 0; }
    .uioverlay .bases.g {
      background-position: -174px 0; }
    .uioverlay .bases.h {
      background-position: -203px 0; }
  .uioverlay[data-gamemode="524288"] #ticket_counter {
    width: 200px; }
  .uioverlay[data-gamemode="524288"] #ticketcounter_capture_points {
    position: relative; }
  .uioverlay[data-gamemode="524288"] .icons.friendly:not(.flag) {
    background-position: -0px -76px;
    margin-left: -4px;
    float: left; }
  .uioverlay[data-gamemode="524288"] .icons.enemy:not(.flag) {
    background-position: -38px -76px;
    margin-right: -4px;
    float: right; }
  .uioverlay[data-gamemode="524288"] .icons.friendly.flagtaken {
    background-position: -0px -114px; }
  .uioverlay[data-gamemode="524288"] .icons.enemy.flagtaken {
    background-position: -38px -114px; }
  .uioverlay[data-gamemode="524288"] .icons.friendly.flag {
    position: absolute;
    left: 0;
    background-position: -0px -152px; }
  .uioverlay[data-gamemode="524288"] .icons.enemy.flag {
    position: absolute;
    right: 0;
    background-position: -38px -152px; }
  .uioverlay[data-gamemode="524288"] #roundtime {
    position: absolute;
    width: 200px;
    bottom: 3px; }
  .uioverlay[data-gamemode="32"] #ticketcounter_capture_points, .uioverlay[data-gamemode="32"] #ticket_counter, .uioverlay[data-gamemode="4096"] #ticketcounter_capture_points, .uioverlay[data-gamemode="4096"] #ticket_counter, .uioverlay[data-gamemode="1048576"] #ticketcounter_capture_points, .uioverlay[data-gamemode="1048576"] #ticket_counter, .uioverlay[data-gamemode="268435456"] #ticketcounter_capture_points, .uioverlay[data-gamemode="268435456"] #ticket_counter, .uioverlay[data-gamemode="1099511627776"] #ticketcounter_capture_points, .uioverlay[data-gamemode="1099511627776"] #ticket_counter {
    display: none; }
  .uioverlay[data-gamemode="34359738368"] .icons {
    margin-right: 0px; }
    .uioverlay[data-gamemode="34359738368"] .icons:last-child {
      margin-right: -6px; }
    .uioverlay[data-gamemode="34359738368"] .icons:first-child {
      margin-left: -6px; }
  .uioverlay[data-gamemode="34359738368"] .icons.friendly + .icons.friendly:before, .uioverlay[data-gamemode="34359738368"] .icons.enemy + .icons.enemy:before {
    top: 15px;
    left: -12px;
    position: absolute;
    content: "";
    background: url(../battlescreen/img/chainlink-icons.png) no-repeat;
    overflow: hidden;
    width: 21px;
    height: 10px; }
  .uioverlay[data-gamemode="34359738368"] .icons.friendly {
    background-position: -0px -38px; }
  .uioverlay[data-gamemode="34359738368"] .icons.enemy {
    background-position: -38px -38px; }
  .uioverlay[data-gamemode="34359738368"] .icons.neutral {
    background-position: -76px -38px; }
  .uioverlay[data-gamemode="34359738368"] .icons.enemy + .icons.enemy:before {
    background-position: -21px 0px; }
  .uioverlay[data-gamemode="34359738368"] #chainlink {
    position: relative;
    display: block;
    font-size: 19px; }
    .uioverlay[data-gamemode="34359738368"] #chainlink .friendly:after, .uioverlay[data-gamemode="34359738368"] #chainlink .enemy:after {
      top: 6px;
      position: absolute;
      content: "";
      background: url(../battlescreen/img/chainlink-icons.png) no-repeat;
      overflow: hidden;
      width: 21px;
      height: 10px; }
    .uioverlay[data-gamemode="34359738368"] #chainlink .friendly {
      float: left;
      color: #95dafc;
      text-shadow: 0 0 0.2em #00abff, 0 0 0.2em rgba(0, 171, 255, 0.5); }
      .uioverlay[data-gamemode="34359738368"] #chainlink .friendly:after {
        left: 15px; }
    .uioverlay[data-gamemode="34359738368"] #chainlink .enemy {
      float: right;
      color: #f6ae8b;
      text-shadow: 0 0 0.2em #ff5a00, 0 0 0.2em rgba(255, 90, 0, 0.5); }
      .uioverlay[data-gamemode="34359738368"] #chainlink .enemy:after {
        right: 15px;
        background-position: -21px 0px; }

body.battlescreen.fullscreen #base-header {
  display: none; }
body.battlescreen.fullscreen #comcenter_container {
  display: none; }
body.battlescreen.fullscreen #unified-game-manager {
  display: none; }
body.battlescreen.fullscreen #content {
  position: absolute;
  top: 0; }
body.battlescreen.fullscreen #battlescreen {
  margin-top: 0; }
body.battlescreen.fullscreen .uioverlay {
  top: 0; }
  body.battlescreen.fullscreen .uioverlay .uioverlaycontent {
    top: 16px;
    bottom: 16px; }
body.battlescreen.fullscreen #toggle-fullscreen {
  background-image: url(../battlescreen/img/icon-fullscreen-off.png); }
body.battlescreen #toggle-fullscreen {
  position: absolute;
  bottom: 0;
  right: 16px;
  background-image: url(../battlescreen/img/icon-fullscreen-on.png);
  width: 33px;
  height: 29px;
  cursor: pointer; }
body.battlescreen #battlescreen {
  background-color: #2e3a42;
  -webkit-transition: opacity 0.5s 0.3s ease-out;
  -moz-transition: opacity 0.5s 0.3s ease-out;
  transition: opacity 0.5s 0.3s ease-out; }
body.battlescreen #footer-wrapper {
  display: none; }
body.battlescreen #content {
  height: 100%;
  position: relative; }
body.battlescreen .smartglass-icon {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 29px;
  height: 28px;
  background-image: url("../battlescreen/img/icon-smartglass.png"); }
  @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
    body.battlescreen .smartglass-icon {
      background-image: url("../battlescreen/img/icon-smartglass@2x.png");
      background-size: 29px 28px; } }

.battlescreen-hidden {
  opacity: 0; }

.battlescreen-transparent {
  opacity: 0.5; }

.battlescreen-visible {
  opacity: 1; }

/*
@include keyframes(header-glow) {
    0% {
        opacity: .8;
    }

    60% {
        opacity: 1;
    }
}
body.has-premium {

    #base-header {

        .glow {
            pointer-events: none;
            content: "";
            position: absolute;
            z-index: 1000;
            margin-top: -1px;
            @include background(radial-gradient(center, ellipse cover, rgba(255, 239, 123, 0.45) 0%, rgba(255, 184, 0, 0.25) 10%, transparent 60%) center center);
            background-repeat: no-repeat;
            right: -500px;
            left: -500px;
            @include animation(header-glow 2s infinite alternate);
        }

        #community-bar .glow {
            background-position: center 15px;
            height: 26px;
            bottom: -1px;
        }

        .game-bar .glow {
            background-position: center -39px;
            height: 76px;
        }
    }
}
*/
.premium-glow {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
  pointer-events: none;
  overflow: hidden; }
  .premium-glow.glow-outside {
    overflow: visible; }
  .premium-glow:after, .premium-glow:before {
    position: absolute;
    display: block;
    width: 100%;
    content: "";
    background: -webkit-radial-gradient(center,  ellipse cover, rgba(255, 239, 123, 0.45) 0%, rgba(255, 184, 0, 0.25) 10%, transparent 70%) center center;
    background: radial-gradient( ellipse  at center, rgba(255, 239, 123, 0.45) 0%, rgba(255, 184, 0, 0.25) 10%, transparent 70%) center center;
    background-repeat: no-repeat; }
  .premium-glow:before {
    height: 8px; }
  .premium-glow:after {
    height: 76px; }
  .premium-glow:before, .premium-glow.glow-above:before {
    background-position: center 3px;
    top: -7px;
    bottom: auto; }
  .premium-glow:after, .premium-glow.glow-above:after {
    background-position: center -37px;
    top: 0;
    bottom: auto; }
  .premium-glow.glow-below:before {
    background-position: center -3px;
    bottom: -7px;
    top: auto; }
  .premium-glow.glow-below:after {
    background-position: center 37px;
    bottom: 0;
    top: auto; }
  .premium-glow.glow-above-left:before, .premium-glow.glow-above-left:after {
    left: -50%; }

.upcoming-premium {
  position: relative; }
  .upcoming-premium .overlay {
    background: url(../premium/upcoming-overlay.png);
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 992px;
    z-index: 2;
    height: 239px; }

#premium-calendar-upcoming-area {
  margin-top: 0; }

.premium-index-section.premium-calendar-section {
  margin-top: 16px; }

.premium-featured-item-toggle {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }
  .premium-featured-item-toggle .featured-item-image {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1; }
    .premium-featured-item-toggle .featured-item-image img {
      width: 100%;
      height: 100%; }
  .premium-featured-item-toggle .featured-item-info {
    position: absolute;
    line-height: 21px;
    z-index: 2;
    color: #FFF;
    font-family: Arial;
    font-weight: 600;
    bottom: 0px;
    left: 16px;
    padding-bottom: 12px; }
    .premium-featured-item-toggle .featured-item-info .title {
      font-size: 30px;
      text-transform: uppercase;
      font-weight: 600;
      font-family: purista; }
    .premium-featured-item-toggle .featured-item-info .description {
      margin-top: 6px;
      width: 930px;
      font-size: 16px;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
      font-weight: normal; }
      .premium-featured-item-toggle .featured-item-info .description span {
        color: #a8a8a8;
        text-transform: uppercase;
        font-size: 12px;
        font-family: Arial, sans-serif; }

.premium-calendar-type10 {
  height: 144px; }

.premium-calendar-cell {
  height: 67px; }

.premium-calendar-body .premium-calendar-cell-inner {
  background: none; }

#premium-content .premium-calendar-cell-inner img {
  top: 0; }

.premium-requirement-box {
  background-image: url(../base/bf4/overlay-p.png);
  background-position: top center;
  background-repeat: no-repeat;
  text-align: center;
  padding: 16px 8px; }
  .premium-requirement-box p {
    font-size: 13px;
    padding: 8px 0 16px 0;
    color: #a8a8a8;
    font-weight: 600; }
    .premium-requirement-box p span {
      color: #FFF; }
  .premium-requirement-box .btn {
    width: auto; }

.premium-calendar.new-premium-calendar {
  margin-bottom: 0; }

.new-premium-calendar-month {
  float: left;
  margin-right: 1px;
  width: 81px;
  position: relative; }
  .new-premium-calendar-month.selected {
    background: none;
    box-shadow: none; }
  .new-premium-calendar-month .premium-calendar-cell {
    width: 100%;
    position: relative;
    margin-top: 1px; }
    .new-premium-calendar-month .premium-calendar-cell.valued img {
      opacity: 0.5; }
    .new-premium-calendar-month .premium-calendar-cell.valued.released img {
      opacity: 1; }
    .new-premium-calendar-month .premium-calendar-cell.nocontent {
      cursor: inherit; }
    .new-premium-calendar-month .premium-calendar-cell.month {
      cursor: inherit;
      background-color: transparent; }
    .new-premium-calendar-month .premium-calendar-cell.new-premium-calendar-expansion {
      height: 144px; }
  .new-premium-calendar-month:last-child {
    margin-right: 0;
    width: 79px; }

.rentedservers-wrapper {
  margin-top: 4px;
  color: #000; }
  .rentedservers-wrapper .rentedservers-server {
    margin-top: 16px; }
  .rentedservers-wrapper .rsppad {
    padding-top: 16px; }
  .rentedservers-wrapper .rentedservers-server-inner-wrapper {
    width: 956px;
    float: left; }
  .rentedservers-wrapper .rentedservers-server-title-extra {
    padding-left: 6px;
    font-size: 12px;
    color: #898989;
    font-weight: normal; }
  .rentedservers-wrapper .rentedservers-server-actions-header {
    margin: 8px 0 8px;
    font-size: 12px;
    font-weight: bold;
    font-family: Tahoma, sans-serif;
    color: #d5dde5; }
  .rentedservers-wrapper .rentedservers-server-actions-description.light {
    color: #d5dde5; }
  .rentedservers-wrapper .rentedservers-server-actions-upload-rules {
    padding-top: 4px;
    line-height: 22px; }
  .rentedservers-wrapper .rentedservers-server-actions-upload-rules li {
    list-style: disc inside;
    padding-left: 2px; }
  .rentedservers-wrapper .rentedservers-server-banner {
    margin: 10px 0 15px;
    width: 512px;
    height: 128px;
    float: left; }
  .rentedservers-wrapper .rentedservers-server-banner.missing {
    margin-top: 10px;
    width: 510px;
    height: 126px;
    color: #d5dde5;
    border: 1px dashed #ccc;
    background: rgba(0, 0, 0, 0.2);
    text-align: center;
    line-height: 126px;
    font-size: 12px; }
  .rentedservers-wrapper .rentedservers-server-banner.missing.exists {
    border-style: solid; }
  .rentedservers-wrapper .rentedservers-server-actions-wrapper {
    float: left;
    margin-left: 16px;
    width: 428px; }
  .rentedservers-wrapper .rentedservers-server-banner-action-delete-form, .rentedservers-wrapper .rentedservers-server-banner-action-upload-form {
    margin: 4px 0 14px;
    float: left;
    color: #ccc; }
  .rentedservers-wrapper .rentedservers-server-banner-action-delete-form {
    float: left; }
  .rentedservers-wrapper .rentedservers-server-banner-action-delete-submit {
    margin-right: 10px; }
  .rentedservers-wrapper .rentedservers-server-banner-action-upload-choose-input {
    margin-bottom: 8px; }
  .rentedservers-wrapper .rentedservers-server-banner-action-delete-choose {
    margin-right: 10px; }
  .rentedservers-wrapper .rentedservers-server-banner-action-upload-info, .rentedservers-wrapper .rentedservers-server-banner-action-upload-info-filename {
    color: #898989;
    font-size: 12px;
    line-height: 16px;
    padding-bottom: 14px; }
  .rentedservers-wrapper .rentedservers-server-banner-action-upload-info-filename {
    width: 428px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: none;
    margin-top: 4px;
    padding: 8px 0 0;
    border-top: 1px dotted #ededed; }
  .rentedservers-wrapper .rentedservers-server-banner-action-upload-info-filename span {
    color: #353535; }

#rentedservers-noservers {
  text-align: center;
  clear: both; }
  #rentedservers-noservers .box-content {
    height: 150px;
    padding-top: 75px; }

#rentedservers-noservers p {
  margin: 20px;
  background: transparent;
  font-size: 16px;
  color: #8a8a8a; }

#rentedservers-noservers h1 {
  font-size: 26px; }

.rentedservers-platoons-list {
  margin-top: 16px; }
  .rentedservers-platoons-list .switch {
    margin-top: 20px;
    margin-right: 20px; }

.xp0-takover #base-background {
  background: #230d0d url(//d34ymitoc1pg7m.cloudfront.net/bf4/backgrounds/bg-takeover-xp0-9f2c4854.jpg) 50% 0 no-repeat; }

.xp1-takover #base-background {
  background: #230d0d url(//d34ymitoc1pg7m.cloudfront.net/bf4/backgrounds/bg-takeover-xp1-a38ae54e.jpg) 50% 0 no-repeat; }

.xp2-takover #base-background {
  background: #230d0d url(//d34ymitoc1pg7m.cloudfront.net/bf4/backgrounds/bg-takeover-xp2-06621b3b.jpg) 50% 0 no-repeat; }

.xp3-takover #base-background {
  background: #230d0d url(//d34ymitoc1pg7m.cloudfront.net/bf4/backgrounds/bg-takeover-xp3-15660d73.jpg) 50% 0 no-repeat; }

#xpack-index-section {
  clear: both;
  margin-top: 16px;
  position: relative;
  z-index: 1; }

.xpack-top {
  margin-top: 30px;
  width: 960px;
  padding: 0 16px;
  height: 177px;
  position: relative; }
  .xpack-top .close-movie-button {
    display: none;
    position: absolute;
    right: 8px;
    bottom: 8px;
    width: 16px;
    height: 16px;
    background: url(../unifiedgamemanager/close@2x.png);
    background-size: 100%;
    cursor: pointer;
    z-index: 5; }
  .xpack-top.xp0-logo {
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf4/takeover/logo-takeover-xp0-03f6d193.png) center center no-repeat; }
  .xpack-top.xp1-logo {
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf4/takeover/logo-takeover-xp1-b99c4cda.png) center center no-repeat; }
  .xpack-top.xp2-logo {
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf4/takeover/logo-takeover-xp2-340e84e7.png) center center no-repeat; }
  .xpack-top.xp4-logo {
    background: url(//d34ymitoc1pg7m.cloudfront.net/bf4/takeover/logo-takeover-xp4-efcffecd.png) center center no-repeat; }

.xpack-offer #xpack-box-footer {
  margin-top: 0;
  padding-top: 8px; }
.xpack-offer .box-content {
  background-color: rgba(7, 7, 7, 0.8);
  padding: 12px 16px; }
  .xpack-offer .box-content.video-container {
    padding: 0;
    position: relative;
    z-index: 2; }
  .xpack-offer .box-content .info-text-content {
    float: left;
    margin-right: 12px;
    width: 600px; }
    .xpack-offer .box-content .info-text-content h2 {
      margin-bottom: 16px; }
    .xpack-offer .box-content .info-text-content h3 {
      font-size: 16px;
      line-height: 18px; }
    .xpack-offer .box-content .info-text-content ul li {
      margin-left: 20px;
      list-style-type: square;
      font-weight: 600;
      text-transform: uppercase;
      font-family: Purista;
      font-size: 17px;
      line-height: 26px; }
    .xpack-offer .box-content .info-text-content p {
      margin-top: 16px;
      line-height: 18px;
      font-family: Arial;
      font-size: 12px;
      color: #a8a8a8; }
  .xpack-offer .box-content .movie-friends-content {
    float: right;
    width: 322px; }
    .xpack-offer .box-content .movie-friends-content .movie-image {
      position: relative; }
      .xpack-offer .box-content .movie-friends-content .movie-image img {
        border: 1px solid #fff; }
      .xpack-offer .box-content .movie-friends-content .movie-image .play-button {
        width: 90px;
        height: 90px;
        position: absolute;
        left: 115px;
        z-index: 1;
        top: 45px;
        cursor: pointer;
        background-image: url(../serverbrowserwarsaw/playbutton-circle.png);
        opacity: 0.8;
        background-repeat: no-repeat; }
        .xpack-offer .box-content .movie-friends-content .movie-image .play-button:hover {
          opacity: 0.7; }
    .xpack-offer .box-content .movie-friends-content .friends-container {
      padding-top: 8px; }
      .xpack-offer .box-content .movie-friends-content .friends-container p {
        margin: 0;
        font-family: Arial;
        font-size: 12px;
        color: #d5dde5; }

.viewcontent-outer {
  border: 1px solid #f01818;
  padding: 5px; }

.viewcontent-forum-outer {
  border-bottom: 1px solid #000;
  padding: 5px;
  position: relative; }

.viewcontent-forum-post {
  float: right;
  width: 110px;
  margin-right: 10px;
  font-size: 11px;
  font-family: arial; }

.viewcontent-outmost {
  min-height: 50px;
  width: 850px;
  background: rgba(0, 0, 0, 0.5); }

.viewcontent-outmost.viewcontent-feed {
  width: 450px; }

.viewcontent-outmost.marked {
  border: 1px solid #f00; }

.viewcontent-state {
  float: right;
  width: 110px;
  text-align: right;
  margin-top: 5px;
  margin-right: 5px;
  font-size: 11px;
  font-family: Arial; }

.viewcontent-reportstate {
  float: left;
  width: 110px;
  text-align: right;
  margin-top: 5px;
  margin-right: 5px;
  font-size: 11px;
  font-family: Arial; }

.viewcontent-body {
  font-family: Arial;
  font-size: 14px;
  margin-left: 10px;
  margin-top: 10px;
  float: left;
  width: 380px; }

.viewcontent-reportbody {
  font-family: Arial;
  font-size: 14px;
  margin-left: 10px;
  margin-top: 10px;
  float: left;
  width: 500px; }

.viewcontent-date {
  font-family: Arial;
  font-size: 11px;
  margin-bottom: 5px; }

.report-status {
  margin-left: 10px;
  background: #ccc;
  padding: 5px;
  width: 200px; }

.viewcontent-avatar {
  float: left;
  padding: 10px; }

.viewcontent-platoon {
  float: left;
  padding: 10px; }

.viewcontent-platoon .platoon-title {
  clear: both;
  float: left;
  width: 120px;
  font-weight: bold;
  margin-top: 10px; }

.viewcontent-platoon .platoon-data {
  float: left;
  width: 150px;
  margin-top: 10px; }

.viewcontent-platoon .platoon-platooncard {
  height: 65px; }

.viewcontent-reporttitle {
  padding-top: 20px;
  padding-bottom: 10px;
  padding-left: 8px;
  font-size: 14px;
  font-weight: bold;
  font-family: arial; }

.viewcontent-title {
  padding-top: 30px;
  padding-bottom: 10px;
  font-size: 14px;
  font-weight: bold;
  font-family: arial; }

.viewcontent-outmost #feedContent li {
  list-style: none; }

.viewcontent-comments {
  padding-left: 50px;
  padding-top: 5px; }

.viewcontent-feed {
  padding: 5px; }

#main-recommendations {
  margin-bottom: 16px;
  background-color: rgba(7, 7, 7, 0.5); }
  #main-recommendations .recommendation .bg-map {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: opacity 2s ease;
    -moz-transition: opacity 2s ease;
    transition: opacity 2s ease;
    background-size: cover; }
  #main-recommendations .recommendation .overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    background-image: -webkit-linear-gradient(left top, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);
    background-image: linear-gradient(to right bottom, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);
    -webkit-transition: opacity 2s ease;
    -moz-transition: opacity 2s ease;
    transition: opacity 2s ease;
    opacity: 0; }
  #main-recommendations .recommendation.loaded .bg-map, #main-recommendations .recommendation.loaded .overlay {
    opacity: 1; }
  #main-recommendations .recommendation .loader {
    display: block;
    margin: 0 auto;
    margin-top: 30px; }

#recommendations > .span2 > .box {
  height: 175px; }
#recommendations > .span2 .box-hide {
  width: 295px; }

#main-recommendations .rating .btn {
  position: relative; }
#main-recommendations .rating .recommendation-hooah {
  height: 15px;
  width: 15px;
  display: inline-block;
  background: url(../feed/feed-icons.png);
  position: relative;
  top: 3px;
  margin-right: 4px; }
  #main-recommendations .rating .recommendation-hooah.like {
    background-position: 15px 0; }
  #main-recommendations .rating .recommendation-hooah.dislike {
    background-position: 15px 0;
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    transform: rotate(-180deg); }

#community-mission .legal {
  margin-top: 8px;
  font-size: 10px;
  line-height: 1.3;
  color: #a8a8a8; }
#community-mission .community-mission-image-container {
  width: 225px;
  height: 180px;
  position: relative;
  float: left;
  background-color: rgba(7, 7, 7, 0.5);
  background-repeat: no-repeat; }
#community-mission .info {
  padding-left: 16px;
  height: 180px;
  width: 750px;
  background-color: rgba(7, 7, 7, 0.5);
  float: left;
  display: inline-block;
  margin-left: 1px; }
  #community-mission .info .community-mission-info-title {
    font-size: 18px;
    padding-top: 16px;
    text-transform: uppercase;
    color: #d5dde5; }
  #community-mission .info .description {
    font-size: 16px;
    line-height: 1.3;
    padding-top: 16px;
    padding-right: 16px; }
#community-mission .reward {
  margin-top: 1px;
  width: 992px;
  float: left; }
  #community-mission .reward .title {
    text-transform: uppercase;
    padding: 16px;
    color: #d5dde5;
    background-color: rgba(7, 7, 7, 0.5);
    width: 193px;
    display: inline-block;
    float: left;
    min-height: 34px; }
  #community-mission .reward .description {
    color: #fff;
    padding: 16px 240px 16px 16px;
    background-color: rgba(7, 7, 7, 0.5);
    width: 766px;
    display: inline-block;
    float: left;
    margin-left: 1px;
    position: relative;
    min-height: 66px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
    #community-mission .reward .description .claim-reward-btn {
      position: absolute;
      top: 16px;
      right: 16px; }
  #community-mission .reward .amount {
    color: #41b946;
    font-weight: bold; }
#community-mission .time-left {
  margin-top: 1px;
  float: left; }
  #community-mission .time-left .time-left-label {
    text-transform: uppercase;
    color: #d5dde5;
    background-color: rgba(7, 7, 7, 0.5);
    width: 193px;
    padding: 16px;
    display: inline-block;
    float: left;
    min-height: 40px; }
  #community-mission .time-left .time-left-counter {
    color: #fff;
    padding: 16px;
    background-color: rgba(7, 7, 7, 0.5);
    width: 734px;
    display: inline-block;
    float: left;
    margin-left: 1px;
    min-height: 40px; }
    #community-mission .time-left .time-left-counter .timeperiod {
      font-size: 14px;
      padding-top: 8px;
      padding-right: 16px;
      font-weight: normal;
      color: #a8a8a8; }
#community-mission .progression {
  margin-top: 1px;
  float: left; }
  #community-mission .progression .title {
    text-transform: uppercase;
    color: #d5dde5;
    background-color: rgba(7, 7, 7, 0.5);
    width: 193px;
    padding: 16px;
    display: inline-block;
    float: left;
    height: 34px; }
  #community-mission .progression .progress-box {
    padding: 16px;
    margin-left: 1px;
    float: left;
    background-color: rgba(7, 7, 7, 0.5);
    width: 734px;
    height: 34px; }
    #community-mission .progression .progress-box .progression-bar {
      width: 734px;
      margin-bottom: 8px; }
      #community-mission .progression .progress-box .progression-bar .progress-bar {
        margin: 0; }
    #community-mission .progression .progress-box .progression-values {
      color: #a8a8a8;
      display: inline-block;
      font-size: 14px; }

#community-mission .legal {
  color: #a8a8a8; }
#community-mission .community-mission-image-container {
  background-image: url(//eaassets-a.akamaihd.net/battlelog/bb/bf4/icons/official-mission-ea5d8ed5.png);
  background-position: center; }
#community-mission .info .community-mission-info-title {
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }
#community-mission .info .description {
  color: #fff; }
#community-mission .reward .title {
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600;
  min-height: 40px; }
#community-mission .reward .description {
  min-height: 72px; }
#community-mission .time-left .time-left-label {
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }
#community-mission .time-left .time-left-counter {
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }
#community-mission .progression .title {
  height: 40px;
  font-family: Purista, sans-serif;
  font-style: normal;
  font-weight: 600; }
#community-mission .progression .progress-box {
  height: 40px; }
  #community-mission .progression .progress-box .progression-values {
    font-family: Purista, sans-serif;
    font-style: normal;
    font-weight: 600; }

.main-header #recommended-server .servername, .main-header #recommended-server .servermeta {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-bottom: 1px; }

.base-hide {
  display: none; }

#base-header .span4.header-play-now {
  padding-right: 16px; }

.common-scrollbar-style.scrollbar-visible .jspCap {
  display: none; }
.common-scrollbar-style.scrollbar-visible .jspTrack {
  background: rgba(7, 7, 7, 0.5); }
.common-scrollbar-style.scrollbar-visible .jspDrag {
  background: rgba(255, 255, 255, 0.75); }
.common-scrollbar-style.scrollbar-visible .jspVerticalBar {
  width: 8px;
  right: 0; }
.common-scrollbar-style.scrollbar-visible .jspHorizontalBar {
  height: 8px;
  bottom: 0; }

html:not(.is-touch) body:not(.no-comcenter) {
  /* More than container-width + comcenter width + spacing */
  /* Less then $container-width + comcenter width */
  /* Less than container-width */ }
  @media screen and (min-width: 1261px) {
    html:not(.is-touch) body:not(.no-comcenter) #base-background {
      margin-left: -237px; }
    html:not(.is-touch) body:not(.no-comcenter) .no-comcenter #base-background {
      margin-left: 0; }
    html:not(.is-touch) body:not(.no-comcenter) .no-comcenter #viewport {
      padding-right: 0; }
    html:not(.is-touch) body:not(.no-comcenter) #viewport {
      position: relative;
      padding-right: 237px; }
    html:not(.is-touch) body:not(.no-comcenter) #geomap {
      right: 237px; }
    html:not(.is-touch) body:not(.no-comcenter) #base-header, html:not(.is-touch) body:not(.no-comcenter) #unified-game-manager {
      right: 237px; }
    html:not(.is-touch) body:not(.no-comcenter) #comcenter-chats {
      right: 245px; }
    html:not(.is-touch) body:not(.no-comcenter) #dialog-container {
      margin-left: -237px; } }
  @media screen and (max-width: 1261px) {
    html:not(.is-touch) body:not(.no-comcenter) body {
      min-width: 1024px; }
    html:not(.is-touch) body:not(.no-comcenter) #base-header, html:not(.is-touch) body:not(.no-comcenter) #unified-game-manager {
      right: 0; }
    html:not(.is-touch) body:not(.no-comcenter) #viewport {
      position: relative;
      padding-right: 0; }
    html:not(.is-touch) body:not(.no-comcenter) #geomap {
      right: 0; }
    html:not(.is-touch) body:not(.no-comcenter) .comcenter-toggle {
      display: block; }
    html:not(.is-touch) body:not(.no-comcenter) #base-header-user-tools .tools .tools-item.pro .username {
      max-width: 120px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis; }
    html:not(.is-touch) body:not(.no-comcenter) #unified-game-manager .grid-container {
      width: 100%; }
      html:not(.is-touch) body:not(.no-comcenter) #unified-game-manager .grid-container #ugm-action-buttons {
        float: right; }
    html:not(.is-touch) body:not(.no-comcenter) #comcenter-friends {
      z-index: 0;
      background: #131313;
      display: block;
      visibility: hidden; }
    html:not(.is-touch) body:not(.no-comcenter) #base-background .video-container {
      display: none; }
    html:not(.is-touch) body:not(.no-comcenter):not(.show-comcenter) #comcenter-friends {
      opacity: 0; }
    html:not(.is-touch) body:not(.no-comcenter).show-comcenter #comcenter-friends {
      z-index: 1001;
      visibility: visible; }
    html:not(.is-touch) body:not(.no-comcenter).show-comcenter #viewport, html:not(.is-touch) body:not(.no-comcenter).show-comcenter #base-background, html:not(.is-touch) body:not(.no-comcenter).show-comcenter #base-header, html:not(.is-touch) body:not(.no-comcenter).show-comcenter #geomap {
      -webkit-transform: translate3d(-237px, 0, 0);
      -moz-transform: translate3d(-237px, 0, 0);
      -ms-transform: translate3d(-237px, 0, 0);
      -o-transform: translate3d(-237px, 0, 0);
      transform: translate3d(-237px, 0, 0);
      -ms-transform: translate(-237px, 0); }
    html:not(.is-touch) body:not(.no-comcenter).show-comcenter #base-header .community-bar, html:not(.is-touch) body:not(.no-comcenter).show-comcenter #base-header .game-bar .inner-wrapper {
      padding-right: 16px; }
    html:not(.is-touch) body:not(.no-comcenter).show-comcenter #base-page {
      position: absolute;
      margin: 0; }
    html:not(.is-touch) body:not(.no-comcenter).show-comcenter #base-background {
      right: 0; }
    html:not(.is-touch) body:not(.no-comcenter).show-comcenter #base-page {
      right: 16px; } }
  @media screen and (max-width: 1041px) {
    html:not(.is-touch) body:not(.no-comcenter) #receipt-container {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 1001; }
    html:not(.is-touch) body:not(.no-comcenter) #base-container:before {
      height: 0; }
    html:not(.is-touch) body:not(.no-comcenter) #base-header {
      min-width: 1024px;
      position: relative; }
      html:not(.is-touch) body:not(.no-comcenter) #base-header .game-bar > .grid-container {
        position: absolute; }
      html:not(.is-touch) body:not(.no-comcenter) #base-header #comcenter-chats {
        width: 1024px; }
    html:not(.is-touch) body:not(.no-comcenter) #geoleaderboard-container {
      margin-top: 0; }
    html:not(.is-touch) body:not(.no-comcenter) #geomap {
      right: 0; }
    html:not(.is-touch) body:not(.no-comcenter) #base-container, html:not(.is-touch) body:not(.no-comcenter) .has-facebook-bar #base-container {
      padding-top: 16px; }
    html:not(.is-touch) body:not(.no-comcenter) #facebook-bar {
      margin-top: 0; }
    html:not(.is-touch) body:not(.no-comcenter) #base-background .video-container {
      display: none; }
    html:not(.is-touch) body:not(.no-comcenter) #comcenter-friends {
      width: 237px;
      right: 0; }
    html:not(.is-touch) body:not(.no-comcenter).show-comcenter #base-background, html:not(.is-touch) body:not(.no-comcenter).show-comcenter #base-header, html:not(.is-touch) body:not(.no-comcenter).show-comcenter #viewport, html:not(.is-touch) body:not(.no-comcenter).show-comcenter #geomap {
      -webkit-transform: translate3d(-237px, 0, 0);
      -moz-transform: translate3d(-237px, 0, 0);
      -ms-transform: translate3d(-237px, 0, 0);
      -o-transform: translate3d(-237px, 0, 0);
      transform: translate3d(-237px, 0, 0);
      -ms-transform: translate(-237px, 0); } }

.bbcode-button {
  background-color: rgba(7, 7, 7, 0.5);
  background-image: url(../base/bf3/buttons/buttons-textformat-light.png); }
  .bbcode-button:hover {
    background-color: rgba(7, 7, 7, 0.6); }

.bbcode-button-bold:hover {
  background-position: 0 0; }

.bbcode-button-italic:hover {
  background-position: -27px 0; }

.bbcode-button-underline:hover {
  background-position: -54px 0; }

.bbcode-button-strikethrough:hover {
  background-position: -81px 0; }

.bbcode-button-spoiler:hover {
  background-position: -108px 0; }

.bbcode-button-link:hover {
  background-position: -135px 0; }

.bbcode-button-center:hover {
  background-position: -162px 0; }

.bbcode-button-quote:hover {
  background-position: -189px 0; }

.bbcode-button-headline:hover {
  background-position: -216px 0; }

/* Old buttons that still has to exist */
.base-button-arrow-small {
  background: url(../base/bfbc2/buttons/base-button-arrow-small.png) no-repeat;
  width: 106px;
  height: 29px;
  cursor: pointer;
  line-height: 29px;
  font-size: 12px;
  font-family: Arial, sans-serif;
  color: #000;
  text-shadow: 0 1px #fcda87;
  border: 0;
  font-weight: bold;
  text-align: center;
  padding: 0; }

.base-button-arrow-small:hover {
  background-position: 0 -29px; }

.base-button-arrow-small:active {
  background-position: 0 -58px;
  -ms-background-position-x: 1px;
  -ms-background-position-y: -57px; }

.base-button-arrow-small:hover[disabled], .base-button-arrow-small:active[disabled], .base-button-arrow-small[disabled] {
  background-position: 0 -87px;
  cursor: default;
  color: #c3c3c3;
  text-shadow: none; }

.base-button-arrow-small a {
  text-align: center; }

.base-button-arrow-small-grey {
  background: url(../base/bfbc2/buttons/base-button-arrow-small-grey.png) no-repeat;
  width: 106px;
  height: 29px;
  cursor: pointer;
  line-height: 29px;
  font-size: 12px;
  font-family: Arial, sans-serif;
  color: #000;
  text-shadow: 0 1px #fff;
  border: 0;
  font-weight: bold;
  text-align: center;
  padding: 0; }

.base-button-arrow-small-grey:hover {
  background-position: 0 -29px; }

.base-button-arrow-small-grey:active {
  background-position: 0 -58px;
  -ms-background-position-x: 1px;
  -ms-background-position-y: -57px; }

.base-button-arrow-small-grey:hover[disabled], .base-button-arrow-small-grey:active[disabled], .base-button-arrow-small-grey[disabled] {
  background-position: 0 -87px;
  cursor: default;
  color: #c3c3c3;
  text-shadow: none; }

/* Temporary popup css */
/*****************/
.common-popup-close-container {
  cursor: pointer;
  position: absolute;
  right: 12px;
  top: 9px;
  height: 33px;
  width: 33px; }

.common-close-light, .common-close, .common-popup-close {
  background: url(../base/shared/row_icon_chat.png) 0 26px;
  height: 13px;
  width: 13px;
  position: relative;
  left: 12px;
  top: 11px; }

.common-close-light:hover, .common-close:hover, .common-popup-close-container:hover .common-popup-close {
  background-position: 0 13px; }

.common-close-light {
  background: url(../base/shared/row_icon_chat_light.png) 0 26px; }

.common-popup {
  width: 498px;
  z-index: 1337;
  margin: 0 auto;
  position: fixed;
  color: #353535;
  left: 50%;
  top: 50%;
  display: none; }

.common-popup.medium {
  width: 674px;
  margin-left: -324px;
  margin-top: 0; }

.common-popup.big {
  width: 915px;
  margin-left: -324px;
  margin-top: 0; }

.common-popup.medium .common-popup-content, .common-popup.big .common-popup-content {
  padding: 0 12px; }

.common-popup.common-popup-big {
  width: 918px; }

.common-popup-handle {
  cursor: default; }

.common-popup-big .common-popup-handle {
  cursor: default; }

.common-popup-title-container {
  height: 44px;
  background: url(../common/popup-header.png) no-repeat;
  -webkit-user-select: none;
  -moz-user-select: -moz-none;
  -o-user-select: none;
  user-select: none; }

.common-popup-big .common-popup-title-container {
  background-image: url(../common/popup-big-header.png); }

.common-popup-title {
  font-weight: bold;
  font-size: 12px;
  font-family: Tahoma, sans-serif;
  color: #353535;
  margin-left: 26px;
  padding-top: 19px;
  height: 25px; }

.common-popup-content-container {
  background: url(../common/popup-middle.png) repeat-y;
  zoom: 1; }

.common-popup.medium .common-popup-title-container {
  background-image: url(../common/popup-medium-header.png); }

.common-popup.medium .common-popup-content-container {
  background-image: url(../common/popup-medium-middle.png); }

.common-popup.medium .common-popup-footer-container {
  background-image: url(../common/popup-medium-bottom.png); }

.common-popup.big .common-popup-title-container {
  background-image: url(../common/popup-big-header.png); }

.common-popup.big .common-popup-content-container {
  background-image: url(../common/popup-big-middle.png); }

.common-popup.big .common-popup-footer-container {
  background-image: url(../common/popup-big-bottom.png); }

.common-popup-big .common-popup-content-container {
  background-image: url(../common/popup-big-middle.png);
  position: relative;
  overflow: hidden;
  zoom: 1; }

.common-popup-content {
  padding: 16px 20px;
  font-size: 14px; }

.common-popup-content a {
  font-size: inherit; }

.common-popup-footer {
  padding: 9px 16px;
  margin: 0 10px;
  background-color: #fafafa;
  font-size: 14px;
  min-height: 28px; }

.common-popup-big .common-popup-footer {
  padding: 10px 20px 0 31px;
  font-size: 12px; }

.common-popup-line {
  width: 478px;
  height: 1px;
  background: #ededed;
  margin-left: 10px; }

.common-popup-big .common-popup-line {
  display: none; }

.common-popup-footer-container {
  height: 59px;
  background: url(../common/popup-bottom.png); }

.common-popup-big .common-popup-footer-container {
  height: 61px;
  padding-top: 1px;
  background: url(../common/popup-big-bottom.png); }

.popup-reportabuse textarea {
  width: 510px;
  height: 220px; }
.popup-reportabuse footer {
  padding-top: 0; }
.popup-reportabuse .popup-reportabuse-buttons {
  text-align: right; }

/****************************/
.common-bigpopup-title-container {
  width: 100%;
  height: 45px;
  background: url(../common/popup-big-header.png);
  -webkit-user-select: none;
  -moz-user-select: -moz-none;
  -o-user-select: none;
  user-select: none; }

.common-bigpopup-content-container {
  width: 100%;
  background: url(../common/popup-big-middle.png) repeat-y; }

.common-bigpopup-content {
  padding: 16px 20px;
  font-size: 14px; }

.common-bigpopup-footer {
  padding: 9px 26px;
  font-size: 14px; }

.common-bigpopup-footer-container {
  width: 100%;
  height: 59px;
  background: url(../common/popup-big-bottom.png); }

/****************************/
.share-widgets li {
  float: left; }
  .share-widgets li.tw {
    width: 90px; }
  .share-widgets li.gp {
    width: 70px; }
  .share-widgets li.fb {
    width: 80px; }

/* SITE NOTIFICATIONS */
.notification-notice {
  background: rgba(0, 0, 0, 0.2);
  padding: 0;
  padding-bottom: 3px;
  padding-top: 2px;
  font-family: Purista, sans-serif;
  line-height: 14px;
  text-transform: uppercase;
  text-align: left;
  margin-bottom: 1px; }
  .notification-notice span {
    font-size: 16px;
    padding-right: 5px;
    line-height: 18px;
    position: relative;
    top: 1px; }
  .notification-notice span.title {
    text-indent: -100%;
    white-space: nowrap;
    width: 20px;
    height: 20px;
    display: block;
    float: left;
    overflow: hidden;
    padding: 0;
    position: absolute;
    left: 13px;
    top: 50%;
    margin-top: -10px;
    background: url(../base/shared/notice-icons-bf4.png) no-repeat; }
  .notification-notice.info {
    color: #ebc7b6;
    text-shadow: 0 1px #d04f13; }
    .notification-notice.info span.title {
      background: url(../base/shared/notice-icons-bf4.png) 0 -20px no-repeat; }
  .notification-notice.warn {
    color: #ebc7b6;
    text-shadow: 0 1px #d04f13; }
    .notification-notice.warn span.title {
      color: #cdb357;
      background: url(../base/shared/notice-icons-bf4.png) 0 0 no-repeat; }
  .notification-notice.severe {
    color: #ebc7b6;
    text-shadow: 0 1px #d04f13; }
    .notification-notice.severe span.title {
      color: #df534f;
      background: url(../base/shared/notice-icons-bf4.png) 0 -40px no-repeat; }

.notification-notice-padder {
  font-size: 12px;
  text-align: left;
  padding: 0 16px 0 42px;
  position: relative; }
  .notification-notice-padder.small {
    padding-top: 0;
    padding-bottom: 0; }
  .notification-notice-padder.medium {
    padding-top: 11px;
    padding-bottom: 11px; }
  .notification-notice-padder.large {
    padding-top: 29px;
    padding-bottom: 29px; }

/* END OF SITE NOTIFICATIONS */
.box.common-no-results {
  text-align: center; }