@charset "UTF-8";
/* CSS Document */

/*-----------------------------
RESET
-----------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
ol, ul {
	list-style: none;
}


body {
	background:#FFFFFF url(../images/mainbg.gif) top left repeat-x;
	font-family:Arial, Helvetica, sans-serif;
	color:#626262;
	font-size:12px;
	line-height:20px;
}



/*-----------------------------
NAVIGATION
-----------------------------*/
#nav-container {width:960px; height:148px; margin:0 auto; background:url(../images/navheader.jpg) top left no-repeat;}

	#nav-container a.signup {float:right;  margin:20px 0 0 0;}

	#nav-container ul {padding:36px 0 0 0; width:940px; margin:0 0 0 10px; clear:both;}
	
	#nav-container li {float:left;}
	
	#nav-container li a {display:block; width:140px; height:50px; background:url(../images/mainnav.png); text-indent:-9999px;}
	
	#nav-container #home {background-position:-10px 0;  margin:0 20px 0 0;}
	#nav-container #howitworks {background-position:-170px 0; margin:0 20px 0 0;}
	#nav-container #products {background-position:-330px 0; margin:0 20px 0 0;}
	#nav-container #faq {background-position:-490px 0; margin:0 20px 0 0;}
	#nav-container #proof {background-position:-650px 0; margin:0 20px 0 0;}
	#nav-container #blog {background-position:-810px 0;}
	
	#nav-container #home:hover {background-position:-10px -50px;  margin:0 20px 0 0;}
	#nav-container #howitworks:hover {background-position:-170px -150px; margin:0 20px 0 0;}
	#nav-container #products:hover {background-position:-330px -150px; margin:0 20px 0 0;}
	#nav-container #faq:hover {background-position:-490px -150px; margin:0 20px 0 0;}
	#nav-container #proof:hover {background-position:-650px -150px; margin:0 20px 0 0;}
	#nav-container #blog:hover {background-position:-810px -150px;}
	
	#nav-container #home.current {background-position:-10px -50px;  margin:0 20px 0 0;}
	#nav-container #howitworks.current {background-position:-170px -150px; margin:0 20px 0 0;}
	#nav-container #products.current {background-position:-330px -150px; margin:0 20px 0 0;}
	#nav-container #faq.current {background-position:-490px -150px; margin:0 20px 0 0;}
	#nav-container #proof.current {background-position:-650px -150px; margin:0 20px 0 0;}
	#nav-container #blog.current {background-position:-810px -150px;}


dl.leftnav {background-color:#f5f5f5; padding:0 0 10px 0;}
	
	.leftnav dd a {margin:0 0 0 5px; padding:3px 0 0 5px; width:130px; height:23px; display:block; text-decoration:none;}
	
	.leftnav dd a:hover {background:url(../images/leftnav-highlight.gif) top left no-repeat; color:#FFFFFF;}

	.ipad-preorder {margin:20px 0 0 0;}

/*-----------------------------
STRUCTURE
-----------------------------*/
#content-container {width:960px; height:auto; overflow:auto; padding:0 0 10px 0; margin:0 auto; background:#FFFFFF url(../images/content-top.gif) top left no-repeat;}

	li.leftcontent {float:left; width:140px; margin:10px 0 0 10px;}
	 
	li.rightcontent {float:right; width:790px;}
	
		.innerRight {margin:0 10px 0 0;}
	
	
/*-----------------------------
HOME PAGE
-----------------------------*/
.headImage {margin:0 0 20px 0; width:790px; height:252px; background:#FFFFFF url(../images/load.gif) no-repeat 375px 116px;}

	.headImage img {opacity:0;}

.homeImage {margin:0 0 20px 0; width:790px; height:360px; background:#FFFFFF url(../images/load.gif) no-repeat 375px 170px; }

	.homeImage img {opacity:0;}

	.homecatch {float:right; margin:0 0 20px 20px;}
	
	ul.itemgallery {width:780px;}
	
		.itemgallery ul li {width:140px; margin:0 20px 0 0; float:left; background:#FFFFFF url(../images/load.gif) no-repeat 60px 60px;}
		
		.itemgallery ul li.last {width:140px; margin:0;}

		.itemgallery ul li img {border:0; cursor:pointer; margin:0; opacity:0;}
		
			

#demotip {
	display:none;
	background:transparent url(../images/black_arrow.png);
	font-size:12px;
	height:70px;
	width:160px;
	padding:25px;
	color:#fff;	
	z-index:9999;
}


/*-----------------------------
PRODUCTS PAGE
-----------------------------*/
.productHead {margin:0 0 20px 0; }


ul.product {width:780px; height:auto; clear:both;  }

	.product li.row {overflow:hidden; height:auto; clear:both; border-bottom:1px solid #e4e4e4; }

	.product li.image {float:left; width:260px; height:260px; background:#FFFFFF url(../images/load.gif) no-repeat 110px 110px; }
	
		.product li.image img {opacity: 0;}
	
	.product li.description {float:left; width:360px; margin:20px 20px 0 0;}
	
	.product li.go {float:left; width:140px; margin:20px 0 0 0;}


/*-----------------------------
COMMENTS
-----------------------------*/
#comments {width:780px; height:auto; overflow:hidden; padding:20px 0 0 0;}

	.column {width:230px; height:auto; background-color:#f5f5f5; padding:10px; margin:0 15px 15px 0; float:left;}
	
		.frapple_column {width:230px; height:auto; background:#c982c7 url(../images/frapp_commentbg.gif) top left repeat-x; color:#ffffff; padding:10px; margin:0 15px 15px 0; float:left;}
	
	.columnlast {width:230px; height:auto; background-color:#f5f5f5; padding:10px; margin:0 0 15px 0; float:left;}
	
		.frapple_columnlast {width:230px; height:auto; background:#c982c7 url(../images/frapp_commentbg.gif) top left repeat-x;  color:#ffffff; padding:10px; margin:0 0 15px 0; float:left;}
	
	.commentclear {clear:both;}

	.gravatar {width:42px; height:42px; padding:2px 0 0 2px; background-color:#FFFFFF; border:1px solid #d1d1d1; float:left; margin:0 0 0 0; clear:both; overflow:hidden;}
	
	.commentorDetails {float:left; margin:0 0 0 10px;}
	
	.comment {padding:10px 0 0 0; margin:0; clear:both; line-height:18px; }
	
	
	
	
	#commentForm {clear:both; width:780px; border-top:1px solid #e4e4e4; padding:20px 0 0 0;}
	
		#commentForm fieldset {width:780px;}
	
		#commentForm .left {width:390px; float:left;}
		
		#commentForm .right {width:390px; float:right;}
		
		#commentForm .leftlarge {width:360px;}

	input {width:350px; height:20px; margin:0 0 10px 0; padding:4px 0 0 2px; font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#333333;  border:1px solid #d1d1d1;}
	
	textarea {width:520px; height:100px; min-height:56px; padding:2px; font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#333333;line-height:18px; border:1px solid #d1d1d1;}
	
	.contactsubmit{ clear:both; width:97px; height:32px; border:0; margin:0; cursor:pointer; background:url(../images/submit.gif) top no-repeat;}
	
	label.error {color:#ff0000; margin:0 0 10px 0; }

/*-----------------------------
FEATURE - IPAD
-----------------------------*/
ul.technicalspecs {width:780px; overflow:auto;}

	.technicalspecs li {width:370px; margin:0 30px 0 0; float:left; height:auto;}
	
	.technicalspecs li.last { margin:0;}
	
		.technicalspecs li ul {margin:0 0 20px 0; height:auto; overflow:hidden}
	
		.technicalspecs li ul li+li {margin:0 0 5px 16px; list-style:disc; font-size:11px; line-height:16px; width:350px; }

/*-----------------------------
PROOF
-----------------------------*/
ul.videos {width:780px; overflow:auto;}

	.videos li {overflow:auto; margin:0 0 20px 0;}

	.videos li ul li.thevid {width:320px; margin:0 20px 0 0; float:left;}
	
	.videos li ul li.vidtext {width:440px; float:left;}


/*-----------------------------
TUTORIAL
-----------------------------*/
.tutorialbox1 {width:760px; min-height:265px; height:auto; _height:265px; padding:20px 0 0 20px; margin:0 0 15px 0; border:1px solid #e5e5e5; background:#f8f8f8 url(../images/tutorial1.jpg) bottom right no-repeat; clear:both }

.tutorialbox2 {width:760px; min-height:265px; height:auto; _height:265px; padding:20px 0 0 20px; margin:0 0 15px 0; border:1px solid #e5e5e5; background:#f8f8f8 url(../images/tutorial2.jpg) bottom right no-repeat; }

.tutorialbox3 {width:760px; min-height:307px; height:auto; _height:307px; padding:20px 0 0 20px; margin:0 0 15px 0; border:1px solid #e5e5e5; background:#f8f8f8 url(../images/tutorial3.jpg) bottom right no-repeat; }

	p.tutorial {width:270px; margin:0 0 20px 0;}


/*-----------------------------
WALLPAPERS
-----------------------------*/
ul.wallpapers {width:760px;}

	.wallpapers li {float:left; margin:0 40px 20px 0;}
	
	.wallpapers li.last {margin-right:0;}

/*-----------------------------
BLOG
-----------------------------*/
ul.blog {width:620px; height:auto;}

	.blog li {overflow:auto; margin:0 0 10px 0;}

.floatright {float:right; margin:0 0 10px 10px;}

.floatleft {float:left; margin:0 20px 10px 0;}

/*-----------------------------
FOOTER
-----------------------------*/
.legal {width:960px; text-align:left; font-size:11px; line-height:18px; margin:30px auto; color:#a5a5a5; padding:20px 0 0 0; border-top:1px solid #e4e4e4;}

/*-----------------------------
GENERAL
-----------------------------*/
h1 {margin:0 0 12px 0; font-size:26px; color:#000000; }
h1.narrow {margin:0 0 12px 0; font-size:26px; color:#000000; width:350px; float:left;}

h2 {clear:both; font-size:18px; color:#333333; margin:0 0 10px 0;}
h2.underline {clear:both; font-size:18px; color:#333333; border-bottom:1px solid #e4e4e4; margin:0 0 10px 0;}

h3 {color:#724598; font-size:18px; margin:0 0 10px 0;}
.technicalspecs h3 {color:#333333; font-size:16px; margin:0 0 10px 0;}

a {text-decoration:none; color:#9c59ac;}

a.frapplecomment {text-decoration:none; color:#ffffff;}

a:hover {text-decoration:underline;}

p {margin:0 0 15px 0;}

#flashheader {width:790px; height:360px; margin:0 auto 20px auto;}