#phoneCarousel{
	/*	This is the carousel section, it
		contains the stage and the arrows */
	height:300px;
	margin:5px auto 10px;
	position:relative;
	width:500px;
}


#phoneCarousel .arrow{
	/* The two arrows */
	width:44px;
	height:44px;
	background:url('img/arrows.png') no-repeat;
	position:absolute;
	top:102%;
	margin-top:-22px;
	left:0;
	cursor:pointer;
}

#phoneCarousel .next{
	/* Individual styles for the next icon */
	background-position:right top;
	left:auto;
	right:0;
}

/* Hover styles */

#phoneCarousel .arrow:hover{
	background-position:left bottom;
}

#phoneCarousel .next:hover{
	background-position:right bottom;
}



#stage{
	/* The stage contains the animated phone images */
	left:50%;
	margin-left:-250px;
	position:absolute;
	width:500px;
	height:100%;
}

#stage img{
	/* Hiding all the images by default */
	display:none;
}

#stage .default{
	/*	This class is applied only to the iphone img by default
		and it is the only one visible if JS is disabled */
	display:block;
	left:50%;
	margin-left:-135px;
	position:absolute;
}

#stage .animationReady{

	/* This class is assigned to the images on load */
	display:block;
	position:absolute;
	top:0;
	left:0;
}



a, a:visited {
	text-decoration:none;
	outline:none;
}

a:hover{	text-decoration:underline;}
a img{	border:none;}