/* outmost wrapper element, containing all elements  */
#scrollable {
	width:960px;
	height:283px;
	margin: 10px auto;
}

/* container for the scrollable items */
div.items {
	height:283px;	
	float:left;
	width:759px !important;
}

/* single item */
div.items a {
	display:block;
	float:left;
	width:253px;
	height:300px;
	font-size:50px;
	color:#ccc;
	line-height:66px;
	text-decoration:none;
	text-align:center;
	cursor:pointer;
}

div.items a:hover {
	color:#999;	
	width: 253px;
}


/* navigator */
div.navi {
	width:50px;
	height:0px;
}


/* items inside navigator */
div.navi span {
	width:8px;
	height:8px;
	float:left;
	margin:3px;
	background:url(http://www.flowplayer.org/img/playlist/dots.png) 0 0 no-repeat;     
	cursor:pointer;
}
	
/************************************************************************/
/*########## ARROWS ##########*/
/************************************************************************/
	
a.prev {
	float: left;
	text-indent: -99999px;
	background: url(../images/arrows.png) no-repeat;
	background-position: 0 0;
	width: 101px;
	height: 115px;
	margin: 90px 0 0 0;
}

a.prev:hover {
	float: left;
	text-indent: -99999px;
	background: url(../images/arrows.png) no-repeat;
	background-position: 0 -115px;
	width: 101px;
	height: 115px;
	margin: 90px 0 0 0;
}

a.next {
	float: right;
	text-indent: -99999px;
	background: url(../images/arrows.png) no-repeat;
	background-position: -101px 0;
	width: 99px;
	height: 115px;
	margin: 90px 0 0 0;
}

a.next:hover {
	float: right;
	text-indent: -99999px;
	background: url(../images/arrows.png) no-repeat;
	background-position: -101px -115px;
	width: 99px;
	height: 115px;
	margin: 90px 0 0 0;
}

/************************************************************************/
/*########## SLIDER ##########*/
/************************************************************************/

#stage {
	width:760px; 
	overflow: auto;
	overflow-x: hidden; 
	overflow-y: hidden; 
	height: 300px;
	margin: 0 auto;
	float: left;
	background: url(../images/stageBG.png) no-repeat;
}

#myList {
	width:1265px; 
	border:0; 
	margin:0; 
	padding:0; 
	left:400px;
}
	
#myList li{
	list-style:none; 
	margin: 0; 
	padding: 0; 
	border: 0; 
	float: left;
	width: 253px;
	height: 300px;
}

a.nutrico {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: 0  0;
	width: 253px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.nutrico:hover {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: 0  -291px;
	width: 253px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.pcf {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: -252px  0;
	width: 251px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.pcf:hover {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: -252px  -291px;
	width: 253px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.swerve {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: -501px  0;
	width: 243px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.swerve:hover {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: -501px  -291px;
	width: 243px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.vitality {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: -747px  0;
	width: 253px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.vitality:hover {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: -747px  -291px;
	width: 253px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.nwr {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: -997px  0;
	width: 253px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.nwr:hover {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: -997px  -291px;
	width: 253px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.cwilbert {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: -1250px  0;
	width: 253px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}

a.cwilbert:hover {
	background: url(../images/wiSlider.png) no-repeat;
	background-position: -1250px  -291px;
	width: 253px;
	height: 283px;
	text-indent: -99999px;
	float: left;
	margin: 10px 0 0 0;
}