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

#maincontent a[href^="http://"]:not([href*="http://www.pawtucketfoundation.org"]) {
    background: top right no-repeat url("../cssimages/external-icon.png"); 
    padding-right: 16px;
    margin-right: 2px; 
}
	#maincontent span.photoreg a[href^="http://"]:not([href*="http://www.pawtucketfoundation.org"]) { background: none; padding: 0; }
	#maincontent span.photoleft a[href^="http://"]:not([href*="http://www.pawtucketfoundation.org"]) { background: none; padding: 0; }
	#maincontent span.photoright a[href^="http://"]:not([href*="http://www.pawtucketfoundation.org"]) { background: none; padding: 0; }
	#maincontent table a[href^="http://"]:not([href*="http://www.pawtucketfoundation.org"]) { background: none; padding: 0; }
	#maincontent #pdfinfo a[href^="http://"]:not([href*="http://www.pawtucketfoundation.org"]) { background: none; padding: 0; }
a.pdf { background: top left no-repeat url("../cssimages/pdf-icon.png") transparent; padding-left: 16px; }

/* ! Social Media Classes - - - Meant for A tags */
.facebook { height: 18px; padding-left: 17px; background: top left no-repeat url("../cssimages/facebook.png") transparent; }
.flickr { height: 18px; padding-left: 17px; background: top left no-repeat url("../cssimages/flickr.png") transparent; }
.issuu { height: 18px; padding-left: 17px; background: top left no-repeat url("../cssimages/issuu.png") transparent; }
.twitter { height: 18px; padding-left: 17px; background: top left no-repeat url("../cssimages/twitter.png") transparent; }
.youtube { height: 18px; padding-left: 17px; background: top left no-repeat url("../cssimages/youtube.png") transparent; }


/* ! ---- Image Floats ---- */
span.photoright, span.photoleft, span.photoreg { 
	color: #444; 
	font-size: .84em; 
	font-style: italic;
}
span.photoright { float: right; margin: 0 -100px 0 10px; }
span.photoleft { float: left; margin: 0 10px 0 0; }
span.photoright img, span.photoleft img, span.photoreg { padding-bottom: 6px; }
span.photoright, span.photoright img, span.photoleft, span.photoleft img { min-width: 120px; max-width: 240px; }
	* html span.photoright, * html span.photoright img, * html span.photoleft, * html span.photoleft img { 
		width: expression( this.scrollWidth < 120 ? "120px" : "inherit" );
		width: expression( this.scrollWidth > 240 ? "240px" : "inherit" ); 
	}
span.photoreg, span.photoreg img { max-width: 640px; margin: 0 -100px 0 0; }
	* html span.photoreg, * html span.photoreg img { width: expression( this.scrollWidth > 640 ? "640px" : "inherit" ); }

.product { padding-bottom: 12px; }
.product table { border-collapse: collapse; }
.product img { padding: 0 6px 10px 0; }
.product form {  }


/* ! ---- 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: 240px; 
	max-height: 200px; 
	border: 1px solid #ccc;
	padding: 2px; 
	font-size: .84em;
}
	* html .gallery_right, * html .gallery_left { width: expression( this.scrollWidth > 220 ? "220px" : "inherit" ); }
.gallery_reg { 
	margin: 0 0 10px 0; 
	max-width: 480px; 
	max-height: 380px; 
}
	* html .gallery_reg { width: expression( this.scrollWidth > 480 ? "480px" : "inherit" ); }
a.thumb_photo, a.thumb_photo img { 
	display: block; 
	max-width: 240px; 
	max-height: 180px; 
}
	.gallery_reg a.thumb_photo, .gallery_reg a.thumb_photo img { max-width: 480px; max-height: 360px; }
		* html a.thumb_photo, * html a.thumb_photo img { width: expression( this.scrollWidth > 240 ? "240px" : "inherit" ); }
		* html .gallery_reg a.thumb_photo, * html .gallery_reg a.thumb_photo img { width: expression( this.scrollWidth > 480 ? "480px" : "inherit" ); }
a.thumb_photo img { padding-bottom: 3px; }


/* ! ---- 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; 
}
.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-weight: 900; 
	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; }
	* html .carousel a.previous, * html .carousel a.next { filter:alpha(opacity=80); }
	* html .carousel a.previous:hover, * html .carousel a.next:hover { filter:alpha(opacity=100); }
.carousel a.previous { float: left; }
.carousel a.next { float: right; }

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

/* ! /// 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 {
			text-decoration: none; 
			font-weight: 900; 
		}
		table.calendarTable th a:hover { color: #000; }
		table#minicalendarTable th, table.calendarTable th h3 {
			letter-spacing: 1px; 
			text-transform: uppercase; 
			text-align: center; 
			background-color: transparent; 
		}
			table#minicalendarTable th a { font-size: .75em; }
	table.calendarTable td {
		width: 14%; 
		padding: 2px 4px; 
		margin: 0 8px 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; 
			font-size: .75em; 
			letter-spacing: 1px; 
			text-transform: uppercase; 
		}
		table#minicalendarTable td.calendarHeader {
			font-size: .75em; 
			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 #c00; 
			background-color: #c00; 
			color: #fff;   
		}
		table.calendarTable td.calendarToday {
			background-color: #ccc; 
		}
	table.calendarTable td a {
		display: block; 
		padding: 2px 3px; 
		margin: 0 0 3px 0; 
		font-weight: normal; 
		background-color: #eee; 
		border-bottom: 1px solid #c00; 
	}
		table.calendarTable td a:hover { background-color: #fff; color: #333; }
	table#minicalendarTable td a {
		background-color: #ccc;
		font-weight: bold; 
		color: #222; 
		padding: 2px 5px 1px 5px; 
	}
	table#minicalendarTable td a:hover {
		background-color: #222; 
		color: #fb3; 
	}
	
/* ! Dummy Proof users of Tiny-MCE */
pre { white-space: normal; }
address { font-style: italic; }
code { font-family: Courier, "Courier New", CourierNew, monospace; }
