/*reset*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0;}
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym,iframe { border:0; }
:focus { outline: 0; }
div.clearer {clear: both;}

/*elements that use layout sprite image*/
div#header h1 a, a#navInteractive, a#navPrint, a#navFineArt, a#navPhotography, a#navBio, a#navContact, a#previousArrow, a#nextArrow, a#viewLess, a#viewMore, div#viewlabel{
	background-image: url(../images/layout/layoutSprite.gif);
}

body{
	font-family: Arial, Helvetica, sans-serif;
}

strong{
	font-weight: bold;
}

/*header*/
div#header{
	width: 912px;
	margin: 0px auto;
	height: 84px;
	position: relative;
}
div#header h1{
	position: absolute;
	top: 26px;
}
div#header h1 a{
	display: block;
	text-indent: -99999em;
	width: 361px;
	height: 22px;
}
div#header div#portfolioNav, div#header div#mainNav{
	position: absolute;
	top: 37px;
	left: 413px;
}
div#header div#mainNav{
	left:  786px;
}
div#header div#portfolioNav ul li, div#header div#mainNav ul li{
	position: relative;
	float: left;
}
div#header div#portfolioNav ul li a , div#header div#mainNav ul li a{
	display: block;
	text-indent: -99999em;
	height: 11px;
	margin-right: 21px;
}
div#header div#portfolioNav ul li ul{
	display: none;
	position: absolute;
	top: 20px;
	width: 260px;
}
div#header div#portfolioNav ul li ul li a{
	font-size: 9px;
	line-height: 9px;
	text-decoration: none;
	color: #9f9f9f;
	text-indent: 0em;	
	margin-right: 8px;
}
div#header div#portfolioNav ul li ul li.active a, div#header div#portfolioNav ul li ul li.active a:hover{
	color: #cc0000;
}
div#header div#portfolioNav ul li ul li a:hover{
	color: #000000;
}
div#header div#portfolioNav ul li.active ul{
	display: block;
}
a#navInteractive{
	width: 82px;
	background-position: 0px -33px;
}
a#navInteractive:hover
{
	background-position: 0px -44px;
}
li.active a#navInteractive{
	background-position: 0px -22px;
}
a#navPrint{
	width: 37px;
	background-position: -82px -33px;
}
a#navPrint:hover
{
	background-position: -82px -44px;
}
li.active a#navPrint{
	background-position: -82px -22px;
}
a#navFineArt{
	width: 56px;
	background-position: -119px -33px;
}
a#navFineArt:hover
{
	background-position: -119px -44px;
}
li.active a#navFineArt{
	background-position: -119px -22px;
}
a#navPhotography{
	width: 101px;
	background-position: -175px -33px;
}
a#navPhotography:hover
{
	background-position: -175px -44px;
}
li.active a#navPhotography{
	background-position: -175px -22px;
}
a#navBio{
	margin-right: 17px!important;
	width: 23px;
	background-position: -276px -33px;
}
a#navBlog
{
	background-image: url(../images/layout/blog.gif);
	width: 35px;
	background-position: 0px -11px;
}
a#navBlog:hover
{
	background-position: 0px -22px;
}
a#navBio:hover
{
	background-position: -276px -44px;
}
li.active a#navBio{
	background-position: -276px -22px;
}
a#navContact{
	margin-right: 0px!important;
	width: 64px;
	background-position: -299px -33px;
}
a#navContact:hover
{
	background-position: -299px -44px;
}
li.active a#navContact{
	background-position: -299px -22px;
}

/*content*/
div#content{
	width: 982px;
	margin: 0px auto;
	height: 527px;
	position: relative;
}
div#content div#projectView{
	height: 445px;
}
div#content div#projectView div#imageContainer{
	height: 443px;
	width: 886px;
	border: 1px solid #e2dede;
	overflow: hidden;
	position: absolute;
	top: 0px;
	left: 48px;
}
div#content div#projectView div#imageContainer div#mainProject{
  position: absolute;
  height: 443px;
	width: 886px;
}
div#content div#projectView div#imageContainer div#secondaryProject{
  position: absolute;
  height: 443px;
	width: 886px;
}
div#content div#projectView div#imageContainer img{
	position: absolute;
}
div#content div#projectView div#imageContainer div#projectDetails{
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 850px;
	z-index: 2;
	background-image: url(../images/layout/detailsPanelBg.png);
	border-top: 1px solid #e2dede;
	background-position: bottom left;
	font-size: 12px;
	color: #fff;
	line-height: 17px;
	letter-spacing: 1px;
	padding: 18px;
}
div#content div#projectView div#imageContainer div#projectDetails a {
	color: #b0abf4;
	text-decoration: none;
	font-weight: bold;
}

div#content div#projectTitles{
	padding: 20px 0px 0px 48px;
}
div#content div#projectTitles h2{
	display: inline;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #444343;
}
div#content div#projectTitles{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #444343;
}
div#content div#projectTitles a{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #660000;
	text-transform: uppercase;
	text-decoration: none;
}
a#previousArrow, a#nextArrow{
	position: absolute;
	height: 22px;
	width: 12px;
	display: block;
	text-indent: -99999em;
	top: 185px;
}
a#previousArrow{
	background-position: -375px 0px;
	left: 19px;
}
a#nextArrow{
	background-position: -377px -12px;
	right: 19px;
}

a#previousArrow:hover{
	background-position: -363px 0px;
}
a#nextArrow:hover{
	background-position: -365px -12px;
}

a#previousArrow.inactive{
	background-position: -387px 0px;
	cursor: default;
}
a#nextArrow.inactive{
	background-position: -389px -12px;
	cursor: default;
}

/*footer*/
div#footer{
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 18px;
	background-image: url(../images/layout/footerBg.gif);
}
div#footer div#footerContents{
	width: 886px;
	margin: 0px auto;
}
div#footer div#footerContents div{
	margin-top: 2px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px;
	color: #666;
	position: relative;
	float: left;
}
div#footer div#footerContents a{
	text-decoration: none;
	color: #8b3e3e;
}
div#footer div#footerContents div.contact{
	padding-left: 27px;
}

div#content div#projectView div#viewSelector{
	position: absolute;
	left: 950px;
	top:  240px;
}
div#content div#projectView div#viewSelector a#viewMore{
	position: absolute;
	text-indent: -99999em;
	width: 13px;
	height: 13px;
	background-position: -401px 0px;
	top: 0px;
	left: 0px;
	font-size: 0px;
	line-height: 0px;
}
div#content div#projectView div#viewSelector a#viewLess{
	position: absolute;
	text-indent: -99999em;
	width: 13px;
	height: 13px;
	background-position: -401px -13px;
	top: 20px;
	left: 0px;
}
div#content div#projectView div#viewSelector a#viewMore:hover
{
	background-position: -413px -0px;
}
div#content div#projectView div#viewSelector a#viewLess:hover
{
	background-position: -413px -13px;
}
div#content div#projectView div#viewSelector div#viewRule{
	position: absolute;
	text-indent: -99999em;
	font-size: 0px;
	line-height: 0px;
	height: 60px;
	width: 1px;
	background-color: #e2dede;
	top: 0px;
	left: 17px;
}
div#content div#projectView div#viewSelector div#viewlabel{
	position: absolute;
	text-indent: -99999em;
	font-size: 0px;
	line-height: 0px;
	height: 35px;
	width: 8px;
	background-position: -438px 0px;
	top: 1px;
	left: 25px;
}

div#content div#projectView div#bioContainer{
	padding: 101px 131px 0px 157px;
	height: 342px;
	width: 597px;
	border: 1px solid #e2dede;
	overflow: hidden;
	position: absolute;
	top: 0px;
	left: 48px;
	font-size: 13px;
	line-height: 20px;
	color: #666666;
	background-image: url(../images/layout/bio.gif);
}

div#content div#projectView div#contactContainer{
	padding: 194px 0px 0px 235px;
	height: 249px;
	width: 651px;
	border: 1px solid #e2dede;
	overflow: hidden;
	position: absolute;
	top: 0px;
	left: 48px;
	font-size: 13px;
	line-height: 20px;
	color: #666666;
	/*background-image: url(../images/layout/contact.gif);*/
}
div#content div#projectView div#contactContainer a{
	text-decoration: underline;
	color: #666666;
}