/* Copyright (c) Wadlemar Umaniz*/

body {
    background-color: #252334;
	color: #ffffff;
	font-family: "GidoleRegular";
    font-size: 1em;
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
	background:transparent url(../images/bg_pattern.png) repeat top center;
}

header {
	height: 55vmin;
	min-height: 180px;
	max-height: 308px;	
}

img {
    width: 100%;
    height: auto;
}

a {
	text-decoration: none;
	color: #ffffff;
	letter-spacing: 2px;
}
a:hover, a:active {
    color: #f79011;
}
a.steam > img {
    width: 20vw;
	max-width: 130px;
}
a.itch > img {
    width: 20vw;
	max-width: 130px;
	padding-left: 10px;
}

.container {
	margin: auto;
	max-width: 640px;
	position: relative;
}

.logo {
	bottom: 0px;
	left: 0px;
	position: absolute;
}
.logo > img {
	max-width: 562px;
}

.google_play_store {
	bottom: 6%;
	right: 0px;
	position: absolute;
	width: 100%;
    max-height: 73px;
    height: 12vw;
}
.google_play_store > a > img {
	width: 41vw;
	max-width: 247px;
	right: 15px;
	bottom: 0px;
	position: absolute;
}

.trailer {
	width: 600px;
    height: 338px;
	max-width: 85vw;
    max-height: 47.8125vw; /* 360/640 = 0.5625 > 56.25 * 0.85 > 47.8125 */
	padding: 30px;
	padding-left: 15px;
	padding-right: 15px;
}

.description {
	font-size: 1.3em;
	padding: 20px;
	padding-left: 15px;
	padding-right: 15px;
}

.distribution_service {
	padding-top: 10px;
	padding-bottom: 30px;
	padding-left: 15px;
	padding-right: 15px;
	text-align: center;
}

.screenshots {
	padding: 15px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	max-width: 640px;
}

.screenshots > a {
	width: 42vw;
	max-width: 298px;
    height: 100%;
	padding-right: 2px;
}

.contact {
	margin-top: 20px;
	margin-bottom: 0px;
	padding-left: 15px;
	padding-right: 15px;
	text-align: center;
	font-size: 1.3em;
}
.contact > div {
	padding-left: 17px;
	padding-right: 17px;
	display: inline;
}

.copyright, .legal {
	margin: 0px auto;
	padding: 2vh 0px 0px 0px;
	text-align: center;
	max-width: 640px;
	width: 80vw;
    font-size: 1em;
}
.legal > a {
	margin: 6px;
}

@media screen and (max-width: 580px) {
	.description {
		font-size: 1em;
	}
	.copyright, .legal {
		font-size: 0.8em;
	}
	.contact {
		font-size: 0.8em;
	}
}

@media screen and (max-width: 380px) {
	.description {
		font-size: 0.8em;
	}
	.copyright, .legal {
		font-size: 0.6em;
	}
	.contact {
		font-size: 0.6em;
	}
}

.noselect {
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
	-moz-user-select: -moz-none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}
.textSelectionIsOn {
    cursor: auto;
    -webkit-touch-callout: text;
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    -o-user-select: text;
    user-select: text;
 }