/********************************************************************
	Galleries (inserted with the WP [gallery] shortcode:
	The (invalid as per W3C) HTML code pf [gallery] is changed,
	dl/dt/dd replaced with figure/figcaption, and the (invalid because inside a DIV) inline CSS 
	replaced with the styling here:
********************************************************************/

.gallery {
	margin:					20px 0 10px -7px; /* visual adjustment related to padding/border of figure element */ 
}

.gallery figure {
	display:					inline-block;
	padding: 				7px;
	border:					solid 1px #ccc;
	margin:					0 10px 5px 0; /* reset default figure margin */
	box-shadow: 			0 0 10px -5px #ccc;
}

.gallery figure a {
	position:				relative; /* to position child span (shadow) absolute */
	display: 				block;
	border:					0;
	text-decoration:		none;
}

/* Container for the shadow. Parent is position:relative. Putting it "on top" of image */
.gallery figure a span {
	position: 				absolute;
	top: 						0; 
	bottom: 					0;
	left: 					0; 
	right: 					0;
	box-shadow: 			inset 15px 15px 20px -20px #000; /* inner shadow top and left */
	z-index: 				1000;
}
.ie8 .gallery figure a span {
	background:				#fff;
	-ms-filter:				"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* first! */
	filter: 					alpha(opacity=0);
}
.ie8 .gallery figure {
	margin:					0 10px 10px 0; /* +5px more margin-bottom for IE8 */
}


/* adding .hentry to this selector for more "specificity" to be able to overwrite inherited 
strong rules "body.single .hentry img" and "body.page .hentry img": */
.hentry .gallery figure a img {
	border:					0; /* reset possibly inherited border from ".hentry img" */
	padding:					0; /* reset possibly inherited border from ".hentry img" */
}

/* captions currently not displayed on gallery page, only on single image pages */
.gallery figcaption {
}


/********************************************************************
	For single images on image.php:
********************************************************************/
.image-attachment .post-bodycopy img {
	margin-left: -8px;
}
.image-attachment .singlenav {
	margin: 10px 0;
}
.image-attachment .singlenav .older a:before {
	content: '\2039\2039 \00a0'; /* This is ISO numeric code for &larr;. For more see http://www.evotech.net/blog/2007/04/named-html-entities-in-numeric-order/ */ 
}
.image-attachment .singlenav .newer a:after {
	content: '\00a0 \203a\203a'; /* &rarr; */
}


/********************************************************************
	For the colorbox overlays:
********************************************************************/
/* This section should not be changed */
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{
	-moz-box-sizing:content-box; -webkit-box-sizing:content-box; 
	box-sizing:content-box; o-box-sizing:content-box;
}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#fff;}
#colorbox{}
	
    #cboxTopLeft{width:25px; height:25px; background:url(%tpldir%/images/colorbox/border1.png) no-repeat 0 0;}
    #cboxTopCenter{height:25px; background:url(%tpldir%/images/colorbox/border1.png) repeat-x 0 -50px;}
    #cboxTopRight{width:25px; height:25px; background:url(%tpldir%/images/colorbox/border1.png) no-repeat -25px 0;}
    #cboxBottomLeft{width:25px; height:25px; background:url(%tpldir%/images/colorbox/border1.png) no-repeat 0 -25px;}
    #cboxBottomCenter{height:25px; background:url(%tpldir%/images/colorbox/border1.png) repeat-x 0 -75px;}
    #cboxBottomRight{width:25px; height:25px; background:url(%tpldir%/images/colorbox/border1.png) no-repeat -25px -25px;}
    #cboxMiddleLeft{width:25px; background:url(%tpldir%/images/colorbox/border2.png) repeat-y 0 0;}
    #cboxMiddleRight{width:25px; background:url(%tpldir%/images/colorbox/border2.png) repeat-y -25px 0;}
	 
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:20px;}
        #cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; color:#999;}
        #cboxCurrent{position:absolute; bottom:0px; left:100px; color:#999;}
        #cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;}
        #cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;}
        #cboxNext{position:absolute; bottom:0px; left:63px; color:#444;}
        #cboxLoadingOverlay{background:#fff url(%tpldir%/images/colorbox/loading.gif) no-repeat 5px 5px;}
        #cboxClose{position:absolute; bottom:0; right:0; display:block; color:#444;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

