/* Copyright (c) Wadlemar Umaniz*/

body {
    background-color: #19171e;
	color: #ffffff;
	font-family: "CaviarDreams";
    font-size: 1em;
}
.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;
}

.main-background {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-image: url('../images/background.png');
	background-position: center top;
	background-color: transparent;
    background-repeat: no-repeat;
	background-size: cover;
	z-index: -1;
}

header {
	width: 100%;
	height: 100vh;
}
header > .logo-container {
	position: absolute;
    bottom: 16%;
	width: 100%;
}
header > .logo-container > .logo {
	width: 100vw;
	max-width: 674px;
	margin: auto;
	text-align: center;
}
header > .logo-container > .logo > img {
	max-width: 674px;
	height: 514px;
	max-width: 90vw;
    max-height: 68.635vw;
}
header > .scrollhint {
	position: absolute;
	bottom: 20px;
	left: 50%;
	width: 22px;
	margin-left: -11px;
}
header > .scrollhint > img {
	display: block;
	width: 100%;
}

section {
	padding-top: 10vh;
	padding-bottom: 10vh;
	background-color: rgba(25, 23, 30, 0.76);
}
section.gradient {
	display: block;
	width: 100%;
	height: 7vh;
	bottom: 0%;
	margin: 0;
	padding: 0;
	background-color: transparent;
	background: -webkit-linear-gradient(rgba(25, 23, 30, 0), rgba(25, 23, 30, 0.76));
    background: -o-linear-gradient(rgba(25, 23, 30, 0), rgba(25, 23, 30, 0.76));
    background: -moz-linear-gradient(rgba(25, 23, 30, 0), rgba(25, 23, 30, 0.76));
    background: linear-gradient(rgba(25, 23, 30, 0), rgba(25, 23, 30, 0.76));
}

.content {
	width: 100vw;
	max-width: 960px;
	margin: 0px auto;
	text-align: center;
}

.trailer {
	width: 640px;
    height: 360px;
	max-width: 90vw;
    max-height: 50.625vw; /* 360/640 = 0.5625 > 56.25 * 0.9 > 50.625 */
}

.content > .screenshot {
    width: 347px;
    height: 195px;
    margin: 0 auto;
    text-align: center;
	display: inline;
}
.content > .screenshot > a {
	text-decoration: none;
    cursor: pointer;
}

.content > .description {
	max-width: 640px;
	width: 80vw;
	margin: 0px auto;
	text-align: justify;
	letter-spacing: 1px;
	line-height: 1.4em;
}

.byDeveloper {
	text-align: right;
}

.content > .contact {
	max-width: 400px;
	width: 80vw;
	position: relative;
    margin: 0px auto;
}
.content > .contact > div {
	margin: 0px auto;
	display: inline;
}

h2 {
	clear: none;
    font-size: 1.6em;
	line-height: 1.2em
}

a {
	text-decoration: none;
	color: white;
	letter-spacing: 2px;
}
a:hover, a:active {
    color: red;
}
a.steam {
	padding-left: 0px;
}
a.itch {
	padding-left: 20px;
}

.systems {
	float: right;
}
.systems > .win {
}
.systems > .mac {
	padding-right: 20px;
}

footer {
	height: 100px;
	background-color: #19171e;
}
.copyright, .legal {
	margin: 0px auto;
	padding: 2vh 0px 0px 0px;
	text-align: center;
	max-width: 640px;
	width: 80vw;
}
.legal > a {
	margin: 6px;
}

.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;
 }