html {
background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEASABIAAD/2wBDAAUDBAQEAwUEBAQFBQUGBwwIBwcHBw8LCwkMEQ8SEhEPERETFhwXExQaFRERGCEYGh0dHx8fExciJCIeJBweHx7/2wBDAQUFBQcGBw4ICA4eFBEUHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh7/wgARCAAIAAgDASIAAhEBAxEB/8QAFQABAQAAAAAAAAAAAAAAAAAAAAf/xAAUAQEAAAAAAAAAAAAAAAAAAAAE/9oADAMBAAIQAxAAAAGbhJf/xAAUEAEAAAAAAAAAAAAAAAAAAAAA/9oACAEBAAEFAn//xAAUEQEAAAAAAAAAAAAAAAAAAAAA/9oACAEDAQE/AX//xAAUEQEAAAAAAAAAAAAAAAAAAAAA/9oACAECAQE/AX//xAAVEAEBAAAAAAAAAAAAAAAAAAAAYv/aAAgBAQAGPwKX/8QAGBABAAMBAAAAAAAAAAAAAAAAASFB8JH/2gAIAQEAAT8hKAG7t2f/2gAMAwEAAgADAAAAEPP/xAAWEQEBAQAAAAAAAAAAAAAAAAABABH/2gAIAQMBAT8QDb//xAAVEQEBAAAAAAAAAAAAAAAAAAAAMf/aAAgBAgEBPxCP/8QAGhABAQACAwAAAAAAAAAAAAAAAREhQQBRYf/aAAgBAQABPxASsCpi9q6S4Pd8P//Z);
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-ms-text-size-adjust: 100%
}
body, html {
height: 100%;
padding: 0;
margin: 0;
font: normal 12px Arial, Helvetica, sans-serif
}
.rounded {
border-radius: 10px
}
.rounded-top {
border-radius: 10px 10px 0 0
}
.rounded-bottom {
border-radius: 0 0 10px 10px
}
.bg-white {
background: #fff
}
.c-white {
color: #fff
}
.c-default {
color: #182936
}
.mb10 {
margin-bottom: 10px
}
.mb20 {
margin-bottom: 20px
}
.btn-default {
background: transparent;
border: none;
cursor: pointer
}
:root {
--logo-height: 60px
}
#content-wrapper {
padding-top: var(--logo-height)
}
#inner-wrapper {
overflow: hidden;
order: 2;
width: 100%
}
.flex-center {
display: flex;
justify-content: space-around
}
@media (min-width: 1280px) {
.wlimit {
max-width: 90%
}
}
@media (min-width: 1600px) {
.wlimit {
max-width: 80%
}
}
.siteHeader {
display: flex;
flex-direction: column
}
#top-header {
width: 100%;
min-width: 240px;
display: flex;
justify-content: space-around;
flex-wrap: wrap;
position: fixed;
background: rgba(24, 41, 54, 0.95);
z-index: 9;
top:0px;
}
.exit-btn {
content: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%20width%3D%222em%22%20height%3D%222em%22%20style%3D%22-ms-transform%3A%20rotate%28360deg%29%3B%20-webkit-transform%3A%20rotate%28360deg%29%3B%20transform%3A%20rotate%28360deg%29%3B%22%20preserveAspectRatio%3D%22xMidYMid%20meet%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M256%208C119%208%208%20119%208%20256s111%20248%20248%20248%20248-111%20248-248S393%208%20256%208zm121.6%20313.1c4.7%204.7%204.7%2012.3%200%2017L338%20377.6c-4.7%204.7-12.3%204.7-17%200L256%20312l-65.1%2065.6c-4.7%204.7-12.3%204.7-17%200L134.4%20338c-4.7-4.7-4.7-12.3%200-17l65.6-65-65.6-65.1c-4.7-4.7-4.7-12.3%200-17l39.6-39.6c4.7-4.7%2012.3-4.7%2017%200l65%2065.7%2065.1-65.6c4.7-4.7%2012.3-4.7%2017%200l39.6%2039.6c4.7%204.7%204.7%2012.3%200%2017L312%20256l65.6%2065.1z%22%20fill%3D%22red%22%2F%3E%3C%2Fsvg%3E")
}
#top-menu-toggle {
display: inline-block;
cursor: pointer;
align-self: center;
order: 1
}
#toggle-more {
display: none
}
.dropbtn, .all-cat-btn {
border: 0;
border-radius: 5px;
background: #fff;
color: #E02F76;
font-size: 14px;
font-weight: 700;
cursor: pointer
}
.all-cat-btn {
padding: 10px 10px
}
.dropbtn {
width: 85px;
display: flex;
align-items: center;
justify-content: space-around
}
.all-cat-title {
font-size: 1.1em;
align-self: center;
}
@media (min-width: 1100px) {
#toggle-more {
display: block
}
#top-menu-toggle {
display: none
}
.bar1, .bar2, .bar3 {
display: none
}
}
.bar1, .bar2, .bar3 {
width: 35px;
height: 5px;
background-color: #fff;
margin: 6px 0;
transition: 0.4s
}
.change .bar1 {
-webkit-transform: rotate(-45deg) translate(-9px, 6px);
transform: rotate(-45deg) translate(-9px, 6px)
}
.change .bar2 {
opacity: 0
}
.change .bar3 {
-webkit-transform: rotate(45deg) translate(-8px, -8px);
transform: rotate(45deg) translate(-8px, -8px)
}
#container-logo {
order: 2;
align-self: center;
max-width: 75%
}
@media (min-width: 401px) {
#container-logo {
max-width: 100%
}
}
#logo {
width: 180px;
height: var(--logo-height);
max-width: 100%;
color: transparent;
display: inline-block
}
#search {
display: none;
order: 4;
width: 100%
}
.search-icon {
content: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%20width%3D%221em%22%20height%3D%221em%22%20style%3D%22-ms-transform%3A%20rotate%28360deg%29%3B%20-webkit-transform%3A%20rotate%28360deg%29%3B%20transform%3A%20rotate%28360deg%29%3B%22%20preserveAspectRatio%3D%22xMidYMid%20meet%22%20viewBox%3D%220%200%201024%201024%22%3E%3Cpath%20d%3D%22M909.6%20854.5L649.9%20594.8C690.2%20542.7%20712%20479%20712%20412c0-80.2-31.3-155.4-87.9-212.1c-56.6-56.7-132-87.9-212.1-87.9s-155.5%2031.3-212.1%2087.9C143.2%20256.5%20112%20331.8%20112%20412c0%2080.1%2031.3%20155.5%2087.9%20212.1C256.5%20680.8%20331.8%20712%20412%20712c67%200%20130.6-21.8%20182.7-62l259.7%20259.6a8.2%208.2%200%200%200%2011.6%200l43.6-43.5a8.2%208.2%200%200%200%200-11.6zM570.4%20570.4C528%20612.7%20471.8%20636%20412%20636s-116-23.3-158.4-65.6C211.3%20528%20188%20471.8%20188%20412s23.3-116.1%2065.6-158.4C296%20211.3%20352.2%20188%20412%20188s116.1%2023.2%20158.4%2065.6S636%20352.2%20636%20412s-23.3%20116.1-65.6%20158.4z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
width: 40px;
cursor: pointer;
float: right;
margin-top: 5px
}
#search-trigger {
display: inline-block;
align-self: center;
order: 3
}
#search-box {
height: 3em;
background: white;
border: 1px solid #DFDFDF;
border-radius: .7em;
display: flex;
margin-bottom: 5px
}
#search-text {
width: 90%;
background: transparent;
border: 0;
outline: none;
font-size: 17px;
line-height: 18px;
margin-left: 0.5em;
padding: .4em
}
#search-suggestions {
width: 100%;
max-height: 350px;
overflow: auto;
position: absolute;
z-index: 999;
border-radius: 5px;;
font-size: 14px
}
@media (min-width: 600px) {
}
@media (min-width: 1100px) {
#search {
width: 252px;
height: 38px;
order: 3;
padding: 10px 0;
display: inline-block;
align-self: center;
position: relative
}
#search-trigger {
display: none
}
#search-box {
width: 250px;
float: right
}
#search-text {
width: 80%
}
#search-suggestions {
max-width: 250px;
right: 0;
top: 50px
}
}
.search-div {
background: #fff;
padding: 5px
}
.ls-tile {
display: flex
}
.ls-tile:hover {
color: #1B94CE;
text-decoration: none
}
.ls-item {
background: #FFF;
border-radius: 5px;
box-sizing: border-box;
margin: 5px 0;
box-shadow: 0 0 5px 1px #CCC7C7
}
.ls-more {
padding: 10px;
display: flex;
justify-content: center
}
.search-btn {
background: url(/static/game36/images/search.png) 0 0 no-repeat;
color: transparent;
padding: 0;
border: 0;
width: 15px;
height: 18px;
outline: none;
top: 0.8em;
position: relative;
right: 7px;
cursor: pointer
}
.search-title {
text-align: center;
font-size: 18px
}
.center {
margin-left: auto;
margin-right: auto;
box-sizing: border-box
}
.mainNav {
display: none
}
@media (min-width: 1100px) {
.mainNav {
display: flex;
order: 2
}
}
.main-menu {
display: none
}
.main-menu > li {
align-self: center
}
.main-menu a {
color: #fff
}
@media (min-width: 1100px) {
.menu-wrapper {
display: flex
}
.main-menu {
display: flex;
font-size: 15px
}
}
.category-item {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
position: relative
}
.category-item a {
color: #fff;
display: block;
padding: 5px 10px;
text-align: center;
text-decoration: none
}
.home-btn {
display: none
}
@media (min-width: 801px) {
.home-btn {
display: inline-block;
content: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 460.3 460.3' fill='%23fff'%3E%3Cpath d='M230 121L66 256.2v1c-.2.3-.2.6-.2.8v137c0 5 1.8 9.3 5.4 13 3.6 3.5 8 5.3 12.8 5.3h109.6V303.7h73v109.6h109.7c5 0 9.2-1.8 12.8-5.4 3.7-3.7 5.5-8 5.5-13V258c0-.8 0-1.3-.3-1.7L230.2 121zm227 104.4l-62.4-52V57c0-2.7-1-5-2.6-6.6-1.7-1.7-4-2.6-6.6-2.6h-54.8c-2.7 0-5 1-6.6 2.6-1.7 1.7-2.6 4-2.6 6.6v55.7l-69.7-58.2c-6-5-13.3-7.4-21.7-7.4-8.4 0-15.6 2.6-21.7 7.5l-205 171c-2 1.4-3 3.5-3.2 6 0 2.6.6 4.8 2 6.7l17.8 21c1.5 1.8 3.5 3 6 3.2 2.3.2 4.6-.5 7-2L230 95.8l197.7 164.7c1.5 1.3 3.5 2 6 2h1c2.4-.4 4.4-1.4 6-3l17.6-21.2c1.5-2 2.2-4 2-6.7-.2-2.6-1.3-4.6-3.2-6.2z'/%3E%3C/svg%3E");
width: 25px
}
}
.list-icon {
content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2060.1%2060.1%22%20width%3D%22512%22%20height%3D%22512%22%3E%3Cstyle%3E.a%7Bfill%3A%23E02F76%3B%7D%3C%2Fstyle%3E%3Cpath%20d%3D%22M57.1%2051.9H16.9c-1.7%200-3-1.3-3-3s1.3-3%203-3h40.2c1.7%200%203%201.3%203%203S58.8%2051.9%2057.1%2051.9z%22%20class%3D%22a%22%2F%3E%3Cpath%20d%3D%22M57.1%2033.1H16.9c-1.7%200-3-1.3-3-3s1.3-3%203-3h40.2c1.7%200%203%201.3%203%203C60.1%2031.7%2058.8%2033.1%2057.1%2033.1z%22%20class%3D%22a%22%2F%3E%3Cpath%20d%3D%22M57.1%2014.2H16.9c-1.7%200-3-1.3-3-3s1.3-3%203-3h40.2c1.7%200%203%201.3%203%203S58.8%2014.2%2057.1%2014.2z%22%20class%3D%22a%22%2F%3E%3Ccircle%20cx%3D%224%22%20cy%3D%2211.5%22%20r%3D%224%22%20class%3D%22a%22%2F%3E%3Ccircle%20cx%3D%224%22%20cy%3D%2230.1%22%20r%3D%224%22%20class%3D%22a%22%2F%3E%3Ccircle%20cx%3D%224%22%20cy%3D%2248.7%22%20r%3D%224%22%20class%3D%22a%22%2F%3E%3C%2Fsvg%3E");
width: 12px;
float: left;
padding: 3px
}
.eye-icon {
content: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBhcmlhLWhpZGRlbj0idHJ1ZSIgZm9jdXNhYmxlPSJmYWxzZSIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iIHN0eWxlPSItbXMtdHJhbnNmb3JtOiByb3RhdGUoMzYwZGVnKTsgLXdlYmtpdC10cmFuc2Zvcm06IHJvdGF0ZSgzNjBkZWcpOyB0cmFuc2Zvcm06IHJvdGF0ZSgzNjBkZWcpOyIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pZFlNaWQgbWVldCIgdmlld0JveD0iMCAwIDY0IDY0Ij48cGF0aCBkPSJNNjIgMzJTNTEuOSA1MiAzMiA1MlMyIDMyIDIgMzJzMTAuMS0yMCAzMC0yMHMzMCAyMCAzMCAyMCIgZmlsbD0iIzIzMWYyMCIvPjxwYXRoIGQ9Ik01NyAzMnMtOC40IDE2LjctMjUgMTYuN1M3IDMyIDcgMzJzOC40LTE2LjcgMjUtMTYuN1M1NyAzMiA1NyAzMnoiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNNDUuNCAzMmMwIDcuNS02IDEzLjUtMTMuNSAxMy41cy0xMy41LTYtMTMuNS0xMy41czYtMTMuNSAxMy41LTEzLjVzMTMuNSA2IDEzLjUgMTMuNSIgZmlsbD0iIzQyYWRlMiIvPjxwYXRoIGQ9Ik0zOS40IDMyYzAgNC4xLTMuNCA3LjUtNy41IDcuNXMtNy41LTMuNC03LjUtNy41czMuNC03LjUgNy41LTcuNXM3LjUgMy40IDcuNSA3LjUiIGZpbGw9IiMyMzFmMjAiLz48L3N2Zz4=");
width: 15px;
float: left;
padding: 3px
}
.arrow {
display: inline-block;
align-self: baseline;
width: 7px;
height: 7px;
border-right: 3px solid #108FF7;
border-bottom: 3px solid #108FF7;
border-top: 3px solid transparent;
border-left: 3px solid transparent;
border-radius: 3px;
-webkit-transform: rotate(45deg) skew(3deg, 3deg);
-moz-transform: rotate(45deg) skew(3deg, 3deg);
-ms-transform: rotate(45deg) skew(3deg, 3deg);
-o-transform: rotate(45deg) skew(3deg, 3deg);
transform: rotate(45deg) skew(3deg, 3deg)
}
.menu-categories {
left: 50%;
transform: translateX(-50%)
}
.menu-categories-mobile {
left: 0
}
.menu-categories, .menu-categories-mobile {
display: none;
width: 100%;
position: absolute;
top: var(--logo-height)
}
.header-categories {
background: #182936;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px
}
.item-shadow {
box-shadow: 0 0 5px 1px #CCC7C7
}
.menu-categories ul, .menu-categories-mobile ul, .game-categories ul, .game-tags ul {
display: flex;
flex-wrap: wrap
}
.menu-categories ul, .menu-categories-mobile ul, .game-categories ul, .game-tags li {
justify-content: center
}
.menu-categories li, .menu-categories-mobile li, .game-categories li, .game-tags li {
background: #FFF;
border-radius: 5px;
box-sizing: border-box;
margin: 0.3%
}
.menu-categories li, .menu-categories-mobile li, .game-categories li, .game-tags li {
flex: 1 0 250px
}
@media (min-width: 410px) {
.menu-categories li, .menu-categories-mobile li, .game-categories li, .game-tags li {
max-width: calc(50% - 10px)
}
}
@media (min-width: 620px) {
.menu-categories li, .menu-categories-mobile li, .game-categories li, .game-tags li {
max-width: calc(33.33333% - 10px)
}
}
@media (min-width: 830px) {
.menu-categories li, .menu-categories-mobile li, .game-categories li, .game-tags li {
max-width: calc(25% - 10px)
}
}
.menu-categories img, .menu-categories-mobile img, .game-categories img, .game-tags img {
width: 100%;
height: 100%;
border-radius: 5px
}
.menu-categories a, .menu-categories-mobile a, .game-categories a, .game-tags a {
font-size: 14px;
text-decoration: none;
display: flex;
padding-right: 5px
}
.nav-header {
margin-top: 20px;
color: #fff;
background: #006A9D;
padding: 10px;
font-size: 16px;
font-weight: bold;
margin-bottom: 5px;
border-radius: 5px;
text-align: center
}
.nav-tile-Title {
align-self: center;
margin-left: 10px;
text-align: left
}
.nav-tile:hover {
text-decoration: none;
color: #1B94CE
}
.games-content {
display: grid;
grid-gap: 10px;
grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
padding: 1%
}
@media (min-width: 601px) {
.games-content {
grid-gap: 15px;
grid-template-columns:repeat(auto-fit, minmax(185px, 1fr))
}
}
@media (min-width: 801px) {
.games-content {
grid-gap: 20px;
grid-template-columns:repeat(auto-fit, minmax(180px, 1fr))
}
}
@media (min-width: 1100px) {
.games-content {
grid-gap: 10px;
grid-template-columns:repeat(auto-fit, minmax(170px, 1fr))
}
}
@media (min-width: 1400px) {
.games-content {
grid-gap: 20px;
grid-template-columns:repeat(auto-fit, minmax(180px, 1fr))
}
}
@media (min-width: 1550px) {
.games-content {
grid-gap: 25px;
grid-template-columns:repeat(auto-fit, minmax(200px, 1fr))
}
}
@media (min-width: 1921px) {
.games-content {
grid-template-columns:repeat(auto-fit, minmax(220px, 1fr))
}
}
.tile, .tag-tile {
overflow: hidden;
position: relative;
display: block;
margin: 0.25em 0;
background: #fff;
text-decoration: none;
box-shadow: 0 1px 6px 0px rgba(50, 50, 50, 0.2)
}
.tile {
border-radius: 1em
}
.tile:hover, .tag-tile:hover {
background: #a41069;
color: #fff;
text-decoration: none
}
.tile-imgThumb, .tag-tile-imgThumb {
position: relative;
display: block;
height: 0
}
.tile-imgThumb {
padding-bottom: 60%
}
.tag-tile-imgThumb {
padding-bottom: 35%
}
.tile-imgThumb > img, .tag-tile-imgThumb > img {
position: absolute;
width: 100%;
height: 100%;
image-rendering: -webkit-optimize-contrast
}
.tile-imgThumb > img {
border-radius: 0.8em 0.8em 0 0
}
.tile-Title, .tag-tile-Title {
overflow: hidden;
margin: 0.35714em;
font-size: 1.15em;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
font-weight: bold
}
#content-layout {
overflow: hidden;
padding:0 10px;
}
#game-header {
font-size: 14px;
padding: 1%;
overflow: auto
}
.headline {
margin: 0;
color: black;
font-weight: bold;
float: left;
padding-top: 1%
}
#game-header h1 {
display: inline;
color: #E02F76
}
ul.breadcrumb {
display: none
}
@media (min-width: 801px) {
ul.breadcrumb {
display: block;
padding: 5px 0px;
list-style: none
}
}
ul.breadcrumb li {
display: inline;
font-size: 14px
}
ul.breadcrumb li + li:before {
color: black;
content: "\00BB"
}
ul.breadcrumb li a {
color: #1B94CE;
text-decoration: none
}
ul.breadcrumb li a:hover {
text-decoration: underline
}
:root {
--flash-template: 1fr
}
@media (min-width: 1100px) {
:root {
--flash-template: auto 300px
}
}
@media (min-width: 1280px) {
:root {
--flash-template: 160px auto 300px
}
}
#game-wrapper {
/* display: grid;
grid-template-columns:var(--flash-template);
grid-gap: 20px */
margin: 20px auto;
max-width: 80%;
}
@media screen and (max-width:768px) {
#game-wrapper {max-width: 100%;}
}
.leftSide {
display: none
}
.midSide {
padding: 20px 0;
display: flex;
flex-direction: column
}
.rightSide {
display: none
}
@media (min-width: 1100px) {
.rightSide {
display: block
}
}
@media (min-width: 1280px) {
.leftSide {
display: block
}
}
#preload {
display: flex;
justify-content: center;
position: relative;
overflow: hidden;
align-self: center;
width: 100%
}
.splash-img {
overflow: hidden;
border-radius: 10px 10px 0 0;
width: 100%;
height: 300px
}
.glow {
filter: blur(20px);
width: 100%;
height: 100%
}
@media (min-width: 801px) {
.splash-img {
border-radius: 10px;
height: 400px
}
}
#pre-game {
display: flex;
flex-direction: column;
align-items: center;
border-radius: 5px
}
.abs-center {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%)
}
#pre-game p {
padding: 5px;
background: #FFF8DC;
border-radius: 5px
}
#btnWrapper {
display: contents
}
#play-game, #play-game-external {
padding: 10px 16px;
border-radius: 5px;
background: #E02F76;;
color: #fff;
font-size: 1.4em;
font-weight: 700;
text-transform: uppercase;
cursor: pointer;
margin: 0 auto;
white-space: nowrap;
border: 3px white solid
}
#preload img {
cursor: pointer;
align-self: center;
border-radius: 5px;
border: 3px white solid
}
#preload a {
margin: 0 auto;
text-decoration: none
}
#game-container {
display: flex;
flex-direction: column;
align-items: center;
position: relative
}
.msg-notice {
font-size: 14px;
color: #1B94CE;
font-weight: 600;
text-align: center;
line-height: 1.2
}
#load-game {
display: flex;
position: relative;
width: 100%
}
#gameFrame {
width: 100%;
height: 100%;
border: 0;
background: #1a1a20;
position: absolute;
top: 0;
left: 0
}
#FlashObject {
margin: 0 auto;
display: block;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0
}
#top-ad-wrapper {
display: none
}
.games-holder {
display: none
}
:root {
--grid-gap: 10px;
--grid-template-columns-3: repeat(3, calc(100% - 5px))
}
@media (min-width: 800px) {
:root {
--grid-template-columns-3: repeat(3, calc(100% - 5px));
--grid-template-columns-6: repeat(6, calc(100% / 4 - 10px));
--gs-max-width: 230px
}
#top-ad-wrapper {
display: grid;
grid-gap: var(--grid-gap);
grid-template-columns:auto auto;
min-height: 320px;
align-items: center;
justify-items: center;
padding: 0 10px
}
}
@media (min-width: 900px) {
.games-holder {
display: block;
overflow-y: auto;
margin: 0 auto;
width: 100%;
max-width: var(--gs-max-width)
}
#top-ad-wrapper {
grid-template-columns:340px auto 340px
}
}
@media (min-width: 1024px) {
:root {
--grid-template-columns-3: repeat(3, calc(100% / 2 - 5px));
--grid-template-columns-6: repeat(6, calc(100% / 5 - 10px));
--gs-max-width: 440px
}
}
@media (min-width: 1200px) {
:root {
--grid-template-columns-3: repeat(3, calc(100% / 3 - 7px));
--grid-template-columns-6: repeat(6, calc(100% / 6 - 10px));
--gs-max-width: 700px
}
}
.games-scroll {
display: grid;
grid-gap: var(--grid-gap);
grid-template-columns:var(--grid-template-columns-3)
}
.games-scroll-related {
display: grid;
grid-gap: var(--grid-gap);
grid-template-columns:var(--grid-template-columns-6)
}
.game-header-responsive, .game-header-responsive-wrapper {
display: none
}
.small-banner-responsive-wrapper, .small-banner-responsive {
display: block;
width: 320px;
height: 50px
}
.small-banner-responsive-wrapper {
align-self: center;
margin: 15px 0
}
.large-skyscraper-responsive-wrapper, .large-skyscraper-responsive {
display: none
}
.top-banner-responsive-wrapper, .top-banner-responsive {
display: block;
width: 100%;
height: 90px;
text-align: center
}
.top-banner-responsive-wrapper {
text-align: center
}
.mid-section {
padding-top: 5px;
display: flex;
justify-content: center
}
.matched-content-wrapper, .matched-content {
display: flex;
flex-direction: column;
min-width: 30em;
max-width: 1200px;
width: 100%;
justify-content: center
}
.game-desc-responsive-wrapper, .game-desc-responsive {
display: none
}
@media (min-width: 800px) {
.game-header-responsive, .game-header-responsive-wrapper {
display: inline-block;
width: 336px;
height: 280px
}
.small-banner-responsive-wrapper, .small-banner-responsive {
display: block;
width: 728px;
height: 90px
}
.game-desc-responsive-wrapper, .game-desc-responsive {
display: inline-block;
width: 300px;
height: 250px
}
.game-desc-responsive-wrapper {
padding: 3.5% 0 0% 2%;
float: right
}
#mobile-ad-wrapper {
display: none
}
}
#game-controls {
display: none;
order: 1
}
.control-btn {
position: relative;
color: #fff;
background-color: transparent;
border: none;
cursor: pointer;
border-radius: 5px;
margin: 5px
}
.control-btn:hover {
background-color: #E02F76
}
.control-btn .tooltip {
visibility: hidden;
width: 100px;
font-size: 14px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
bottom: 120%;
left: 100%;
margin-left: -55px;
opacity: 0;
transition: opacity 0.3s
}
.control-btn:hover .tooltip {
visibility: visible;
opacity: 1
}
.control-btn svg {
width: 20px;
height: 25px;
fill: #fff;
margin: auto
}
.load-in-nmk {
order: 2
}
.load-flash-icon {
width: 32px
}
#flash-alternative {
position: relative
}
#flash-alternative .tooltip {
position: absolute;
bottom: 110%;
left: -350%;
width: 350px;
z-index: 1;
padding: 10px;
background: #FFF8DC;
line-height: 1.4;
visibility: hidden;
opacity: 0;
transition: opacity 0.3s
}
#flash-alternative:hover .tooltip {
visibility: visible;
opacity: 1
}
.section {
overflow: auto;
color: white;
padding: 0 0px 0px 5px;
line-height: 24px;
font-size: 16px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
background-color: #a41069
}
.section h3 {
font-size: 16px;
margin: 0.5%
}
.space {
height: 10px
}
#about-game {
color: black;
padding: 1%;
border-top-right-radius: 10px;
border-top-left-radius: 10px
}
#about-game p, #preload-mobile p, .info {
font-family: Georgia, serif;
font-size: 17px;
line-height: 1.6
}
.mtb10 {
margin: 10px 0
}
#rating-wrapper {
display: none;
align-self: center;
background: #182936;
justify-content: space-between;
align-items: center;
width: 100%;
height: 42px
}
@media (min-width: 801px) {
}
.thumbs-rating {
display: flex;
flex-flow: row nowrap;
order: 3
}
#rating {
display: flex
}
#thumbUp, #thumbDown {
display: flex;
width: 75px;
margin: 1%
}
#thumbUp:disabled, #thumbDown:disabled {
cursor: default;
pointer-events: none
}
#thumbUp:disabled svg, #thumbDown:disabled svg {
fill: #69c1eb
}
.rate-icon, .rate-text {
align-self: center;
margin: auto
}
.rate-text {
font-size: 15px;
letter-spacing: 0.47px
}
.hideElement {
display: none
}
#allow_flash_container {
width: 100%;
height: 100%;
position: relative
}
.visible-block {
display: block
}
.visible-flex {
display: flex
}
.hidden {
display: none
}
#no-flash-on-mobile {
flex-direction: column
}
.nmk-btn-common {
border: 0;
border-radius: 5px;
background: #E02F76;;
color: #fff;
font-weight: 700;
cursor: pointer;
margin: 0 auto
}
.nmk-btn-big {
padding: 10px 16px;
font-size: 1.4em
}
.nmk-btn-inline {
padding: 0 5px
}
.allow_flash_screen {
margin: 0 auto;
display: flex;
flex-direction: column
}
.allow_flash_screen img {
margin: 0 auto
}
#flash_activation_paragraph.visible {
display: block
}
#flash_activation_paragraph.hidden {
display: none
}
#allow_flash {
padding: 20px;
background-color: #fff;
position: absolute;
left: 40px;
right: 40px;
border-radius: 10px;
box-shadow: 0 0 5px 4px #CCC7C7
}
#allow_flash_title {
height: 60px;
line-height: 60px;
color: #eeefef;
text-transform: uppercase
}
#allow_flash_title strong {
font-weight: 700
}
#allow_flash_title #site_title {
color: #fff;
font-weight: 700
}
#allow_flash_overlay {
display: none;
position: fixed;
z-index: 15;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: #000;
background-color: rgba(0, 0, 0, .6)
}
#allow-modal {
background-color: #fefefe;
padding: 30px 20px 20px;
border: solid #414446;
border-width: 1px 1px 0;
width: 500px;
line-height: 30px
}
#allow-modal strong {
font-size: 24px;
font-weight: 700
}
#allow-modal .small {
font-size: 12px;
color: rgba(0, 0, 0, .5);
line-height: 14px
}
#allow-modal.chrome {
margin-top: 160px;
margin-left: 109px
}
#allow-modal.edge {
margin-top: 160px;
margin-right: 29px;
float: right
}
#allow_flash_site_title_bottom {
background: linear-gradient(to bottom, #0086cb 0%, #0282c5 100%);
width: 500px;
line-height: 30px;
color: #fff;
padding: 10px 20px;
text-align: right;
font-weight: 700;
border: solid #414446;
border-width: 0 1px 1px;
margin-left: -20px;
margin-bottom: -20px
}
#chrome-flash-message {
display: none
}
#edge-flash-message {
display: none
}
#allow_flash_arrow.chrome {
float: left;
position: relative;
top: 119px;
left: 332px
}
#allow_flash_arrow.chrome.chrome58 {
float: left;
position: relative;
top: 119px;
left: 280px
}
#allow_flash_arrow.edge {
float: right;
position: relative;
top: 129px;
right: 155px
}
.sidebar-responsive, .sidebar-responsive-wrapper {
display: none
}
@media (min-width: 1100px) {
.rightSide .sidebar-responsive-wrapper {
display: flex;
flex-direction: column
}
.rightSide .sidebar-responsive {
display: block;
width: 160px;
height: 600px
}
.large-skyscraper-responsive-wrapper {
display: flex;
flex-direction: column
}
.large-skyscraper-responsive {
display: block;
width: 300px;
height: 600px
}
}
@media (min-width: 1280px) {
.leftSide .sidebar-responsive-wrapper {
display: flex;
flex-direction: column
}
.leftSide .sidebar-responsive {
display: block;
width: 160px;
height: 600px
}
}
.advHeader {
font-size: 10px;
letter-spacing: .01em;
text-align: center;
text-transform: uppercase;
width: 100%;
display: none
}
iframe#mobile-embed-container.mobile-game.fullscreen {
width: 100%;
height: 100%;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px
}
.mobile-game {
display: none
}
#adsContainer {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
text-align: center;
overflow: hidden;
background-color: #000
}
#adContainer, #adContainerMobile {
position: absolute;
text-align: left;
left: 0;
top: 0;
width: 100%;
height: 100%
}
#mobile-container {
display: none;
background: #000
}
.similar-games {
display: grid
}
#related-games {
display: none
}
@media (min-width: 800px) {
#related-games {
display: block;
margin: 0 auto;
width: 100%;
overflow-y: auto;
padding: 0 5px
}
#mobile-related-games {
display: none
}
}
.game-series {
display: grid;
grid-template-columns:repeat(auto-fit, 180px)
}
.game-meta {
display: table;
flex-grow: 1;
line-height: 2
}
.meta-row {
display: table-row;
width: 100%
}
.meta-row:nth-child(odd) {
background: #fff
}
.meta-row:nth-child(even) {
background: #fafafa
}
.meta-label {
font-weight: 700;
border-top: #ddd solid 1px
}
.meta-value {
display: table-cell;
border-top: #ddd solid 1px;
padding: 0 10px;
text-align: left;
width: 50%
}
.subtle {
color: #454545
}
.stats-wrapper {
display: flex;
flex-wrap: wrap;
margin: 0 10px
}
*[data-visible="false"] {
display: none !important
}
.footertags, .footer-articles {
display: block
}
.footer-articles {
margin-bottom: 10px
}
.footer-articles h2 {
margin-left: 1.5%
}
@media (min-width: 1000px) {
.footertags, .footer-articles {
padding: 0.5% 0 2% 0;
display: block
}
}
.footer-main {
display: flex;
flex-wrap: wrap
}
ul {
list-style: none;
margin: 0;
padding: 0;
vertical-align: baseline
}
ol {
font: 16px/25px Georgia, serif
}
a {
text-decoration: none;
font-weight: bold;
color: #a41069
}
a:hover {
text-decoration: underline
}
.spacer-solid {
border-top: 1px solid #746969
}
.inline {
display: inline-block
}
.clear {
clear: both
}
img {
border: 0
}
h1 {
color: #E02F76;
margin: 0;
padding: 0;
font-size: 20px;
font-weight: bold
}
h2, h2 a {
font-size: 18px;
font-weight: bold;
color: #E02F76
}
h3 {
font-size: 16px
}
#seocontentbox {
color: black;
padding: 10px 20px 6px;
box-sizing: border-box;
border-top-left-radius: 10px;
border-top-right-radius: 10px
}
#seocontentbox a {
color: #1B94CE
}
#seocontentbox p {
text-align: justify;
font-family: Georgia, serif;
font-size: 17px;
line-height: 1.6
}
.bottom_ad {
max-width: 1200px;
max-height: 115px;
margin: 0 auto;
padding: 1% 0% 1%
}
#footer {
color: #fff
}
#footer a {
font-size: 14px;
color: #fff
}
.footer-wrapper {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #a41069;
min-height: 65px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
padding: 0 10px;
box-sizing: border-box
}
.social-icons {
display: flex
}
.social-icons li {
margin-right: 10px;
width: 40px
}
#content-header{padding:12px;}
#toggle-more .dropbtn{height:30px;}
#toggle-more .dropbtn .arrow{position: relative; top: 5px;}
.menu-categories .header-categories{padding:0 6px;}
#search,
.menu-categories-mobile .header-categories{padding: 5px 9px 20px;}
.menu-categories-mobile .header-categories li{margin-top:5px;}
.menu-categories .header-categories li,
.menu-categories-mobile .header-categories li{padding: 6px 20px;}
.menu-categories .header-categories li .nav-tile,
.menu-categories-mobile .header-categories li .nav-tile{justify-content: center;}
.menu-categories .header-categories li img,
.menu-categories-mobile .header-categories li img{width: 40px; height: 30px;}
.footer-wrapper{max-width: 79.1%;}
.footer-links{text-align: center; width: 100%;}
#play-game{margin-top:20px}
#img-play img{height:160px;}
@media screen and (max-width:768px) {
.tile-Title, .tag-tile-Title{font-size: 14px;}
#about-game,
.games-content{padding:8px;}
.footer-wrapper{max-width: 95%;}
}