html, body {
	margin: 0px auto;
	padding: 0px;
	font-family: Helvetica, sans-serif;
}

body { font-size: 32px; }
body.site {
	color: #000;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
	
	background-color: #CCC; background-image: url('../../images/body.png');
	background-repeat: repeat;
	
}
body.noscroll { position: fixed; overflow: hidden; }

header, nav, section, article, aside, footer { display: block; box-sizing: border-box; }

a { text-decoration: none; color: inherit; }
a:visited { text-decoration: none; color: inherit; }
a img { border: 0px !important; }
.item-gray { background-color: rgb(243, 243, 243); }
.node-template { display:none !important; }

.popup {
	display: none; box-sizing: border-box;
	position: absolute; left: 0px; top: 0px;
	background-color: rgba(255, 86, 42, 1.0);
	color: rgba(255,255,255,1);
	z-index: 100501;
}

.popup > header {
	display: block; box-sizing: border-box; position: absolute;
	left: 0.1em; right: 0.1em; top: 0.1em; height: 1.8em; line-height: 1.8em;
	background-color: rgba(255, 86, 42, 1.0);
	background-image: url('../../images/logo_big.png');
	background-repeat: no-repeat;
	background-position: 5% 50%;
	background-size: 6em auto;
}
.popup > header > a { 
	float: right; line-height: 1.6em; cursor: pointer; text-decoration: underline;
	margin-right: 0.5em; 
}
.popup > footer {
	display: block; box-sizing: border-box; position: absolute;
	left: 0em; right: 0em; bottom: 0em; height: 3em; line-height: 3em;
	text-align: center;
	background-color: rgba(255, 86, 42, 1.0);
	background: -moz-linear-gradient(top,  rgba(255,86,42,0.5) 0%, rgba(255,86,42,0.8) 20%, rgba(255,86,42,1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,86,42,0.5)), color-stop(20%,rgba(255,86,42,0.8)), color-stop(100%,rgba(255,86,42,1)));
	background: -webkit-linear-gradient(top,  rgba(255,86,42,0.5) 0%,rgba(255,86,42,0.8) 20%,rgba(255,86,42,1) 100%);
	background: -o-linear-gradient(top,  rgba(255,86,42,0.5) 0%,rgba(255,86,42,0.8) 20%,rgba(255,86,42,1) 100%);
	background: -ms-linear-gradient(top,  rgba(255,86,42,0.5) 0%,rgba(255,86,42,0.8) 20%,rgba(255,86,42,1) 100%);
	background: linear-gradient(to bottom,  rgba(255,86,42,0.5) 0%,rgba(255,86,42,0.8) 20%,rgba(255,86,42,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80ff562a', endColorstr='#ff562a',GradientType=0 );
}
.popup > footer > button {
	display: inline-block; box-sizing: border-box;
	font-size: 1.5em;
	color: rgba(255,255,255,1); background-color: rgba(0, 173, 41, 1.0);
	border: 0px; outline: none; cursor: pointer; padding: 0em 1em;
}
.popup > section {
	display: block; box-sizing: border-box; position: absolute;
	left: 0.5em; right: 0.5em; top: 2em; bottom: 0em;
	overflow: hidden;
}
.popup.active { display: block; }

.popup.home-popup { 
	position: fixed;
	left: 0px; top: 0px; bottom: 0px; width: 29em;
}

.popup.home-popup > header > a.home-popup-logo { float: left; display: inline-block; width: 50%; text-decoration: none; }

.popup.home-popup > section::-webkit-scrollbar { width: 0.5em; }
.popup.home-popup > section::-webkit-scrollbar-track { background-color: rgba(0,0,0,0); border: 0px; }
.popup.home-popup > section::-webkit-scrollbar-thumb { background-color: rgba(200,200,200,0.5); cursor: pointer; }
.popup.home-popup > section::-webkit-scrollbar-thumb:hover { background-color: #EEE; }

@media screen and (orientation:portrait) { 
	
	.popup.home-popup { width: 16em; }
	.popup.home-popup .game-item { font-size: 150%; }
}

.popup.home-popup > section {
	overflow-y: scroll;
	/*-webkit-overflow-scrolling: touch;*/
}
.popup.home-popup > section > article {
	/*position: absolute; left: 0em; right: 0em; top: 0em; bottom: 0em;*/
	/*width: 100%; height: 100%;*/
	/*overflow-y: scroll;*/ 
	padding-bottom: 3em; 
}
.popup.home-popup .game-item { font-size: 150%; }


.game-home-button {
	position: fixed; z-index: 100500;
	border: 0px; outline: none; border-radius: 0.5em;
	font-size: 1em; width: 2em; height: 2em;
	left: 0em; top: 0em;
	color: rgba(255,255,255,1); 
	background-color: rgba(255, 86, 42, 1.0);
	/*background-image: url('../images/game_home_button.png');*/
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHxJREFUeNpi/P//P8NgAUwMgwiMOmbUMUPaMSxYxCSA2A+L+D4gvoNHnlSwA4gfoYiAyhk0bPMfO4giIE8q8Ea3ezTNkJJmQOkiHYv4KQLypILL6AKMo3XTaDkzWs6MljOj5cyoY0bLmdFyZrScGS1nRh0z6pjB5xiAAAMAL0qjjz9syZQAAAAASUVORK5CYII=");
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: 80% 80%;
	-webkit-box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.4em 0.1em;
	-moz-box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.4em 0.1em;
	box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.4em 0.1em;
	cursor: pointer;
}
@media screen and (orientation:portrait) { 
	.game-home-button { width: 4em; height: 4em; }
}

body > header {
	
	position: fixed;
	left: 0px; top: 0px; right: 0px; height: 2em; line-height: 3em;

	-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0em 0em 0.1em 0.1em;
	-moz-box-shadow: rgba(0, 0, 0, 0.2) 0em 0em 0.1em 0.1em;
	box-shadow: rgba(0, 0, 0, 0.2) 0em 0em 0.1em 0.1em;
	
	z-index: 100500;
	-webkit-transform: translateZ(0px);
	background-color: rgba(255, 86, 42, 1.0);
}

body > header > * { 
	display: inline-block; box-sizing: border-box; 
	position: absolute; top: 0px; height: 2em; line-height: 2em; vertical-align: middle;
	margin: 0px; padding: 0px; text-align: center;
	cursor: pointer; 
	transition: background-color 0.2s ease-out, text-shadow 0.5s ease-out, color 0.5s ease-out;
	background-color: transparent;
	text-shadow: 0px 0px 2px rgba(255, 255, 255, 1);
}

/*body > header > .header-button:hover,*/ body > header > *.active {
	color: #ffffff;
	background-color: rgba(0,0,0,0.3);
	text-shadow: none;
}

body > header > .header-logo { 
	left: 0em; width: 10em; height: 2em; top: 0em;
	background-image: url('../../images/logo_big.png');
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: auto 80%;
}
body > header > .header-logo > * {  display: none; vertical-align: middle; }

body > header > .header-categories { right: 0em; padding: 0em 1em; color: #fff; } 
body > header > .header-categories > * { pointer-events: none; } 
body > header > .header-categories > .categories-caption { text-transform: uppercase; }
body > header > .header-categories > .categories-caption > .categories-arrow { 
	display: inline-block; box-sizing: border-box;
	position: relative; right: -1.4em; margin-left: -1.2em; margin-right: 1.2em; top: -0.1em; 
	width: 1em; height: 1em; vertical-align: middle;  
	background-image: url('../../images/combo-arrow.png');
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: 100% auto;
} 
body > header > .header-categories.active > .categories-caption > .categories-arrow {
	-moz-transform: scaleY(-1); -o-transform: scaleY(-1); -webkit-transform: scaleY(-1); transform: scaleY(-1); filter: FlipV; -ms-filter: "FlipV";	
}

nav.menu {
	font-size: 0.8em; color: #000000;
	display: block; position: fixed; top: 2.6em; right: 0em; bottom: 0em; 
	overflow-x: hidden;
	overflow-y: scroll;
	z-index: 100500; width: 14em;
	-webkit-overflow-scrolling: touch;
}

nav.menu > ul {
	display: block; box-sizing: border-box; text-align: center;
	-webkit-box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.4em 0.1em;
	-moz-box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.4em 0.1em;
	box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.4em 0.1em;
	background-color: #ffffff;	
	margin: 0em; padding: 0em;
}
nav.menu > ul > li {
	display: block; box-sizing: border-box; text-align: center;
	list-style-type: none; margin: 0em; padding: 0.2em;
	border-bottom: 1px solid black;
	height: 3em; line-height: 3em;
	background-color: #ffffff;	
	transition: color 1s ease-in;
}
nav.menu > ul > li:hover {
	transition: color 0.1s ease-in;
	color: #ff562a;
	-webkit-box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.4em 0.1em;
	-moz-box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.4em 0.1em;
	box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.4em 0.1em;
}
nav.menu > ul > li > a {
	display: block; box-sizing: border-box; height: 3em;
}
.modal-shader {
	display: none; position: fixed; box-sizing: border-box;
	left: 0px; right: 0px; top: 0px; bottom: 0px;
	z-index: 100499;
	background: rgba(0,0,0,0.5);
} 

body > header .header-row-item-logo {
	background-image: url("../../images/logo.png");
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: center center;
}

body > header .header-row-item-selected {
	background-image: -webkit-gradient(
		linear,
		left top,
		left bottom,
		color-stop(0, #EDAF9F),
		color-stop(1, #E44C26)
	);
	background-image: -o-linear-gradient(bottom, #EDAF9F 0%, #E44C26 100%);
	background-image: -moz-linear-gradient(bottom, #EDAF9F 0%, #E44C26 100%);
	background-image: -webkit-linear-gradient(bottom, #EDAF9F 0%, #E44C26 100%);
	background-image: -ms-linear-gradient(bottom, #EDAF9F 0%, #E44C26 100%);
	background-image: linear-gradient(to bottom, #EDAF9F 0%, #E44C26 100%);
	color: #fff;
	font-weight: bold;
}

.header-free-space { height: 2.5em; content: ' '; }

body > footer {
	height: 18em; 
	color: #ff572b; background-color: #650000; text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);
	text-align: center; font-size: 0.5em;
	padding-bottom: 1em;
}
body > footer > * { padding: 0.5em 2em; box-sizing: border-box; }
body > footer > *:nth-child(1) { padding-top: 1em; }

body > footer > .footer-links { text-transform: uppercase; }
body > footer > .footer-links > a { color: #FFF; display: inline-block; margin: 0px 0.5em; font-size: 1.5em; text-decoration: none; }
body > footer > .footer-links > a:hover { color: #ff572b; text-decoration: none; }

body > footer > .footer-seo { }

body > footer > .footer-social { }
body > footer > .footer-social > * { vertical-align:middle; }
body > footer > .footer-social > .footer-social-text { 
    display: inline-block; height: 2em; line-height: 2em; margin: 0em 0.5em; 
}
body > footer > .footer-social > a { 
	display: inline-block; box-sizing: border-box; overflow: hidden; 
	width: 4em; height: 4em; line-height: 4em; 
	border: 2px solid #ff572b;
	background-position: 50% 50%; 
	background-repeat: no-repeat;
	background-size: contain;
	margin: 0em 0.5em; 
}
body > footer > .footer-social > a:hover { border-color: #FFFFFF; background-size: 120% 120%; }
body > footer > .footer-social > a:active { border-color: #FFFFFF; background-size: 110% 110%; }
body > footer > .footer-social > a.facebook { background-image: url('../../images/social/facebook.png'); }
body > footer > .footer-social > a.twitter { background-image: url('../../images/social/twitter.png'); }
body > footer > .footer-social > a.email { background-image: url('../../images/social/mail.png'); }

body > section.main-content { 
	min-width: 640px; box-sizing: border-box; 
	margin: 0.2em auto;
}

article.game-item {
	display: inline-block; box-sizing: border-box;
	vertical-align: top;
	background: rgba(255,255,255,1);
}

article.game-item .game-item-image {
	background-color: rgba(255,128,0,0.3);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

article.game-item h2 { 
	display: block; color: #000000; font-size: 0.6em; font-weight: bold; white-space: nowrap; margin: 0px; height: 2.4em; line-height: 2.4em; 
}

article.game-item h3 { 
	font-size: 0.65em; font-weight: normal; white-space: nowrap; color: #E44C26; margin: 0px; margin-bottom: 0.4em; 
}

article.game-item a.play:active {
	background-color: rgba(0,173,41,0.7);
}

a.play, button.embed-button {
    display: inline-block; box-sizing: border-box;
    font-size: 0.8em; height: 2em; line-height: 2em;
    outline: none; border: 0em; cursor: pointer;
    padding: 0em 1em;
}

a.play { background-color: rgba(0,173,41,1); color: rgba(255,255,255,1); }
button.embed-button { background-color: rgba(255, 86, 42, 1.0); color: rgba(255,255,255,1); margin: 0em 0.1em; padding: 0em 1em; }

section.embed-popup {
	display: block; position: fixed; z-index: 100500;
	left: 0px; right: 0px; top: 0px; bottom: 0px;
	background: rgba(0,0,0,0.5);
}
section.embed-popup > article {
	display: block; box-sizing: border-box; position: absolute;
	left: 3em; right: 3em; top: 2em; height: 15em;
	background-color: rgba(255, 86, 42, 1.0);
}
section.embed-popup > article > code {
	display: block; position: absolute; font-size: 50%; font-family: Courier;
	left: 1em; right: 1em; top: 1em; bottom: 14em;
	background: rgba(255,255,255,0.8);
	text-align: left; padding: 1em;
	-moz-appearance: textfield-multiline;
    -webkit-appearance: textarea;	
}
section.embed-popup > article > .embed-options {
	display: block; position: absolute; line-height: 1em;
	left: 0em; right: 0em; top: 9em;
	text-align: center; padding: 1em;
	-moz-appearance: textfield-multiline;
    -webkit-appearance: textarea;	
}

section.embed-popup > article > .embed-options > span {cursor: pointer; display: inline-block; margin-left: 0.5em;}
section.embed-popup > article > .embed-options > span.active { font-weight: bold; text-decoration: underline; }
section.embed-popup > article > .embed-options input {width: 2em; height: 2em;}

section.embed-popup > article > button {
	display: inline-block; box-sizing: border-box;
	font-size: 1em; height: 2em; line-height: 2em; width: 10em;
	background-color: rgba(0,173,41,1); color: rgba(255,255,255,1);
	outline: none; border: 0em; cursor: pointer;
	margin: 0em 0.1em;
	padding: 0em 1em;
	position: absolute; left: 50%; margin-left: -5em; bottom: 0.5em;
}

section.game-details {
	display: block; box-sizing: border-box;
	width: 100%; padding: 0.3em;
	background: rgba(255,255,255,1); 
}

section.game-details > article.game-item {
	height: 4em;
	display: block; box-sizing: border-box;
	width: 100%;
}

section.game-details > article.game-item .game-item-image {
	float: left; width: 8em; height: 3.6em;
	margin: 0em 0.5em 0em 0em;
	cursor: pointer;
}

section.game-details > article.game-item h2 {
	height: 2em; line-height: 2em;
}

section.game-details > article.game-item h3 {
	height: 1em; line-height: 1em; font-size: 0.6em;
}

section.game-details > section.screenshots {
	display: block; width: 100%;
}

section.game-details > section.screenshots > .scroll-wrapper {
	width: 100%; height: 8.2em; overflow: hidden;
}

section.game-details > section.screenshots > .scroll-wrapper > .scroll-content {
	height: 8.2em; overflow: visible;
	white-space: nowrap; padding: 0em 4em 0em 0em;
	
}

section.game-details > section.screenshots > .scroll-wrapper > .scroll-content > .screenshot {
	/*height: 11.8em;*/ height: 8em; 
	width: auto; 
	pointer-events: none;
	margin: 0.1em 0.1em; 0.1em 0em;
	border: 1px solid #000;
}

section.game-details > section.description { display: block; margin-top: 1em; }
section.game-details > section.description > article:nth-of-type(1) { display: block; font-size: 0.6em; }
section.game-details > section.description > article:nth-of-type(2) { display: block; text-align: center; margin: 0.5em 0em; }
section.game-details > section.description a.play { font-size: 1em; }
section.game-details > section.description button.embed-button { font-size: 1em; }

article.text-block {
	font-size: 0.5em; background: rgba(255,255,255,1);
	padding: 2em; margin: 1em auto;
}

section.error-404 { color: rgba(128,0,0,1.0); text-align: center; padding: 0em 1em; }
section.error-404 > header {  font-size: 6em; }
section.error-404 > article { font-size: 0.6em; margin: 1em 0em; }
section.error-404 a { text-decoration: underline; white-space: nowrap; }

.advertizing { display: none; }

button.load-more {
	display: inline-block; box-sizing: border-box;
	font-size: 1em; height: 2em; line-height: 2em;
	background-color: rgba(255, 86, 42, 1.0); color: rgba(255,255,255,1);
	outline: none; border: 0em; cursor: pointer;
	padding: 0em 1em;
	margin-bottom: 1em;
}
button.load-more:active {
	background-color: rgba(255, 86, 42,0.7);
}

.ad-container { text-align: center; }
.ad-container.after-header > ins { margin-bottom: 0.5em; }
.ad-container.before-footer > ins { margin-bottom: 0.2em; }
.ad-container.before-more-games { margin-top: 0.5em; }

responsive-banner { 
    display: inline-block; box-sizing: border-box; 
    padding: 0px; margin: 0px; width: 300px; height: 600px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.15em 0px;
    -moz-box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.15em 0px;
    box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.15em 0px;
    background-color: rgba(255,255,255,1);
}

.category-description {
    
    display: block; box-sizing: border-box; font-size: 0.6em;
    background: rgba(255,255,255,1); padding: 0.5em; margin: 0.3em;
    text-indent: 1em;

    -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.15em 0px;
    -moz-box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.15em 0px;
    box-shadow: rgba(0, 0, 0, 0.5) 0em 0.1em 0.15em 0px;
}

.adblock {
    width: 100% !important; height: 100% !important; min-height: 50px;
    position: relative;
    background-color: rgba(218,37,28,1);
    background-image: url('../../images/adblock.png');
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
}

.adblock.adblock-300x250 { min-width: 300px; min-height: 250px; }
.adblock.adblock-300x250 { 
    background-image: url('../../images/adblock/300na250.png'); 
}

.adblock.adblock-300x600 { min-width: 300px; min-height: 600px; }
.adblock.adblock-300x600 { 
    background-image: url('../../images/adblock/300na600.png'); 
}

.adblock.adblock-320x100 { min-width: 320px; min-height: 100px; }
.adblock.adblock-320x100 { 
    background-image: url('../../images/adblock/320na100.png'); 
}

.adblock.adblock-320x50 { min-width: 320px; min-height: 50px; }
.adblock.adblock-320x50 { 
    background-image: url('../../images/adblock/320na50.png'); 
}

.adblock.adblock-468x60 { min-width: 468px; min-height: 60px; }
.adblock.adblock-468x60 { 
    background-image: url('../../images/adblock/468na60.png'); 
}

.adblock.adblock-728x90 { min-width: 728px; min-height: 90px; }
.adblock.adblock-728x90 { 
    background-image: url('../../images/adblock/728na90.png'); 
}

TilesList { min-height: 620px; } /* to avoid skyscraper banner overflow */

TilesList.embed-list {}
TilesList.embed-list > GameTile {
    height: 232px;
}
TilesList.embed-list > GameTile > a {
    bottom: 1.8em;
}
TilesList.embed-list > GameTile > button.embed-button {
   position: absolute; display: block;
   border: 3px solid rgba(255,255,255,1);
   /*top: 0.4em; right: 0.3em;*/
  bottom: 0.2em; left: 0.2em; width: 284px; 
}