@charset "utf-8";


/*.external-link{
padding-right:7px;
background-image:url(../imgs/external-link.png);
background-repeat:no-repeat;
background-position:right top;
}*/


.djd-logo{
width:23px;
height:23px;
float:left;
padding:3px 0px 0px 5px;
}


body{
	font-family: Georgia, serif;
	width:100%;
	font-size:13px;
	line-height:1.23em;
	background-image:url(../imgs/header-bg-4.jpg);
	background-repeat:no-repeat;
	background-position:100px 0px;
}

.sub-bg-t{
float:left;
width:160px;
height:15px;
background-image:url(../imgs/sub-bg.png);
}

.sub-bg-b{
float:left;
width:160px;
height:21px;
background-image:url(../imgs/sub-bg.png);
background-position:0px -15px;
}

.taper{
float:left;
/*margin-top:5px;*/
width:160px;
height:28px;
}

.number{
width:48px;
height:48px;
position:absolute;
margin:20px 0px 0px 970px;
}

.close a{
float:right;
clear:both;
height:20px;
width:20px;
margin:-45px 12px 0px 0px;
background-image:url(../imgs/close-alt.png);
}

.close a:hover{
background-position: left -20px;
}



.project-index{
width:112px;
height:18px;
position:absolute;
background-image:url(../imgs/tab_project-index.png);
margin:-17px 0px 0px 650px;
}


.go-top a{
margin:0px 0px -10px 0px;
clear:both;
float:right;
width:99px;
height:18px;
background-image:url(../imgs/backtotop.png);
}

.go-top a:hover{
background-position:0px -18px;
}

.more-work a{
float:right;
height:40px;
width:40px;
margin:10px 0px 15px 0px;
background-image:url(../imgs/morework.png);
}

.more-work a:hover{
background-position: left -40px;
}

.read-more a{
float:left;
height:40px;
width:40px;
margin:10px 5px 15px 0px;
background-image:url(../imgs/readmore.png);
}

.read-more a:hover{
background-position: left -40px;
}

.gallery a{
float:left;
height:45px;
width:45px;
margin:10px 0px 15px 0px;
background-image:url(../imgs/gallery.png);
}

.gallery a:hover{
background-position: left -45px;
}

.flickr a{
float:left;
height:40px;
width:40px;
margin:10px 0px 15px 5px;
background-image:url(../imgs/flickr.png);
}

.flickr a:hover{
background-position: left -40px;
}


.view-more a{
float:left;
height:40px;
width:40px;
margin:10px 0px 15px 0px;
background-image:url(../imgs/viewmore.png);
}

.view-more a:hover{
background-position: left -40px;
}


.nav, #sub-nav li{
padding-top:5px;
}

.column-s img{
margin-top:40px;
}


#tab-illustration{
float:left;
width:87px;
height:35px;
margin-left:230px;
background-image:url(../imgs/tab_illustration.png);
}

#tab-design{
float:left;
width:60px;
height:35px;
margin-left:5px;
background-image:url(../imgs/tab_design.png);
}


global-nav-holder li{

}

ul.global-nav-holder a {
	text-indent: -99999px;
	height:35px;
}

ul.global-nav-holder a:hover {
	background-position: left -35px;
}

ul.global-nav-holder li.tab-illustration a {
margin-right:7px;
float:left;
width:87px;
height:35px;
background-image:url(../imgs/tab_illustration.png);
}
ul.global-nav-holder li.tab-design a {
float:left;
width:60px;
height:35px;
background-image:url(../imgs/tab_design.png);
}
ul.global-nav-holder li.tab-blog a {
float:right;
width:46px;
height:35px;
background-image:url(../imgs/tab_blog.png);
}



#read li.tab-blog a, #illustration li.tab-illustration a, #design li.tab-design a, #webdesign li.tab-design a, #motion li.tab-design a, #print li.tab-design a, #onlinemedia li.tab-design a {
	background-position: left -70px;
}






#global-nav{
height:30px;
color:#fff;
background-color:#000000;
}


#gnh{
width:1000px;
margin:0px auto;
height:35px;
}

ul.global-nav-holder{	
/*padding-top:6px;*/
float:right;
width:770px;
height:35px;
/*font-size:11px;*/
}

#wrap{
width:1000px;
margin:0px auto;
}

#signiture{
float:left;
margin:30px 0px 30px 0px;
}

#main-column{
margin:40px 0px 100px 0px;
float:right;
width:1000px;
}

#main-column-alt{
margin:40px 0px 100px 0px;
float:right;
width:770px;
}

.media{
float:right;
background-color:#cccccc;
margin-bottom:25px;
}

.project-info{
width:160px;
float:left;
}

.project-info-lrg{
position:absolute;
float:left;
width:160px;
}

.txt-bg-white{
background-color:#fff;

border-bottom:solid 3px #fff;
} 

.project{
width:1000px;
float:left;
margin-bottom:35px;
}



#header{
float:right;
width:770px;

}

.section{
vertical-align:-10%;
margin-right:15px;
}

.headernav{
	float:left;
	width:770px;
	font-size:5.8em;
	line-height:1.1em;
	margin:100px 0px 20px 0px;
	font-style:italic;
}

.headernav a:link {
	color: #3a3a3a;
	text-decoration:none;
	font-weight:regular;
}
.headernav a:visited {
	color: #3a3a3a;
	text-decoration:none;
	font-weight:regular;
}
.headernav a:hover {
	color: #1c1c1c;
	text-decoration:none;
	font-weight:regular;
}
.headernav a:active {
	color: #3a3a3a;
	text-decoration:none;
	font-weight:regular;
}

.headernav ul, .headernav li{
display:inline;
	color: #3a3a3a;
}


.linebreak{
	border-top:1px solid #c6c6c6;
	margin: 8px 0px 8px 0px;
	clear:both;
}

.linebreak-alt{
width:770px;

	border-top:1px solid #c6c6c6;
	margin: 8px 0px 8px 0px;
	clear:both;
}


/* 3. Typography */

h2{
	font-size:32px;
	font-style:italic;
	line-height:34px;
	margin:15px 0px 15px 0px;
	color: #686868;
}

h3{
	font-size:22px;
	line-height:1.1em;
	font-weight:bold;
	font-style:none;
	color: #414141;
	margin-bottom:5px;
}

h4{
	font-size:16px;
	line-height:1.23em;
	font-style:italic;
	color: #414141;
	margin-bottom:15px;
}

h5{
	font-size:16px;
	line-height:1.23em;
	font-style:italic;
	font-weight:bold;
	color: #414141;
	margin-bottom:15px;
}

p{	
	font-size:13px;
	line-height:1.4em;
	color: #414141;
	padding-bottom:5px;
}




.more-info{
margin:15px 0px 15px 0px;
float:left;
width:1000px;
display:none;
}

.article{
width:770px;
float:right;
margin-bottom:25px;
}

.more-alt{
width:770px;
float:right;
display:none;
}

.supp-info{
margin:15px 0px 15px 0px;
float:left;
width:770px;
}


.supp-info-alt{
margin:35px 0px 15px 0px;
float:right;
width:770px;
}

#emailform{
width:770px;
margin:40px 0px 100px 0px;
float:right;
}









/*.label{
width:103px;
height:103px;
position:absolute;
margin:-92px 0px 0px -14px;
}*/

.label{
width:85px;
height:85px;
position:absolute;
margin:-74px 0px 0px -11px;
}

.column-l li{
display:inline;
margin-right:5px;
}

.column-l {
	width:360px;
	margin:0px 50px 50px 0px;
	float:right;
}
.column-r {
	width:360px;
	margin:0px 0px 50px 0px;
	float:right;
}

.column-s {
	width:160px;
	margin:0px 0px 50px 0px;
	float:left;
	font-style:italic;
}

.column-s img{
padding-bottom:8px;
}

/* --- Left Column --- */

#leftcolumn{
position:absolute;
/*float:left;*/
width:160px;
/*background-color:#212121;*/
}

#logo{
width:42px;
height:29px;
background-color:#212121;
padding:40px 98px 60px 20px;
}


.credits{
margin-bottom:15px;
}

.credits li{
padding-top:5px;
color:#acacac;
font-style:italic;
}



.nav-id{
margin-left:26px;
margin-right:12px;
line-height:1.6em;
color:#6b6b6b;


}



.sub-id{
color:#6b6b6b;
font-style:italic;
margin-left:10px;
padding-right:5px;
vertical-align:25%;
}

#sub-nav{
float:left;
font-size:12px;
width:160px;
}





#sub-nav ul{
float:left;
width:130px;
margin-left:15px;
background-color:#373737;
}



#sub-nav li a:link {
	color: #b6b6b6;
	text-decoration:none;
	font-weight:regular;
}
#sub-nav li a:visited {
	color: #b6b6b6;
	text-decoration:none;
	font-weight:regular;
}
#sub-nav li a:hover {
	color: #fff;
	text-decoration:none;
	font-weight:regular;
	/*background-color:#373737;*/
}
#sub-nav li a:active {
	color: #b6b6b6;
	text-decoration:none;
	font-weight:regular;
}

































ul.nav {
	float: left;
	width: 160px;
	background-color:#212121;
}
ul.nav li {
	float: left;
}

/*--CSS Sprites - Default State--*/
ul.nav a {
	float: left;
	display: block;
	height: 24px;
	/*text-indent: 26px;*/
	background-position: left top;
}

ul.nav li a {
position:abosolute;
	background-image: url(../imgs/nav-item-bg.gif);
	width: 160px;
}


ul.nav li a:hover {
	background-image: url(../imgs/nav-item-bg.gif);
	width: 160px;
	background-position: left -24px;
}




#design li.design a, #about li.about a, #contact li.contact a, #read li.read a, #see li.see a{
	background-position: left -24px;
}

#design li.overview a, #webdesign li.webdesign a, #illustration li.illustration a, #motion li.motion a, #print li.print a, #onlinemedia li.onlinemedia a {
	color: #fff;
}

#webdesign li.design a, #illustration li.design a, #motion li.design a, #print li.design a, #onlinemedia li.design a {
	background-position: left -24px;
}



/* -- Link Styles -- */

#leftcolumn a {
	color: #fff;
	text-decoration:none;
	font-size:1em;
	font-weight:normal;
	font-style:italic;
}
#leftcolumn a:visited {
	color: #fff;
	text-decoration:none;
	font-size:1em;
	font-weight:normal;
	font-style:italic;
}
#leftcolumn a:hover {
	color: #fff;
	text-decoration:none;
	font-size:1em;
	font-weight:normal;
	font-style:italic;
}
#leftcolumn a:active {
	color: #fff;
	text-decoration:none;
	font-size:1em;
	font-weight:normal;
	font-style:italic;
}

ul.credits li a {
color:#acacac;
text-decoration:none;
border-bottom:dotted 1px #dadada;
}
ul.credits li a:visited {
color:#acacac;
text-decoration:none;
}
ul.credits li a:hover {
color:#4b4b4b;
text-decoration:none;
border-bottom:dotted 1px #4b4b4b;
}
ul.credits li a:active {
color:#acacac;
text-decoration:none;
}

.column-r a {
font-weight:bold;
color:#9d7e39;
text-decoration:none;
border-bottom:dotted 1px #9d7e39;
}
.column-r a:visited {
font-weight:bold;
color:#9d7e39;
text-decoration:none;
}
.column-r a:hover {
color:#2f2f2f;
font-weight:bold;
text-decoration:none;
border-bottom:dotted 1px #2f2f2f;
}
.column-r a:active {
font-weight:bold;
color:#9d7e39;
text-decoration:none;
}

.column-l a {
font-weight:bold;
color:#9d7e39;
text-decoration:none;
border-bottom:dotted 1px #9d7e39;
}
.column-l a:visited {
font-weight:bold;
color:#9d7e39;
text-decoration:none;
}
.column-l a:hover {
color:#2f2f2f;
font-weight:bold;
text-decoration:none;
border-bottom:dotted 1px #2f2f2f;
}
.column-l a:active {
font-weight:bold;
color:#9d7e39;
text-decoration:none;
}

.title{
color:#9d7e39;
height:18px;
position:absolute;
margin-top:-30px;
font-size:16px;
font-weight:bold;
text-align:right;
font-style:italic;
}

.title a{
background-image:url(../imgs/sml_circle-rollover.png);
background-repeat:no-repeat;
background-position:right top;
padding-right:5px;
}

.title a:hover{
background-position:right -18px;
}

.page-index{
float:right;
margin:35px 25px 20px 0px;
text-align:right;
font-style:italic;
}



.index-id{
font-size:13px;
vertical-align:5%;
color:#ffffff;
padding-left:5px;
font-weight:normal;
}

.page-index-split{
position:absolute;
margin:-8px 0px 0px 385px;
height:148px;
width:1px;
border-left:solid 1px #c6c6c6;
}

.page-index-l{
float:left;
margin:40px 0px 20px 20px;
}

.page-index-r{
float:right;
margin:40px 20px 0px 30px;
}

.page-index-l a, .page-index-r a {
color:#414141;
text-decoration:none;
/*border-bottom:dotted 1px #9d7e39;*/
}
.page-index-l a:visited, .page-index-r a:visited {
color:#414141;
text-decoration:none;
}
.page-index-l a:hover, .page-index-r a:hover {
color:#000000;
text-decoration:none;
/*border-bottom:dotted 1px #2f2f2f;*/
}
.page-index-l  a:active, .page-index-r a:active {
color:#414141;
text-decoration:none;
}

.flt-l{
float:left;
}

.flt-r{
float:right;
}

.bullet{
float:left;
margin-top:2px;
}

.gold a {
color:#9d7e39;
font-weight:bold;
text-decoration:none;
/*border-bottom:dotted 1px #9d7e39;*/
}
.gold a:visited {
color:#9d7e39;
text-decoration:none;
}
.gold a:hover {
color:#000000;
text-decoration:none;
/*border-bottom:dotted 1px #2f2f2f;*/
}
.gold a:active {
color:#9d7e39;
text-decoration:none;
}