@font-face { 
	font-family: "Gotham-Thin"; 
	src: url('fonts/Gotham-Thin.eot');
	src: local(''), url('fonts/Gotham-Thin.woff') format('woff'), 
		url("fonts/Gotham-Thin.otf") format("opentype"),
		url('fonts/Gotham-Thin.ttf') format('truetype');
}

body { background: url('../images/bkg.aimax.light.jpg') no-repeat; background-size: cover; font-family: "Gotham-Thin", Helvetica, sans-serif; width: 100%; }
footer { bottom: 10px; color: #fff; font-size: 10px; position: fixed; right: 15px; }
header #logo { background: url('../images/bkg.aimax.logo.png') no-repeat; height: 24px; left: 15px; position: fixed; text-indent: -9999px; top: 15px; width: 100px; }
#main { float: left; width: 100%; }
#main #content { float: left; width: 100%; }
#content h1, #content h2 { color: #fff; padding: 0 10%; position: absolute; text-align: center; width: 78%; }
#content h1 { font-size: 60px; top: 40%; }
#content h2 { font-size: 40px; top: 55%; }

@media screen and (min-width:320px) and (max-width:568px) {
	body { background-size: inherit; background-position: -178px -410px; }
	#content h1 { font-size: 42px; top: 22%; }
	#content h2 { font-size: 19px; top: 55%;}
}

@media screen and (min-device-width:375px) and (max-device-width:667px) and (orientation:landscape) {
	#content h1 { font-size: 45px; top: 23%; }
	#content h2 { font-size: 25px; }
}

@media screen and (min-width:414px) and (max-width:736px) {
	#content h1 { font-size: 54px; }
}

@media screen and (min-device-width:414px) and (max-device-width:736px) and (orientation:landscape) {
	#content h1 { top: 27%; }
}

@media screen and (min-width:768px) and (max-width:1024px) {
	body { background-size: inherit; }
}