/* Styles for the Calendar, Image replacement and the Galleries 
Every installation of the HCd backend needs these to function properly. 

Basics have been updated 03-11-2009. Customize away... 

*/

a[href$=".pdf"] { background: top left no-repeat url("../cssimages/pdf-icon.png") transparent; padding-left: 16px; }


/* ! /// Image Floats /// */
span.photoright, span.photoleft, span.photoreg { 
	color: #666; 
	font: italic 12px/14px LucidaGrande, "Lucida Grande", Helvetica, Arial, sans-serif;
	text-align: right;
}
span.photoright { float: right; margin: 0 -10px 0 8px; }
span.photoleft { float: left; margin: 0 8px 0 -10px; }
span.photoright img, span.photoleft img, span.photoreg { padding-bottom: 6px; }
span.photoright img, span.photoleft img { 
	min-width: 120px; 
	max-width: 240px; 
}
span.photoreg img {
	min-width: 120px; 
}


/* ! /// Gallery Styles using Lightbox /// */
a.gallery_photo, .gallery_photo { display: none; }
.gallery_reg { float: none; } 
.gallery_right { float: right; margin: 0 0 5px 8px; }
.gallery_left { float: left; margin: 0 8px 5px 0; } 

.gallery_reg, .gallery_right, .gallery_left { 
	display: inline-block; 
	max-width: 220px; 
	max-height: 200px; 
	border: 1px solid #ccc;
	padding: 2px; 
	text-align: center; 
	font: normal 9px/12px LucidaGrande, "Lucida Grande", Helvetica, Arial, sans-serif;
}
.gallery_reg { 
	margin: 0 0 10px 0; 
	max-width: 480px; 
	max-height: 380px; 
}
	* html .gallery_right, * html .gallery_left { width: 220px; }
	* html .gallery_reg { width: 480px; }
a.thumb_photo, a.thumb_photo img { 
	display: block; 
	max-width: 220px; 
	max-height: 180px; 
}
	.gallery_reg a.thumb_photo, .gallery_reg a.thumb_photo img { max-width: 480px; max-height: 360px; }
a.thumb_photo img { padding-bottom: 3px; }
	* html a.thumb_photo, * html a.thumb_photo img { width: 220px; }
	* html .gallery_reg a.thumb_photo, * html .gallery_reg a.thumb_photo img { width: 480px; }


/* ! /// Carousel Styles using jqueryCarouselLite /// */
div.carouselwrap_left, div.carouselwrap_right { 
	/* Set the width of the container here, as well as in the UL itself (helps it all render better). Without a width, the Carousel will fill the entire container. */
	width: 240px; 
	height: 180px; 
	float: right; 
	margin: 0 0 10px 10px; 
	font: normal 12px/18px Arial, Helvetica, sans-serif; 
}
.carousel { width: 240px; height: 180px; }
.carousel ul {  
	overflow: hidden;
	list-style-type: none; 
	padding: 0; 
	margin: 0;  
}
.carousel ul { height: 180px; }
.carousel li { background-color: #222; }
.carousel li img { width: 240px; overflow: hidden; }

.carousel a.previous, .carousel a.next {
	font: bold 12px/16px Arial, Helvetica, sans-serif; 
	background-color: #eee; 
	color: #000; 
	text-decoration: none;
	padding: 4px 6px 0 6px; 
	height: 18px; 
	margin: 0 0 -22px 0; 
	position: relative; 
	top: -22px;
	overflow: visible;
	z-index: 100; 
	opacity: .8; 
}
	.carousel a.previous:hover, .carousel a.next:hover { opacity: 1; color: #c00; }
.carousel a.previous { float: left; }
.carousel a.next { float: right; }
div.carouselwrap_reg, div.carouselwrap_left, div.carouselwrap_right { font-size: 10px; }

div.carouselwrap_reg { width: 480px; height: 330px; }
div.carouselwrap_reg .carousel, div.carouselwrap_reg .carousel ul { width: 480px; height: 300px; } /* allow for the height of the caption */
div.carouselwrap_reg .carousel ul li, div.carouselwrap_reg .carousel ul li img { width: 480px; overflow: hidden; }

/* For the Homepage carousel */
body#home .carousel, body#home .carousel ul, body#home .carousel li { width: 500px; height: 330px; }
body#home .carousel li img { width: 500px; overflow: hidden; }
body#home div[id^="carousel_"] span { display: none; }
body#home .carouselwrap_reg, body#home .carouselwrap_right, body#home .carouselwrap_left { padding: 0 0 15px 0; }


/* ! /// Calendar styles /// */
/*
table#minicalendarTable, table.calendarTable {
	width: 100%;  
	border: none; 
}
table#minicalendarTable { border-left: 1px solid #ddd;  }
	table#minicalendarTable th, table.calendarTable th {  }
		table.calendarTable th a {
			font-size: 12px; 
			color: #278; 
			text-decoration: none; 
			font-weight: bolder; 
		}
		table.calendarTable th a:hover { color: #000; }
		table#minicalendarTable th, table.calendarTable th h3 {
			font-size: 12px; 
			letter-spacing: 1px; 
			text-transform: uppercase; 
			text-align: center; 
			background-color: transparent; 
		}
			table#minicalendarTable th a { 
				font-size: 9px; 
			}
		table.calendarTable th h3 {
			font-size: 14px;
			color: #000; 
			background-color: transparent; 
		}
	table.calendarTable td {
		width: 14%; 
		padding: 2px 4px; 
		margin: 0 10px 0 0; 
	}
	table#minicalendarTable td { 
		width: 14%; 
		color: #666; 
		text-align: center; 
		padding: 1px 0; 
	}
	table#minicalendarTable td, table.calendarTable td {
		border-right: 1px solid #ddd; 
		border-bottom: 1px solid #aaa; 
	}
		table.calendarTable td.calendarHeader {
			border-top: 1px solid #ccc;
			background-color: #ddd; 
			color: #000; 
			font-size: 10px; 
			letter-spacing: 1px; 
			text-transform: uppercase; 
		}
		table#minicalendarTable td.calendarHeader {
			color: #278; 
			font-size: 10px; 
			font-weight: bold; 
			text-transform: uppercase; 
			padding: 0 0 1px 0; 
		}
		table.calendarTable td.calendar {
			font-weight: bold; 
		}
		table#minicalendarTable td.calendarToday {
			border: 1px solid #489; 
			background-color: #489; 
			color: #fff;   
		}
		table.calendarTable td.calendarToday {
			background-color: #fd6; 
		}
	table.calendarTable td a {
		display: block; 
		padding: 2px 3px; 
		margin: 0 0 3px 0; 
		font-weight: normal; 
		background-color: #eee; 
		color: #278;
		border-bottom: 1px solid #278; 
	}
		table.calendarTable td a:hover { background-color: #fff; color: #333; }
	table#minicalendarTable td a {
		background-color: #fb3;
		font-weight: bold; 
		color: #222; 
		padding: 2px 5px 1px 5px; 
	}
	table#minicalendarTable td a:hover {
		background-color: #222; 
		color: #fb3; 
	}
	
	table.calendarTable td a.tournament_event { background-color: #489; color: #fff; }
	table.calendarTable td a.tournament_event:hover { background-color: #000; color: #489; }
*/
	
/* ! Dummy Proof users of Tiny-MCE */
pre { white-space: normal; }
address { font-style: italic; }
code { font-family: Courier, "Courier New", CourierNew, monospace; }