.outerWrapper {
	text-align: left;
	position:relative;
	width:1230px;
}

.item {
	float:left;
	margin-right:10px;
	padding:0;
}


.left-nav-btn, .right-nav-btn {
	position:absolute;
	width:45px;
	height:40px;
	top:-70px; right:0;
	cursor:pointer;
	
}

.left-nav-btn {background:url(Arrows_Left.png) right center no-repeat; right:35px;}
.right-nav-btn {background:url(Arrows_Right.png) left center no-repeat;}

.left-nav-btn:hover{background:url(Arrows_Left.png) left center no-repeat;}
.right-nav-btn:hover {background:url(Arrows_Right.png) right center no-repeat;}



/* Counter (See Example 7) */

#counter {
	margin-top:-30px;
	font-weight: bold;
	font-size: 18px;
	text-align: center;
	padding-bottom: 20px;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {

.outerWrapper {
	text-align: left;
	position:relative;
	width:100%;
}

}

@media only screen and (min-width: 480px) and (max-width: 767px) {
.outerWrapper {
	text-align: left;
	position:relative;
	width:100%;
}
	
}

@media only screen and (min-width: 0px) and (max-width: 479px) {
	
.outerWrapper {
	text-align: left;
	position:relative;
	width:95%;
}

.left-nav-btn, .right-nav-btn {
	position:absolute;
	width:45px;
	height:40px;
	top:420px; right:0;
	cursor:pointer;
	
}

.left-nav-btn {background:url(Arrows_Left.png) right center no-repeat; right:35px;}
.right-nav-btn {background:url(Arrows_Right.png) left center no-repeat;}

.left-nav-btn:hover{background:url(Arrows_Left.png) left center no-repeat;}
.right-nav-btn:hover {background:url(Arrows_Right.png) right center no-repeat;}

}