/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
	#carousel {
	    position: relative;
		width:486px;
		height:378px;
		float:left;
		margin: 36px 0 0 18px;
	}
	
	#carousel .jcarousel-clip {
	    padding: 0;
	    margin: 0;
	    overflow: hidden;
	    position: relative;
	}
	
	#carousel .jcarousel-list {
	    overflow: hidden;
	    position: relative;
	    top: 0;
	    left: 0;
	    margin: 0;
	    padding: 0;
	}
	
	#carousel .jcarousel-list li,
	#carousel .jcarousel-item {
		position: relative;
	    float: left;
	    list-style: none;
	    /* We set the width/height explicitly. No width/height causes infinite loops. */
		width:486px;
		height:270px;
		text-shadow: #000 0 0 0;
	}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */

	#carousel .jcarousel-next, 
	#carousel .jcarousel-prev {	
	    z-index: 20000;
		width:36px;
		height:36px;
		text-indent: -5000px;
		position: absolute;
		cursor: pointer;
		top:99px;
	}
	
	#carousel .jcarousel-prev 	{ left:-18px; }
	#carousel .jcarousel-next		{ right:-18px; }
	
	#carousel .jcarousel-prev 	{ background: url(../../images/btn_carousel_left.png); }
	#carousel .jcarousel-next 	{ background: url(../../images/btn_carousel_right.png); }
	
	#carousel .jcarousel-prev:hover 	{ background: url(../../images/btn_carousel_left.png) 0 -36px; border:0; }
	#carousel .jcarousel-next:hover 	{ background: url(../../images/btn_carousel_right.png) 0 -36px; border:0; }

	#carousel .jcarousel-prev:active 	{ background: url(../../images/btn_carousel_left.png) 0 -108px; border:0; }
	#carousel .jcarousel-next:active 	{ background: url(../../images/btn_carousel_right.png) 0 -108px; border:0; }

	
	#carousel .jcarousel-prev-disabled, #carousel .jcarousel-prev-disabled:hover	{ background: url(../../images/btn_carousel_left.png) 0 -72px; border:0; cursor: default; }
	#carousel .jcarousel-next-disabled, #carousel .jcarousel-next-disabled:hover	{ background: url(../../images/btn_carousel_right.png) 0 -72px; border:0; cursor: default; }

/* Added in for the info panel */

	#carousel .carousel_info {
		position: absolute;
		bottom:-72px;
		left:0;
		display: block;
		width:100%;
		height:108px;
		background: black;
		z-index: 10000;
		width:486px;
		opacity:0.7;
	}
	
	#carousel .carousel_info_active {
		cursor:pointer;
	}
	
	#carousel .carousel_info p {
		margin: 9px 18px 9px 18px;
		color: #ccc;
	}

	#carousel .carousel_info p.link {
		text-align: right;
		color:white;
	}
	
	#carousel .carousel_info p.link a {
		font-weight: bold;
		letter-spacing: -0.05em;
		color:white;
	}
/* Added in for the fram */

	.carousel_frame {
		background: url(/wp-content/themes/jivagrid/images/carousel_frame.png);
		position: absolute;
		top:0px;
		left:-18px;
		width:522px;
		height:270px;
		z-index: 1;
	}


	#carousel_nav {
		bottom:72px;
		right:0px;
	}