/* =Layout
---------------------------------------------------- */



/* =Structure
------------------------------------------------------ */
/* The main theme structure */
#wrapper, 
#header 
{
	margin: 0 auto;
}
#main 
{ 
	margin:0 auto;	
	width: 960px;
	margin-top: 15px;
	min-height:614px;
}

body 
{ 
	background: url("/images/bg_body.jpg") repeat center top;
	font: 12px/20px Helvetica, "Helvetica-Neue", sans-serif;
}
#wrapper 
{ 
    margin: 0 auto;
    position: relative;
    width: 960px;
    z-index: 2;
}
#header
{    
    height: 102px;
    padding: 25px 0 0 0;
}
#header h1 
{ 
	height: 115px;
	width: 525px;
}
#header .logo
{ 
	float: left;
    /*left: -2px;*/
    /*position: absolute;*/
    /*top: -15px;*/
    width: 525px;
}

h1 { font-size: 2.2em; }


/* =Navigation Primary
----------------------------------------------*/
#header #facebook
{
position: absolute;
right: -363px;
top: 92px;
}

#header ul 
{ 
	float:right;	
	margin: 80px 0 0 20px;
}
#nav 
{ 
	float:right; 
}
#nav ul li 
{
    float: left;
    height: 47px;
    position: relative;	
	padding:0;
}
#nav  li a 
{
	display:block;	
}

#nav li.home a
{
	text-indent:-9999px;
	display:block;
	background:url("/images/home_off.png") no-repeat top left;
	width:73px;
	height:47px;
	margin-right:-5px;
}
#nav li.about a
{
	text-indent:-9999px;
	display:block;
	background:url("/images/about_off.png") no-repeat top left;
	width:80px;
	height:47px;
	margin-right:-10px;
}
#nav li.creations a
{
	text-indent:-9999px;
	display:block;
	background:url("/images/creations_off.png") no-repeat top left;
	width:107px;
	height:47px;
}
#nav li.contact a
{
	text-indent:-9999px;
	display:block;
	background:url("/images/contact_off.png") no-repeat top left;
	width:88px;
	height:47px;
}
#nav li.home a:hover,  #nav li.home a.active
{
	background:url("/images/home_over.png") no-repeat top left;
	width:73px;
	height:47px;
}
#nav li.about a:hover,#nav li.about a.active
{

	background:url("/images/about_over.png") no-repeat top left;
	width:80px;
	height:47px;
}
#nav li.creations a:hover,#nav li.creations a.active
{

	background:url("/images/creations_over.png") no-repeat top left;
	width:107px;
	height:47px;
}
#nav li.contact a:hover, #nav li.contact a.active
{
	background:url("/images/contact_over.png") no-repeat top left;
	width:88px;
	height:47px;
}

.content-area {
	margin: 0 auto;
    width: 960px;
	position: relative;
}

.about_bg
{
	margin-top:10px;
	background:url("/images/about_02.png") no-repeat top left;
	height: 614px;
	width: 957px;
	padding: 1em;
}

/*
LAYOUT: Three column home page
DESCRIPTION: three-column fixed layout
*/
.three_col_hp {
	width: 960px; 	
}

/*
LAYOUT: Two column interior page about page
DESCRIPTION: two-column fixed layout with left content container
*/



/*
LAYOUT: Two column interior page contact page 
DESCRIPTION: two-column fixed layout with left content container
*/



/* =Footer
-------------------------------------------------------------- */
#footer {
    /*padding: 8px 0;*/
	width: 960px; margin: 0 auto;
	clear: both;
}
#footer .site-map {
    float: left;
    height: 30px;
    margin: 10px 0 12px 0;
    width: 600px;
}
#footer .copyright {
    clear: both;
    font: 11px/20px Helvetica, "Helvetica-Neue", sans-serif;
    padding: 5px 0 0 10px;
    color: #efefef;
}
div.about_content { position:absolute; top:195px; left:25px; width:500px; }
.about_content h1 { margin: 46px 0 9px 0; background:url("/images/art.png") no-repeat top left; width:328px; height:50px; text-indent:-9999px; display:block; }
.about_content ul li { margin-bottom:15px; list-style-type: none; font-size: 1.4em; color:#343434; }
.about_content ul li div { padding-left: 38px;
padding-top: 2px; }
.about_content li.one { background:url("/images/1.png") no-repeat top left; margin-bottom:35px; list-style-type: none; font-size: 1.4em; }
.about_content li.two {background:url("/images/2.png") no-repeat top left; margin-bottom:15px; list-style-type: none; font-size: 1.4em;  }


div.contact_content { position:absolute; top:195px; left:340px; width:550px; margin-left: 15px;}
.contact_content h1 { margin-left:-18px; margin-top: 46px; margin-bottom: 15px; background:url("/images/contact.png") no-repeat top left; width:241px; height:50px; text-indent:-9999px; display:block; }
.contact_content p { font-size: 1.4em;color:#343434;  }
.contact_content form {   }

/* =Gallerific v3
--------------------------------------------------------------- */
div#gallery 
{
	margin-top: 15px; 
}
div.content {
	/* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
	display: none;
	float: left;
	width: 550px; 
}
div.content a, div.navigation a {
	text-decoration: none;
	color: #777;
}
div.content a:focus, div.content a:hover, div.content a:active {
	text-decoration: underline;
}
div.controls {
	margin-top: 5px;
	height: 23px;
}
div.controls a {
	padding: 5px;
}
div.ss-controls {
	float: left; display: none; /* hide for now */
}
div.nav-controls {
	float: right;
}
div.slideshow-container {
	position: relative;
	clear: both;
	height: 1024px; /* This should be set to be at least the height of the largest image in the slideshow */
}
div.loader {
	position: absolute;
	top: 0;
	left: 0;
	background-image: url('loader.gif');
	background-repeat: no-repeat;
	background-position: center;
	width: 550px;
	height: 1024px; /* This should be set to be at least the height of the largest image in the slideshow */
}
/*div#caption { 
clear:left;
	font-size:14px;
	color: #fff;
		position: absolute;
	top: 775px;
	right: -5px;
	width: 320px;
	color: #fff;
	font-size: 1.4em;
}*/
div#slideshow {
 	width: 550px;
}
div#slideshow span.image-wrapper {
	display: block;
	/*position: absolute;
	top: 180px;
	left: 0;*/
}
div#slideshow a.advance-link {
	display: block;
	width: 550px;
	height: 1024px; /* This should be set to be at least the height of the largest image in the slideshow */
	/*line-height: 1024px;  This should be set to be at least the height of the largest image in the slideshow */
	text-align: center;
}
div#slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {
	text-decoration: none;
}
div#slideshow img {
	vertical-align: middle;
	border: 1px solid #ccc;
}
div.download {
	float: right;
}
div.caption-container {
	position: relative;
	clear: left;
	height: 75px;
}
span.image-caption {
	display: block;
	/*position: absolute;*/
	/*width: 545px;*/
	clear: both;
	
			position: absolute;
	top: 775px;
	right: -5px;
	width: 320px;
	color: #fff;
	font-size:1.4em;
/*	top: 0;
	left: 0;*/
}
/*div.caption {
	position: absolute;
	top: 200px;
	right: -5px;
	width: 320px;	
}*/
div.image-title {
	font-weight: bold;
	font-size: 1.4em;
}
div.image-desc {
	line-height: 1.3em;
	padding-top: 12px;
}
div.navigation {
	/* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */
}
a.advance-link { /*display: none;*/ }
ul.thumbs, ul.images {
	clear: both;
	margin: 0;
	padding: 0;
}
ul.thumbs li , ul.images li{
	float: left;
	padding: 0;
	margin: 5px 25px 10px 0;
	list-style: none;
}
a.thumb, a.image {
	padding: 2px;
	display: block;
	border: 1px solid #ccc;
}
ul.thumbs li.selected a.thumb,ul.images li.selected a.image {
	background: #000;
}
a.thumb:focus , a.image:focus{
	outline: none;
}
ul.thumbs img , ul.images img{
	border: none;
	display: block;
}
div.pagination {
	
	clear: both;
}
div.navigation div.top {
	margin-bottom: 12px;
	height: 11px;
}
div.navigation div.bottom {
	margin-top: 12px;
}
div.pagination a {
color: #fff; text-decoration: none;	display: block;
	float: left;
	margin-right: 2px;
	padding: 4px 5px 2px 5px;
	border: 1px solid #000;
	font-weight:bold;
}
 div.pagination span.current, div.pagination span.ellipsis {
	display: block;
	float: left;
	margin-right: 2px;
	padding: 4px 7px 2px 7px;
	border: 1px solid #ccc;
}
div#thumbs .top  { display: none; }
div.pagination a:hover {
/*	background-color: #eee;*/
	border: 1px solid #eee;
	text-decoration: none;
}
div.pagination span.current {
	font-weight: bold;
	background-color: #000 !important;
	border-color: #000;
	color: #fff;
}
div.pagination span.ellipsis {
	border: none;
	padding: 5px 0 3px 2px;
}

div#thumbs { /*margin-left:650px; width: 320px;*/ position: absolute; top:219px; right:-5px; width: 320px; }


/*******************
CUSTOM FONTS 
*******************/
@font-face {
    font-family: 'my_underwoodregular';
    src: url('../fonts/myunderwood-webfont.eot');
    src: url('../fonts/myunderwood-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/myunderwood-webfont.woff') format('woff'),
         url('../fonts/myunderwood-webfont.ttf') format('truetype'),
         url('../fonts/myunderwood-webfont.svg#my_underwoodregular') format('svg');
    font-weight: normal;
    font-style: normal;    
}

.cf { 
	font-family: 'my_underwoodregular';
}

body { 
	font-family: 'my_underwoodregular';
}