/* Main wrapper for carousel */
#Chronosel { width:620px; height:310px; overflow:hidden; position:relative; float:left; padding:0px; margin:0px; }
/* each li is a complete slide entry with textbox, text, image, etc */
#Chronosel li { white-space:nowrap; float:left; width:620px; height:310px; float:left; display:none; }
/* display the first one by default. */
#Chronosel li:first-child { display:block; }
/* Currently width and height match the slide, so that the entire slide is clickable */
#Chronosel .Chronosel-Link { 	width:620px; 
								height:310px; 	
								position:absolute; 
								float:left; 
								text-decoration:none; 
								position:absolute; 
								top:0px; 
								left:0px;  
}
/* the actual text of the slide. Some of this is overwritten by inline styles */
#Chronosel .Slide-Text { 	top:6px; 
							left:6px; 
							width:588px; 
							letter-spacing:0px;  
							position:absolute; 
							z-index:5; 
							opacity:1;
							font-size:24px !important;
							font-weight:bold;	
							letter-spacing:0px !important;
							
							font-family:Arial, Helvetica, Geneva, sans-serif !important; 
							padding:10px; 
							overflow:visible; 
							text-decoration:none; 
							white-space:pre-wrap !important;
							color:white; 
}
/* the background layer textbox. The black or white area behind the text */
#Chronosel .Slide-Textbox { top:6px; 
							left:6px; 
							width:588px; 
							letter-spacing:0px;
							position:absolute; 
							z-index:3; 
							background-color:black;
							color:white; 
							font-size:24px !important;
							letter-spacing:0px !important;
							font-family:Arial, Helvetica, Geneva, sans-serif !important; 
							font-weight:bold;	
							padding:10px;
							overflow:visible;
							white-space:pre-wrap !important;
							opacity:0.8;
}
/* this exists inside .Slide-Textbox, to make sure that it maintains the same height as .Slide-Text. */
#Chronosel .Slide-Textbox .Slide-Textbox-Size { visibility:hidden; !important; }

/* description text */
#Chronosel div.HighlightSubhead { font-size:16px; line-height:24px; font-weight:normal; }

/* the border around the entire slide */
#Chronosel .Slide-Border {  position:absolute; 
							width:608px; 
							height:298px; 
							z-index:2;  
							display:block; 
							top:0px; 
							left:0px; 
							float:left; 
							border:6px solid black; 
							opacity:0.8;
}
/* the large background image contained within each slide. */
#Chronosel .Slide-Image { 	width:620px; 
							height:310px; 
							border:0px; 
							margin:0px; 
							padding:0px;
							float:left; 
}
/* the wrapper for the control box this is an LI within the #Chronosel ul that gets treated a bit differently */
#Controls { display:block !important; z-index:4; position:absolute; float:left; opacity:0.5; background-color:transparent;}
#Controls:hover { opacity:1; }

/* a UL that's a child of #Controls, containing sub-LIs that make up each clickable control. */
#Controls #Slide-Controls { display:block !important; 
							z-index:4; 
							position:absolute; 
							float:left; 
							bottom:6px; 
							right:6px;
							border-width:0px;
							padding:0px;
							margin:0px;
							height:23px; 
}
/* generic styles for the sub-LIs that represent each clickable control */
#Slide-Controls .Slide-Control { 	display:block; 
									float:left; 
									height:23px; 
									width:21px;
									background-image:url('../../Sprites/Carousel/CarouselButtons.png'); 
									background-repeat:no-repeat; 
									background-position:-15px 0px; 
									cursor:pointer;
}
/* Generic style for hyperlinks stored within the LI. */
#Slide-Controls .Slide-Control a { height:23px; width:23px; display:block; float:left; }


/* generic hover styles for each clickable control */
#Slide-Controls .Slide-Control:hover { 	background-position:-15px -23px !important; }

/* adjustments for next/prev buttons */
#Slide-Control-Prev, #Slide-Control-Next { width:15px !important; }
#Slide-Control-Prev-Link, #Slide-Control-Prev-Link { width:15px !important; }

#Controls #Slide-Control-Prev { background-position:0px 0px; }
#Controls #Slide-Control-Next { background-position:-37px 0px; }
#Controls #Slide-Control-Prev:hover { background-position:0px -23px !important; }
#Controls #Slide-Control-Next:hover { background-position:-37px -23px !important; }

#Slide-Control-All {
						display:block !important; 
						float:left !important; 
						height:20px !important; 
						width:60px !important;			
						cursor:pointer !important;
						position:absolute !important; 
						left:50px !important;
						top:-28px !important; 
						z-index:5345634 !important;
						background-color:gray !important;
						opacity:1 !important;
						padding:5px;
						}
					}
#Slide-Control-All a { 	opacity:1 !important;
	 					color:#FFFFFF !important; 
						background-color:gray !important;
}