* { outline: none }
body {
	 font-family: Arial, Helvetica;
	 font-size: 12px;
	 line-height: 19px;
	 margin:0;
	 padding:0;
	 background: #141414;
	 color: #b5b5b5;
}

body.home { background: #141414 url(../images/loader.gif) no-repeat center 340px;}
body.popup { padding: 10px }

a { color: #b5b5b5; text-decoration: none }
a img, img { border: none }
ul, ol { margin: 0; padding: 0}
.sold { color: #b30000; font-weight: bold }
.error { color: #F00 }
.success { color: #080 }

h1 {
	font-size: 11px;
	color: #FFFFFF;
	font-weight: bold;
	margin-left: 4px;
	margin-bottom: 0;
}

h2 {
	font-size: 16px;
	color: #ffffff;
	margin-top: 0;
	margin-bottom: 8px;
}

p {
	font-size: 12px;
	color: #b5b5b5;
	text-align: left;
	margin: .5em 0 1em;
	font-weight: normal;
}

p.portfolio_copy {
	font-size: 11px;
	margin-left: 4px;
	margin-top: 4px;
}

/*Supersize Plugin Styles*/
#supersize {
	height:100%;
	width:100%;
	position: absolute;
}

#supersize img {
	position: absolute;
	height:100%;
	width:100%;
}
/* end supersize styles */

#wrapper {
	position: absolute;
	top: 0;
	left: 0;
	min-width: 1000px;
	width: 100%;
	min-height: 100%;
	z-index: 5;
}

#content {
	width: 980px;
	margin: auto;
	padding: 21px 0 141px 0;
	position: relative;
	z-index: 6;
}

body.home #content { padding-top: 100px }
body.photos #content { width: 1028px }

#veil {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 5;
	background: #000;
}

#logo {
	position: relative;
	z-index: 10;
	background: url(../images/bg-nav_shadow.png) no-repeat;
	width: 501px;
	height: 124px;
	margin: 0 auto;
}

/*
Since we're not showing dialogs anywhere else, this isn't really necessary, but might come in handy in the future

body.photos #dialogs, body.gallery #dialogs {
	position: absolute;
	top:160px;
	left: 50%;
	margin-left: -414px;
}
*/

#nav {
	position: relative;
	top: -7px;
	left: 13px;
	list-style: none;
}

#nav li {
	float: left;
	height: 25px;
	padding: 0;
	position: relative;
	overflow: hidden;
}

#nav li a {
	position: absolute;
	font-size: 11px;
	color: #FFF;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	width: 100%;
	height: 100%;
	padding-top: 2px;
}

#nav li a:hover, #nav li.selected a { background: url(../images/sprite-nav_bg.png) no-repeat }

#nav li.portfolio { width: 86px; }
#nav li.portfolio a { background-position: 0 0; }
#nav li.galleries { width: 86px; }
#nav li.galleries a { background-position: 0 0; }
#nav li.workshops { width: 95px }
#nav li.workshops a { background-position: -91px 0; }
#nav li.blog { width: 56px }
#nav li.blog a { background-position: -191px 0; }
#nav li.purchase { width: 87px }
#nav li.purchase a { background-position: -249px 0; }
#nav li.about { width: 64px }
#nav li.about a { background-position: -338px 0;}



.portfolio #modal_portfolio { background: #141414; }


#modal_portfolio { margin: 0 auto; width: 828px; text-align: center; }

#modal_portfolio a {
	font-size: 12px;
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
}

.portfolio_cat { float: left; padding: 0 10px;}

.portfolio_cat .cat_title {
	color: #ffffff;
	font-size: 11px;
	font-weight: bold;
}

.portfolio_cat img { border: 2px solid #FFF;}
.portfolio_cat a:hover img { border-color: #971c26 }

#modal_portfolio #portfolio_nav {
	clear: both;
	width: 402px;
	margin: 0 auto;
	padding-top: 20px;
	padding-bottom: 6px;
}

a.new_images, a.entire_gallery {
	background: url(../images/sprite-btn-browse.png) no-repeat;
	width: 189px;
	height: 34px;
	text-indent: -99999px;
	margin: 6px;
	float: left;
}
a.new_images { background-position: 0 0;}
a.new_images:hover { background-position: 0 -33px;}
a.entire_gallery { background-position: -201px 0;}
a.entire_gallery:hover { background-position: -201px -33px; }

.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }


#content-container {
	width: 100%;
	background-color: #141414;
}

#content-container.single-column {
	width: 600px;
	margin: 0 auto;
}

body.photos #content-container { margin-bottom: 30px; }

#content-left {
	width: 200px;
	float: left;
	position: relative;
}

#content-left li { margin: 0; margin-bottom: 6px; }
#content-left ul li a:hover { color: #ffffff;}
#content-left ul li.active a  { color: #ffffff; font-weight: bold}

#content-right {
	width: auto;
	margin-left: 211px;
	position: relative;
}

#content-right.misc { width: 600px; }

.misc b, .misc a  { color: #FFF; }
.misc a:hover { text-decoration: underline; }
.misc h1 { font-size: 16px; margin: 0}
.misc h2 { font-size: 14px; }
.misc p, #content-right.misc table { margin-left: 5px; }
.misc ul, #content-right.misc ol { padding-left: 25px; margin-bottom: 15px; }
.misc img { border: 2px solid #ffffff; }

/* Portfolio styles */

#portfolio_nav {
	margin-left: 5px;
	text-transform: uppercase;
	font-size: 11px;
}

#portfolio_nav b, #portfolio_nav a:hover { color: white }
#portfolio_nav span { padding: 0 3px; }

#thumbs {
	margin-top: 25px;
	margin-left: -3px;
	text-align: center;
	width: 188px;
}

#thumbs img {
	border: 2px solid #ffffff;
	width: 71px;
	height: 71px;
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}

#thumbs a { text-indent: 0; height: auto; width: auto; float: left; margin: 7px }
#thumbs a:hover img, #thumbs img.active, #thumb-nav img {
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
	}

/*jQuery Scrollable Styles*/

#thumbs div.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: auto;
	height: 260px;
	margin-bottom: 20px;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a super large width to accomodate scrollable items.
	it's enough that you set width and height for the root element and
	not for this element.
*/
#thumbs div.scrollable div.items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;
}

/* single scrollable item */
#thumbs div.scrollable div.items div {
	padding: 0;
	width: 188px;
	float: left;
	padding-left: 6px;
}

#thumbs div.scrollable div.items div img{
	margin: 0;
}

#thumbs a.prev, #thumbs a.next {
	background: url(../images/sprite-btn-arrows.gif) no-repeat;
	text-indent: -999999px;
	display: inline;
	cursor: pointer;
	width: 31px;
	height: 32px;
	border: none;
	margin: 0 6px;
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
}

#thumbs a.prev { background-position: 0 0; float: left;}
#thumbs a.prev:hover { background-position: 0 -33px;}
#thumbs a.next { background-position: -31px 0; float: right;}
#thumbs a.next:hover { background-position: -31px -33px;}

#thumbs span {
	color: #ffffff;
	float: left;
	margin-top: 5px;
	text-align: center;
	width: 100px;
}

/* disabled navigational button */
#thumbs a.disabled {
	filter:alpha(opacity=40);
	-moz-opacity:0.40;
	-khtml-opacity: 0.40;
	opacity: 0.40;
	cursor: default;
}

#thumbs a.disabled.prev:hover { background-position: 0 0;}
#thumbs a.disabled.next:hover { background-position: -31px 0;}

#img-container { position: relative; border: 2px solid #FFF; }
#img-container.offset, #details.offset { margin-left: 120px}

#controls { position: absolute; width: 100%; height: 100%; display: none }

#controls a {
	text-indent: -999999px;
	filter:alpha(opacity=0);
	-moz-opacity:0;
	-khtml-opacity: 0;
	opacity: 0;
	position: absolute;
	width: 46%;
	height: 100%;
	top: 0;
}
#controls a:hover {
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
}

#controls a.btn-back {	background: url(../images/btn-back.png) no-repeat 0 40%; left:0;}
#controls a.btn-next {	background: url(../images/btn-next.png) no-repeat 100% 40%;	right: 0;}


#details {
	text-align: center;
	padding: 15px 2px 0;
	font-size: 11px;
	text-transform: uppercase;
}

#details h2 { color: #ffffff; margin: 0; font-size: 12px; text-transform: uppercase}

#details a:hover { color: #ffffff; }
#details span { padding: 0 3px; }
#details .share { margin: 5px auto; width: 80px; }
#details .moreinfo { cursor: pointer }

#details .desc {
	margin: 2px 0 10px;
	color: #FFF;
	display: none;
}



/* Gallery Styles */


#gallery-select {
	width: 600px;
	height: 500px;
	margin: 0 auto;
	background: #141414;
	text-align: center;
	color: #ffffff;
	font-weight: bold;
	position: relative;
}

#gallery-select div {
	width: 181px;
	float: left;
}

#gallery-select div.gallery_nav {
	width: 189px;
	float: none;
	bottom: 0;
	margin: 0 auto;
}

#gallery-select div.middle { margin: 0 28px; }

#gallery-select img {
	border: 2px solid white;
	margin: 0;
}

#gallery-select a:hover img { border-color: #971c26; }

#gallery-select ul {
	text-align: left;
	list-style: none;
	margin: 0;
	margin-top: 20px;
	margin-left: 12px;
}

#gallery-select li { margin: 0; margin-bottom: 5px; }

#gallery-select li a { font-weight: normal; margin-left: 10px; }
#gallery-select li a:hover { color: #ffffff; }


#accordion { margin-left: 10px; }
#accordion li { list-style: none; margin: 0; margin-bottom: 10px; }
#accordion a { background: none; text-indent: 0; float: none; height: auto; width: auto; color: #ffffff; font-weight: bold;}
#accordion li ul a { color: #b5b5b5; font-weight: normal; padding: 2px 3px; }
#accordion li ul a:hover, #accordion li ul a.active { color: #ffffff; background: #b30000; }
#accordion li ul { margin-left: 10px; }
#accordion li ul li { margin: 5px 0; }

#accordion a.new { width: 100%; float: left; background: url(../images/btn-new.gif) no-repeat 118px 4px;  }


#gallery-thumbs {margin-left: 30px;}

/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
#gallery-thumbs div.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 737px;
	height: 435px;
	float: left;
	clear: none;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a super large width to accomodate scrollable items.
	it's enough that you set width and height for the root element and
	not for this element.
*/
#gallery-thumbs div.scrollable div.items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	background: #141414;
}

/*
	a single item. must be floated on horizontal scrolling
	typically this element is the one that *you* will style
	the most.
*/
#gallery-thumbs div.scrollable div.items div {
	float:left;
	width: 737px;
	height: 435px;
	position: relative;
}

#gallery-thumbs div.scrollable div.items div a img {
	border: 2px solid #ffffff;
	height: 125px;
	position: absolute;
/*
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
*/
}

#gallery-thumbs div.scrollable div.items div a:hover img, #gallery-thumbs img.active {
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
	}


#gallery-thumbs a.prev, #gallery-thumbs a.next {
	background: url(../images/sprite-btn-arrows.gif) no-repeat;
	text-indent: -999999px;
	display: inline;
	cursor: pointer;
	width: 31px;
	height: 32px;
	border: none;
	margin: 0 6px;
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
}

#gallery-thumbs a.prev { background-position: 0 0;}
#gallery-thumbs a.prev:hover { background-position: 0 -33px;}
#gallery-thumbs a.next { background-position: -31px 0;}
#gallery-thumbs a.next:hover { background-position: -31px -33px;}

#gallery-thumbs span { color: #ffffff; margin-top: 5px; text-align: center; width: 95px; }

#gallery-thumbs .prev, #gallery-thumbs .next, #gallery-thumbs span { float: right; }
#gallery-thumbs a.disabled.prev:hover { background-position: 0 0;}
#gallery-thumbs a.disabled.next:hover { background-position: -31px 0;}

/* disabled navigational button */
#gallery-thumbs a.disabled {
	filter:alpha(opacity=40);
	-moz-opacity:0.40;
	-khtml-opacity: 0.40;
	opacity: 0.40;
	cursor: default;
}

.breadcrumb { float: left; color: #b5b5b5; margin-bottom: 25px; }
.breadcrumb a { color: #ffffff; }


.price-list tr { padding-bottom: 3px; }
.price-list td { padding-right: 15px; }

.sale-items { text-align: center; }
.sale-items td { padding-bottom: 40px;}
.sale-items .desc { text-align: left; padding-left: 40px; }

/* Footer Styles */

#footer {
	background: url(../images/bg-footer.jpg) repeat-x bottom;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	height: 141px;
	width: 100%;
	min-width: 1000px;
	position: absolute;
	bottom: 0;
	color: #595959;
	text-align: center;
	z-index: 7;
}

#footer_text { position: relative; padding: 12px 0 0 0; width: 570px; margin: 0 auto; top: 46px }

#contact { color: #b5b5b5; margin-top: 10px;}
#contact a:hover { text-decoration: underline; }

#footer_ad {
	position: absolute;
	right: 15px;
	bottom: 10px;
}

#social-links { position: absolute; left: 65px; bottom: 22px; }

#social-links a.facebook, #social-links a.twitter {
	background: url(../images/sprite-social.gif) no-repeat;
	width: 60px;
	height: 21px;
	float: left;
	margin-right: 15px;
	text-indent: -9999px;
}

#social-links a.facebook { background-position: 0 0; }
#social-links a.twitter { background-position: -60px 0; }
#social-links a.facebook:hover { background-position: 0 -21px; }
#social-links a.twitter:hover { background-position: -60px -21px; }

#sitecredit {
	font-size: 9px;
	clear: left;
	text-align: left;
	margin-left: 10px;
	padding-top: 5px
}
#sitecredit a { color: #595959; }
#sitecredit a:hover { text-decoration: underline; color: #b5b5b5; }

ul.form_errors {
	margin-left: 25px;
	color: #FF0000;
	margin-bottom: 5px;
}

body.collection.popup {
	padding: 20px 30px 10px;
}

body.collection table {
	margin-left: 5px;
	margin-bottom: 15px;
}

body.collection td {
	padding: 2px 4px;
}

body.collection td.remove {
	font-size: 10px;
}

body.collection a {
	text-decoration: none;
}
body.collection a:hover {
	text-decoration: underline;
}
body.collection a.main {
	font-weight: bold;
}

body.collection #name, body.collection #email {
	width: 180px;
}
body.collection #message {
	width: 380px;
	height: 60px;
}