.flex-container,.fp {
    display: flex
}

.flex-container.flex-column,.fp.flex-column {
    flex-direction: column
}

.flex-container .flex-child,.flex-container .fc,.fp .flex-child,.fp .fc {
    flex: 1
}

.flex-container .flex-child.center-self,.flex-container .fc.center-self,.fp .flex-child.center-self,.fp .fc.center-self {
    align-self: center
}

.flex-container.content-center,.fp.content-center {
    justify-content: center
}

.flex-container .flex-card,.fp .flex-card {
    display: flex;
    flex: 1
}

.flex-container .flex-card.content,.fp .flex-card.content {
    flex: 1
}

.overflow-auto {
    overflow: auto
}

.block {
    display: block
}

.text-right {
    text-align: right
}

.text-left {
    text-align: left
}

.circle {
    border-radius: 50%
}

.unselectable {
    user-select: none
}

.ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.no-right-rad,div.no-right-rad,label.no-right-rad {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.no-rad,div.no-rad,label.no-rad {
    border-radius: 0
}

.no-left-rad,div.no-left-rad,label.no-left-rad {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.absolute {
    position: absolute
}

.absolute.right {
    right: 0
}

.absolute.left {
    left: 0
}

.absolute.top {
    top: 0
}

.absolute.bottom {
    bottom: 0
}

.f-right {
    float: right
}

.f-left {
    float: left
}

html,body {
    margin: 0;
    padding: 0
}

body {
    position: relative;
    min-height: 100vh
}

li:not(.normal) {
    list-style: none
}

ol:not(.normal),ul:not(.normal) {
    padding: 0;
    margin: 0
}

* {
    box-sizing: border-box
}

a {
    text-decoration: none;
    color: inherit
}

button,input,textarea,option,select {
    font-family: Montserrat,sans-serif;
    font-weight: 500
}

button {
    font-weight: inherit
}

button:focus,select:focus {
    outline: none
}

@font-face {
    font-family: montserrat;
    font-weight: 500;
    src: url(https://css.brkcdn.com/font/6fd836a65acf6d59bd2f.woff2)
}

@font-face {
    font-family: montserrat;
    font-weight: 600;
    src: url(https://css.brkcdn.com/font/c18b4ac34e93857f7437.woff2) format("woff2"),url(https://css.brkcdn.com/font/27dfd575571f017cc9a7.ttf) format("ttf")
}

@font-face {
    font-family: montserrat;
    font-weight: 700;
    src: url(https://css.brkcdn.com/font/66fd2310725b78026454.woff2) format("woff2"),url(https://css.brkcdn.com/font/68c8d686f4b0d91b92f1.ttf) format("ttf")
}

body {
    font-family: Montserrat,sans-serif;
    font-weight: 500;
    color: #fff;
    background-color: #242426
}

nav {
    width: 100%;
    overflow: auto;
    margin-bottom: 20px;
    z-index: 2
}

nav div.primary {
    overflow: auto;
    background-color: #212020;
    color: #fff;
    font-size: 1.1em;
    padding-top: 6px
}

nav div.primary ul li a:hover {
    border-color: red;
    border-color: #fff
}

nav div.secondary {
    overflow: auto;
    background-color: #2e2f32;
    color: #d6e5ee;
    font-size: .9em;
    padding-top: 0
}

nav div.secondary ul li a:hover {
    border-color: red;
    border-color: #fff
}

nav .info {
    border-radius: 5px;
    padding: 5px 10px;
    background-color: #2e2f32;
    display: inline-block
}

nav .info a {
    font-size: .8em;
    display: inline-block;
    padding: 0 10px
}

nav .push-left,nav .push-right {
    display: inline-block
}

nav .push-left {
    vertical-align: top
}

nav .push-right {
    vertical-align: bottom
}

nav .username {
    margin: 5px 0 0 15px;
    float: right;
    cursor: pointer
}

nav .username .username-holder {
    max-width: 125px
}

nav .username i {
    vertical-align: text-top;
    margin-left: 4px
}

@media handheld,only screen and (max-width: 767px) {
    nav {
        text-align:center
    }

    nav .grid {
        padding-left: 10px
    }

    nav .nav-user {
        text-align: center;
        float: none
    }

    nav .username {
        float: none;
        margin-bottom: 5px
    }

    nav .username.login-buttons {
        margin-bottom: 10px
    }
}

nav div ul {
    overflow: auto;
    list-style: none
}

nav div ul li {
    display: inline-block;
    padding: 0 1px
}

nav div ul li a {
    display: inline-block;
    padding: 8px 5px;
    border-bottom: 2px solid transparent
}

.login-button {
    border: 1px solid #2fb621;
    color: #fff;
    padding: 5px;
    border-radius: 5px;
    transition: background-color 50ms linear
}

.login-button:hover {
    background-color: #2fb621
}

.register-button {
    border: 1px solid #00bcd4;
    color: #fff;
    padding: 5px;
    border-radius: 5px;
    transition: background-color 50ms linear
}

.register-button:hover {
    background-color: #00bcd4
}

.notif,.nav-notif {
    margin-top: -4px;
    float: right;
    background-color: #c61400;
    padding: 2px 4px;
    color: #fff;
    font-size: .6em;
    font-weight: 600;
    border-radius: 5px
}

.side-ad {
    padding-top: 50px;
    padding-left: 50px;
    padding-right: 50px;
    position: absolute;
    display: none
}

@media only screen and (min-width: 1500px) {
    .side-ad {
        display:block
    }
}

@media only screen and (max-width: 1800px) {
    .side-ad {
        padding-left:10px;
        padding-right: 10px
    }
}

.card {
    border-radius: 5px;
    overflow: auto;
    box-shadow: 0 2px 5px #0003
}

.card .top:not(.absolute) {
    overflow: auto;
    padding: 10px;
    font-weight: 700;
    border-bottom: 1.5px solid;
    color: #fff;
    background-color: #3b3c40;
    border-color: #2d2e31
}

.card .top:not(.absolute).green {
    color: #54a84a;
    background-color: #0a5812;
    border-color: #54a84a
}

.card .top:not(.absolute).blue {
    color: #869eff;
    background-color: #134b7b;
    border-color: #869eff
}

.card .top:not(.absolute).red {
    color: #ff8686;
    background-color: #9f1212;
    border-color: #ff6161
}

.card .top:not(.absolute).orange {
    color: #e5c765;
    background-color: #9f7e12;
    border-color: #e5c765
}

.card .content {
    height: inherit;
    overflow: auto;
    padding: 10px;
    background-color: #343538
}

.card .border {
    border: 1px solid #dcdcdc
}

.card .name {
    overflow: hidden;
    color: #d2d2d2;
    font-weight: 600;
    display: inline-block
}

.card .creator {
    overflow: hidden;
    color: #dfdfdf;
    font-size: .9em
}

.card .thumbnail {
    padding: 20px;
    text-align: center;
    background-color: #233036
}

.card .thumbnail.no-padding {
    padding: 0
}

.card .thumbnail img {
    height: 100%;
    width: 100%;
    display: block
}

.card .thumbnail.dark {
    background-color: #2d2e31
}

.card .footer {
    border-top: 1px solid #212121;
    padding: 10px;
    background-color: #2f2f2f
}

.card .footer .playing {
    text-align: right;
    color: #af1111;
    font-weight: 600
}

.card:not(.no-margin) {
    margin-bottom: 10px
}

.label {
    font-size: .9em;
    font-weight: 500;
    color: #e6e6e6
}

.label.dark {
    color: #d2d2d2
}

.label.dark-grey {
    color: #c4c4c4
}

.label.black {
    color: #fff
}

.label.small {
    font-size: .8em
}

button:not(.plain),.button:not(.plain) {
    text-align: center;
    padding: 10px 20px;
    border-radius: 5px;
    border: 1px solid;
    display: inline-block;
    text-transform: uppercase;
    color: #fff;
    background-color: #d0d0d0;
    border-color: #adadad
}

button:not(.plain):not([disabled]).blue,.button:not(.plain):not([disabled]).blue {
    color: #fff;
    background-color: #134b7b;
    border-color: #869eff
}

button:not(.plain):not([disabled]).green,.button:not(.plain):not([disabled]).green {
    color: #fff;
    background-color: #0a5812;
    border-color: #54a84a
}

button:not(.plain):not([disabled]).red,.button:not(.plain):not([disabled]).red {
    color: #fff;
    background-color: #9f1212;
    border-color: #ff6161
}

button:not(.plain):not([disabled]).orange,.button:not(.plain):not([disabled]).orange {
    color: #fff;
    background-color: #9f7e12;
    border-color: #e5c765
}

button:not(.plain):not([disabled]).hgreen,.button:not(.plain):not([disabled]).hgreen {
    color: #54a84a;
    background-color: #0a5812;
    border-color: #54a84a
}

button:not(.plain):not([disabled]).hblue,.button:not(.plain):not([disabled]).hblue {
    color: #869eff;
    background-color: #134b7b;
    border-color: #869eff
}

button:not(.plain):not([disabled]).hred,.button:not(.plain):not([disabled]).hred {
    color: #ff8686;
    background-color: #9f1212;
    border-color: #ff6161
}

button:not(.plain):not([disabled]).horange,.button:not(.plain):not([disabled]).horange {
    color: #e5c765;
    background-color: #9f7e12;
    border-color: #e5c765
}

button:not(.plain):not([disabled]).bits,.button:not(.plain):not([disabled]).bits {
    color: #fff;
    background-color: #f49b00;
    border-color: #f49b00
}

button:not(.plain):not([disabled]).bucks,.button:not(.plain):not([disabled]).bucks {
    color: #fff;
    background-color: #009624;
    border-color: #009624
}

button:not(.plain):not([disabled]).free,.button:not(.plain):not([disabled]).free {
    color: #fff;
    background-color: #6fb6db;
    border-color: #419dda
}

button[disabled],.button[disabled] {
    cursor: not-allowed!important
}

button.plain,.button.plain {
    border: 0;
    font-size: 1em;
    padding: 0
}

button.no-click,button.no-click[disabled],.button.no-click,.button.no-click[disabled] {
    cursor: default;
    color: #fff;
    background-color: #d0d0d0;
    border-color: #adadad
}

button:hover,.button:hover {
    cursor: pointer
}

button.no-cap,.button.no-cap {
    text-transform: inherit
}

button.flat,.button.flat {
    border-color: #0000
}

button.small,.button.small {
    padding: 5px 10px
}

button.purchase,.button.purchase {
    font-size: 15px;
    min-width: 100px
}

button.tab-button,.button.tab-button {
    font-weight: 600;
    font-size: 17px
}

button.tab-button.transparent,.button.tab-button.transparent {
    background-color: #0000;
    border-color: #0000;
    color: #fff
}

button.tab-button.transparent:hover,.button.tab-button.transparent:hover {
    background-color: #0000001a
}

.tab-buttons {
    margin-bottom: 10px
}

input,textarea {
    padding: 4px;
    color: #fff;
    border-radius: 5px;
    background-color: #2f2f2f;
    border: 1px solid #232121
}

input.rigid,textarea.rigid {
    border-radius: 2px;
    color: #797979;
    padding: 10px;
    background-color: #2f2c2c;
    border: 1px solid #232121
}

input::placeholder,textarea::placeholder {
    font-weight: 600;
    color: #a8a8a8
}

input:focus,textarea:focus {
    outline: none
}

.input-group {
    display: inline-flex;
    margin-bottom: 4px;
    overflow: auto;
    border-radius: 5px;
    border: 1px solid #232121
}

.input-group.fill {
    display: flex;
    align-items: stretch
}

.input-group.fill .input-button {
    flex: 0
}

.input-group.fill input,.input-group.fill textarea,.input-group.fill .input {
    flex: 1
}

.input-group.rigid {
    border-radius: 2px;
    color: #797979;
    padding: 10px;
    background-color: #2f2c2c;
    color: #fff;
    border: 1px solid #232121
}

.input-group input,.input-group textarea,.input-group .input-button {
    flex: 1;
    border-radius: 0;
    border: none
}

.input-group .input-button {
    border-left: 1px solid #869eff;
    color: #fff;
    background-color: #134b7b;
    padding: 4px 15px;
    font-size: 13.3px;
    font-weight: 600
}

.input-group .input-button:hover {
    cursor: pointer
}

.width-100 {
    display: block;
    width: 100%
}

.margin-5 {
    margin-bottom: 5px
}

.select,select {
    background-color: #2f2f2f;
    border-color: #232121;
    border-radius: 3px;
    font-weight: 600;
    padding: 8px;
    color: #fff
}

.select option,select option {
    color: #fff
}

.select.small-padding,select.small-padding {
    padding: 0 8px
}

.bits-text {
    color: #f49b00
}

.bucks-text {
    color: #009624
}

.free-text {
    color: #0f7bff
}

.offsale-text {
    color: #cacaca
}

.red-text {
    color: #ce1b1b
}

.blue-text {
    color: #196fb5
}

.green-text {
    color: #2fb621
}

.white-text {
    color: #fff
}

.light-gray-text {
    color: #9e9e9e
}

.gray-text {
    color: #d2d2d2
}

.agray-text {
    color: #dfdfdf
}

.dark-gray-text {
    color: #c4c4c4
}

.darkest-gray-text {
    color: #d4d4d4
}

.ablack-text {
    color: #d2d2d2
}

.select-color-text,.black-text {
    color: #fff
}

.favorite-text {
    color: #fcc100
}

.large-text {
    font-size: 2em
}

.medium-text {
    font-size: 1.5rem
}

.smedium-text {
    font-size: 1.2rem
}

.normal-text {
    font-size: 1rem
}

.small-text {
    font-size: .9rem
}

.smaller-text {
    font-size: .8rem
}

b,.bold {
    font-weight: 600
}

.very-bold {
    font-weight: 700
}

.cap-text {
    text-transform: uppercase
}

.center-text,.text-center {
    text-align: center
}

.pointer,.hover-cursor:hover {
    cursor: pointer
}

hr,.line {
    border: 0;
    height: 0;
    border-top: 1px solid #303133;
    border-bottom: 1px solid #303133
}

.alert {
    margin-bottom: 10px;
    border-radius: 5px;
    text-align: center;
    padding: 10px;
    color: #fff
}

.alert.success {
    background-color: #23d160
}

.alert.error {
    background-color: #ef263d
}

.alert.warning {
    background-color: #ef9526
}

.blockquote,blockquote {
    word-wrap: break-word;
    padding: 3px 0 3px 3px;
    border-left: 4px solid #eee;
    margin-left: 0
}

.blockquote.red,blockquote.red {
    border-color: #af1111
}

.blockquote.green,blockquote.green {
    border-color: #1d6918
}

.blockquote.blue,blockquote.blue {
    border-color: #1c4788
}

.blockquote.orange,blockquote.orange {
    border-color: #cab124
}

.tabs {
    margin-bottom: 10px
}

.tabs .tab {
    text-align: center;
    color: #fff;
    border-radius: 5px 5px 0 0;
    padding: 10px;
    background-color: #2c2d2f;
    border: 1px solid;
    border-color: #2f3033;
    font-size: 1.1rem
}

.tabs .tab.active {
    background-color: #343538;
    font-weight: 600;
    border-bottom: 1px solid transparent
}

.tabs .tab:hover {
    cursor: pointer
}

.tabs .tab-body {
    min-width: 100%;
    overflow: auto;
    padding: 10px;
    border: 1px solid #2f3033;
    border-top: 0;
    border-radius: 0 0 5px 5px;
    background-color: #343538
}

.tabs .tab-body:not(.active) {
    display: none
}

.button-tabs .button-tab:not(.active) {
    display: none
}

.vertical-tab {
    border-radius: 5px;
    list-style: none;
    overflow: hidden
}

.vertical-tab li,.vertical-tab .tab {
    border-left: 4px solid transparent;
    padding: 10px;
    transition: background-color .1s linear
}

.vertical-tab li.active,.vertical-tab .tab.active {
    border-color: #ce1b1b;
    background-color: #2c2d2f
}

.vertical-tab li:hover,.vertical-tab .tab:hover {
    cursor: pointer;
    border-color: #ce1b1b;
    background-color: #2c2d2f
}

.box {
    border: 1px solid #27282b;
    border-radius: 5px
}

.box.shaded {
    background-color: #2f3033
}

.box.img {
    text-align: center
}

.box.game-img {
    border: 0 transparent
}

.box.game-img img {
    border-radius: 5px;
    width: 100%;
    display: block
}

.box.item-img {
    padding: 50px;
    text-align: center
}

.box.item-img img {
    width: 100%
}

.box.item-img.special {
    border: 5px solid #ffd52d
}

.box.item-img.owns {
    border: 5px solid #4cb04c
}

.modal {
    position: fixed;
    z-index: 2000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: #0006
}

.modal .close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: 700;
    margin-top: -10px
}

.modal .close:focus,.modal .close:hover {
    color: #000;
    text-decoration: none;
    cursor: pointer
}

.modal .modal-content {
    background-color: #343538;
    margin: 15% auto;
    padding: 20px;
    width: 20%;
    min-width: 250px
}

.modal .modal-buttons {
    display: flex;
    justify-content: center;
    margin-top: 20px
}

.modal .cancel-button {
    background-color: #fff;
    color: #000;
    border: 1px solid #b8b8b8
}

.hover-card:not(.thread-card) {
    height: 128px
}

.hover-card {
    transition: background-color .05s linear;
    border-radius: 5px;
    overflow: hidden
}

.hover-card:not(:last-of-type) {
    margin-bottom: 5px;
    margin-top: 5px
}

.hover-card:not(.np) {
    padding: 5px
}

.hover-card.viewed {
    background-color: #2e2f31
}

.hover-card:hover {
    background-color: #2c2d2f
}

.hover-card.clan .clan-logo {
    height: 100%;
    width: 10%;
    margin-right: 1%;
    float: left;
    min-width: 114px
}

.hover-card.clan .clan-logo img {
    height: 100%;
    width: 100%
}

.hover-card.clan .clan-stats {
    width: 86%;
    float: left
}

.hover-card .clan-description {
    overflow: hidden;
    max-height: 200px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    text-overflow: -o-ellipsis-lastline
}

.hover-card .data-trade {
    height: 100%
}

.more-popover {
    position: absolute;
    visibility: hidden;
    z-index: 1000;
    opacity: 0;
    transition: visibility .2s,opacity .2s linear
}

.more-popover.active {
    visibility: visible;
    opacity: 1
}

.more-popover li:not(:first-child):not(:last-child) * {
    border-radius: 0
}

.more-popover li:first-child * {
    border-radius: 5px 5px 0 0
}

.more-popover li:last-child * {
    border-radius: 0 0 5px 5px
}

.more-popover li:only-child * {
    border-radius: 5px
}

.more-popover ul {
    box-shadow: 0 2px 20px #0000004d;
    border-radius: 5px;
    list-style-type: none;
    top: -13px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.more-popover li {
    min-width: 125px
}

.more-popover li * {
    color: #000;
    background-color: #fff;
    border-radius: 5px;
    padding: 10px 0 10px 5px;
    display: block;
    transition: background-color .1s
}

.more-popover li :hover {
    background-color: #f4f4f4
}

.more-popover.user li * {
    background-color: #636363;
    color: #fff;
    padding-right: 70px
}

.more-popover.user li :hover {
    background-color: #585858
}

dropdown {
    display: none
}

#dropdown-v div,.dropdown {
    position: absolute;
    margin-right: 5px
}

.dropdown-content {
    position: absolute;
    z-index: 1000;
    visibility: hidden;
    opacity: 0;
    transition: visibility .2s,opacity .2s ease-in-out
}

.dropdown-content.active {
    display: block;
    visibility: visible;
    opacity: 1
}

.dropdown-content.logout-dropdown li * {
    color: #fff;
    background-color: #636363
}

.dropdown-content.logout-dropdown li :hover {
    background-color: #585858
}

.dropdown-content.logout-dropdown .dropdown-arrow {
    border-bottom: 7px solid #636363
}

.dropdown-content .dropdown-arrow {
    z-index: 500;
    left: 50%;
    margin-left: -7px;
    position: absolute;
    top: -20px;
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #343538
}

.dropdown-content .user li * {
    background-color: #343538;
    color: #fff;
    padding-right: 70px
}

.dropdown-content li :hover {
    background-color: #2c2d2f
}

.dropdown-content li {
    cursor: pointer;
    min-width: 125px
}

.dropdown-content li * {
    background-color: #343538;
    padding: 10px 0 10px 5px;
    display: block;
    transition: background-color .1s
}

.dropdown-content li:only-child * {
    border-radius: 5px
}

.dropdown-content ul,.dropdown-content .dropdown-data {
    box-shadow: 0 2px 20px #0000004d;
    overflow-y: hidden;
    border-radius: 5px;
    list-style-type: none;
    top: -13px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #343538
}

.pages {
    text-align: center
}

.pages.red .page.active {
    color: #af1111
}

.pages.green .page.active {
    color: #1d6918
}

.pages.blue .page.active {
    color: #1c4788
}

.pages.orange .page.active {
    color: #cab124
}

.pages .page {
    color: #b8b8b8;
    padding: 5px;
    font-weight: 600;
    cursor: pointer
}

.pages .page:not(:last-child) {
    padding-right: 5px
}

.pages .page.active {
    color: #196fb5
}

.fieldset {
    border: 2px solid #999;
    border-radius: 3px
}

.fieldset legend {
    font-size: .9rem;
    text-transform: capitalize;
    color: #999;
    font-weight: 600
}

.fieldset.red {
    border-color: #fe5746
}

.fieldset.red legend {
    color: #fe5746
}

.fieldset.green {
    border-color: #7cdc83
}

.fieldset.green legend {
    color: #7cdc83
}

.m0 {
    margin: 0!important
}

.m1 {
    margin: 5px
}

.m2 {
    margin: 10px
}

.m3 {
    margin: 15px
}

.m4 {
    margin: 20px
}

.m5 {
    margin: 25px
}

.m6 {
    margin: 30px
}

.ml0 {
    margin-left: 0!important
}

.ml1 {
    margin-left: 5px
}

.ml2 {
    margin-left: 10px
}

.ml3 {
    margin-left: 15px
}

.ml4 {
    margin-left: 20px
}

.ml5 {
    margin-left: 25px
}

.ml6 {
    margin-left: 30px
}

.mr0 {
    margin-right: 0!important
}

.mr1 {
    margin-right: 5px
}

.mr2 {
    margin-right: 10px
}

.mr3 {
    margin-right: 15px
}

.mr4 {
    margin-right: 20px
}

.mr5 {
    margin-right: 25px
}

.mr6 {
    margin-right: 30px
}

.mt0 {
    margin-top: 0!important
}

.mt1 {
    margin-top: 5px
}

.mt2 {
    margin-top: 10px
}

.mt3 {
    margin-top: 15px
}

.mt4 {
    margin-top: 20px
}

.mt5 {
    margin-top: 25px
}

.mt6 {
    margin-top: 30px
}

.mb0 {
    margin-bottom: 0!important
}

.mb1 {
    margin-bottom: 5px
}

.mb2 {
    margin-bottom: 10px
}

.mb3 {
    margin-bottom: 15px
}

.mb4 {
    margin-bottom: 20px
}

.mb5 {
    margin-bottom: 25px
}

.mb6 {
    margin-bottom: 30px
}

.p0 {
    padding: 0!important
}

.p1 {
    padding: 5px
}

.p2 {
    padding: 10px
}

.p3 {
    padding: 15px
}

.p4 {
    padding: 20px
}

.p5 {
    padding: 25px
}

.p6 {
    padding: 30px
}

.pl0 {
    padding-left: 0!important
}

.pl1 {
    padding-left: 5px
}

.pl2 {
    padding-left: 10px
}

.pl3 {
    padding-left: 15px
}

.pl4 {
    padding-left: 20px
}

.pl5 {
    padding-left: 25px
}

.pl6 {
    padding-left: 30px
}

.pr0 {
    padding-right: 0!important
}

.pr1 {
    padding-right: 5px
}

.pr2 {
    padding-right: 10px
}

.pr3 {
    padding-right: 15px
}

.pr4 {
    padding-right: 20px
}

.pr5 {
    padding-right: 25px
}

.pr6 {
    padding-right: 30px
}

.pt0 {
    padding-top: 0!important
}

.pt1 {
    padding-top: 5px
}

.pt2 {
    padding-top: 10px
}

.pt3 {
    padding-top: 15px
}

.pt4 {
    padding-top: 20px
}

.pt5 {
    padding-top: 25px
}

.pt6 {
    padding-top: 30px
}

.pb0 {
    padding-bottom: 0!important
}

.pb1 {
    padding-bottom: 5px
}

.pb2 {
    padding-bottom: 10px
}

.pb3 {
    padding-bottom: 15px
}

.pb4 {
    padding-bottom: 20px
}

.pb5 {
    padding-bottom: 25px
}

.pb6 {
    padding-bottom: 30px
}

.search-user-card {
    height: 100px
}

.search-user-card img {
    height: 80px;
    width: 80px;
    margin-right: 10px
}

.search-user-card .description {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    width: 80%;
    white-space: normal
}

.clan-img-holder {
    border-radius: 5px;
    background-color: #2d2e31;
    width: 225px;
    height: 225px
}

.clan-img-holder img {
    height: 100%;
    width: 100%
}

.clan-edit-ranks table h5 {
    margin-bottom: 0;
    margin-top: 5px
}

.edit-member .clan-member {
    position: relative;
    padding-bottom: 0
}

.clan-member {
    display: inline-block;
    padding: 12px;
    text-align: center
}

.edit-member select {
    width: 25%;
    display: block;
    min-width: 115px;
    font-size: 14px
}

.clan-relation .clan-name {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 5px;
    max-width: 145px
}

.clan-relation .clan-form {
    display: inline-block;
    position: absolute;
    top: 50%;
    transform: translateY(-65%);
    margin-left: 150px
}

.slick-slide {
    display: inline-block
}

.carousel {
    overflow: hidden;
    position: relative
}

.carousel ul li {
    display: inline-block
}

.carousel-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 3px;
    padding: 5px;
    transition: background-color .1s linear;
    z-index: 999
}

.carousel-button:hover {
    background-color: #0000001a
}

.carousel-button.left {
    border-left: 0;
    left: 0
}

.carousel-button.right {
    border-right: 0;
    right: 0
}

.forum-links .inline {
    display: inline-block
}

.forum-links .content {
    overflow: hidden
}

.forum-links a {
    color: #d2d2d2;
    padding: 0 10px
}

.forum-links .inline .inline {
    display: inline-block
}

.m0.thread-card {
    padding: 10px;
    border-radius: 0
}

.divide {
    width: 1px;
    height: 100%;
    background-color: #303133;
    padding: 10px 1px 10px 0
}

.forum-tag {
    position: relative;
    background: #303133;
    border-radius: 4px;
    padding: 6px 8px;
    color: #fff;
    float: right
}

.forum-tag:after {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    border-right-color: #303133;
    border-width: 5px;
    margin-top: -5px
}

.thread-label {
    font-size: .6em;
    color: #fff;
    margin-right: 4px;
    padding: 4px;
    border-radius: 4px
}

.thread-label.blue {
    background-color: #869eff
}

.thread-label.green {
    background-color: #54a84a
}

.thread-label.red {
    background-color: #ff8686
}

.thread-label.orange {
    background-color: #e5c765
}

.thread {
    overflow: auto;
    margin-bottom: 10px
}

.thread-row {
    position: relative;
    overflow: auto
}

.thread-row .p {
    word-wrap: break-word;
    margin-bottom: 10px
}

.thread-row:last-child {
    border-bottom: 0
}

@media handheld,only screen and (max-width: 767px) {
    .forum-links .content {
        overflow-x:scroll
    }

    .forum-links {
        display: block
    }
}

.content .board div.stat {
    text-align: center;
    padding-top: 20px;
    padding-right: 0
}

.stat .title {
    font-weight: 500;
    font-size: .9em;
    color: #d2d2d2
}

.board-info a {
    color: #d2d2d2
}

.card .topic div.stat {
    padding-right: 0
}

.board-info {
    height: 60px
}

.forum-bar a {
    color: #d4d4d4
}

.forum-bar .fa-angle-double-right {
    color: #bababa;
    padding: 0 5px
}

.forum-options {
    color: #9e9e9e
}

.admin-forum-options a,.admin-forum-options button {
    color: #9e9e9e;
    display: inline-block;
    text-decoration: none;
    font-weight: 500;
    font-size: 16px;
    background-color: #0000;
    border: none;
    padding: 0 20px 0 0
}

.admin-forum-options form {
    display: inline-block
}

.report:hover {
    color: #c60000;
    cursor: pointer
}

.forum-reply:hover {
    color: #196fb5
}

.forum-quote:hover {
    color: #2fb621
}

.membership-holder .membership-header {
    min-height: 128px;
    position: relative
}

.membership-holder .membership-header.ace {
    background-color: #dc0f18
}

.membership-holder .membership-header.royal {
    background-color: #e08733
}

.membership-holder .membership-icon {
    transform: scale(2);
    margin: 18px 0 0 18px
}

.membership-holder .membership-text {
    margin-left: 60px;
    margin-top: 10px;
    display: inline-block
}

.membership-holder .membership-perks div {
    padding-bottom: 5px
}

.membership-holder .membership-bkg {
    position: absolute;
    right: 0
}

.membership-holder .membership-items {
    position: absolute;
    right: 0;
    height: 128px
}

.membership-buttons {
    padding: 10px;
    border: 1px solid #232121;
    border-top: 0;
    text-align: center
}

.membership-buttons .membership-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 100px;
    padding-right: 0;
    margin: 0 12px;
    width: calc(33.3% - 30px)
}

@media handheld,only screen and (max-width: 767px) {
    .membership-buttons .membership-button {
        width:100%;
        margin: 0 0 10px
    }
}

.membership-buttons .membership-button.gray {
    cursor: default;
    background: linear-gradient(0deg,#636363 0%,#8b8b8b 100%)
}

.membership-buttons .membership-button.ace {
    background: linear-gradient(0deg,#DC0F18 0%,#FE292B 100%)
}

.membership-buttons .membership-button.royal {
    background: linear-gradient(0deg,#E08733 0%,#F4A244 100%)
}

.membership-buttons .membership-button.bucks {
    background: linear-gradient(0deg,#00832C 0%,#00AD39 100%)
}

.membership-buttons .membership-button .membership-average {
    width: 100%;
    position: absolute;
    bottom: 0;
    padding: 5px
}

.membership-buttons .membership-button .membership-average.gray {
    background-color: #535353
}

.membership-buttons .membership-button .membership-average.ace {
    background-color: #a70d13
}

.membership-buttons .membership-button .membership-average.royal {
    background-color: #a96626
}

.membership-buttons .membership-length {
    position: absolute;
    transform: translateY(-125%)
}

.membership-buttons .membership-month {
    margin: 5px 0 0 2px
}

.membership-buttons .bucks-amount {
    position: absolute;
    transform: translateY(-50%)
}

.membership-buttons .bucks-price {
    position: absolute;
    transform: translateY(50%)
}

@media(max-width: 1100px) {
    .membership-bkg,.membership-items {
        display:none
    }
}

.payment-form-simple {
    margin-bottom: 10px
}

.payment-form-options {
    margin-top: -5px
}

.payment-form-options .payment-form-spacer {
    margin-bottom: 10px
}

.payment-form-options .payment-form-spacer img {
    position: relative;
    top: 6px;
    width: 40px
}

.lottery-winners .lottery-winner {
    max-width: 128px;
    margin: 0 10px
}

.lottery-winners img {
    width: 128px
}

.lottery-button.plain {
    padding: 15px 50px;
    margin-top: 10px;
    background: linear-gradient(0deg,#00832C 0%,#00AD39 100%)
}

.grid .col-1-4.set {
    padding-left: 10px;
    padding-right: 10px
}

.grid .col-1-4.set .thumbnail img {
    max-height: 144px
}

.card .game-name {
    height: 25px;
    display: block
}

.download-page {
    color: #fff
}

.download-page .splash {
    width: 500px;
    height: 423px;
    position: absolute;
    right: 0;
    top: 0
}

.download-page a.download {
    text-decoration: none
}

.download-page a.download h5 {
    margin: 0
}

.download-page a.download:hover button {
    cursor: pointer;
    box-shadow: 0 2px 5px #0003
}

.download-page .holder {
    position: relative
}

.download-page .holder.legacy button.nh-button {
    border-color: #95b90b;
    background-color: #0000;
    padding: 0 10px
}

.download-page .holder.legacy {
    height: 423px
}

.download-page .holder.experimental {
    background: linear-gradient(90deg,rgb(0,145,236) 0%,rgb(1,169,254) 50%,rgb(88,198,254) 100%)
}

.download-page .holder.experimental .grid {
    padding-top: 50px;
    position: relative;
    padding-bottom: 0
}

.download-page .buy-button-holder {
    margin-top: 150px
}

.download-page .holder.blogs {
    background: linear-gradient(180deg,rgb(36,36,38) 0%,rgb(19,19,21) 100%)
}

.download-page .holder.experimental .buy-button {
    position: relative;
    border-radius: 2px;
    border: none;
    background-color: #fff;
    font-size: 2.3em;
    color: #01a9fe;
    padding: 20px 40px
}

.download-page .buy-button div {
    color: #a6a6ad;
    font-size: 15px;
    font-weight: 500;
    text-transform: initial
}

.download-page .other-versions {
    padding: 15px;
    cursor: pointer;
    margin-bottom: 25px
}

.download-page .workshop-brick {
    float: left;
    max-width: 100%;
    width: 350px;
    height: 218px
}

.download-page .brick-text {
    padding-top: 50px
}

.download-page .detailed-info {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-right: 0;
    margin: 0 8px 50px;
    width: calc(33.3% - 20px)
}

.download-page .detailed-info img {
    height: 100%;
    width: 100%
}

.download-page .detailed-info .creator {
    font-style: italic;
    color: #cbcbd3;
    height: 0;
    overflow: hidden;
    transition: height .1s
}

.download-page .detailed-info:hover .creator {
    height: 20px
}

.download-page .detailed-info img {
    border-radius: 2px
}

.download-page .bottom-text {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 12px 12px 9px;
    background-color: #403f3f7a;
    color: #fff
}

.download-page .tile2 {
    display: inline;
    position: absolute;
    width: 452px;
    height: 322px;
    border-radius: 2px;
    z-index: 4;
    right: -139px;
    content: url(https://css.brkcdn.com/images/0abbf3621c342dd99bf5.png)
}

.download-page .tile4 {
    display: inline;
    position: absolute;
    border-radius: 2px;
    content: url(https://css.brkcdn.com/images/9e693e9de915c6b618f1.png)
}

.download-page .workshop-brick {
    content: url(https://css.brkcdn.com/images/735f18f6c6504fe6fa7e.png)
}

.download-page .splash.shuttle {
    content: url(https://css.brkcdn.com/images/58143be7c2568468f410.png)
}

.download-page .performance-upgrades {
    content: url(https://css.brkcdn.com/images/54dd553ac066ac3043bd.png)
}

.download-page .mats-surfaces {
    content: url(https://css.brkcdn.com/images/c96d18d233631f66effe.png)
}

.download-page .intuitive-controls {
    content: url(https://css.brkcdn.com/images/f5e4c756c19e94905448.png)
}

.download-page .new-envs {
    content: url(https://css.brkcdn.com/images/61b70bd0dacc0083a29d.png)
}

.download-page .dynamic-lighting {
    content: url(https://css.brkcdn.com/images/83d34e1647ab4a3992f6.png)
}

.download-page .ongoing-dev {
    content: url(https://css.brkcdn.com/images/9ec9ad30157caded9bce.png)
}

@media handheld,only screen and (max-width: 1430px) {
    .download-page .tile2 {
        display:none
    }
}

@media handheld,only screen and (max-width: 1200px) {
    .download-page .tile4 {
        position:relative
    }
}

@media handheld,only screen and (max-width: 767px) {
    .download-page .tile4 {
        display:none
    }

    .download-page .detailed-info {
        margin: 0 0 8px;
        width: calc(50% - 3px)
    }
}

@media handheld,only screen and (max-width: 512px) {
    .download-page .detailed-info {
        margin:0 0 8px;
        width: 100%
    }

    .download-page .holder.experimental .buy-button {
        font-size: 1em
    }
}

@media handheld,only screen and (min-width: 1200px) {
    .download-page .tile4 {
        width:550px;
        height: 322px;
        top: -40px;
        right: -23px
    }
}

.shake {
    animation: shake .5s;
    animation-iteration-count: infinite;
    overflow: hidden
}

.bomb-overlay {
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 10000000;
    transition: background-color 1.5s ease-out
}

.bomb-overlay.white {
    background-color: #fff
}

@keyframes shake {
    0% {
        transform: translate(1px,1px) rotate(0)
    }

    10% {
        transform: translate(-1px,-2px) rotate(-1deg)
    }

    20% {
        transform: translate(-3px) rotate(1deg)
    }

    30% {
        transform: translate(3px,2px) rotate(0)
    }

    40% {
        transform: translate(1px,-1px) rotate(1deg)
    }

    50% {
        transform: translate(-1px,2px) rotate(-1deg)
    }

    60% {
        transform: translate(-3px,1px) rotate(0)
    }

    70% {
        transform: translate(3px,1px) rotate(-1deg)
    }

    80% {
        transform: translate(-1px,-1px) rotate(1deg)
    }

    90% {
        transform: translate(1px,2px) rotate(0)
    }

    to {
        transform: translate(1px,-2px) rotate(-1deg)
    }
}

.shop-categories {
    display: flex
}

.shop-categories .category {
    flex: 1;
    color: #d2d2d2;
    text-align: center
}

.shop-categories .category a:hover,.shop-categories .category.active {
    font-weight: 600;
    color: #dfdfdf;
    cursor: pointer
}

.card .item-creator {
    overflow: hidden;
    color: #dfdfdf;
    font-size: .9em
}

.item-page {
    position: relative
}

.comment {
    overflow: hidden;
    position: relative
}

.comment .user-link {
    position: relative
}

.comment img {
    width: 100%;
    max-width: 150px
}

.comment .comment-holder {
    white-space: normal
}

.card .item-card-details,.card .item-content {
    font-weight: 500;
    background-color: #2f3033;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border-top: 1px solid #303133;
    padding: 10px;
    max-height: 81px
}

.card .item-card-details .price,.card .item-content .price {
    overflow: hidden;
    padding-top: 4px;
    color: #515151
}

@media handheld,only screen and (max-width: 767px) {
    .shop-categories {
        overflow-x:scroll
    }

    .shop-categories .category {
        flex: none;
        font-size: 14px;
        display: inline-block;
        padding-right: 15px;
        padding-bottom: 10px
    }
}

@media handheld,only screen and (min-width: 767px) {
    .shop-bar {
        height:110px
    }

    .shop-bar .card {
        height: 100px
    }
}

.sellers .seller {
    position: relative
}

.sellers .seller .owner img {
    width: 100px;
    display: inline-block
}

.sellers .price {
    right: 0;
    position: absolute;
    top: 45%;
    transform: translateY(-50%)
}

.sellers .price .serial {
    font-size: .8em;
    color: #dfdfdf;
    text-align: right
}

.sellers .seller:not(:last-child) {
    padding-bottom: 5px;
    margin-bottom: 10px;
    border-bottom: 1px solid #303133
}

.tabs .tab-holder .tab-body .recommended-item {
    padding-left: 10px;
    padding-right: 10px;
    text-align: center
}

.file-img-box {
    border: 1px solid #d9d9d9;
    width: 156px;
    height: 156px;
    margin: auto auto 10px
}

.file-img-box img {
    height: 100%;
    width: 100%;
    box-sizing: content-box
}

.upload-preview-box img {
    height: 100%;
    margin: auto;
    box-sizing: content-box
}

.upload-preview-box {
    position: relative;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    text-align: center;
    padding: 5px;
    height: 256px;
    width: 256px;
    margin: auto
}

#upload-file-img,#upload-file-model {
    width: .1px;
    height: .1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1
}

#upload-label {
    cursor: pointer;
    padding: 5px
}

.upload-label {
    display: block;
    margin-top: 5px;
    text-align: left;
    font-weight: 600
}

.upload-input {
    margin-bottom: 10px;
    display: block
}

.tfa-input-holder {
    margin-bottom: 5px
}

.tfa-input-holder input {
    margin: 3px;
    width: 26px
}

.recovery-code {
    margin-top: 5px;
    user-select: none
}

.recovery-code span {
    color: #0909a7
}

.old-theme.trade-picker {
    margin-top: 10px;
    overflow: hidden;
    overflow-y: scroll;
    border-radius: 5px;
    background-color: #343538;
    max-height: 1024px
}

.old-theme.trade-picker hr {
    margin: 4px
}

.old-theme.trade-picker .trade {
    height: 72px;
    position: relative;
    cursor: pointer
}

.old-theme.trade-picker .trade:hover {
    background-color: #2c2d2f
}

.old-theme.trade-picker .trade.selected {
    background-color: #2e2f31;
    border-left: 4px solid #ce1b1b
}

.old-theme.trade-picker .trade-status {
    position: absolute;
    bottom: 5px;
    right: 10px
}

.old-theme.trade-picker .trade-date {
    position: absolute;
    top: 5px;
    right: 10px
}

.old-theme.trade-picker .trade-user-thumbnail {
    float: left;
    width: 64px;
    margin: 4px
}

.user-description-box.closed {
    max-height: 100px;
    white-space: normal;
    overflow: hidden;
    position: relative
}

.user-description-box:not(.closed) .user-desc {
    padding-bottom: 24px
}

.toggle-user-desc {
    white-space: normal;
    word-break: break-word;
    min-height: 100px
}

.toggle-user-desc:not(.open):after {
    background-color: #343538;
    color: gray;
    position: absolute;
    content: "...";
    text-align: right;
    height: 24px;
    padding-left: 5px;
    bottom: -1px;
    right: 0;
    width: 100%
}

.read-more-desc {
    position: absolute;
    right: 0;
    bottom: -5px;
    padding: 0 5px 2px 0;
    margin-bottom: 1px;
    z-index: 1000;
    background-color: #343538
}

.read-more-desc:hover {
    cursor: pointer
}

.user-description-box {
    position: relative
}

.friends-list li {
    text-align: center;
    padding: 0 2px
}

.friends-list li div {
    width: 100%
}

.profile-card {
    width: 128px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    border-radius: 5px;
    transition: background-color 50ms linear;
    padding: 2px;
    text-align: center
}

.profile-card.award img {
    height: 128px;
    border: 1px solid #232121;
    border-radius: 5px
}

.profile-card:hover {
    background-color: #2c2d2f
}

.profile-card:not(.not-padded):not(:nth-child(3n)) {
    margin-right: 5px
}

.profile-card:not(.crate) img {
    height: 124px;
    width: 124px
}

.profile-card.crate img {
    width: 100%;
    border: 1px solid #232121;
    background-color: #343538;
    border-radius: 5px;
    padding: 5px
}

.profile-card.crate {
    padding: 7px;
    width: 100%
}

.profile-card.crate:not(:nth-child(5n)) {
    margin-right: 1px
}

.friend-card {
    width: 18.5%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    border-radius: 5px;
    transition: background-color 50ms linear;
    padding: 2px;
    text-align: center
}

.friend-card:hover {
    background-color: #2c2d2f
}

.friend-card img {
    height: 150px;
    width: 150px
}

.friend-card button {
    margin-top: 5px;
    margin-bottom: 5px
}

.trade-serial {
    position: absolute;
    margin: 4px;
    border-radius: 4px;
    padding: 3px;
    background-color: #343538;
    font-size: 15px
}

.status-dot {
    float: none;
    display: inline-block;
    margin-bottom: 3px;
    background-color: #a2a2a2;
    border-radius: 50%;
    width: 10px;
    height: 10px
}

.status-dot.online {
    background-color: #00ab00
}

.award-card {
    height: 128px
}

.award-card img {
    width: 128px;
    float: left;
    height: 100%;
    margin-right: 10px
}

.crate-types {
    border-right: 2px solid #232121;
    padding-right: 5px
}

.crate-types li {
    cursor: pointer;
    padding: 10px;
    transition: background-color .1s linear
}

.crate-types li:first-child {
    border-radius: 3px 3px 3px 0
}

.crate-types li:last-child {
    border-radius: 0 3px 3px
}

.crate-types .active,.crate-types :hover {
    background-color: #2c2d2f;
    border-left: 4px solid #ce1b1b
}

.crate-types :hover {
    background-color: #2c2d2f
}

.set-list .set-slider,.set-list .set-slider li,.set-list .set-slider ul {
    height: 100%
}

.set-list .set.active {
    display: block
}

.set-list .set:not(.active) {
    display: none
}

.set-list .set-title {
    font-weight: 600;
    font-size: 1.5rem
}

.set-list .set-stats {
    text-align: center;
    padding: 20px 20px 0
}

.set-list .set-stats li {
    width: 50%;
    display: inline-block
}

.set-list .set-stats li div:first-child {
    color: #797979
}

.slider-button {
    top: 175px;
    position: absolute;
    text-align: center;
    color: #000;
    z-index: 1000;
    padding: 5px;
    transition: background-color .1s linear
}

.slider-button:hover {
    background-color: #0000003d
}

.slider-button.left {
    border-radius: 0 3px 3px 0;
    border-left: 0
}

.slider-button.right {
    border-radius: 3px 0 0 3px;
    border-right: 0;
    right: 0
}

.register-checkbox {
    border-radius: 3px;
    border: 1px solid #d9d9d9;
    padding: 3px;
    margin: 0;
    width: 100%
}

select.register {
    width: 100%;
    -webkit-appearance: none;
    border: 1px solid #d9d9d9
}

select.register.no-rad {
    border-radius: 0;
    border-left: 0;
    border-right: 0
}

.avatar-card {
    width: 128px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    border-radius: 5px;
    padding: 2px;
    text-align: center
}

.avatar-card.crate {
    padding: 5px;
    width: 125px
}

.avatar-card.crate .img-holder {
    width: 100%;
    border: 1px solid #232121;
    border-radius: 5px;
    padding: 10px
}

.avatar-card.crate img {
    height: 95px;
    min-height: 95px
}

.avatar-card.crate:not(:nth-child(5n)) {
    margin-right: 1px
}

.loader {
    position: absolute;
    top: calc(50% - 25px);
    left: calc(50% - 25px);
    transform: translate(-50%,-50%);
    border: 3px solid #f3f3f3;
    border-top: 3px solid #3498db;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1.5s linear infinite
}

@keyframes spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.outfit-overlay {
    position: absolute;
    left: 1px;
    z-index: 10;
    padding: 5px;
    opacity: .87;
    background-color: #343538;
    width: calc(100% - 5px);
    height: calc(100% - 29px)
}

.outfit-overlay:not(.active) {
    display: none
}

.outfit-overlay li {
    font-size: 12px;
    padding: 5px;
    margin: 0 4px 5px;
    border-radius: 5px;
    transition: background-color .1s linear;
    cursor: pointer
}

.outfit-overlay li:hover {
    background-color: #869eff
}

.item-types {
    margin-bottom: 10px
}

.item-types a {
    font-size: 14.7px;
    cursor: pointer
}

.item-types a.active {
    font-weight: 600
}

.item-types a:not(.active):hover {
    text-decoration: underline
}

.settings input {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 5px
}

.settings select {
    min-width: 0;
    height: 30px;
    padding: 0 8px
}

.settings .tfa-qr-code svg {
    width: 90%!important
}

[class*=grid],[class*=col-],[class*=mobile-],.grid:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

[class*=col-] {
    float: left;
    min-height: 1px;
    padding-right: 20px
}

[class*=col-].swap-padding {
    padding-right: 0;
    padding-left: 20px
}

[class*=col-].swap-padding:first-child {
    padding-left: 0
}

[class*=col-]:last-child:not(.keep-col-padding) {
    padding-right: 0
}

[class*=col-].no-pad {
    padding: 0
}

.relative {
    position: relative
}

.inline {
    display: inline-block
}

.grid {
    width: 100%;
    max-width: 1140px;
    min-width: 748px;
    margin: 0 auto;
    overflow: visible
}

.main-holder {
    position: relative;
    overflow: visible;
    padding-bottom: 362px
}

@media handheld,only screen and (max-width: 767px) {
    .main-holder {
        padding-bottom:655px
    }
}

.grid:after {
    content: "";
    display: table;
    clear: both
}

.grid-pad {
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 0
}

.push-right {
    float: right
}

.col-1-1 {
    width: 100%
}

.col-4-5,.col-10-12 {
    width: 80%
}

.col-2-3,.col-8-12 {
    width: 66.66%
}

.col-1-2,.col-6-12 {
    width: 50%
}

.col-1-3,.col-4-12 {
    width: 33.33%
}

.col-3-10 {
    width: 30%
}

.col-1-4,.col-3-12 {
    width: 25%
}

.col-1-5 {
    width: 20%
}

.col-1-6,.col-2-12 {
    width: 16.667%
}

.col-1-7 {
    width: 14.28%
}

.col-1-8 {
    width: 12.5%
}

.col-1-9 {
    width: 11.1%
}

.col-1-10 {
    width: 10%
}

.col-1-11 {
    width: 9.09%
}

.col-1-12 {
    width: 8.33%
}

.col-11-12 {
    width: 91.66%
}

.col-10-12 {
    width: 83.333%
}

.col-9-12 {
    width: 75%
}

.col-5-12 {
    width: 41.66%
}

.col-7-12 {
    width: 58.33%
}

.push-2-3,.push-8-12 {
    margin-left: 66.66%
}

.push-1-2,.push-6-12 {
    margin-left: 50%
}

.push-1-3,.push-4-12 {
    margin-left: 33.33%
}

.push-1-4,.push-3-12 {
    margin-left: 25%
}

.push-1-5 {
    margin-left: 20%
}

.push-1-6,.push-2-12 {
    margin-left: 16.667%
}

.push-1-7 {
    margin-left: 14.28%
}

.push-1-8 {
    margin-left: 12.5%
}

.push-1-9 {
    margin-left: 11.1%
}

.push-1-10 {
    margin-left: 10%
}

.push-1-11 {
    margin-left: 9.09%
}

.push-1-12 {
    margin-left: 8.33%
}

.acc-1-2 {
    width: 46%;
    margin-right: 4%;
    float: left
}

.main-holder>.col-10-12.push-1-12 {
    padding-right: 0
}

@media only screen and (min-width: 767px) {
    .mobile-only {
        display:none!important;
        width: 0;
        height: 0
    }
}

@media handheld,only screen and (max-width: 767px) {
    .grid {
        width:100%;
        min-width: 0;
        margin-left: 0;
        margin-right: 0;
        padding-left: 10px;
        padding-right: 10px
    }

    [class*=col-] {
        width: auto;
        float: none;
        margin: 10px 0;
        padding-left: 0;
        padding-right: 10px
    }

    [class*=col-] [class*=col-]:not(.mobile-pad) {
        padding-right: 0
    }

    [class*=col-] [class*=col-]:not(.mobile-pad).swap-padding {
        padding-left: 0
    }

    [class*=mobile-col-] {
        float: left;
        margin: 0 0 10px;
        padding-left: 0;
        padding-right: 10px;
        padding-bottom: 0
    }

    .mobile-col-1-1 {
        width: 100%
    }

    .mobile-col-2-3,.mobile-col-8-12 {
        width: 66.66%
    }

    .mobile-col-1-2,.mobile-col-6-12 {
        width: 50%
    }

    .mobile-col-1-3,.mobile-col-4-12 {
        width: 33.33%
    }

    .mobile-col-1-4,.mobile-col-3-12 {
        width: 25%
    }

    .mobile-col-1-5 {
        width: 20%
    }

    .mobile-col-1-6,.mobile-col-2-12 {
        width: 16.667%
    }

    .mobile-col-1-7 {
        width: 14.28%
    }

    .mobile-col-1-8 {
        width: 12.5%
    }

    .mobile-col-1-9 {
        width: 11.1%
    }

    .mobile-col-1-10 {
        width: 10%
    }

    .mobile-col-1-11 {
        width: 9.09%
    }

    .mobile-col-1-12 {
        width: 8.33%
    }

    .mobile-col-11-12 {
        width: 91.66%
    }

    .mobile-col-10-12 {
        width: 83.333%
    }

    .mobile-col-9-12 {
        width: 75%
    }

    .mobile-col-5-12 {
        width: 41.66%
    }

    .mobile-col-7-12 {
        width: 58.33%
    }

    .hide-on-mobile {
        display: none!important;
        width: 0;
        height: 0
    }

    .tabs .tab,.tabs .tab.active {
        border: 1px solid #2f3033;
        border-radius: 5px
    }

    [class*=col-] .mobile-fill:first-child {
        width: 98%
    }

    .mobile-fill {
        width: 100%
    }

    [class*=col-] .mobile-half-fill {
        width: 49.5%
    }

    [class*=col-] .mobile-half-fill:nth-child(even) {
        margin-left: .5%
    }

    [class*=col-] .mobile-half-fill:nth-child(odd) {
        margin-right: .5%
    }

    .no-mobile {
        display: none!important
    }
}

.icon,.special-e-icon,.special-icon,.arrow-down,.messages-icon,.friends-icon,.bits-icon,.bucks-icon,.royal-icon,.ace-icon,.mint-icon {
    vertical-align: top;
    background-image: url(https://css.brkcdn.com/sprites/4b6c5f0d414a499a5ac6.svg);
    background-repeat: no-repeat;
    background-size: auto auto;
    display: inline-block
}

.mint-icon {
    margin-left: 3px;
    width: 24px;
    height: 24px;
    background-position: 0 0;
    vertical-align: sub
}

.ace-icon {
    margin-left: 3px;
    width: 24px;
    height: 24px;
    background-position: -29px 0;
    vertical-align: sub
}

.royal-icon {
    margin-left: 3px;
    width: 24px;
    height: 24px;
    background-position: -58px 0;
    vertical-align: sub
}

.bucks-icon {
    width: 22px;
    height: 20px;
    background-position: 0 -29px
}

.bits-icon {
    padding-right: 3px;
    width: 21px;
    height: 20px;
    background-position: -25px -29px
}

.friends-icon {
    padding-right: 3px;
    width: 20px;
    height: 20px;
    background-position: -50px -29px
}

.messages-icon {
    padding-right: 3px;
    width: 20px;
    height: 20px;
    background-position: -75px -29px
}

.arrow-down {
    padding-right: 3px;
    width: 17px;
    height: 19px;
    background-position: 0 -140px;
    vertical-align: text-bottom;
    margin-left: 10px
}

.special-icon {
    width: 60px;
    height: 60px;
    background-position: 1px -75px;
    position: absolute;
    top: 0;
    right: 0
}

.special-e-icon {
    width: 60px;
    height: 60px;
    background-position: -64px -75px;
    position: absolute;
    top: 0;
    right: 0
}

.owned-check-tri {
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    border-left: 50px solid transparent
}

.owned-check {
    height: 2em;
    font-size: 1em;
    transform: translateY(-135%) translate(-135%);
    color: #fff;
    text-align: center
}

.dropdown-arrow {
    font-size: 20px;
    color: #dfdfdf;
    cursor: pointer
}

.dropdown-arrow:hover {
    font-weight: 600
}

.item-more {
    font-size: 20px;
    color: #dfdfdf
}

.item-more:hover {
    font-weight: 600
}

.item-more-div {
    position: absolute;
    right: 0;
    margin-right: 5px;
    cursor: pointer
}

.owned-check-tri.special {
    border-top: 50px solid #ffd52d
}

.owned-check-tri.owns {
    border-top: 50px solid #4cb04c
}

.img-white {
    filter: brightness(0) invert(1)
}

@font-face {
    font-family: emote;
    src: url(https://css.brkcdn.com/font/fa6e8beec6d1d274c728.ttf),url(https://css.brkcdn.com/sprites/150dbd707ef7b5ad61c1.svg);
    font-weight: 400;
    font-style: normal
}

[class^=emote-]:before,[class*=" emote-"]:before {
    font-family: emote;
    font-style: normal;
    font-weight: 400;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.emote-happy:before {
    content: "\e800"
}

.emote-wink:before {
    content: "\e801"
}

.emote-sad:before {
    content: "\e802"
}

.emote-sleep:before {
    content: "\e803"
}

.emote-thumbsup:before {
    content: "\e804"
}

.emote-surprised:before {
    content: "\e806"
}

.emote-tongue:before {
    content: "\e807"
}

.emote-coffee:before {
    content: "\e808"
}

.emote-sunglasses:before {
    content: "\e809"
}

.emote-displeased:before {
    content: "\e80a"
}

.emote-grin:before {
    content: "\e80c"
}

.emote-angry:before {
    content: "\e80d"
}

.emote-saint:before {
    content: "\e80e"
}

.emote-cry:before {
    content: "\e80f"
}

.emote-squint:before {
    content: "\e811"
}

.emote-laugh:before {
    content: "\e812"
}

.emote-wink2:before {
    content: "\e813"
}
