.carousel  {
    position: relative;
    width:297px;
    height:53px;
    background:url("images/fd-carousel.gif") no-repeat top left;     
}
.carousel button { /*Don't remove this. we still use this for individual demos. only the front pages use images as of now*/
    float: left;
}              
.carousel a.prev, .carousel a.next {
	display: block;
    float: left;
    width: 7px;
    height: 45px;
    text-decoration: none;
    margin:3px 0 0 2px;
}  
.carousel a.next {
    margin-left:0 !important;
}	
.carousel a:hover, .carousel a:active {
	border: none;
	outline: none;
}                 
.carousel .jCarouselLite {
	float: left;
    /* Needed for rendering without flicker */
    position: relative;
    visibility: hidden;
    left: -5000px;
}
.carousel .jCarouselLite ul {
	margin: 0;
}
.carousel .jCarouselLite li img, 
.carousel .jCarouselLite li p {
	background-color: #fff;
	width:65px;
	margin:5px 2px;
	cursor:pointer !important;
}
        
     
.carousel .vertical{
	margin-left: 170px;
}
.carousel .vertical .jCarouselLite {   /* so that in IE 6, the carousel div doesnt expand to fill the space */
	width: 170px;
}
.carousel .imageSlider li img, 
.carousel .imageSlider li p, 
.carousel .imageSliderExt li img , 
.carousel .imageSliderExt li p {
	width: 400px;
	height: 300px;
}