@charset "utf-8";
/* CSS Document */

/* custom fonts */
@font-face {
	font-family:OverpassMonoRegular;
	src:url('../fonts/overpass-mono-regular/overpass-mono-regular.eot');
	src:url('../fonts/overpass-mono-regular/overpass-mono-regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/overpass-mono-regular/overpass-mono-regular.svg#OverpassMonoRegular') format('svg'),
		url('../fonts/overpass-mono-regular/overpass-mono-regular.woff2') format('woff2'),
		url('../fonts/overpass-mono-regular/overpass-mono-regular.woff') format('woff'),
		url('../fonts/overpass-mono-regular/overpass-mono-regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family:OverpassMonoSemiBold;
	src:url('../fonts/overpass-mono-semibold/overpass-mono-semibold.eot');
	src:url('../fonts/overpass-mono-semibold/overpass-mono-semibold.eot?#iefix') format('embedded-opentype'),
		url('../fonts/overpass-mono-semibold/overpass-mono-semibold.svg#OverpassMonoSemiBold') format('svg'),
		url('../fonts/overpass-mono-semibold/overpass-mono-semibold.woff2') format('woff2'),
		url('../fonts/overpass-mono-semibold/overpass-mono-semibold.woff') format('woff'),
		url('../fonts/overpass-mono-semibold/overpass-mono-semibold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family:WareHaus;
	src:url('../fonts/ware-haus/ware-haus.eot');
	src:url('../fonts/ware-haus/ware-haus.eot?#iefix') format('embedded-opentype'),
		url('../fonts/ware-haus/ware-haus.svg#WareHaus') format('svg'),
		url('../fonts/ware-haus/ware-haus.woff2') format('woff2'),
		url('../fonts/ware-haus/ware-haus.woff') format('woff'),
		url('../fonts/ware-haus/ware-haus.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
/* /custom fonts */

* { margin:0; padding:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; }

html { font-size:100%; height:100%; }

body { font-family:OverpassMonoRegular, sans-serif; font-size:1.25em; color:#fff; background-color:#000; height:100%; }

a { outline:none; text-decoration:none; color:#fff; transition:all linear 0.2s; }
a:hover, a:focus, a.active { text-decoration:underline; color:#fff; outline:none; }
	a * { transition:all linear 0.2s; }
	a img { border:0; }

img { max-width:100%; }

h1, h2, h3, h4, h5, h6, p { margin:0 0 10px 0; font-weight:normal; }

p { line-height:1.5em; }

h2 { font-size:2em; }

small { font-size:70%; }

figure, footer, header, section { display:block; }

.wrapper { min-height:100%; position:relative; }

header { padding:30px 30px 0 30px; position:relative; z-index:2; }
header:before, header:after { content:""; display:table; }
header:after { clear:both; }
	header .about { float:right; }

[class^="nav-"] { font-family:OverpassMonoSemiBold, sans-serif; }
.nav-logo {}
.nav-about { float:right; }
.nav-download {}
.nav-contact { float:right; }

/* content */
#content {}
	.home-content { width:480px; max-width:90%; font-size:0; text-align:center; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); }
	
	.about-content { width:650px; max-width:90%; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); }
	
	.download-content { width:600px; max-width:90%; word-wrap:break-word; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); }
		.download-content .typeface { font-family:WareHaus, sans-serif; font-size:3.5em; line-height:0.9em; }
		.download-content br { line-height:2em; }
		a.arrow { background:transparent url(../images/download-icon.png) 0 5px no-repeat; padding-left:20px; }
	
	.contact-content { width:600px; max-width:90%; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); }
		.contact-content p { margin-bottom:15px; }
/* /content */

footer { padding:0 30px 30px 30px; position:absolute; bottom:0; left:0; right:0; z-index:2; }
footer:before, footer:after { content:""; display:table; }
footer:after { clear:both; }

/* extra small device (xs)*/
@media screen and (max-width: 767px) {
	body { font-size:1em; }
	header { padding:15px 15px 0 15px; }
	.nav-logo img { width:100px; }
	.home-content { max-width:250px; margin-top:15px; }
	.about-content { width:260px; margin-top:18px; }
	.download-content { width:260px; margin-top:15px; }
	.hidden-xs { display:none; }
	.download-content .typeface { font-size:2.65em; }
	.contact-content { width:290px; margin-top:20px; }
	.contact-content p:first-child { width:230px; }
	footer { padding:0 15px 15px 15px; }
}

@media screen and (max-height: 360px) {
	.home-content { max-width:220px; margin-top:0; }
}

/* small device (sm) */
@media screen and (min-width: 768px) and (max-width: 991px) {
	
}

/* medium device (md) */
@media screen and (min-width: 992px) and (max-width: 1199px) {
	
}

/* large device (lg) */
@media screen and (min-width: 1200px) {
	
}