/*GENERAL*/
body {	
	background:url(../images/pattern.jpg) repeat; 
	font-family: Baskerville, Georgia, Helvetica, Arial, sans-serif;
	color:white;
}


/*PAGINATION*/
.stepcarousel{
	position: absolute; /*leave this value alone*/
	overflow: scroll; /*leave this value alone*/
	width: 226px; /*Width of Carousel Viewer itself*/
	height: 339px; /*Height should enough to fit largest content's height*/
	background-color:black;
	margin-left:37px;
	margin-top:89px;
}

.stepcarousel .belt{
	position: absolute; /*leave this value alone*/
	left: 0;
	top: 0;
}

.stepcarousel .panel{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	width: 226px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}


/*OTHERS*/
#main-content{	
	width: 100%;
	height: 800px;
	min-width:855px;	
}

#firstpart-content{
	width: 100%;
	height: 730px;	
}

#secondpart-content{
	width: 100%;
		
}

#introduction-content{
	margin: 0 auto;
	width:855px;
	height:530px;
	padding-top:70px;
}

#iphone4{
	background: url(../images/iphone4.png) no-repeat 0px 0px;
	width:300px;
    height: 525px;
    float:right;	
}

#presentation{

	width:555px;
	height:530px;
	float:right;
	
}

#maintitle{
	font-weight: bold;
	font-size: 26px; 
	text-align:center;
	height: 62px;
	margin-top:90px;
	text-shadow: rgb(159, 153, 153) 0px 1px 0px; 
	padding-right:0.5em;
}

#separator{
	font-weight: bold;
	font-size: 20px; 
	text-align:center;
	height:30px;
	padding-left:10px;
	padding-right:10px;
}

.sep{
	letter-spacing:-2px;
	font-weight: bold;
	font-size: 20px; 
}

#description{
	font-weight: bold;
	font-size: 24px; 
	text-align:center;	
	padding:50px 50px 40px 50px;
	text-shadow: rgb(159, 153, 153) 0px 1px 0px; 
}

#download{
	margin:0 auto;
	width:296px;
	height:93px;
}

#download a img{
	border:none;	
}

.crossBig{
	background:url(../images/crossB.png) no-repeat 0px 0px;
	width:136px;
	height:139px;
	position:absolute;
	margin-left:-150px;
	margin-top:400px;	
}

.crossMedium{
	background:url(../images/crossM.png) no-repeat 0px 0px;
	width:78px;
	height:79px;
	position:absolute;
	margin-left:-180px;
	margin-top:200px;	
}

.crossSmall{
	background:url(../images/crossS.png) no-repeat 0px 0px;
	width:55px;
	height:56px;
	position:absolute;
	margin-left:320px;
	margin-top:300px;	
}


/*SECOND PART*/
#features-content{
	margin: 0 auto;
	width:855px;
	height:400px;
}	

#hiw-content{
	margin: 0 auto;
	width:855px;
	height:200px;
}	

#contact-content{
	margin: 0 auto;
	width:855px;
	height:500px;
}	

#contacttext{
	line-height:30px;	
	text-align:center;
	text-shadow: rgb(159, 153, 153) 0px 1px 0px; 
}

.sptitle{
	padding-left:30px;
	height:10px;
	text-align:left;
	text-shadow: rgb(159, 153, 153) 0px 1px 0px; 
}	

.separatorSP{	
	height:30px;
}

.seplink{
	display:block;
	float:left;
	font-weight: bold;
	font-size: 12px;
	color:white;
	text-shadow: rgb(159, 153, 153) 0px 1px 0px; 
	filter: dropshadow(color=#9f9999,offX=0,offY=1);
	text-decoration:none;
	max-height:30px;
	padding-top:10px;
	padding-left:15px;
	padding-right:15px;
}

.sepline{
	width:10em;
	display:block;
	float:left;
	height:30px;
	background:url(../images/barre.jpg) repeat-x 0px 16px;
}

#foriphone{
	display:block;
	float:left;
	font-weight: bold;
	font-size: 1em;
	padding:3px 10px 0px 10px;
}

.seplinebig{
	width:715px;
	display:block;
	float:left;
	height:30px;
	background:url(../images/barre.jpg) repeat-x 0px 16px;
}

.seplinesmall{
	background-color:yellow;
	width:44px;
	display:block;
	float:left;
	height:30px;
	background:url(../images/barre.jpg) repeat-x 0px 16px;	
}

#copyright{
	margin: 0 auto;
	width:855px;
	height:140px;
}

#copyrighttext{
	font-weight: bold;
	font-size: 12px;
	margin-left:10px;
	letter-spacing:1px;
	text-shadow: rgb(159, 153, 153) 0px 1px 0px; 
}

#separatorCopyright{
	margin-left:10px;
	height:30px;
	background:url(../images/barre.jpg) repeat-x 0px 20px;	
}

.featurescontainer{
	float:left;
	width:50%;
	height:345px;
}

.featuresblock {
	height:115px;
	font-weight: bold;
}

.featuresimage {
	float:left;
	width:148px;
	margin-left:14px;
	margin-top:3px;
}

#howitworks{
	height:160px;
	padding:5px 2px 5px 10px;
}

.howitworksblock{
	width:33%;
	height:160px;
	float:left;
}

.numberhiw{ 
	float:left;
	width:22%;
	height:160px;
	font-weight: bold;
	font-size: 72px;
	line-height:2em;
	text-shadow: rgb(159, 153, 153) 0px 1px 0px; 
}
	
.imagehiw{
	float:right;
	width:78%;
	height:160px;
}