/*
.scrollSection{
	.scrollHead{}
	.scrollArea{
		.scrollBody{
			.wrapper{
				.scrollBox{
					.thumbArea{}
					.linkArea{}
				}
			}
		}
	}
	.scrollbar-hor{}
	.handle-hor{}
}
   
*/

.scrollSection{
	margin-bottom: 30px;
	float: left;
}

.scrollSection .active{
	height: auto; 
	overflow: none;
}
			
/* Scrollbar & content css */						
.scrollArea{
	height: 160px;
	width: 942px;
	float:left;
	background: transparent;
	overflow: hidden;
}
			
.scrollBody{
	width: 3200px; /* 20 * 160 */ 
	margin: 0px -9px;
}
			
.scrollSection .active .scrollBody{
	width: 960px !important;
}
			
.wrapper{
	float: left;
}
			
.scrollBox{
	float: left;
	width: 142px;
	padding: 0px 9px;
	cursor: pointer;
}

.scrollBody .scrollBox.sfhover p{
	text-decoration: underline;
}

.scrollBody .scrollBox.active p{
	color: #ffffff;
}

.scrollBox p{
	font-size: 0.93em;
	margin: 0px;
	color: #FFBA00;
}

			
.scrollBox p.thumbArea{
	overflow: hidden;
	white-space: nowrap;
}	
			
.scrollBox p.linkArea{
	height:40px;
	overflow:hidden;
	padding: 6px 0px;
}	
	
.scrollBox p.event{
	text-indent: -10px; 
	padding-left: 10px;

}


			
.scrollbar-hor{
	background: url(scroll-bar_bg.png) no-repeat left;
	height: 20px;
	width: 942px;
	float:left;
	clear: both;
}

.handle-hor{
	height: 20px;
	width: 20px;
	background:url(scrollKnob.png)  no-repeat left ;
}
			
.scrollSection .invisible{
	visibility: hidden;
}
			
.playerThumb{ /* display: inline;*/ }

.scrollHead{
	border-bottom: 1px solid #4e4e4e;
	margin-bottom: 16px;
}

.scrollHead h2{
	margin-bottom: 0.43em;
}
			
.scrollHead div{
	padding: 6px 0px;
	height: 18px;
}