/* this css is for gratitude */
/* color uses
text body #e6bd73 e7c28b
active nav #e69673
visited nav #f18353
selected/hover #e75e22 
*/

body{
	background-color: #000000;
    margin: 0px 0px 0px 0px;
}

html {
    scrollbar-base-color: #000000;
	scrollbar-track-color: #313131;
	scrollbar-face-color: #000000;
	scrollbar-highlight-color: #383838;
	scrollbar-3dlight-color: #383838;
	scrollbar-darkshadow-color: #000000;
	scrollbar-shadow-color: #343434;
	scrollbar-arrow-color: #e6bd73;
}

/* this determins the font behavior of the whole site */
p, div, blockquote, dl, ul, ol, {    
	font-family: Verdana;
	font-size: 12px;
    font-weight: normal;
    text-decoration: none;
	vertical-align: top;
}

a img {border: none; } 

.content {
	font-family: Verdana;
	font-size: 12px;
    color: #e7c28b;
    font-weight: normal;
    text-decoration: none;	
    padding: 13px 20px 13px 13px;
    vertical-align: top;
    align: left;
}

.split {
	font-family: Verdana;
	font-size: 12px;
    color: #e7c28b;
    font-weight: normal;
    text-decoration: none;
    padding: 10px;
    vertical-align: top;
    align: left;
}

h1 {
	font-family: Verdana;
	font-size: 14px;
    font-weight: bold;
    color: #e7c28b;
    text-decoration: none;	
}

h3 {
	font-family: Verdana;
	font-size: 12px;
    font-weight: normal;
    color: #e7c28b;
    text-decoration: none;	
}

.album {
    padding: 10px;
}

div.gall {
    border: 6px double #ffffff;
    padding: 10px;
    width: 220px;
}

.sample td {
	font-family: Verdana;
	font-size: 12px;
    color: #714f1b;
	font-weight: bold;
    padding-top: 30px;
    text-align: center;
}


/* Roll Over Navigation Buttons */

.rollover1 a {
display:block;
width: 250px;
padding:20px 10px 20px 7px;
background: url("images/home-lg.jpg") 0 0 no-repeat;
text-decoration: none;
}
.rollover1 a:hover { 
background-position: 0 -63px;
}
.rollover1 a:active {
background-position: 0 -126px;
}

.rollover2 a {
display:block;
width: 250px;
padding:20px 10px 20px 7px;
background: url("images/beads-lg.jpg") 0 0 no-repeat;
text-decoration: none;
}
.rollover2 a:hover { 
background-position: 0 -63px;
}
.rollover2 a:active {
background-position: 0 -126px;
}

.rollover3 a {
display:block;
width: 250px;
padding:20px 10px 20px 7px;
background: url("images/me-lg.jpg") 0 0 no-repeat;
text-decoration: none;
}
.rollover3 a:hover { 
background-position: 0 -63px;
}
.rollover3 a:active {
background-position: 0 -126px;
}

.rollover4 a {
display:block;
width: 250px;
padding:20px 10px 20px 7px;
background: url("images/studio-lg.jpg") 0 0 no-repeat;
text-decoration: none;
}
.rollover4 a:hover { 
background-position: 0 -63px;
}
.rollover4 a:active {
background-position: 0 -126px;
}

.rollover5 a {
display:block;
width: 250px;
padding:20px 10px 20px 7px;
background: url("images/shop-lg.jpg") 0 0 no-repeat;
text-decoration: none;
}
.rollover5 a:hover { 
background-position: 0 -63px;
}
.rollover5 a:active {
background-position: 0 -126px;
}

.rollover6 a {
display:block;
width: 250px;
padding:20px 10px 20px 7px;
background: url("images/contact-lg.jpg") 0 0 no-repeat;
text-decoration: none;
}
.rollover6 a:hover { 
background-position: 0 -63px;
}
.rollover6 a:active {
background-position: 0 -126px;
}

.rollover7 a {
display:block;
width: 250px;
padding:20px 10px 20px 7px;
background: url("images/blog-lg.jpg") 0 0 no-repeat;
text-decoration: none;
}
.rollover7 a:hover { 
background-position: 0 -63px;
}
.rollover7 a:active {
background-position: 0 -126px;
}

/* end Roll Over Navigation Buttons */

.mapsection {
	font-family: Verdana;
	font-size: 14px;
    font-weight: bold;
    color: #e7c28b;
    text-decoration: none;	
}
    
.footc {
	font-family: Verdana;
	font-size: 10px;
    text-decoration: none;    
    color: #e7c28b;
    vertical-align: top;
    padding: 5px;
} 
.footc a:link {
	font-family: Verdana;
	font-size: 10px;
    text-decoration: none;
    color: #f18353;
    font-weight: normal;
    padding: 1x;
} 

.footc a:visited {
	font-family: Verdana;
	font-size: 10px;
    text-decoration: none;
    color: #f18353;
    font-weight: normal;
    padding: 1px;
} 

.footc a:hover {
	font-family: Verdana;
	font-size: 10px;
    text-decoration: none;
    color: #e75e22;
    font-weight: normal;
    padding: 1px;
}

.footc a:active {
	font-family: Verdana;
	font-size: 10px;
    text-decoration: none;
    color: #e69673;
    font-weight: normal;
    padding: 1px;
}

/* Site Map */

.footb {
	font-family: Verdana;
	font-size: 12px;
    text-decoration: none;    
    color: #e7c28b;
    vertical-align: top;
    text-align: top;
    padding: 5px;
} 
.footb a:link {
	font-family: Verdana;
	font-size: 12px;
    text-decoration: none;
    color: #f18353;
    font-weight: normal;
    padding: 1x;
} 

.footb a:visited {
	font-family: Verdana;
	font-size: 12px;
    text-decoration: none;
    color: #f18353;
    font-weight: normal;
    padding: 1px;
} 

.footb a:hover {
	font-family: Verdana;
	font-size: 12px;
    text-decoration: none;
    color: #e75e22;
    font-weight: normal;
    padding: 1px;
}

.footb a:active {
	font-family: Verdana;
	font-size: 12px;
    text-decoration: none;
    color: #e69673;
    font-weight: normal;
    padding: 1px;
}


/* Lightbox CSS */

#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: 1px silver; }

#outerImageContainer{
    border: 1px solid #fff;
	position: relative;
	background-color: #000;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 15px Verdana, Helvetica, sans-serif;
    color: #000;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{
	padding:0 10px;
	}
#imageData #imageDetails{ width: 90%; text-align: center; }	
#imageData #caption{ font: 15px Verdana; font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=40);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}