/* WOLFINGER SITE STYLE */

* {
	margin: 0;
	padding: 0;
}

body {
	font-size: 62.5%;
	font-family: Helvetica, sans-serif;

	background-color: #ffffff;
}

p {
	font-size: 1.3em;
	line-height: 1.4em;
	margin-bottom: 0.8em;
}

a { color: #999999; text-decoration: none; }
a:hover, a:active { color: #333333 }

h1 { font-size: 3.0em; margin-bottom: 0.8em; }
h2 { font-size: 2.0em; text-transform: uppercase; margin-bottom: 0.8em; }
h3 {
	font-size: 1.6em;
	text-transform: uppercase;
	font-style: italic;
	letter-spacing: 2px;
	background: #eaefe7;
	color: #eaefe7;
	padding: 5px;
	margin-bottom: 0.5em;
	text-align: center;
}

.clear { clear: both; }



#artwork{
	width: 760px;
	display: block;
}

#client{
	width: 760px;
	height: 500px;
	display: block;

}

#info{
	padding: 4px;
	height: 10px;
	width: 756px;
	display: block;
	float: right;
	text-align: left;
}


/* SIDE NAVIGATION */

#container{
	height: 510px;
	width: 120px;
	overflow: hidden;
	display: block;
	float: top-left;
}

#title{
	height: 32px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/title.gif) top left no-repeat;
	display: block;
}

#title-over{
	height: 32px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/title.gif) -120px; no-repeat;
	display: block;

}

#title:hover{

background-position:-120px top;;

}

#empty{
	height: 8px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	display: block;

}

#portraiture{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/portraiture.gif) top left no-repeat;
	display: block;

}
#portraiture-over{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/portraiture.gif) bottom right; no-repeat;
	display: block;

}

#portraiture:hover{

background-position:-120px top;

}

#wedding{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/wedding.gif) top left no-repeat;
	display: block;

}
#wedding-over{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/wedding.gif) bottom right; no-repeat;
	display: block;

}

#wedding:hover{

background-position:-120px top;

}

#food{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/food.gif) top left no-repeat;
	display: block;

}
#food-over{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/food.gif) bottom right; no-repeat;
	display: block;

}

#food:hover{

background-position:-120px top;

}

#travel{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/travel.gif) top left no-repeat;
	display: block;

}
#travel-over{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/travel.gif) bottom right; no-repeat;
	display: block;

}

#travel:hover{

background-position:-120px top;

}

#places{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/travel.gif) top left no-repeat;
	display: block;

}
#places-over{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/travel.gif) bottom right; no-repeat;
	display: block;

}

#places:hover{

background-position:-120px top;

}

#wine{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/wine.gif) top left no-repeat;
	display: block;

}
#wine-over{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/wine.gif) bottom right; no-repeat;
	display: block;

}

#wine:hover{

background-position:-120px top;

}

#projects {
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/projects.gif) top left no-repeat;
	display: block;

}
#projects-over{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/projects.gif) bottom right; no-repeat;
	display: block;
}

#projects:hover{

background-position:-120px top;

}

#clients {
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/clients.gif) top left no-repeat;
	display: block;

}
#clients-over{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/clients.gif) bottom right; no-repeat;
	display: block;
}

#clients:hover{

background-position:-120px top;

}


#blog {
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/blog.gif) top left no-repeat;
	display: block;

}
#blog-over{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/blog.gif) bottom right; no-repeat;
	display: block;

}

#blog:hover{

background-position:-120px top;

}

#about {
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/about.gif) top left no-repeat;
	display: block;

}
#about-over{
	height: 19px;
	width: 120px;
	text-indent: 10000px;
	overflow: hidden;
	background: url(images/about.gif) bottom right; no-repeat;
	display: block;

}

#about:hover{

background-position:-120px top;

}


/* THUMBNAIL NAVIGATION  */

#thumbnails{
	height: 240px;
	width: 120px;
	display: block;
}


#page_contain{
	margin: 0 auto;
	height: 510px;
	width: 900px;
	display: block;
	text-align: center;
	z-index:-15;
}

#arrows{
	padding: 4px;
	height: 19px;
	width: 115px;
	background: url(images/space.gif) top left no-repeat;
	display: block;
	text-align: left;
}