/* 
Screen.css for www.dhornbein.com
by: Drew Hornbein
www.dhornbein.com
November 12, 2008

Drop me a line
*/

img {border:none;}
a {color:#777;}
a:hover {color: #f89a1c;}

body {
	background-color:white;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
}

h1,h2,h3,h4,h5 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; text-transform:uppercase;}



#wrapper {
	margin: 0 auto;
	text-align: left;
	width: 900px;
}

#nav {
	background-color:white;
	height:50px;
	padding-left:133px;
}



#nav li{
display:inline;
list-style:none;
}

#nav li a {
display:inline;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
line-height:50px;
padding-right:20px;
text-decoration:none;
text-transform:uppercase;
}

#nav .nav_btn a {
font-size:2em;
}

#nav .sub_btn a {
font-size:1.25em;
}

#nav li a:hover {color:#f89a1c;}

#nav .active a, #nav .active a:hover{
	color:black;
	cursor: default;
	font-size:2em;
}

#nav .sub_active a, #nav .sub_active a:hover{
	color:black;
	cursor: default;
	font-size:1.25em;
}
/*
#portfolio a {background: transparent url(../i/nav_portfolio.jpg) no-repeat left top;}
#portfolio a:hover {background: transparent url(../i/nav_portfolio.jpg) no-repeat left center;}
#portfolio {background: transparent url(../i/nav_portfolio.jpg) no-repeat left bottom;}

#digital a {background: transparent url(../i/nav_digital.jpg) no-repeat left top;}
#digital a:hover {background: transparent url(../i/nav_digital.jpg) no-repeat left center;}
#digital {background: transparent url(../i/nav_digital.jpg) no-repeat left bottom;}

#web a {background: transparent url(../i/nav_web.jpg) no-repeat left top;}
#web a:hover {background: transparent url(../i/nav_web.jpg) no-repeat left center;}
#web {background: transparent url(../i/nav_web.jpg) no-repeat left bottom;}

#art a {background: transparent url(../i/nav_art.jpg) no-repeat left top;}
#art a:hover {background: transparent url(../i/nav_art.jpg) no-repeat left center;}
#art {background: transparent url(../i/nav_art.jpg) no-repeat left bottom;}

#contact a {background: transparent url(../i/nav_contact.jpg) no-repeat left top;}
#contact a:hover {background: transparent url(../i/nav_contact.jpg) no-repeat left center;}
#contact {background: transparent url(../i/nav_contact.jpg) no-repeat left bottom;}
*/
#content {
background:#fff url(../i/body_background.jpg) no-repeat top center;
clear:both;
height:600px;
padding-top:25px;
text-align:center;
}


/************* CONNECT ******************/

#connect {cursor: context-menu;}

#contact_box {
background:white;
color:#ab6a13;
padding:10px 10px 10px 200px;
text-align:left;
}

#contact_box h1 {
color:black;
display: inline;
font-size:1.25em;
}

#contact_box h1 a {color: black;text-decoration: none;}
#contact_box h1 a:hover {color:#f89a1c;}

#contact_box .and {
color:#aaa;
font-family:Times New Roman;
font-style:italic;
font-size:1em;
font-weight:normal;
text-transform: lowercase;
}

.aboutme {
}

.aboutme span{
font-size:0.825em;
line-height:1.3em;
width:15em;
}

.aboutme img {
padding:0 5px;
}

#twitter {
}

#twitter_update_list,#twitter_update_list li {
display: inline
}

#twitter_update_list span {font-size: 0.85em;}
#twitter_update_list li a {color:#ccc;}

/***************TRAY************/
.tray {
background: transparent url(../i/strap_background.png) no-repeat top center;
clear:both;
height:150px;
padding: 0 0 50px;
}

/*****Featured work*****/

#feature {
padding:0 0 25px;
}

#feature .picture {
}

#feature .info {
margin:0 0 10px 150px;
overflow:hidden;
width:600px;
}

#feature .info p {
background:#000000;
color:white;
font-size:0.875em;
padding:10px;
text-align:right;
}

#feature_picture {
background:transparent url(../i/featured.png) no-repeat left center;
}

#feature_picture img {
background-color:#CCCCCC;
border:3px solid #EEEEEE;
padding:1px;
}

/*****Straps*****/

.cat_1,.cat_2,.cat_3 {
display:block;
float:left;
height:150px;
width:7%;
}

.cat_1 {
background: transparent url(../i/strap_digital.gif) no-repeat top left;
}

.cat_2 {
background: transparent url(../i/strap_web.gif) no-repeat top left;
}

.cat_3 {
background: transparent url(../i/strap_art.gif) no-repeat top left;
}

.tray .picture {
padding-top:20px;
float:left;
width:73%;
}

.tray .picture img {
background-color:#CCCCCC;
border:3px solid #EEEEEE;
padding:1px;
}

.tray .info {
height:150px;
float:left;
width:20%;
}

.tray .info p {
color:#777;
font-family:Arial, Helvetica, sans-serif;
font-size:0.875em;
padding:20px 5px 10px;
text-align:left;
}

#footer {
clear:both;
color:#aaa;
padding:25px;
font-size:0.825em;
text-align:center;
}