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

/*body, a
{font-family:Segoe UI, Myriad Pro, helvetica, sans serif;
font-size: 16px;
line-height: 22px;
color:#d1d1d1;}*/

.hr
{
background:url(../images/separator.jpg) repeat-x center;
height:2px;
width:700px;
clear:both;
margin:20px auto;}
#features div:hover
{}

.featurepanel
{
display:block;}
.featurepanel span
{
display:block;
border:none;
padding:0;
float:none;
margin:0;
width:auto;	
margin-left:92px;}

.featurepanel img
{
float:left;
margin-right:20px;
}

.featurepanel b
{display:block;
clear:right;
font-weight:normal;
font-size:120%;
color:#666;
text-shadow: 0 1px 0 #FFF;
}

#f-container
{
width:100%;
margin:auto;
background: #f0f0f0 url(../images/header.jpg) repeat-X left top;

}

#f-header
{
z-index:0;
background: #000d25 url(../images/bg0.jpg) no-repeat center top;
height:610px;
font-family:Segoe UI, Myriad Pro, helvetica, sans serif;
font-size: 16px;
line-height: 22px;
color:#d1d1d1;}
#backgrounds
{
z-index:1;

width:100%;
position:absolute;
height:610px;
padding:0;
margin-top:110px;


top:0;
overflow:hidden;}
#backgrounds img
{
display:none;
position:absolute;
top:0;
z-index:1;
width:3000px;
margin:0 0 0 -40px;
}
#iphone
{
z-index:2;
background: transparent url(../images/phone.png) no-repeat top left;
width: 477px;
height:539px;
margin:auto;
position:relative;
left:-235px;
top:72px;}

/*#iphone
{
z-index:0;
background: transparent url(../images/phone2.png) no-repeat top left;
width: 390px;
height:685px;
margin:auto;
position:relative;
left:-254px;
top:30px;}*/

.hide, #spanel li
{
text-indent:-9000px;}

.hide2
{
display:none;}

#header_content
{
z-index:2;
margin:-560px auto 0 auto;

width:492px;
position:relative;
left:205px;}

#heading
{ background: url(../images/heading.png) center top no-repeat;
margin-top:150px;

width:492px;
height:129px;
}

#slider
{
height:130px;
text-indent:0;
width:280px;
text-align: center;
margin:auto;
margin-top:140px;
position:relative;}

#slider li
{
position:absolute;
top:0;
left:0;
display:none;

}

#slider li.active
{display:block;}

#spanel
{
text-indent:0;
width:347px;
height: 43px;
background:url(../images/spanelbg.png) no-repeat top left;
margin:auto;
margin-top:20px;
position:relative;
z-index:1;
opacity:0.9;}

#spanel li
{
display:inline-block;
z-index:3;

}

.box-content
{
width:585px;
margin:auto;
}

.description
{
float:left;
position:relative;
width:300px;
}
.box-content p, .box-content img
{
float:left;
margin:0;
max-width: 300px;
text-indent:0;}

.box-content h1
{
text-indent:0;
margin:0;}

ul#spanel, #spanel ul
{
position:relative;
z-index:8;
padding: 0 5px;
list-style:none

}

#spanel li a
{
text-indent:-9999px;
height: 37px;
margin:0;
padding:0;
margin-top:3px;
width:80px;
display:block;
}


.s1
{background: url(../images/about.png) center no-repeat;
}

.s2
{background: url(../images/update.png) center no-repeat;
}



.s3
{background: url(../images/read.png) center no-repeat;

}

.s4
{background: url(../images/fanboy.png) center no-repeat;
}

#spanelbg
{
height:37px;
width: 85px;
position:absolute;
top:4px;
left:4px;
z-index:-1;
}

.new
{
background:url(../images/new.png) no-repeat top left;
width:92px; 
float:none;
height:92px;
position:absolute;
margin:auto;
top:00px;
left:300px;
z-index:10;}


.tempcontain
{
position:relative;
width:960px;
margin:auto;}

.viewport
{
position:absolute;
z-index:99;
width:220px;
overflow:hidden;
height:329px;
margin:auto;
left:93px;
top:155px;
}

.slider
{
width:1000px;
float:left;
position:relative;
right:0;}

.slider img
{
margin:0;
padding:0;
margin-right:-4px;
}/*
.viewport
{
position:absolute;
z-index:99;
width:269px;
overflow:hidden;
height:402px;
margin:auto;
left:93px;
top:132px;
}

.slider
{
width:9000px;
float:left;
position:relative;
right:0;}

.slider img
{
margin:0;
padding:0;
margin-right:-4px;
}*/
#fingers
{
background:url(../images/finger.png) no-repeat left;
width:129px;
height:305px;
position:absolute;
top:285px;
left:93px;
z-index:100;
}



.slidemenu1 {
float:right;
font-family: Myriad Pro, segoe ui, sans serif;
width:380px; /*If you change the menu items, you may need to change the width according to the new number of characters*/
}
.slidemenu {
float:right;
font-family: Myriad Pro, segoe ui, sans serif;
margin-top:-20px;
margin-bottom:20px;
width:350px; /*If you change the menu items, you may need to change the width according to the new number of characters*/
}

.slidemenu1 li a
{
font-family: Myriad Pro, segoe ui, sans serif;
text-decoration:none;
color:#777777;
padding: 7px;
font-size: 16px;}

.slidemenu li, .slidemenu1 li
{
float:left;
text-shadow: 0 1px 1px #FFF;
}

.slidemenu1 li a:hover
{color:#333;}

.slidemenu li a
{
font-family: Myriad Pro, segoe ui, sans serif;
text-decoration:none;
float:left;
color:#999;
padding: 6px;
font-size: 14px;
text-shadow: 0 1px 1px #FFF;}

.slidemenu li a:hover
{color:#555;}