html {
min-height:100%;
margin-bottom:1px;
}

body {
	background: #000;
	font: 12px "Lucida Grande", Tahoma;
	margin: 0 auto;
}

a {
	color: #417fce;
	
}


body#home li.home,
body#video li.video,
body#screens li.screens,
body#support li.support {
	color: #fff;
	background-color: #1e1e1e;;
}

#main {
	color: #fff;
	position: relative;
	text-align: left;
	width: 800px;
	height: auto;
	margin: 0 auto;
}

#main h1 {
	background: url(../images/shortbanner.png) no-repeat 50% 0px;	
	margin: 0;
	height: 190px;
}

#banner {
	position: relative;
	width: 100%;
	text-align: left;
	text-indent: -9999px;
}

#appstore a {
	background: url(../images/appstorebadge2.png) top center no-repeat;
	position: absolute;
	width: 175px;
	height: 78px;
	z-index: 1;
	top: 100px;
	left: 616px;
	text-indent: -9999px;
}

#appstore a:hover {
	background: url(../images/appstorebadge2.png) bottom center no-repeat;
}

#new-game {
	background: url(../images/newgame.png);
	position: absolute;
	top:275px;
	left: 382px;
	width:  300px;
	height: 140px;
	text-indent: -9999px;
	z-index: 2;
}

#main-shot {
	position: absolute;
	width: 380px;
	height: 220px;
	top: 190px;
	left: 15px;
	z-index: 1;
}

#main-shot p a {
	background: url(../images/morescreenshots.png) top center no-repeat;
	position: absolute;
	width: 220px;
	height: 40px;
	left: 18%;	
	top: -13px;
	text-indent: -9999px;
}

#main-shot p a:hover {
	background: url(../images/morescreenshots.png) bottom center no-repeat;
}

#coming-soon {
	background: url(../images/newrelease.png);
	width:  130px;
	height: 130px;
	position: absolute;
	left: 80px;
	top:340px;
	z-index: 2;
}

#menubar {
	position: absolute;
	display: block;
	left:  400px;
	top: 195px;
	width: auto;
	height: auto;
	z-index: 1;
}

#menu-header {
	height: 100px;
	width: 40px;
	background: url(../images/menuleft.png);
	float: left;
}

#menu {
	background: url(../images/menubody.png) repeat-x;
	width: auto;
	height: 100px;
	float: left;	
	list-style: none;
	padding: 0 0 0 0;
	margin: 0px;
}

#menu-footer {
	height: 100px;
	width: 40px;
	background: url(../images/menuright.png);
	float: left;
}



#menu li {
	float: left;	
	padding: 0px 10px;
	text-transform: uppercase;
	font: bold 12px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	margin-top: 25px;
	line-height: 50px;
	height:  50px;
}

#menu li a {
	height: 50px;
	color: #bdbdbd;
	text-decoration: none;
}

#menu li a:hover {
	color: #fff;
}

#content {
	position: relative;
	width:  460px;
	margin: 0 auto;
	text-align: left;
	padding: 0px;
}

#content h1 {
	background: none;
	height: auto;	

}

#main-content-header {
	background: url(../images/grey_block_large_hdr.png) no-repeat;
	font: 12px "Lucida Grande";
	width: 460px;
	height: 64px;
	margin-top: 45px;
	clear: all;
}

#main-content {
	display: block;
	background: url(../images/grey_block_mid.png) repeat-y;
	font: 12px "Lucida Grande";
	color: #9b9b9b;
	width: 390px;
	padding: 150px 30px 20px 40px;
	text-shadow: 0 1px 1px rgba(0,0,0,0.75);
	text-align: left;
}

#main-content.screen {
	height: 260px;
}

#support #main-content {
	padding: 0px 30px 20px 40px;
}

#main-content h1 {
	color: #c0c0c0;
	font-variant: small-caps;
	font-size: large;
}

#main-content b {
	color: #c0c0c0;
	font-size: small;
}


#main-content-footer {
	background: url(../images/grey_block_ftr.png) no-repeat;
	font: 12px "Lucida Grande";
	width: 460px;
	height: 24px;
}

#exotic {
	background: url(../images/exotic.png) no-repeat 15px;
	margin: 0 auto;
	position: relative;
	width: 440px;
	height: 36px;
	text-shadow: rgba(0,0,0,0.5) -1px 2px 4px;
	color: #939286;
	text-transform: uppercase;
	font-size: 10px;
	padding: 0px 20px 0px 0px;
}

#credit {
	position: relative;
	top: 10px;
	width: 100%;
	height: 36px;
	text-align: right;
	text-shadow: rgba(0,0,0,0.5) -1px 2px 4px;
	color: #939286;
	text-transform: uppercase;
	font-size: 10px;
}

#credit a {
	color: #417fce;
}


#screen {
	background: url(../images/screens/phoneonly.png) no-repeat;
	position: absolute;
	top: 298px;
	left: 19px;
	text-align: center;
	line-height: 320px;
	width:  742px;
	height:  386px;
	z-index: 1;
	margin: 0 auto;
}

#screen img {
	margin-top: 33px;
}


#screennav {
	text-align: left;
	position: absolute;
	left: 200px;
	top: 252px;
	width:  100px;
	float: left;
}

#screennav ul{
	float: left;	
	width: 100px;
	list-style-type: none;
	margin: 0px 0px 0px 0px;
	text-indent: 0px;
	padding: 0;
}

#screennav li{
	float: left;	
	width: 50px;
	height: 50px;
	margin: 0px 0px 0px 0px;
}

#screennav li.prev a {
	position: absolute;
	height: 50px;
	width: 50px;
	text-indent: -9999px;
}

#screennav li.next a {
	position: absolute;
	height: 50px;
	width: 50px;
	text-indent: -9999px;
}

#screennav li.prev {
	background: url(../images/leftarrow.png) no-repeat;
}
#screennav li.next {
	background: url(../images/rightarrow.png) no-repeat;
}

#screennav li.prev a:hover {
	color: #fff;
	background: url(../images/leftarrow.png) no-repeat center bottom;	
}
#screennav li.next a:hover {
	color: #fff;
	background: url(../images/rightarrow.png) no-repeat center bottom;	
}


a#prevbutton {
	background: url(../images/leftarrow.png) no-repeat;
	height: 50px;
	width: 50px;
}

a#nextbutton {
	background: url(../images/rightarrow.png) no-repeat;
	height: 50px;
	width: 50px;
}

#actualsize {
	position: relative;
	background: url(../images/actualsizetext.png) no-repeat 50%;
	width: 480px;
	height: 28px;	
	top: -105px;
	margin: 0 auto;
}

#video-content {
	position: relative;	
	width: 680px;
	margin: 0 auto;
	top: -466px;
	z-index: 2;
}

#video-hdr {
	background: url(../images/blacktop.png)  no-repeat center center;
	width: 680px;
	width:  100%;
	height:  19px;
}

#video-bdy {
	background: url(../images/blackmid.png)  repeat-y center;
	width: 680px;
	margin: 0 auto;
	text-align: center;
}

#video-ftr {
	background: url(../images/blackbot.png)  no-repeat center center;
	width:  100%;
	height:  20px;
}

#video-footnote {
	padding: 230px 40px 10px 40px;
	font-size: smaller;
}