/* -------------------------------------------------------------- 
  
   Boilerplate Screen Styles
   * Version:   0.5 (2007-11-19)
   
-------------------------------------------------------------- */

@import "lib/reset.css";
@import "lib/typography.css";
@import "lib/forms.css";


/* General Styles
-------------------------------------------------------------- */
  
	html { height:100%; margin-bottom:1px; }
	body {
		background:url(../images/bg-gradient.png) repeat-x 0 0 #fff;
		margin:0;
		padding-bottom:40px;
	}
	#page {
		width:780px;
		margin:0 auto;
	}
	
	/* Header 
	------------------------- */
	#header {
		clear:both;
		overflow:hidden;
		background:url(../images/head-phone.png) no-repeat top right;
		height:360px;
		padding-top:20px;
	}
	#header #mainNav {
		list-style:none;
		position:relative;
		top:40px;
		left:140px;
		margin:0;
		
		font-size:1.2em;
	}
	#header #mainNav li {
		float:left;
		padding:10px;
	}
	#header #mainNav a {
		color:#919e41;
	}
	
	#header #logo {
		width:340px;
		height:150px;
		background:url(../images/head-logo.png) no-repeat;
		overflow:hidden;
		text-indent:-5000px;
		clear:both;
	}
	.skip {
		padding:10px;
		color:#f15e66;
		font-weight:bold;
		font-size:1.4em;
		background:url(../images/dot.png) no-repeat right top;
		padding-right:35px;
	}
	#header .skip {
		position:relative;
		top:-10px;
		left:140px;
	}
	
	
	/* Content
	------------------------- */
	#homeBody {
		float:left;
		width:460px;
		margin-right:30px;
		
	}
	#homeBody .intro {
		font-size:1.6em;
		line-height:1.6;
	}
	
	.makeYourFace {
		display:block;
		width:460px;
		height:100px;
		background:url(../images/make-your-face.png) no-repeat;
		overflow:hidden;
		text-indent:-5000px;
		clear:both;
	}
	.inner {
		margin:0 40px;
	}
	
	/* Sidebar
	------------------------- */
	#sidebar { 
		width:290px;
		float:right;
		padding-bottom:20px;
	}
	#sidebar .sideHeading {
		display:block;
		width:290px;
		height:60px;
		background:url(../images/side-home-header.png) no-repeat;
		text-indent:-5000px;
		overflow:hidden;
	}
	#sidebar .box {
		width:260px;
		background:url(../images/side-background.png) repeat-y;
	}
	#sidebar .box p {
		color:#fff;
		padding:0 30px 0 80px;
	}
	#sidebar .box .footer {
		height:90px;
		background:url(../images/side-footer.png) bottom;
	}
	
	/* Checkout Steps
	------------------------- */
	#checkoutSteps {
		background:url(../images/grey-line.png) repeat-x center;
		height:30px;
		margin-bottom:20px;
	}
	#checkoutSteps a,
	#checkoutSteps span,
	#checkoutSteps em {
		display:block;
		float:left;
		width:100px;
		height:30px;
		background:#fff;
		margin-right:100px;
		font-size:1.1em;
		text-align:center;
		line-height:30px;
		padding:0 10px;
		font-style:normal;
	}
	#checkoutSteps span {
		background-image:url(../images/checkout-step-bg.png);
		background-repeat:no-repeat;
		background-position:center;
		color:#fff;
	}
	#checkoutSteps .right {
		margin-right:0;
	}
	.stepHeader {
		background:url(../images/checkout-step-bg.png) no-repeat;
		padding-left:60px;
		line-height:30px;
	}
	.stepHeader span {
		color:#fff;
		padding-right:20px;
	}

/* Pages
-------------------------------------------------------------- */

	/* Index Page
	------------------------- */
	#index #logo {
		float:right;
		width:120px;
		height:50px;
		background:url(../images/home-logo.png) no-repeat;
		display:block;
		overflow:hidden;
		text-indent:-5000px;
	}
	#index #splash {
		width:100%;
		height:550px;
		background:url(../images/home-splash.png) no-repeat center;
		display:block;
		clear:both;
		overflow:hidden;
		text-indent:-5000px;
		margin-bottom:30px;
	}
	#index .skip {
		background-position:left;
		padding-left:35px;
		float:left;
		top:0;
		left:0;
	}
	#index #addthis {
		float:left;
		padding:10px 0;
		clear:both;
	}
	
	/* Buy Page
	------------------------- */
	#buy #orderTotal {
		float:right;
		font-size:2.4em;
	}
	#buy #orderItems {
		font-size:1.2em;
		list-style:none;
		margin-left:0;
	}
	#buy #orderItems span {
		font-size:1.4;
		font-weight:bold;
	}
	#buy #secure {
		background:url(../images/lock.png) no-repeat left center;
		color:#666;
		line-height:30px;
		padding-left:35px;
	}
	
	/* Download Page
	------------------------- */
	#previewContainer {
		float:left;
		width:100%;
	}
	#previewContainer #DataList1 tr {
		float:left;
	}
	.sellfacePreview {
		float:left;
		display:block;
		text-align:center;
		margin:0 1em 1em 0;
		border:1px solid #ccc;
		padding:0.25em;
		width:200px;
		height:360px;
		overflow:hidden;
		clear: none;
	}
	.sellfacePreview * { border:0; margin:0; padding:0; }
	.sellfacePreview img { width:200px; }
	.sellfaceData { 
		margin:0.5em 0; 
		font-weight: bold;
		text-align:center;
	}
	.logout {
		float:left;
		clear:both;
		padding:2em 0;
	}
	
/* Special
-------------------------------------------------------------- */
	#launchGiveaway {
		background:#f15e66;
		color:#fff;
		padding:1em;
		margin-bottom:1em;
		display:block;
	}
	#launchGiveaway:hover {
		background:#d3443f;
		text-decoration: none;
	}
	#launchGiveaway h1 {
		font-weight:bold;
		color:#fff;
	}
	#launchGiveaway p {
		margin-bottom:0;
	}