/* 
	Inlined styles for my overrides to the carousel for this demo.
	Normally I would put this in a separate CSS file.
*/

.carousel-component {
	width: 500px;
	height: 139px;
	background:url(/images/blue_bg.jpg) no-repeat;
	padding: 10px 0 0 0;
}
.carousel-component .carousel-clip-region {
	width: 420px;
}
.carousel-component .carousel-list li { 
	margin:0px;
	/*width: 130px; /* img width is 75 px from flickr + a.border-left (1) + a.border-right(1) + 
	               img.border-left (1) + img.border-right (1)*/
	margin-left: auto; /* for testing IE auto issue */
}

.carousel-component .carousel-list li a { 
	display:block;
	/*border:2px solid #0066CC;*/
	outline:none;
	-moz-outline:none; 
}

.carousel-component .carousel-list li img a:hover{ 
	border: 2px solid #fff;
}

.carousel-component .carousel-list li img a{ 
	border:2px solid #0066CC;
	display:block; 
}

.carousel-component .carousel-list li strong { 
	display:block; 
}
									

#prev-arrow { 
	position:absolute;
	top:47px;
	z-index:3;
	cursor:pointer;
	left:5px; 
}

#next-arrow { 
	position:absolute;
	top:47px;
	z-index:3;
	cursor:pointer;
	right:-3px; 
}