/* CSS Document */

#desktopwrap {
	display:			none;
}

#mobilewrap {
	display:			block;
	position:			relative;
	top:				50%;

	margin:				-160px auto 0 auto;
	padding:			0;

	width:				320px;
	height:				320px;
	
	overflow:			hidden;

	background-color:	rgb(255,255,255);
	
	box-sizing:			border-box;

	opacity:			0;
	transition:			opacity 2s;
}

.isready #mobilewrap {
	opacity:			1;
}

#slideshow {
	position:			absolute;
	top:				0;
	left:				0;
	z-index:			99;
	
	width:				320px;
	height:				320px;
	
	padding:			0;
	margin:				0;
}

#slideshow ul,
#slideshow li {
	list-style:			none;
	margin:				0;
	padding:			0;
}

#slidecontrols {
	position:			absolute;
	bottom:				0;
	z-index:			100;
	
	width:				320px;
	height:				37px;
	
	padding:			0;
	margin:				0;	
	
	text-align:			center;
	
	background-color:	#3c3c3c;
}

#slideshowpager a {
	display:			inline-block;
	width:				9px;
	height:				9px;
	
	margin:				13px 2px 0 2px; 
	
	overflow:			hidden;
	
	font-size:			6px;
	line-height:		9px;
	text-align:			left;
	text-indent:		-999px;	
	
	background-color:	#FFF;
	
	border:				1px solid #FFF;
}

#slideshowpager a.activeSlide {
	background-color:	transparent;
}

#next,
#prev {
	position:			absolute;
	bottom:				0;
	left:				0;
	z-index:			101;
	
	width:				34px;
	height:				37px;
	
	padding:			0;
	margin:				0;	
	
	background-image:	url('../images/320/arrow-left.png');
	background-repeat:	no-repeat;
	background-position:center;		
}

#next {
	left:				auto;
	right:				0;

	background-image:	url('../images/320/arrow-right.png');
}