body {
    background: #626d76;
    color: #000
}
body.as-no-scroll {
    overflow: hidden;
    padding-right: var(--as-sbw, 0px);
}

a,a:link,a:visited,a:hover,a:active {
    color: #258999
}

.as-button {
    box-shadow: 1px 1px 2px 0 rgba(90,90,90,1);
    color: #fff!important;
    background: #229bae;
    border: 1px solid #229bae
}

a.btn {
    color: white
}

.as-button-panel {
    color: #fff!important
}

.as-button-panel.btn-info {
    background: #229bae;
    border: 1px solid #229bae
}

.as-ads-leader {
    overflow: hidden;
    text-align: center;
    margin-top: 20px
}

.as-logo-holder {
    max-width: 424px
}

.as-logo-holder img {
    width: 100%;
    height: auto
}

.as-incontent {
    width: 100%!important;
    margin: 0!important;
    padding: 0;
    text-align: center;
    display: block!important
}

.as-label {
    font-family: Arial,Helvetica,sans-serif;
    font-weight: 300;
    letter-spacing: .75px;
    font-size: 12px;
    text-align: center;
    padding: 10px 0 6px;
    color: rgba(0,0,0,0.4);
    text-transform: uppercase
}

.as-unit {
    min-height: 90px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: stretch
}

.as-unit-base {
    display: flex;
    flex-basis: 728px;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.07)
}

.list-in-columns {
    column-count: 3
}

.main-nav {
    font-weight: bold;
    margin: 0;
    width: 100%;
    display: table;
    overflow: hidden
}

.main-nav li {
    padding: 0 5px 0 0;
    display: table-cell;
    text-align: center
}

.main-nav li:last-child {
    padding-right: 0
}

.main-nav a {
    color: #fff;
    display: block;
    border-radius: 4px 4px 0 0;
    overflow: hidden;
    border-top: 1px solid #98eafc;
    background: #98eafc;
    text-shadow: 1px 2px 0 rgba(0,0,0,.4)
}

.main-nav a>span {
    display: block;
    padding: 5px 4px 5px;
    border-radius: 5px 5px 0 0;
    background: #16869e;
    background: -webkit-linear-gradient(top,#8deafc 0,#00bcd9 3%,#00adca 23%,#00839a 67%,#00758b 83%,#005160 100%);
    background: linear-gradient(to bottom,#8deafc 0,#00bcd9 3%,#00adca 23%,#00839a 67%,#00758b 83%,#005160 100%);
    position: relative;
    z-index: 2;
    border-width: 0 1px;
    border-style: solid;
    border-color: #16869e;
    -webkit-border-image: -webkit-linear-gradient(top,#94e5f7,#0a5160) 1 100%;
    border-image: linear-gradient(to bottom,#94e5f7,#0a5160) 1 100%
}

.main-nav a>span:after {
    content: "";
    background: -webkit-linear-gradient(top,#3bc8e0 0,#32bdd5 36%,#129fb7 100%);
    background: linear-gradient(to bottom,#3bc8e0 0,#32bdd5 36%,#129fb7 100%);
    position: absolute;
    top: 0;
    height: 49%;
    right: 0;
    left: 0;
    border-radius: 3px;
    z-index: -1
}

.main-nav a:hover,.main-nav a:focus {
    background: #b6b7b8;
    border-color: #b6b7b8;
    text-decoration: none;
    color: #fff
}

.main-nav .active a {
    background: #b6b7b8;
    border-color: #b6b7b8
}

.main-nav a:hover>span,.main-nav .active a>span {
    background: #626d75;
    background: -webkit-linear-gradient(top,#818384 0,#787c7f 38%,#6a7379 79%,#616c74 100%);
    background: linear-gradient(to bottom,#818384 0,#787c7f 38%,#6a7379 79%,#616c74 100%);
    border-color: #626d75;
    -webkit-border-image: -webkit-linear-gradient(top,#b2b3b4,#626c74) 1 100%;
    border-image: linear-gradient(to bottom,#b2b3b4,#626c74) 1 100%
}

.main-nav a:hover>span:after,.main-nav .active a>span:after {
    background: -webkit-linear-gradient(top,#97999a 0,#8e9193 57%,#83898c 100%);
    background: linear-gradient(to bottom,#97999a 0,#8e9193 57%,#83898c 100%)
}

.as-nav {
    background-color: #626d76!important;
    box-shadow: 0 1px 2px 0 rgba(50,50,50,1)
}

.navbar-nav li>a,.navbar-brand,.navbar-text {
    text-shadow: 2px 2px 2px rgba(90,90,90,1)
}

.nav-link {
    color: #bcbcbc!important;
    margin-left: 10px
}

.nav-link:hover,.active .nav-link {
    color: white!important
}

.dropdown-item {
    color: grey!important
}

.dropdown-item:hover {
    color: black!important
}

.dropdown-item:active {
    background: #229bae;
    color: white!important
}

.as-game-menu-standout {
    color: #229bae!important
}

.as-navbar-social {
    padding-bottom: 0;
    border: 0;
    overflow: hidden
}

header {
    background: #000 url("../png/bg-pattern.png") repeat-x;
    background-position: 0 -50px;
    border-bottom: 10px solid #626d75;
}

.as-search-button {
    background: white;
    color: grey
}

.as-search-button:hover,.as-search-button:active {
    background: white!important;
    color: black!important
}

.sub-nav a {
    margin-right: 5px;
    border-radius: 20px;
    margin-bottom: 10px
}

.sub-nav a:last-child {
    margin-right: 0
}

.breadcrumb {
    background: transparent;
    padding: 0;
    margin: 0
}

.as-wrapper {
    display: block;
    background: linear-gradient(to bottom,#b4b9ba 0,#cbcbcb 5%)
}

.as-wrapper:before,.as-wrapper:after {
    content: "";
    display: table
}

.as-main-title {
    margin: 0;
    padding: 0
}

.as-game-container {
    display: flex;
    flex-direction: row
}

.as-game-more {
    text-align: left;
    font-size: 14px;
    flex-basis: 200px;
    flex-shrink: 0
}

.as-game-main {
    flex-grow: 0;
    width: 100%
}

.as-game-list {
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-align: center
}

.as-game-list li {
    display: inline-flex;
    width: 184px;
    padding-right: 12px;
    padding-left: 12px;
    margin-bottom: 24px
}

.as-game-box img:not([src]) {
    visibility: hidden
}

.as-game-box {
    position: relative;
    display: block;
    color: white!important;
    padding: 0;
    margin: 0;
    width: 100%;
    min-height: 120px;
    box-shadow: 0 .5rem .9rem rgba(0,0,0,.15);
    border-radius: 7px;
    text-decoration: none
}

a.as-game-box {
    text-decoration: none
}

.as-game-box img {
    width: 100%;
    height: auto;
    border-radius: 7px 7px 0 0
}

.as-game-box-title {
    display: block;
    background: rgba(0,0,0,.6);
    padding: 5px;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
    border-radius: 0 0 7px 7px;
    color: white
}

.as-game-box:hover .as-game-box-title {
    background: black
}

.as-game-box-badge {
    position: absolute;
    top: 5px;
    right: 5px
}

.as-game-box-badge-mobile {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 20px;
    border-radius: 7px 0 7px 0;
    box-shadow: 0 0 3px 0 rgba(90,90,90,1)
}

.pagination .page-item.active .page-link {
    background: #229bae;
    border-color: #229bae
}

.pagination .page-item:not(.active) .page-link:hover,.pagination .page-item:not(.active) .page-link:active {
    color: #229bae
}

.as-text-box {
    border: 1px solid rgba(0,0,0,0.2);
    color: rgba(0,0,0,0.5);
    font-size: .9em;
    border-radius: 5px
}

.as-text-box p:last-child {
    margin-bottom: 0
}

footer {
    background: #626d76;
    font-size: .9em
}

footer .nav-link {
    text-shadow: 2px 2px 2px rgba(90,90,90,1);
    padding: 0;
    margin-right: 10px
}

.as-wrapper-like {
    display: inline-block
}

.as-topbar {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    background: rgba(255,255,255,0.2)
}

.as-topbar h1 {
    margin-bottom: 7px;
    margin-right: 7px
}

.as-topbar .ratings {
    position: relative;
    margin-right: 104px;
    margin-top: 3px;
    margin-bottom: 7px
}

.as-topbar .ratings .game-rating {
    color: #b74825;
    text-shadow: 0 0 2px #777;
    width: 90px;
    margin: 0;
    padding: 0
}

.as-topbar .rating-value {
    position: absolute;
    top: 0;
    left: 97px;
    width: 42px;
    height: 24px;
    word-break: break-all;
    overflow: hidden;
    background: rgba(255,255,255,0.7);
    border-radius: 12px;
    padding-left: 4px;
    padding-right: 4px;
    color: #555
}

.as-topbar .rating-count {
    display: inline-block;
    height: 40px;
    float: right;
    margin-left: 8px;
    position: absolute;
    left: 135px;
    top: 0;
    color: #555
}

.game-wrapper {
    display: flex;
    flex-direction: row;
    flex: 1;
    align-items: center;
    flex-wrap: wrap;
    padding: 0 20px 12px 20px;
    overflow: hidden
}

.game-box {
    margin: 0 auto;
    text-align: center
}

.game-deskbox {
    position: relative
}

.gamebar-left {
    flex: 1 0 auto;
    order: 1;
    text-align: right
}

.gamebar-right {
    flex: 1 0 auto;
    order: 3;
    text-align: left
}

.gamebar-left-games {
    max-width: 128px;
    float: right;
    margin-right: 16px
}

.gamebar-right-games {
    max-width: 128px;
    float: left;
    margin-left: 16px
}

.as-related-title {
    line-height: inherit;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.as-related-game {
    min-height: inherit;
    margin-bottom: 12px
}

.as-related-resize {
    height: 80px;
    overflow: hidden
}

.as-related-resize img {
    width: 100%;
    height: auto
}

.as-wrapper-info {
    background: #9da4a68b
}

.as-wrapper-info .as-text-box {
    border-color: rgba(0,0,0,0.2);
    color: rgba(0,0,0,0.5)
}

.as-info-box-img {
    display: inline-block;
    text-align: center;
    width: 120px;
    float: left;
    border-radius: 7px
}

.as-info-box-img img {
    width: 100%;
    height: auto;
    border-radius: 7px
}

.as-info-box-rating {
    display: block;
    background: rgba(255,255,255,0.4);
    font-size: .9em;
    padding: 5px;
    border-radius: 0 0 7px 7px
}

.as-info-box-tags a {
    margin-bottom: 5px;
    margin-right: 4px;
    color: white
}

.as-info-box-controls div {
    margin: 0 0 9.5px
}

.as-related-list {
    background: rgba(255,255,255,0.35);
    padding: 10px 10px 10px 30px;
    font-size: .9em;
    margin-left: 0;
    border-radius: 7px
}

.as-related-list li {
    padding-bottom: 5px
}

#preroll-box {
    max-width: 675px;
    min-height: 380px;
    margin: 0 auto;
    text-align: center
}

#preroll-box-wrapper {
    background: #eee;
    box-shadow: 0 0 5px #888
}

#preroll-load {
    display: inline-block;
    padding: 8px
}

.as-spinner {
    width: 20px;
    height: 20px;
    animation: spinner-border .9s linear infinite
}

#as-play-btn, .download-info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background: rgba(0,0,0,0.4);
    width: 100%;
    height: 100%;
    border-radius: 8px;
    border: 1px solid rgba(0,0,0,0.15);
    justify-content: center;
    cursor: pointer;
    max-width: 720px;
    margin: 0 auto;
    min-height: 380px;
    position: relative;
    transition: background-color .15s ease-in-out;
    transition-property: background-color;
    transition-duration: .15s;
    transition-timing-function: ease-in-out;
    transition-delay: 0s
}

#as-play-btn:hover {
    background: rgba(0,0,0,0.5)
}

#as-play-btn:hover .as-cta {
    color: #212529;
    background-color: #e0a800;
    border-color: #d39e00
}

#as-play-btn:active .as-cta {
    color: #212529;
    background-color: #d39e00;
    border-color: #c69500
}

.as_play_mobile {
    cursor: pointer
}

.as-btn-loading {
    opacity: .65
}

.as-game-tags {
    list-style: none;
    margin: 0;
    padding: 0
}

.as-game-tags li {
    margin: 0;
    border: 1px solid rgba(0,0,0,0.2);
    background: white;
    font-size: .9em
}

.as-game-tags li a {
    display: block;
    padding: 10px 15px
}

.as-game-tags li a:hover {
    text-decoration: none
}

.as-game-tags li:hover {
    background-color: lightyellow;
    border: 1px gray solid
}

.as-game-tags-pop {
    color: #ff8c00;
    font-size: 16px
}

.as-game-tags .form-group {
    margin-bottom: 0;
    padding-bottom: 0
}

.as-game-tags .form-check-label {
    display: block
}

.as-tags-container {
    -moz-column-count: 4;
    -webkit-column-count: 4;
    column-count: 4
}

.as-tags-list {
    list-style-type: none;
    margin: 0;
    padding: 0
}

.as-tags-list li {
    height: 50px;
    margin-bottom: 14px;
    -moz-page-break-inside: avoid;
    -webkit-column-break-inside: avoid;
    break-inside: avoid;
    -o-column-break-inside: avoid;
    -ms-column-break-inside: avoid;
    column-break-inside: avoid;
    page-break-inside: avoid
}

.as-tags-list li a {
    display: block;
    width: 100%;
    line-height: 50px;
    background: rgba(0,0,0,.6);
    box-shadow: 0 .5rem .9rem rgba(0,0,0,.15);
    border-radius: 7px;
    color: white
}

.as-tags-list li a:hover {
    background: black;
    text-decoration: none
}

.as-tags-list img {
    border-radius: 7px 0 0 7px;
    margin-right: 14px;
    float: left;
    box-shadow: 5px 0 2px -2px rgba(0,0,0,.5);
    background: gray
}

.as-generic-box {
    background: rgba(255,255,255,0.35);
    flex: 2
}

.as-generic-box-outline {
    border: 1px solid gray
}

.as-generic-box p,.as-generic-box-outline p {
    margin: 0;
    padding: 0;
    margin-bottom: .75em
}

.as-generic-box p:last-child,.as-generic-box-outline p:last-child {
    margin-bottom: 0
}

.as-generic-box h3 {
    font-size: 20px;
    margin-top: .75em;
    margin-bottom: .75em
}

.as-game-more p {
    margin-bottom: .5em
}

.as-sort-options {
    margin-right: 200px;
    text-align: center
}

.as-game-tags-admin li {
    padding: 0
}

.as-tag-label-style {
    padding: 10px 30px;
    cursor: pointer
}

.as-tag-group-style {
    padding-left: 0
}

.as-game-tags-admin li:hover {
    background-color: lightyellow;
    border: 1px gray solid
}

.as-edit-tags-list td {
    line-height: 50px
}

.as-group {
    border-radius: 5px;
    padding: 15px;
    background: rgba(255,255,255,0.4)
}

.as-add-game-publish {
    font-size: .9em
}

.as-slideout {
    font-size: .9em;
    margin-top: 10px
}

.as-slideout-form-text {
    display: inline-block;
    margin-top: 3px
}

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
    display: none
}

.as-game-edit,.as-game-fullscreen {
    margin-left: 10px;
    color: #000!important
}

.grecaptcha-badge {
    display: none
}


/* Tooltip */
.as-tip,
.as-pop {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 4px;
    white-space: nowrap;
    pointer-events: none;
    z-index: 1060;
    opacity: 0;
    transition: opacity .15s;
}
.as-tip { background: #222; color: #fff; }
.as-pop { background: #28a745; color: #fff; padding: 5px 12px; }
.as-tip.show,
.as-pop.show { opacity: 1; }

/* Tooltip/Popover arrow */
.as-tip::after,
.as-pop::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
}
.as-tip::after { border-top-color: #222; }
.as-pop::after { border-top-color: #28a745; }

/* Voted/reported state */
.as-voted {
    cursor: not-allowed !important;
    background-color: #8d9499;
    border-color: #8c9398;
}

.as-voted:hover {
    background-color: #8d9499;
    border-color: #8c9398;
}

.frame-2,
iframe[src*="emulatorjs.com/ad"] {
    display: none !important;
}

@media(min-width: 1400px) {
    .d-xxl-table-cell {
        display:table-cell!important
    }
}

@media(max-width: 960px) {
    .as-tags-container {
        -moz-column-count:3;
        -webkit-column-count: 3;
        column-count: 3
    }

    .list-in-columns {
        column-count: 2
    }
}

@media(max-width: 800px) {
    .as-game-container {
        flex-direction:column-reverse
    }

    .as-sort-options {
        margin-right: 0;
        text-align: center
    }

    .as-game-list li {
        width: 25%
    }
    #as-play-btn {
        min-height: 460px;
    }
}

@media(max-width: 660px) {
    .as-game-list li {
        width:33%
    }

    .as-tags-container {
        -moz-column-count: 2;
        -webkit-column-count: 2;
        column-count: 2
    }
}

@media(max-width: 480px) {
    .as-game-list li {
        width:50%
    }

    .as-tags-list li {
        font-size: 14px
    }

    .game-box {
        order: 1
    }

    .gamebar-left {
        order: 2
    }

    .as-related-game:nth-child(n+4) {
        display: none
    }

    .as-related-resize {
        height: auto
    }

    .as-related-title {
        white-space: normal;
        overflow: visible;
        text-overflow: inherit
    }

    .gamebar-right,.gamebar-left {
        flex: 1 1 auto
    }

    .gamebar-right-games,.gamebar-left-games {
        max-width: 100%;
        float: none;
        margin: 0;
        margin-top: 12px
    }

    .gamebar-right-games .as-related-game,.gamebar-left-games .as-related-game {
        float: left;
        width: 30%!important;
        margin-right: 5%!important
    }

    .gamebar-right-games .as-related-game:nth-child(3),.gamebar-left-games .as-related-game:nth-child(3) {
        margin-right: 0!important
    }

    .as-unit {
        min-height: 50px;
        min-height: calc((1/6)*100vw)
    }
}


.game-box { flex: 0 1 960px; order: 2; align-self: stretch; }
@media (max-width: 1305px) {
    .gamebar-right { flex: 1 1 auto; }
    .gamebar-right-games { max-width:100%; float:none; margin:0; margin-top:12px; }
    .gamebar-right-games .as-related-game { float:left; width:18%; margin-right:2.5%; }
    .gamebar-right-games .as-related-game:nth-child(5) { margin-right:0; }
    .gamebar-right .as-related-resize { height:auto; }
    .gamebar-left .as-related-resize  { height:auto; max-height:80px; }
    .gamebar-left { flex:0; }
    .gamebar-left-games { float:left; }
}
@media (max-width: 1161px) {
    .gamebar-left { flex:1 1 auto; order:2; }
    .gamebar-left-games { max-width:100%; float:none; margin:0; margin-top:12px; }
    .gamebar-left-games .as-related-game { float:left; width:18%; margin-right:2.5%; }
    .gamebar-left-games .as-related-game:nth-child(5) { margin-right:0; }
    .game-box { order:1; }
    .as-related-resize { height:auto !important; max-height:none !important; }
}
