﻿
* { padding:0; margin:0; }
body { font: 12px/18px Arial, Sans-Serif; color: #555; background: #fff; }

.container { margin: auto; margin-top: 54px; width: 792px; }
h1 { font-size: 2em; line-height: 1em; margin-bottom: 1em; background: url(/Resources/Images/Kathy-Croson-Logo.gif) no-repeat; text-indent: -9999px; width: 248px; height: 28px; }
h1 a { display: block; width: 250px; height: 30px; overflow: hidden; }
h3 { font-size: 1em;}
h4 { font-size: 1em; margin-bottom: 18px; color: #999; }
a { color: #555; font-weight: bold; text-decoration: none; }
a:hover { text-decoration: underline; }
img { border: none; }
textarea, input { font-family: Arial, Sans-Serif; font-size: 1em; color: #333; }
.col1 { width: 288px; float: left; }
.col2 { float: left; width: 504px; }

.clear { clear: both; }

/* --- nav --- */
.nav { list-style-type: none; margin-top: 72px; }
.nav li a { background: url(/Resources/Images/Navigation.gif) 0 -5px; height: 24px; width: 153px; display: block; text-indent: -9999px; overflow: hidden; margin-bottom: 18px; }
.nav .paintings:hover { background-position: 153px -5px; }

.nav .about { background-position: 0 -41px; }
.nav .about:hover { background-position: 153px -41px; }

.nav .news { background-position: 0 -77px; }
.nav .news:hover { background-position: 153px -77px; }

.nav .commissions { background-position: 0 -113px; }
.nav .commissions:hover { background-position: 153px -113px; }

.nav .contact { background-position: 0 -149px; }
.nav .contact:hover { background-position: 153px -149px; }

/* --- gallery sub nav --- */
.nav ul { list-style-type: none; margin-left: 18px; margin-bottom: 18px; }
.nav ul a { background: none; display: inline; text-indent: 0; }
.nav ul a.active { text-decoration: none; text-transform: uppercase; font-weight: bold; letter-spacing: .08em; }

ul.gal-nav { position: absolute; top: 378px; right: 0; }
ul.gal-nav li { border: none; padding: 0; margin: 0; float: left; margin-left: 18px; }
#gal-next, #gal-prev { background: url(/Resources/Images/Gallery-Nav.gif); width: 18px; height: 18px; display: block; }
#gal-next { background-position: top right; }

.thumbs { margin-top: 54px; }
.thumbs a { position: relative; width: 50px; height: 50px; float: left; }
.thumbs img { height: 50px; width: 50px; }
.thumbs a:hover span { background: none; }
.thumbs span { background: url(/Resources/Images/Transparent-Gray.png) no-repeat; display: block; position: absolute; top: 0; left: 0; height: 50px; width: 50px; z-index: 3; }

.featured-painting { position: relative; }
.featured-painting ul { margin-top: 9px; }
.featured-painting li { display: inline; padding-right: 18px; margin-right: 18px; font-size: .9em; }
.featured-painting .first { border-right: solid 1px #999;}
.featured-painting ul em { font-weight: bold; font-style: normal; }

/* --- Copy Based Pages --- */
.copy-based .featured-painting { float: left;}
.copy-based .photo { float: left; margin: 0 18px 0 0; }
.copy-based .photo p { border: solid 1px #ccc; padding: 6px 9px; font-size: .9em; border-top: none; color: #999;}
.copy-based .photo a { font-weight: normal; color: #999; }
.copy-based h2 { background: url(/Resources/Images/Headings.gif) top left no-repeat; text-indent: -9999px; line-height: 36px; height: 36px; }
.copy-based h2.artist-statement { background-position: 195px 0; }
.copy-based h2.biography { background-position: 0 -40px; }
.copy-based h2.professional-associations { background-position: 0 -80px; }
.copy-based h2.commissions { background-position: 308px -160px; }
.copy-based h2.contact { background-position: 200px -200px; }
.copy-based p { margin-bottom: 18px; }

/* --- News --- */
.news h2 { background: none; text-indent: 0; line-height: 1em; height: auto; }
.news p a { text-decoration: underline; }
div.news-post { border-bottom: solid 1px #999; margin-bottom: 18px; padding-bottom: 18px; }
.news-post img { height: 50px; width: 50px; }

/* --- Contact --- */
fieldset.contact { border: none; }
fieldset.contact legend { margin-bottom: 18px; }
fieldset.contact ul { list-style-type: none; }
fieldset.contact label { width: 72px; display: block; float: left; }
fieldset.contact input, fieldset.contact textarea { background: #eee; border: solid 1px #999; width: 216px; }
fieldset.contact li { margin-bottom: 18px; }
fieldset.contact .sign-up { display: block; background: url(/Resources/Images/Sign-Up.gif) no-repeat; width: 108px; height: 24px; text-indent: -9999px; overflow: hidden; margin-left: 72px; }
fieldset.contact .sign-up:hover { background-position: bottom; }
.status-message { background-color: #ddd; padding: 6px; }
a.facebook { display: block; width: 105px; height: 30px; background: url(/Resources/Images/Facebook.gif) no-repeat; margin-left: 200px; }

.footer { text-align: right; position: relative; top: 72px; color: #ccc; }

acronym { letter-spacing: .2em; }

/* --- Galleria Styles --- */
.gallery li { border: none; margin: 0; padding: 0; }
.galleria li a { display: none; }
.galleria li { display: block; float: left; height: 50px; }
.galleria li .caption{ display: block; padding-top:.5em }
.gallery li span { display: none; }
ul.gallery { margin-top: 36px; }

/* --- Homeapge Slideshow --- */
#slideshow div { display: none; }
#slideshow div.active { display: block; }

/* --- Lightbox --- */

/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay { position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; }
#jquery-lightbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; }
#lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; border: solid 1px #999; }
#lightbox-container-image { padding: 10px; }
#lightbox-loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block; }
#lightbox-nav-btnPrev { left: 0; float: left; }
#lightbox-nav-btnNext { right: 0; float: right; }
#lightbox-container-image-data-box { background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: hidden; width: 100%; padding: 0 10px 0; border: solid 1px #999; border-top: none; }
#lightbox-container-image-data { padding: 5px 0; color: #666; }
#lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left; }	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {	display: block; clear: left; }
#lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: 0.7em; }