/* HTML Overrides */
body {background: #000; color: #fff; font-family: Helvetica, Arial, Sans-serif; font-size: 12px;}
h1, h2, h3, h4 {margin: 0; padding: 0;}
p {margin: 0 0 20px 0; line-height: 20px;}
a, a:visited {color: #4978bc;}
a:active {color: #00bdf2;}

/* Template Pieces */
#main {width: 956px; margin: 20px auto 0 auto;}
#head {width: 900px; margin: 0 auto 10px auto;}
#logo {width: 265px; height: 54px; margin: 0 0 0 10px; display: inline-block; background: transparent url('../images/logo.png') no-repeat 0 0; float: left;}
#logo img {display: none;}
#navigation {width: 600px; margin: 0 0 0 300px;}
#navigation ul {margin: 0; padding: 0; float: right;}
#navigation ul li {margin: 0 0 0 10px; padding: 0; list-style: none; float: left;}
#navigation ul li a {margin: 9px 10px 10px 10px; padding: 4px; color: #666; border: 1px solid #000; text-decoration: none; font-family: 'Helvetica LT Condensed', Helvetica, Arial, sans-serif; font-size: 18px; display: block;}
#navigation ul li a:hover {border: 1px solid #fff; background: #333; color: #fff;}
.home #home a, .portfolio #portfolio a, .about #about a, .contact #contact a {color: #fff;}
.home #home a:hover, .portfolio #portfolio a:hover, .about #about a:hover, .contact #contact a:hover {border: 1px solid #000; background: none;}
#body {width: 956px; height: 602px; margin: 0; padding: 0; position: relative; overflow: hidden;}
#footer {width: 900px; margin: 5px auto 0 auto; text-align: center; font-size: 10px; color: #999; font-family: 'Helvetica LT Condensed', Arial, Helvetica, sans-serif;}

/* Thumbnails */
#thumbnails {width: 900px; height: 87px; padding: 0 1px; margin: 0 auto 0 auto;}
.gallery_demo_unstyled {height: 60px; margin: 0; padding: 0; display: block; width: 1700px; position: relative;} /* max width here, for users without javascript */
.gallery_demo_unstyled li {width: 90px; height: 60px; overflow: hidden; border: 1px solid #666; margin: 9px 9px 0 0; background: #000; display: block; float: left; cursor: pointer;}
.gallery_demo_unstyled li:hover, .gallery_demo li.active {border: 1px solid #fff}
#main_image {width: 900px; height: 601px; padding: 0; margin: 0 auto;}
#main_image .galleria_wrapper {background: #fff; display: inline;}
#main_image .galleria_wrapper img {border: 1px solid #fff; margin: 0 auto; display: block;}
.caption {padding: 5px 10px; position: absolute; bottom: 6px; left: 33px; display: inline-block; font-style: italic; color: #fff; display: none; font-family: 'Helvetica LT Condensed', Arial, Helvetica, sans-serif; background: transparent url('../images/bgBlack75.png') repeat 0 0; border: 1px solid #fff;}
.caption {display: none; visibility: hidden;}
* html .galleria li div span {width:400px} /* MSIE bug */

/* Content Areas */
/* #content {width: 290px; height: 478px; padding: 30px; position: absolute; top: 31px; left: 58px; background: transparent url('../images/bgBlack75.png') repeat 0 0; border: 1px solid #fff;} */
h1 {position: absolute; top: 31px; left: 58px; font-family: 'Helvetica LT Condensed', Helvetica, Arial, sans-serif;}
#content {width: 290px; height: 448px; padding: 30px 30px 10px 30px; position: absolute; top: 81px; left: 58px; background: transparent url('../images/bgBlack75.png') repeat 0 0; border: 1px solid #fff; font-size: 14px; overflow: auto;}

/* Thumbnail Scroll */
#thumbnails {/* Set it so we could calculate the offsetLeft */ position: relative; overflow: auto;}
.gallery_demo_unstyled a {display: block; text-decoration: none;}
.gallery_demo_unstyled li span {width: 90px; position: absolute; top: 75px; text-align: center; font-size: 12px; color: #fff; font-family: 'Helvetica LT Condensed', Arial, Helvetica, sans-serif; font-size: 10px; display: none;}
.gallery_demo_unstyled li:hover span {display: none;}
.gallery_demo_unstyled li:hover img {filter:alpha(opacity=50); opacity: 0.5;}

/* Previous and Next buttons */
#galleryL, #galleryR {width: 20px; height: 100px; position: absolute; top: 250px; left: 0px; background: transparent url('../images/icons.png') no-repeat -40px 0; border: 1px solid #000; display: block;}
#galleryR {background-position: -100px 0; position: absolute; top: 250px; left: auto; right: 0px;}
#galleryL:hover {background-position: -70px 0;}
#galleryR:hover {background-position: -130px 0;}

/* Lightview Overrides */
a.lightview {color: #999;}
a.lightview:visited {color: #999;}

/* Page-Specific Backgrounds and Styles */
.portfolio #main_image {background: #fff;}
.home #main_image, .about #main_image, .contact #main_image {height: 600px; border: 1px solid #fff;}
.contact #main_image {background: transparent url('../images/backgrounds/Santa-Cruz-Pier.jpg') no-repeat 0 0;}
.about #main_image {background: transparent url('../images/backgrounds/Puddles-Modified.jpg') no-repeat 0 0;}
.about #content {width: 490px; left: auto; right: 58px;}

/* Misc. Styles */
.watermark {position: absolute; top: 0; left: 28px; z-index: 5;}
.clear {clear: both;}
.signature {width: 219px; height: 36px; margin: 30px 0 0 50px; background: transparent url('../images/icons.png') no-repeat 0 -100px; display: block;}

/* Zoom Styles and Overrides */
#zoom {width: 50px; height: 50px; position: absolute; top: 275px; left: 453px; background: transparent url('../images/icons.png') no-repeat -175px 0; display: none; z-index: 10;}
/* #main_image:hover #zoom {display: block;} */
#zoom:hover {background-position: -175px -50px;}
.tools {width: 25px; height: 25px; position: absolute; top: 287px; left: 465px; background: transparent url('../images/icons.png') no-repeat -175px -50px; display: none;}
.tools:hover {background-position: -150px -75px;}
.zoom {width: 13px; height: 13px; padding: 6px; background: transparent url('../images/icons.png') no-repeat -14px -14px; display: block;}
.tools:hover .zoom {background-position: 6px -14px;}
/* .tools:hover .zoom {background-position: 6px -34px;} */

.lightbox {}