/* ---- Web design by Leesa Willis - http://thehangedman.net ---- */

/* Reset default browser styles */ @import url('styles/reset.css');

/* Rebuild default browser styles */ @import url('styles/960.css');

/* Rebuild default browser styles */ @import url('styles/text.css');

body { background:#ffffff; }
a { text-decoration:none; }

.aleft { text-align:left; }
.aright { text-align:right; }
.actr { text-align:center; }

hr { width:80%; text-align:center; }

.logo { height:46px; background:url(imgs/JoBLOGO.png) no-repeat 0 10px; }

.indexcon { /*background:#e3e3e3; */width:962px; border:1px solid #999999; margin-top:200px;}

.menu ul {/*background:#e3e3e3; */height:36px; text-align:right; list-style:none; margin:0; padding:8px 0 0 0; list-style-type:none; text-transform:uppercase; font-size:12px; letter-spacing:2px; position:relative; top:0; z-index:999;}
.menu ul li { display:inline; margin:0 0 0 25px; padding:0; }

.sidebar { float:left; text-align:left; margin-top:90px; font-size:85%; text-transform:uppercase; }
.sidebar ul { list-style:none; }
.sidebar ul li { margin:0 0 10px 10px; letter-spacing: 2px;}

.main1 {text-align:center; height:220px; margin-top:0; margin-bottom:65px; padding-bottom:10px;}
.main1.index {position:relative; top:-90px; z-index:1; overflow:visible;}
.main1 img.gal {margin:0 120px 0 0; border-right:2px solid #575757; border-bottom:2px solid #575757; width:75px; height:75px; position:relative; left:60px; z-index:111;}

.indxbck {width:782px; height:94px; position:relative; top:115px; left:-10px; z-index:777;}
.indxlnk {position:relative; top:0px; z-index:999;}

.trnslnk {width:78px; height:78px; margin:0 123px 0 0; Position:relative; top:172px; left:61px; z-index:888;}
.trnslnk:hover {width:75px; height:75px; border-right:2px solid #C40000; border-bottom:2px solid #C40000; top:171px;}

.main2 { text-align:center; height:220px; margin-top:25px; margin-bottom:60px; }
.main2 img.gal { margin:72.5px 60px 0 60px; border:2px solid #575757; width:60px; height:60px; }
.main2 img.gal:hover { border:2px solid #C40000; }

.gallery { /*background:#e3e3e3; */float:right; /*clear:both; */width:284px; /*height:284px; */margin-right:60px; /*margin-bottom:50px; */padding:0; }
.gallery a img.gal, .gallall a img.gal, .gallery img.gal, .gallall img.gal { margin:5px; border-right:1px solid #575757; border-bottom:1px solid #575757; width:60px; height:60px; }
.gallery a img.gal:hover, .gallall a img.gal:hover { border-right:1px solid #C40000; border-bottom:1px solid #C40000; }
.galttl h4 { float:right; margin:255px 25px 0 0; text-align:right; font-weight:normal; font-family:Georgia, serif; text-transform:uppercase; letter-spacing:.1em; }
.galttl2 h4 { float:right; text-align:right; margin:80px 25px 0 0; font-weight:normal; font-family:Georgia, serif; text-transform:uppercase; letter-spacing:.1em; }

.gallall { /*background:#e3e3e3; */float:right; /*clear:both; */width:575px; height:280px; margin-right:5px; /*margin-bottom:50px; */padding:0; text-align:left; overflow:auto;}

.txtcon { /*background:#e3e3e3; */float:right; width:566px; height:280px; margin-right:5px; margin-bottom:50px; padding-right:10px; overflow:auto; font-size:90%; line-height:1.6em; text-align:justify; }
.txtcon h4, .txtcon h5 { text-transform:uppercase; font-weight:normal; font-family:Georgia, serif; letter-spacing:.1em; }
.txtcon h4.hdr { text-align:right; }
.txtcon h5.minihdr { margin:0; font-size:130%; font-weight:bold; line-height:2.5em; }
.txtcon img.left { float:left; margin:10px 10px 10px 0; padding:0; }
.txtcon img.right { float:right; margin:10px 0 10px 10px; }
.txtcon ul { margin:0 0 20px 0; padding:0; }
.txtcon ul li { list-style:square; margin-left:15px; }

.layoutpic { margin:5px 10px 0 0; width:250px; height:250px; }
.layoutpic.artist {margin:5px 7px 0 0; width:213px; height:250px; }

#footer { margin-top:8px; }

/* ------- LIGHTBOX ------- */
#lightbox{position: absolute; left: 0; width: 100%; z-index: 999; text-align: center; line-height: 0;}

#lightbox img{width:auto; height:auto;}

#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;}

#hoverNav{position:absolute; top:0; left:0; height:100%; width:100%; z-index:99;}

#imageContainer>#hoverNav{left:0;}

#hoverNav a {outline: none;}


#prevLink, #nextLink{width:49%; height:100%; background-image:url(data:js/lightbox/image/gif;base64,AAAA); /*Trick IE into showing hover*/ display:block;}

#prevLink {left:0; float:left;}

#nextLink {right:0; float:right;}

#prevLink:hover, #prevLink:visited:hover {background:url(js/lightbox/images/prevlabel.gif) left 15% no-repeat;}

#nextLink:hover, #nextLink:visited:hover {background:url(js/lightbox/images/nextlabel.gif) right 15% no-repeat;}


#imageDataContainer{font:10px Verdana, Helvetica, sans-serif; background-color:#fff; margin:0 auto; line-height:1.4em; overflow:auto; width:100%;}


#imageData{padding:0 10px; color:#666;}

#imageData #imageDetails{width:70%; float:left; text-align:left;}

#imageData #caption{font-weight:bold;}

#imageData #numberDisplay{display:block; clear:left; padding-bottom:1.0em;}

#imageData #bottomNavClose{width:66px; float:right; padding-bottom:0.7em; outline:none;}


#overlay{position:absolute; top:0; left:0; z-index:900; width:100%; height:500px; background-color:#000;}