#collection-wrap {
position:relative;
}


#collection-viewport {
overflow:hidden;
position:relative;
padding-top:40px;
padding-bottom:86px;
}

#collection-viewport ul {
display:block;
position:relative;
padding:0;
margin:0;
}

#collection-viewport li {
float:left;
display:inline-block;
width:300px;
list-style:none;
margin:0 1px 0 0;
padding:0;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
position:relative;
text-align:center;
background:none;
}

	#collection-viewport .collection-viewport-item {
	position:relative;
	overflow:hidden;
	}

	#collection-viewport .collection-viewport-related {
	position:absolute;
	top:100%;
	left:0px;
	text-align:left;
	font-family:"runda-n3", "runda", Verdana, Helvetica, sans-serif;
	font-weight:300;
	font-size:12px;
	padding:12px 15px;
	}
		#collection-viewport .collection-viewport-related strong,
		#collection-viewport .collection-viewport-related b {
		font-family:"runda-n3", "runda", Verdana, Helvetica, sans-serif;
		font-weight:300;
		font-size:13px;	
		text-transform:uppercase;
		}

	#collection-viewport li img {
	-moz-transition:all .3s ease-out;
	-webkit-transition:all .3s ease-out;
	transition:all .3s ease-out;
	vertical-align:middle;
	}
	
		#collection-viewport li .collection-viewport-item:hover img {
		opacity:0.5;
		}

	#collection-viewport li .rollover {
	display:block;
	position:absolute;
	width:100%;
	height:70px;
	bottom:-70px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	font-family:"runda-n3", "runda", Verdana, Helvetica, sans-serif;
	font-weight:300;
	font-size:22px;
	line-height:66px;
	color:#ffffff;
	background-color:#b2b2b2;
	text-align:center;
	-moz-transition:all .3s ease-out;
	-webkit-transition:all .3s ease-out;
	transition:all .3s ease-out;
	opacity:0;
	}
		#collection-viewport li .collection-viewport-item:hover .rollover {
		bottom:0px;	
		opacity:1;
		}

#collection-previous, 
#collection-next {
position:absolute;
top:42%;
width:50px;
height:16%;
background-color:rgba(255,255,255,0.9);
background-position:center center;
background-repeat:no-repeat;
-moz-transition:all .3s ease-out;
-webkit-transition:all .3s ease-out;
transition:all .3s ease-out;
text-indent:-5000px;
overflow:hidden;
cursor:pointer;
z-index:900;
}
	#collection-previous {
	left:0px;
	background-image:url(../../images/rotator_prev.png);
	}

	#collection-next {
	right:0px;
	background-image:url(../../images/rotator_next.png);
	}
	
	#collection-previous:hover, 
	#collection-next:hover {
	opacity:0.7;
	}




