/*
Theme Name: Spirit
Theme URI: http://spiritapp.com
Description: Theme for spiritapp.com
Version: 0.2.1
Author: Andrew Hamilton
Author URI: http://andrewhamilton.net
*/

/* ----------------------------------------------------------------- */	
/* BASICS */
/* ----------------------------------------------------------------- */	

body {
	background: #000018 url('../img/background.jpg') top center no-repeat;
	padding: 0;
	margin: 0;
	height: 100%;
	width: 100%;
}
	
a:active { outline: none; }
	
/* ----------------------------------------------------------------- */		
/* TYPE */
/* ----------------------------------------------------------------- */	

.bodytext, .bodytextright, .bodytextmid, .bodytextdark, .footer {
	font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

.copyright {
	font-family: "Verdana", sans-serif;
}

.bodytext, .bodytextright, .bodytextmid, .bodytextdark {
	font-size: 12px;
	font-weight: normal;
}

.bodytextbolditalic {
	font-weight: bold;
	font-style: italic;	
}

.bodytextright {
	text-align: right;
}

.bodytext a, .bodytextmid a, .bodytextright a {
	text-decoration: none;	
}

.bodytext a:hover, .bodytextmid a:hover, .bodytextright a:hover {
	text-decoration: underline;	
}

.bodytext, .bodytextbolditalic, .bodytext a  {
	color: #40b9c2;	
}

#reviews .bodytextbolditalic, .bodytext a:hover {
	color: #b4e6f1;
}

.bodytextmid a, .bodytextright a, .bodytextmid a:hover, .bodytextright a:hover {
	color: #40b9c2;
}

.bodytextmid,.bodytextright {
	color: #205d6d;	
}

.bodytextdark {
	color: #000018;	
}

.footer, .copyright {
	font-size: 10px;
	color: #205d6d;
}

.footer a {
	color: #40b9c2;
	text-decoration: none;
}

.footer a:hover {
	text-decoration: underline;
}

.editleft {
	float: left;
	position: relative;
	margin: 0 0 0 -50px;
}

.editleft a, editright a {
	text-decoration: none;
	padding: 2px 4px 2px 4px;
	color: #40b9c2;
	border: 1px solid #40b9c2;
}

.editleft a:hover, editright a:hover {
	text-decoration: none;
	color: #000018;
	background-color: #40b9c2;
}

.twitterfeed {
	color: #000018;
	min-height: 64px;
    display: table-cell;
    vertical-align: middle;
    padding: 4px 4px 4px 4px;
    width: 440px;
}

.twitterfeed a {
	color: #205d6d;
	text-decoration: none;
}

.twitterfeed a:hover {
	text-decoration: underline;
}

/* ----------------------------------------------------------------- */	
/* PAGE LAYOUT */	
/* ----------------------------------------------------------------- */	

#wrap {
	margin: 0 auto 0 auto;
	width: 964px;
	background: url('../img/raster_4x4.gif');
}

#header {
	float: left;
	width: 964px;
}

#logo a {
	background: transparent url('../img/logo.png') no-repeat;
	float: left;
	font-size: 0;
	text-indent: -10000px;
	margin: 60px 0 0 0;
	width: 248px;
	height: 108px;
}

#grid {
	margin: 0 auto 0 auto;
	float: left;
	width: 963px;
	height: 232px;
}

#gotspirit {
	background: transparent url('../img/titlegotspirit.png') no-repeat;
	float: left;
	font-size: 0;
	text-indent: -10000px;
	width: 409px;
	height: 41px;
}

#content {
	float: left;
	width: 964px;
}

#maincontent {
	clear: both;
	float: left;
	width: 564px;
	min-height: 444px;
	margin: 0 0 0 10px;
}

#sidecontent {
	float: right;
	margin: 160px 80px 0 0;
	width: 258px;
}

#contentblocks {
	float: left;
	width: 564px;
	margin: 0 0 0 10px;
}

#openfeintsoon a {
	background: transparent url('../img/openfeintsoon.png') no-repeat;
	float: left;
	font-size: 0;
	text-indent: -10000px;
	height: 75px;
	width: 242px;
}

#fiftypercentoff a {
	background: transparent url('../img/50percentoff.png') no-repeat;
	float: left;
	font-size: 0;
	text-indent: -10000px;
	height: 75px;
	width: 304px;
}

#upperfooter {
	float: left;
	padding: 20px 0 20px 0;
}

#footer {
	padding: 10px 0 20px 0;
	clear: both;
}

/* ----------------------------------------------------------------- */	
/* GRID */
/* ----------------------------------------------------------------- */	

#gridleft, #gridmiddle, #gridright { float: left; height: 232px; }
#gridleft { background: transparent url('../img/gridleft.png') no-repeat; width: 74px; }
#gridmiddle { background: transparent url('../img/gridmiddle.png') repeat-x; width: 773px; }
#gridright { background: transparent url('../img/gridright.png') no-repeat; width: 116px; }

#pricecut {
	background: transparent url('../img/pricecut.gif') no-repeat;
}

#price {
	background: transparent url('../img/price.gif') no-repeat;
}

#price, #pricecut {
	float: right;
	position: absolute;
	margin: 178px 0 0 872px;
	width: 82px;
	height: 82px;
}

#screenshots {
	width: 211px;
	height: 317px;
	position: absolute;
	overflow: hidden;
	left: 24px;
	top: 79px;
	background-color: black;
	z-index: 10;
}

#screenshots img { float: left; }
#screenshots div { width: 1585px; }

#screenshotcontrols {
	float: right;
	position: absolute;
	top: 490px;
	right: 83px;
	width: 80px;
	height: 36px;
	z-index: 100;
}

#leftbutton a, #rightbutton a {
	float: left;
	height: 36px;
	width: 36px;
}

#leftbutton a {
	background: transparent url('../img/buttonleft.png') no-repeat;
}

#rightbutton a {
	background: transparent url('../img/buttonright.png') no-repeat;
}

#leftbutton a:hover, #rightbutton a:hover  { background-position: bottom left; }

#iphone {
	background: transparent url('../img/iphone.png') no-repeat;
	float: right;
	position: absolute;
	margin: 70px 0 0 614px;
	width: 258px;
	height: 565px;
	z-index: 1;
}

#appstore a {
	background: transparent url('../img/appstore.png') no-repeat;
	float: left;
	position: absolute;
	margin: 206px 0 0 124px;
	font-size: 0;
	text-indent: -10000px;
	width: 184px;
	height: 75px;
}

#appstore a:hover { background-position: bottom left; }

#videoplayer a {
	background: transparent url('../img/playmovie.png') no-repeat;
	float: left;
	position: absolute;
	margin: 289px 0 0 124px;
	font-size: 0;
	text-indent: -10000px;
	width: 184px;
	height: 75px;
}

#videoplayer a:hover { background-position: bottom left; }

/* ----------------------------------------------------------------- */
/* Game Sprites */
/* ----------------------------------------------------------------- */	

#sprites, #spritehand, #spriteplayer, #spriteline, #spritehunter01, #spritehunter02, #spritebouncer01, #spritebouncer02,
#spriteshifterleft, #spriteshifterright, #spritestalker { position: absolute; }

#sprites { width: 500px; height: 232px; }

#spritehand {
	background: transparent url('../img/spritehand.png') no-repeat;
	height: 120px;
	width: 87px;
	left: 260px;
	top: 86px;
}

#spriteplayer {
	background: transparent url('../img/spriteplayer.png') no-repeat;
	height: 38px;
	width: 42px;
	left: 250px;
	top: 50px;
}

#spriteline {
	background: transparent url('../img/spriteline.png') no-repeat;
	height: 125px;
	width: 45px;
	left: 223px;
	top: 88px;
}

#spritehunter01, #spritehunter02 {
	background: transparent url('../img/spritehunter.png') no-repeat;
	height: 52px;
	width: 52px;
}

#spritehunter01 { left: 40px; top: 140px; }
#spritehunter02 { left: 60px; top: 43px; }

#spritebouncer01, #spritebouncer02 {
	background: transparent url('../img/spritebouncer01.png') no-repeat;
	height: 52px;
	width: 52px;
}

#spritebouncer01 { left: 180px; top: 52px; }
#spritebouncer02 { left: 32px; top: 120px; }

#spriteshifterleft {
	background: transparent url('../img/spriteshifterleft.png') no-repeat;
	height: 46px;
	width: 49px;
	left: 400px;
	top: 15px;
}

#spriteshifterright {
	background: transparent url('../img/spriteshifterright.png') no-repeat;
	height: 47px;
	width: 48px;
	left: 110px;
	top: 130px;
}

/* #spritestalker {
	background: transparent url('../img/spritestalker.png') no-repeat;
	height: 50px;
	width: 48px;
	left: 60px;
	top: 43px;
} */

/* ----------------------------------------------------------------- */	
/* REVIEWS */
/* ----------------------------------------------------------------- */	

#reviewstitle {
	background: transparent url('../img/titlereviews.png') no-repeat;
	float: left;
	clear: both;
	font-size: 0;
	text-indent: -10000px;
	padding: 0 0 6px 0;
	width: 258px;
	height: 37px;
}

#reviews {
	float: left;
	padding: 0 0 0 6px;
	min-height: 120px;
}

#reviewstars1, #reviewstars2, #reviewstars3, #reviewstars4, #reviewstars5,
#stars1, #stars2, #stars3, #stars4, #stars5 {
	height: 25px;
	padding: 0 0 4px 0;
	z-index: 0;
}

#reviewstars1, #reviewstars2, #reviewstars3, #reviewstars4, #reviewstars5 {
	background: transparent url('../img/staroff.png') repeat-x;
}

#stars1, #stars2, #stars3, #stars4, #stars5 {
	background: transparent url('../img/staron.png') repeat-x;
	float: left;
}

#reviewstars1, #stars1 { width: 25px; }
#reviewstars2, #stars2 { width: 50px; }
#reviewstars3, #stars3 { width: 75px; }
#reviewstars4, #stars4 { width: 100px; }
#reviewstars5, #stars5 { width: 125px; }

/* ----------------------------------------------------------------- */	
/* SOCIAL MEDIA */
/* ----------------------------------------------------------------- */	

#facebookfan {
	float: right;
	width: 258px;
	margin: 17px 0 0 66px;

}

#twitter {
	float: left;
	padding: 10px 0 0 0;
	width: 550px;
	height: 64px;
}

#twitterfollow {
	float: left;
	width: 520px;
}

#twitterleft, #twittermiddle, #twitterright, #twitterlogo {
	float: left;
	height: 59px;
}

#twitterlogo {
	background: transparent url('../img/twitter.png') no-repeat;
	width: 36px;
}

#twitterleft {
	background: transparent url('../img/twitterleft.png') no-repeat;
	width: 34px;
}

#twittermiddle {
	position: relative;
	display: inline;
	word-break: break-all;
	background: transparent url('../img/twittermiddle.png') repeat-x;
	width: 445px;
}

#twitterright {
	background: transparent url('../img/twitterright.png') no-repeat;
	width: 20px;
}