* { margin: 0; padding: 0 }
a:active,
a:focus,
a:visited { outline: none; border: none; }

body 		{ text-align: center; padding-bottom: 50px; font-size: 14px; line-height: 1.5em; }
#wrap		{ width: 780px; margin: 0 auto; background: #fff; }
#header		{ margin: 25px auto 0px auto; }

h1 { color: #333; line-height: 1; font-size: 17px;  }
h1 a { text-decoration: none; }


h2 {
	line-height: 1;
	margin: 5px 0 0 0;
	color: #888;
	font-size: 13px;
	font-weight: normal;
	letter-spacing: 1px;
	text-transform: uppercase;
}


/**********************
*** Portfolio (homepage)
**********************/
#portfolio			{ margin-top: 25px; overflow: hidden; }
#welcome			{ width: 300px; margin: 0 20px; float: left; }
#gallery_list		{ width: 440px; float: right; }

/* Gallery thumbnails */
.gallery_box 		{ margin: 0 20px 40px 20px; float: left; width: 170px; height: 170px; background-repeat: no-repeat; background-position: center center; }
.gallery_box h3		{ font-size: 11px; letter-spacing: 1px; margin-bottom: 2px; }
.gallery_box h3 a	{ text-decoration: none; }

/* Footer (contains gallery and page nav) */
.footer_nav { clear: both; }
.footer_nav a:hover { color: #333; }

/* Gallery menu */
.gallery_nav			{ clear: both; padding-top: 20px; text-align: center; font-size: 14px; font-style: italic; padding-bottom: 5px;  }
.gallery_nav a 			{ text-decoration: none; margin: 0 .85em; }
.gallery_nav a.active 	{ font-weight: bold; }

/* Page menu */
.page_nav			{ padding-top: 5px; }
.page_nav a 		{ text-decoration: none; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; margin: 0 1em; }
.page_nav a.active	{ font-weight: bold; }

/* sticky */
.sticky				{ color:#aaa; font-size:0.8333em; margin-top:0.5em; }
.sticky a			{ color:#aaa; text-decoration:none; }


/**********************
*** Text content
**********************/
.body 			{ text-align: left; width: 500px; margin: 0 auto; }
.body h2		{ margin-bottom: 1.6em; font-weight: bold; color: #333; }
.body 			{ font-size: 11px; line-height: 1.6; }
.body p 		{ margin: 0.7em 0 1.2em; }
.body ul,
.body ol 		{ margin-left: 4em; }
.body a			{ color: #333; font-weight: bold; text-decoration: none; }
.body a:hover	{ color: #000; text-decoration: underline; }
.body img		{ border: 3px double #ccc; }


/**********************
*** Main gallery
**********************/
.gallery					{ margin: 20px auto; width: 700px; height: 500px; }
.gallery .caption			{ font-family: "Lucida Grande", Verdana, sans-serif; font-size: 11px; color: #fff; background: url(../img/trans_dark.png); width: 66%; text-align:left; text-shadow: #000 0px 0px 0px; position: absolute; left: 3px; margin: 0; line-height: 1.4; padding: 10px; z-index: 10;}
.toggleCaption				{ text-align: left; }
.toggleCaption a			{ display: block; width: 16px; height: 16px; background: url(../img/caption.png) no-repeat 0 0; }
.toggleCaption a:hover 		{ background: url(../img/caption.png) no-repeat 0 -16px; }
.toggleCaption.visible a 		{ background: url(../img/caption.png) no-repeat 0 -32px; }
.gallery .image				{ height: 500px; width: 700px; }
.gallery .image img			{ border: 3px double #ccc; }
.scrollable img			 	{ border: 3px double white; }
.scrollable img.active		{ border-color: #999; }

.nav			{ margin-bottom: 15px; clear: both; letter-spacing: 3px; color: #bbb; text-transform: uppercase; }
.nav a			{ color: #444; text-decoration: none; }
.nav a:hover	{ color: #000; }

.counter 		{ font-size: 13px; line-height: 13px; letter-spacing: 0px; text-transform: none; padding: 0 10px; margin: 0 10px;
					border-left: 1px solid #ccc; border-right: 1px solid #ccc; color: #333; }
.counter span	{ font-style: italic; color: #555; font-weight: normal; }

/*#thumb_panel 	{ width: 800px; margin: 0 auto; padding-left: 72px; }*/



/**********************
*** Font variations
**********************/
body.lucida-georgia  { font-family: Georgia, "Times new roman", serif; }
.lucida-georgia h1 { font-weight: bold; letter-spacing: 2px; word-spacing: .25em; font-variant: small-caps; text-transform: uppercase; }
.lucida-georgia h2 { font-family: "Lucida Grande", Verdana, sans-serif; }
.lucida-georgia .gallery_box h3 { font-family: "Lucida Grande", Verdana, sans-serif; text-transform: uppercase; }
.lucida-georgia .page_nav a { font-family: "Lucida Grande", Verdana, sans-serif; }
.lucida-georgia .gallery_nav { font-family: Georgia, "Times new roman", serif; }
.lucida-georgia .body { font-family: "Lucida Grande", Verdana, sans-serif; }
.lucida-georgia .gallery .caption { font-family: "Lucida Grande", Verdana, sans-serif; }
.lucida-georgia .toggleCaption { font-family: "Lucida Grande", Verdana, sans-serif; }
.lucida-georgia .nav { font: 80% 'helvetica neue',sans-serif; }
.lucida-georgia .counter { font-family: "Georgia", serif; }

body.palatino { font-family: "Palatino", "Times new roman", "Times" serif; }
.palatino h1 { font-family: "Baskerville", "Palatino", "Times New Roman", serif; font-weight: bold; letter-spacing: 2px; word-spacing: .25em; font-variant: small-caps; text-transform: uppercase; }
.palatino h2 { font-style: italic; text-transform: none; font-size: 12px; line-height: 1.5; }
.palatino .gallery_box h3 { font-variant: small-caps; font-size: 14px; text-transform: lowercase; letter-spacing: 1px; }
.palatino .body { font-size: 13px; }
.palatino .body h2 { font-size: 15px; }
.palatino .body p.first .dropCaps { color: #fff; font-size: 18px; width: 18px; margin-top: 3px; margin-right: 8px; padding: 8px; text-align: center; float: left; font-weight: bold; background: #555; border: 3px double #aaa; font-style: normal !important; }
.palatino .body p.first:first-line { font-weight: bold; font-style: italic; }
.palatino .body a { font-style: italic; font-family: "Times"; text-decoration: underline; }
.palatino .gallery .image img			{ border: 3px double #999; border: none; }
.palatino .scrollable img			 	{ border: 3px double white; }
.palatino .scrollable img.active		{ border-color: #666; }


body.helvetica  { font-family: "Helvetica Neue", Arial, sans-serif; }
.helvetica .mdash { display: none; }
/* Helvetica looks better than Neue when big & bold */
.helvetica h1 { font-weight: bold; letter-spacing: -1px; font-size: 24px; font-family: Helvetica, Arial, sans-serif; }
.helvetica h2 { font-weight: normal; letter-spacing: 0; text-transform: none; font-size: 13px; }
.helvetica .gallery_box h3 { font-weight: bold; text-transform: none; letter-spacing: 0; }
.helvetica .page_nav a { }
.helvetica .gallery_nav {  font-style: normal; font-weight: bold; }
.helvetica .gallery_nav a { color: #999; }
.helvetica .gallery_nav a:hover { color: #555; }
.helvetica .gallery_nav a.active { color: #333; }
.helvetica .body { font-size: 12px; }
.helvetica .body h2, .helvetica .body h3 { font-weight: bold; }
.helvetica .body h2 { font-size: 16px; line-height: 1.15; }
.helvetica .nav { font-size: 11px; font-weight: bold; letter-spacing: 0; }
.helvetica .nav a { color: #999; }
.helvetica .nav a:hover { color: #333; }



/**********************
*** Color variations
**********************/

/* Main body / title */
body.white-gray	{ background: #fff; color: #555; }
body.dark-white { background: #1c1c1c; color: #eee; }
body.dark-white	#wrap{ width: 780px; margin: 0 auto; background: #1c1c1c; }
body.white-gray h1 a { color: #333; }
body.white-gray h1 a:hover { color: #000; }

body.dark-white h1 a { color: #eee; }
body.dark-white h1 a:hover { color: #fff; }

/* Borders on gallery thumbs (homepage) */
body.white-gray .gallery_box a img	{ border: 3px double #bbb; }
body.white-gray .gallery_box a:hover img { border-color: #888; }

body.dark-white .gallery_box a img	{ border: 3px solid #171717; }
body.dark-white .gallery_box a:hover img { border-color: #000; }

/* Headings on gallery thumbs (homepage)  */
body.white-gray .gallery_box h3 a		{ color: #333; }
body.white-gray .gallery_box:hover h3 a,
body.white-gray .gallery_box h3 a:hover { color: #000; }

body.dark-white .gallery_box h3 a		{ color: #777; }
body.dark-white .gallery_box:hover h3 a,
body.dark-white .gallery_box h3 a:hover { color: #fff; }

/* Body text styles */
body.dark-white .body { color: #999; }
body.dark-white .body h2,
body.dark-white .body h3 { color: #eee; }
body.dark-white .body a { color: #bbb; }
body.dark-white .body a:hover { color: #fff; }

/* Page navigation */
body.white-gray .page_nav { border-top: 1px solid #ddd; }
body.white-gray .page_nav a { color: #888; }
body.white-gray .page_nav a.active,
body.white-gray .page_nav a:hover { color: #333; }

body.dark-white .page_nav { border-top: 1px solid #333; }
body.dark-white .page_nav a { color: #555; }
body.dark-white .page_nav a.active { color: #fff; }
body.dark-white .page_nav a:hover { color: #999; }

/* Gallery navigation */
body.white-gray .gallery_nav a			{ color: #555; }
body.white-gray .gallery_nav a.active,
body.white-gray .gallery_nav a:hover 	{ color: #333; }

body.dark-white .gallery_nav a			{ color: #444; }
body.dark-white .gallery_nav a.active,
body.dark-white .gallery_nav a.active:hover	{ color: #fff; }
body.dark-white .gallery_nav a:hover 	{ color: #999; }


/* Gallery parts & image treatment */
body.dark-white .items { background: #000; }
body.dark-white .scrollable img { border-color: #000; }

body.dark-white .body img,
body.dark-white .gallery .image img { border: 3px solid #000; }
body.dark-white .counter { border-color: #333; color: #555; }
body.dark-white .nav a { color: #555; }
body.dark-white .nav a:hover { color: #999; }

/* Gallery thumb controls */
body.white-gray a.prev,
body.white-gray a.next,
body.white-gray a.prevPage,
body.white-gray a.nextPage { height: 18px; 	background:url(../img/left.png) no-repeat 0 0px; }

body.white-gray a.prev:hover,
body.white-gray a.next:hover,
body.white-gray a.prevPage:hover,
body.white-gray a.nextPage:hover {
	background-position:0px -18px;		
}

body.white-gray a.next,
body.white-gray a.nextPage { background-image:url(../img/right.png); }

body.dark-white .sticky,
body.dark-white .sticky a		{ color:#555; }
body.dark-white .sticky a:hover	{ color:#999; }