@charset "utf-8";
/* CSS Document */

body{
	background:#f4f4f4;
	padding:0px;
}

.bg-dark{
	background:#b00404 !important;
	/*background:#D20000 !important;*/
}

h1{
	font-size:24px;
	color:#39F;
	margin-bottom:15px;
}

h2{
	font-size:20px;
	color:#39F;
	margin-bottom:15px;
	border-bottom:1px solid #CCC;
	padding-bottom:10px;
}

h2.hidden, div.hidden{
	display:none;	
}

.pagination{
	margin-top:20px;	
}

.row{
	margin:0;	
}

.logo{
	background:url(../images/logo.png) left center no-repeat;
	background-size: contain;
	padding-left:50px;
	font-weight:bold;
	margin-right:50px;	
}

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,.9);
}

a{
	cursor:pointer;
	color:#39F;
}

a:hover{
	color:#0065CA;
	text-decoration:none;	
}

.spaced{
	padding-top:20px;
	padding-bottom:20px;
	overflow:hidden;	
}

.whitebg{
	background:#FFF;	
}

.nav-item{
	margin-right:15px;	
}

.nav-item.new{
	background:url(../images/new-green.png) left center no-repeat;
	padding-left:22px;
}

.nav-item.rated{
	background:url(../images/rated.png) left center no-repeat;
	padding-left:22px;
}

.nav-item.popular{
	background:url(../images/popular.png) left center no-repeat;
	padding-left:22px;
}

.dropdown-menu{
	background:#333;
	border-radius:0;
}

.dropdown-item{
	color:#FFF;	
}

.dropdown-item:active {
	background:#b00404;	
}

.navbar-dark .navbar-toggler{
	border:none;
  	border-color: rgb(255,102,203);
}

.navbar-dark .navbar-toggler:focus{
	outline:none;	
}

.navbar-dark .navbar-toggler-icon{
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

/* SEARCH */

.search-icon{
	font-size:22px;
	color:#FFF;	
}

.search-icon:hover{
	color:#CCC;
}

#search {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    
    -webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;

    -webkit-transform: translate(0px, -100%) scale(0, 0);
	-moz-transform: translate(0px, -100%) scale(0, 0);
	-o-transform: translate(0px, -100%) scale(0, 0);
	-ms-transform: translate(0px, -100%) scale(0, 0);
	transform: translate(0px, -100%) scale(0, 0);
    
    opacity: 0;
	
	z-index:999;
}

#search.open {
    -webkit-transform: translate(0px, 0px) scale(1, 1);
    -moz-transform: translate(0px, 0px) scale(1, 1);
	-o-transform: translate(0px, 0px) scale(1, 1);
	-ms-transform: translate(0px, 0px) scale(1, 1);
	transform: translate(0px, 0px) scale(1, 1); 
    opacity: 1;
}

#search input[type="search"] {
    position: absolute;
    top: 30%;
    width: 100%;
    color: rgb(255, 255, 255);
    background: rgba(0, 0, 0, 0);
    font-size: 60px;
    font-weight: 300;
    text-align: center;
    border: 0px;
    margin: 0px auto;
    margin-top: -51px;
    padding-left: 30px;
    padding-right: 30px;
    outline: none;
}
#search .btn {
    position: absolute;
    top: 30%;
    left: 50%;
    margin-top: 61px;
    margin-left: -45px;
}
#search .close {
    position: fixed;
    top: 15px;
    right: 15px;
    color: #fff;
	background-color: #428bca;
	border-color: #357ebd;
	opacity: 1;
	padding: 10px 17px;
	font-size: 27px;
	padding-bottom:15px;
}

.footer{
	color:#FFF;
	font-size:12px;	
}

.footer .copyright{
	/*background-color: #b00404;*/
	background-color:#333;
	padding-top:20px;
	padding-bottom:20px;
	text-align:center;
}

.footer .description{
    padding-bottom: 30px;
    font-size: 12px;
    color: #FFFFFF;
    text-align: justify;
	background:#D20000;
	border-top:8px solid #FF5E5E;
}

.footer .description a{
	color:#FC0;	
}

.footer .copyright a{
	font-size:14px;
}

.footer .description h3{
	font-size:22px;
	margin-top:20px;
}

.banner-list{
	float:right;
	margin-bottom:12px;	
}

.game-item{
	border-radius:8px;
	border:1px solid #f4f4f4;
	display:inline-block;
	position:relative;
	text-align:center;
	overflow:hidden;
	margin-bottom:12px;
	margin-right:1%;
	-webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.game-item:hover{
	-webkit-box-shadow: 0px 5px 15px -4px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 5px 15px -4px rgba(0,0,0,0.5);
	box-shadow: 0px 5px 15px -4px rgba(0,0,0,0.5);
}

.game-item img{
	width:120px;
	height:90px;
	background:#FFF url(../images/loading.gif) center center no-repeat;
}

.game-item div{
	display:block;
	width:100%;
	text-align:center;
}

.game-item a{
	font-size:13px;
	padding-top: 10px;
	padding-bottom: 10px;
	color:#666;
}

.game-item .game-title{
	max-width:120px;
	padding-top:3px;
	overflow:hidden;
	height:25px;
	text-align:center;
}

.stars{
	height:19px;
	padding-top:2px;
	text-align:center;
	display:inline-block;	
}

.stars ul{
	list-style:none;
	display:inline-block;
	height:14px;
	background:url(../images/star.png) 0px -14px repeat-x;
	width:80px;
	margin-top:0px;
	margin-bottom:0px;
	text-align:left;
	-webkit-margin-before: 0em;
	-webkit-margin-after: 0em;
	-webkit-margin-start: 0px;
	-webkit-margin-end: 0px;
	-webkit-padding-start: 0px;
	padding:0px;
}

.stars ul li{
	float:left;
	display:block;
	height:14px;
}

.stars .full{
	background:url(../images/star.png) repeat-x;
	display:block;
	height:14px;
	float:left !important;
	left:0px;
}

.played{
	font-size:12px;
	color:#BBBBBB;
	line-height:140%;
	margin-bottom:6px;
	cursor:default;	
}

.languages{
	padding-top:20px;
	padding-bottom:10px;
	text-align:center;
	line-height:220%;	
}

.languages a{
	padding:16px;
	color:#666;	
}

.link-line{
	text-align:center;
	margin-bottom:10px;
}

.link-line a{
	font-size:9px;
	padding: 15px;
	color:#CCC;	
}

.counter{
	text-align:center;
	margin-bottom:20px;
	margin-top:20px;
	vertical-align:text-bottom;		
}

.counter img{
	vertical-align:top;	
}

.game_box{
	position:relative;
	text-align:center;
	width:100%;
	display:inline-block;	
}

.game_box .game{
	z-index:0;
	display:inline-block;
	text-align:center;
	height:auto;
	width:100%;
}

.game_box .game img{
	max-width:100%;	
}

.game .ifr{
	display:inline-block;	
}

.game_box .advert{
	z-index:5;
	background:#000000;
	position:absolute;
	width:100%;
}

.game_box .banner{
	position:absolute;
	top:25%;
	width:100%;
	text-align:center;
}

.game_box .advertising{
	position:absolute;
	top:19%;
	text-align:center;
	color:#666;
	width:100%;
	text-align:center;
	line-height:190%;
	margin-bottom:5px;
}

.game_box .advertising:hover{
	cursor:default;
}

/* loading progress bar */

.lcontainer{
	left:50%;
	position:absolute;
}

#loading {
 position:absolute;
 top:20px;
 left:-250px;
 width:500px;
 margin:2px auto;
 border:1px solid #4086E5;
 padding:3px;
 text-align:center;
 line-height:140%;
 font-weight:bold;
 font-size:16px;
 border-radius:5px;
 -moz-border-radius:5px;
}

#loading #loadbar{
	width:0%;
	height:22px;
	padding-top:3px;
	background: #4086e5;
	box-shadow: inset 0 0 12px #1754a6;
	-webkit-box-shadow: inset 0 0 12px #1754a6;
	-moz-box-shadow: inset 0 0 12px #1754a6;
	border-radius:3px;
	-moz-border-radius:3px;
	line-height:100%;
}

#loading #loadbar:hover{
	cursor:default;
}

#loading span{
	cursor:pointer;
	color:#FFF;
}

#loading span:hover{
	text-decoration:underline;	
}

.game-description{
	font-size:14px;
}

.gamerating{
	width:150px;
	display:block;
	float:right;	
}

.rating-column{
	float:right;	
}

.game-played span{
	color:#b00404;	
}

.game-share{
	height:34px;
	display:block;
	height:43px;
}

.game-share .imgg {
    float: left;
    margin-right: 2px;
}

.message_wait{
	height:48px;
	background:url('../images/spinner.gif') center no-repeat;
}

.alert{
	width:100%;	
}

#search_result{
    position: absolute;
    top: 30%;
    width: 100%;
	margin-top:110px;	
}

.now_playing div{
	margin-bottom:14px;	
}

#ifr{
	max-width:100%;	
}

.badge{
	padding:6px;
}

.tags-line a{
	margin-left:10px;
	margin-right:10px;
	text-align:center;
	margin-top:10px;
	margin-bottom:10px;
	padding:8px;	
}

/*
@media screen and (max-width:1050px) {
	#ifr{
		max-width:100%;	
	}	
}
*/


@media screen and (max-width:980px) {
	.list-of-games.inline{
		height:173px;
	    overflow-x: scroll;
	    overflow-y: hidden;
		width:auto;
		white-space: nowrap;
		max-width:none !important;
	}
}

@media screen and (max-width:820px) {
	.nav-item.new{
		display:none;	
	}
	.nav-item{
		margin-right:8px;	
	}
	.logo{
		margin-right:10px;
	}
}


.nav-item.more{
	display:none;	
}


@media screen and (max-width:575px) {

	#loading {
		left:-160px;
		width:320px;
	}
	
	.nav-item.more, .nav-item.new{
		display:block;	
	}

	.nav-item.new, .nav-item.rated, .nav-item.popular{
		background-position:right;
		padding-right:20px;
		padding-left:0;
	}
	
	.nav-item.dropdown{
		display:none;	
	}
	
	.banner-list{
		float:none;
		text-align:center;
	}
	
	.list-of-games.main .game-item{
		width:32%;
		margin-left:auto;
		margin-right:auto;
		margin-bottom:0;
	}
	
	.list-of-games.main .game-item .game-title{
		max-width:100%;
	}
	
	.list-of-games.main .game-item img{
		width:100%;
		height:auto;		
	}
	
	.search-icon{
		display:inline-block;
		background:#000;
		padding:8px;
	}
	
	.game-block{
		padding-left:8px;
		padding-right:8px;	
	}
	
}