/* MAIN CSS KATEESHELBY.COM */
/* ////////////////////////////////////////////////////// */

/*div {border:1px solid #003300;}*/

/* RESET */
* { margin: 0; padding: 0; }

/* COVER ALL */
body { background: #000; color: #ccc; font-family: georgia, serif; font-size: small; line-height: 1.5em;}

.white{color: #fff;}
.red{color:#ff3300;}
.grey {color: #666;}

/* PAGE STYLES */ 
h1, h2, h3 { color: #ccc; font-weight: normal;  margin-bottom: 12px;}


.rightSideContent h2 {margin-bottom: 68px;}

p { margin: 0 0 15px 0; line-height: 1.5em;}
.introCopy p  {line-height: 1.5em;}
#footer p {font-size: 70%;}
p.seePhotos
{
	margin: 28px 0;
	font-size: large;
}


/* IMAGES STYLES */ 
img { border: none; }

/* GENERAL LINKS*/
a:link, a:visited { color: #ccc; font-weight: normal; text-decoration: none; }
a:hover { text-decoration: underline; color: #666;}

p.seePhotos a:link, p.seePhotos a:visited {text-decoration: none;}


#header a:hover { text-decoration: none; color: #ccc;}

/* NAVS  */
#nav { width: 938px; text-align: left; padding: 0; margin: 18px 0;}
#nav a.nd { display: none; }
#nav ul { list-style-type: none; margin: 0px; padding: 0; }
#nav li { display: inline; list-style:none; margin-right: 12px;}
#nav p {font-size: 100%;}

#sideNav ul {margin: 0; padding:0;}
#sideNav li {list-style:none; font-size: 95%; line-height: 1.2em; color: #666; margin: 5px 0;}

/* LAYOUT DIVS */ 
#wrapper { margin: 0 auto; width: 960px; background: #000;} 
#header { margin-bottom: 30px; width: 960px; }
#logo { float: left; } 

/* CONTENT */

.leftSideContent {width: 224px; float: left; margin-right: 38px;}

.rightSideContent { width: 680px; margin: 0px; float: left; padding-left: 18px;}
.rightSideContent #imageGallery img {height: 65px; overflow: hidden; border: 2px solid #fff;}

#imageGallery {margin: 18px 0;}


.introCopy {float: right; width: 440px; padding-left: 18px;}
.introCopyImg {float: left; width: 215px;}


/* FOOTER */
#footer { height: 117px; background-color: #000; margin-top: 28px; clear: both;}
#footerContent { padding: 0;}


/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////// LIGHTBOX CSS //////////////// */
/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////// */


.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html>body .clearfix { display: inline-block; width: 100%; }
* html .clearfix { /* Hides from IE-mac \*/ height: 1%; /* End hide from IE-mac */ }

#lightbox{ position: absolute; top: 20px; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; color:#151410; }

#lightbox a, #lightbox a:hover { border-bottom:none; color:#666; text-decoration:underline; }
#lightbox a img{ border: none;}

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; } 
#loadingLink { display:block; margin:0 auto; padding:0; width:32px; height:32px; background:url("../images/loading.gif") center center no-repeat; text-indent:-9999px; } 
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } 

#imageContainer>#hoverNav{ left: 0;} 
#hoverNav a{ outline: none;}

#prevLinkImg, #nextLinkImg{ width: 49%; height: 100%; background: transparent url(../"images/blank.gif") no-repeat; /* Trick IE into showing hover */ display: block; text-indent:-9999px; } 
#prevLinkImg { left: 0; float: left;} 
#nextLinkImg { right: 0; float: right;} 
#prevLinkImg:hover, #prevLinkImg:visited:hover { background: url("../images/prevlabel.jpg") left 15% no-repeat; } 
#nextLinkImg:hover, #nextLinkImg:visited:hover { background: url("../images/nextlabel.jpg") right 15% no-repeat; }


#imageDataContainer{ font: 12px georgia, serif; color: #666; background-color: #fff; margin: 0 auto; line-height: 1.4em; }
#imageData{ padding:0 10px; } 
#imageDetails{ width: 70%; float: left; text-align: left; color: #666;} 

#caption{ font-weight: bold;	} 

#numberDisplay{ display: block; clear: left; } 
#detailsNav{ display: block; clear: left; padding:0 0 10px 0;} 

#prevLinkDetails { margin:0 8px 0 0; } 
#nextLinkDetails { margin:0 8px 0 0; } 

#closeLink { display: block; margin: 0; padding: 0 0 10px 0; text-decoration: none; float: right; width: 39px; height: 28px; text-indent: -9999px; overflow: hidden; background-image: url("../images/closelabel.jpg"); background-repeat: no-repeat; }

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; filter:alpha(opacity=100); -moz-opacity: 1; opacity: 1; }


/* ORIGINAL VALUES OF OVERLAY */
/* /////////////////////////////////////////////////////////*/
/* #overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #151410; filter:alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; } */
/* /////////////////////////////////////////////////////////*/