/* reset css*/
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;
	font-family:Arial, Helvetica, sans-serif;
}

blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
:focus {
	outline: 0;
}
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* end of reset css*/

/*generic css*/
.left {
	float:left;
}
.right {
	float:right;
}
.clear {
	clear:both;
}
.hide {
	display:none;
}
.block {
	display: block;
}
.no-margin {
	margin:0;
}
/*end of generic css*/


body{ color: #fff; background: #000; }
a{ color:#e8ff7c; }
p{ line-height: 15px; margin: 10px 0; }
h1.page-header{ margin:15px 0; font-size: 20px; font-weight: normal; }
h1.page-header-tabs{ margin:20px 0 0 20px; font-size: 18px; font-weight: normal; }
a.no-underline{ text-decoration: none; }
ol, ul{ margin-left: 30px; line-height: 15px; }
li ul{ list-style: none; }
#body{ background: #000 url('/img/body-drop.png') top center no-repeat; margin:0 auto; width:960px; color:#fff; font-size: 12px; height: 800px;position:relative; }
#bodyInner{ background: #000 url('/img/body-drop-inner.png') top center no-repeat; margin:0 auto; height: 1000px; width:960px; color:#fff; font-size: 12px; position:relative; top:-15px; }
li.question{ font-size: 14px; color: #e8ff7c; cursor: pointer; font-weight: bold; }
li.question span.answer{ font-size: 12px; text-decoration: none; color: #fff; display: none; font-weight: normal;  }

.content{left:53px;top:151px;width:590px;position:relative; }

.iphone{ width: 247px; height: 547px; position:absolute; left:697px;top:151px; }
.screen{ position: relative; top:80px; left:22px; width: 205px; height: 307px; }

.footer {
	position:absolute;
	bottom: 10px;
	left:20px;
}

/* 
    root element for the scrollable. 
    when scrolling occurs this element stays still. 
*/ 
div.scrollable { 
 
    /* required settings */ 
left:53px;
top:151px;
width:590px;
    position:relative; 
    overflow:hidden; 
    height:500px; 
} 
 
/* 
    root element for scrollable items. Must be absolutely positioned 
    and it should have a super large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element. 
*/ 
div.scrollable div.items { 
    /* this cannot be too large */ 
    width:20000em; 
    position:absolute; 
} 
 
/* 
    a single item. must be floated on horizontal scrolling 
    typically this element is the one that *you* will style 
    the most. 
*/ 
div.scrollable div.items div { 
    float:left; 
    width:590px;
}
a.prev {
	position:absolute;
	display:block;
	background:transparent url(../img/arrow-left.png) no-repeat -4px -3px;
	top:330px;
	left:8px;
	height:60px;
	width:40px;
}
a.next {
	position:absolute;
	display:block;
	background:transparent url(../img/arrow-right.png) no-repeat -12px -2px;
	top:330px;
	left:654px;
	height:60px;
	width:40px;
}
a.disabled {
	background:none;
}
a.app-download {
	position:absolute;
	top:700px;
	left:752px;
	width:146px;
	height:46px;
	background:none;
}