.carousel_container{position:relative; overflow:hidden;}

.carousel_container .left_scroll, .carousel_container .right_scroll{
	position:absolute;  
	width:30px; 
	height:30px; 
	cursor:pointer;
	z-index:10;
	display:none;
	top: 30%;
}
.carousel_container .left_scroll{left:0; background:url(play_left.png) no-repeat;}
.carousel_container .right_scroll{right:0; background:url(play_right.png) no-repeat;}
.carousel_container:hover .left_scroll, .carousel_container:hover .right_scroll{display:block;}

.carousel_container .carousel_inner{
	position:relative;
	float:left; /* important for inline positioning */  
	/* width:930px;  important (this width = width of list item(including margin) * items shown */  
	overflow: hidden;  /* important (hide the items outside the div) */  
	/* non-important styling bellow */  

}

.carousel_container .carousel_ul {  
	position:relative;  
	/* left:-310px;  important (this should be negative number of list items width(including margin) */  
	list-style-type: none; /* removing the default styling for unordered list items */  
	margin: 0px;  
	padding: 0px;  
	width:9999px; /* important */  
	/* non-important styling bellow */  
	padding-bottom:10px;  
	overflow:hidden;
}  
  
.carousel_container .carousel_ul li{  
	float: left; /* important for inline positioning of the list items */  
	/*width:310px;   fixed width, important */  
	/* just styling bellow*/  
	position:relative;
}  

.carousel_container .carousel_ul li a{
	display:block;
	position:relative;
	width:100%;
	overflow:hidden;
}

.carousel_container .carousel_ul li a:hover{
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.7);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.7);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.7);
}

.carousel_container .carousel_ul li .item_note{
	position:absolute;
	bottom:0px;
	width:100%;
	padding:3px;
	overflow:hidden;
	display:none;
	background:#000;
	opacity:0.8;
	color:#FFF;
	z-index:10;
}

.carousel_container .carousel_ul li .item_note a{
	color:#FF0;
	display:inline;
}

.carousel_container .carousel_ul li .item_note p{
	margin:0 0 3px 0;
}
  
.carousel_container .carousel_ul li img {  
	.margin-bottom:-4px; /* IE is making a 4px gap bellow an image inside of an anchor (<a href...>) so this is to fix that*/  
	/* styling */  
	cursor:pointer;  
	cursor: hand;  
	border:0px;  
}