@charset "utf-8";
/* CSS Document */
.gamePage
{
	width: 100%;
	min-height: 100px;
	/*height: auto;*/
	background-color: black;
	position:relative;/*absolute*/
	
	/*margin-top: 50%;
	/*padding-bottom: 100px;*/
	text-align: center;
	
	/*margin: 0;*/
	padding: 0;
	padding-top: 100px;
}

.gameGallery{
	background-color: transparent;
	
	/*top:50px;*/
	height: 100%;/*100%*/
	width:auto;
	left: 15%;
	right: 15%;
	/*top: 50%;
	transform: translate(0,-50%);*/
	/*position: absolute;*/
	/*margin: auto auto;*/
	/*position: absolute;*/
	
	margin-left: 15%;
	margin-right: 15%;
	display:inline-block;
	
	padding-bottom: 100px;
}

.previousGame{
	width: 50%;
	height: auto;
	
	overflow: hidden; /* [1.2] Hide the overflowing of child elements */
	
	color: transparent;
	transition: color 1s ease;
	
	display:inline-block;
	vertical-align:middle;
	text-align: center;
	
	/*left: 0;
	top: 0;*/
	position:relative;
	
	padding: 0;
	margin: 0 0 0 0;
	float:left;
	
	cursor: pointer;
}

.previousGame:hover{
	color:white;
}

.previousGame img {
  transition: transform 0.5s, filter 0.5s ease-in-out;
  transform-origin: center center;
  filter: brightness(100%);
}

.previousGame:hover img {
  filter: brightness(40%);
  transform: scale(1.1);
}

.currentGame{
	width: 100%;
	height: auto;
	
	overflow: hidden; /* [1.2] Hide the overflowing of child elements */
	
	color: transparent;
	transition: color 1s ease;
	
	display:inline-block;/*inline-block*/
	vertical-align:middle;
	text-align: center;
	
	margin: auto auto;
	
	/*left: 0;
	top: 0;*/
	position:relative;
	
	background-color: transparent;
	
	cursor: pointer;
}

.currentGame:hover{
	color:white;
}

.currentGame img {
  transition: transform 0.5s, filter 0.5s ease-in-out;
  transform-origin: center center;
  filter: brightness(100%);
}

.currentGame:hover img {
  filter: brightness(40%);
  transform: scale(1.1);
}

.gameImg
{
	width: 100%;
	height: 100%;
	
	display:block;
	
	/*right:0;
	top:0;
	position:relative;*/
}

.gameText
{
	font-family: "futura-bold";
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	position:absolute;
	font-size: xx-large;/*x-large*/
	
	/*color:white;
	/*transition: color 2.5s ease, top 3.5s ease;*/
	
	z-index:8;
	
	white-space: nowrap;
}

@media only screen and (max-width: 1000px)
{
	.previousGame
	{
		width: 100%;
	}
	
	.gameGallery
	{
		margin-left: 0%;
		margin-right: 0%;
	}

}

@font-face{
  	font-family: futura-bold;
  	src:	url('../fonts/futura/FuturaLTBold.woff') format('woff'),
			url('../fonts/futura/original/Futura%20LT%20Bold.ttf') format('ttf');
}