/*@group reset*/

/*-------------------------
	Common Styles
---------------------------*/

body { 
	margin:0;
	padding:0;
	background: black url(images/bg.jpg) no-repeat;
	font: 16px Arial, sans-serif;
	color: #403664;
    }

a:link{
	color: #403664;
	text-decoration: underline;
}

a:visited{
	color: #403664;
	text-decoration: underline;
}

a:hover{
	color: #403664;
	text-decoration: underline;
}

p{
	line-height: 20px;
}

/*--------------------------
	Site Layout
----------------------------*/
#site{
	width: 100%;
	margin: 10px auto;
}

#wrapper{
	width:430px;
	margin:20px auto;
}

#container{
	width: 422px;
	margin:0 auto;
	padding:0;
	background: url(images/main_bg.png) repeat-y top left;
}

/*--------------------------
	Header
----------------------------*/

#header{
	width: 422px;
	height:110px;
	margin: 0 auto;
	padding: 0;
	background: url(images/header_top.png) 0 top no-repeat;
}

h1{
	margin:0 auto;
	padding: 20px 0 0 30px;
	font: 30px "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #ffffff;	
}

.description{
	width: 360px;
	line-height: 20px;
	padding: 0 0 0 33px;
	color: #333333;
}

/*--------------------------
	Robot
----------------------------*/
#robot{
	width:358px;
	height:652px;
	position: absolute;
	top: 100px;
	left: 50px;
	display: block;
	background: url(images/robot.png) 0 0 no-repeat;
}

/*--------------------------
	Navigation
----------------------------*/
.nav{

height:50px;
width: 183px;
padding: 0;
margin: 256px 0 0 78px;
}

.nav a{
list-style-type: none;
color: white;
text-decoration: none;
display: block;
height: 50px;
width: 129px;
line-height: 48px;
float: left;
font-weight: bold;
font-size: 16px;
padding-left: 54px;
outline: none;
}

.nav li{
	display: block;
	float: left;
	height: 50px;
	width: 183px;
	padding-bottom: 12px;
	margin: 0;
}

.nav li.current{
	background: url(images/nav_select.png) 0 0 no-repeat !important;
}

.nav li.current a{
	background: url(images/nav_select.png) 0 0 no-repeat !important;
	outline: none;
}

.nav li a span{
	padding-left: 18px;
	margin-left: -2px;
	float: left;
	display: block;
}

.nav li.about a span{
	background: url(images/nav_about_icon.png) 0 center no-repeat;	
}
.nav li.contact a span{
	background: url(images/nav_contact_icon.png) 0 center no-repeat;	
	padding-left: 20px;
}

.nav li.stalkme{
	margin-right: 0;
}

.nav li.stalkme a span{
	background: url(images/nav_stalkme_icon.png) 0 center no-repeat;	
}
.nav li a:active span{
	position: relative;
	top: 1px;
}
.nav li:hover{
	background: url(images/nav_hover.png) 0 0 no-repeat !important;
}

/*--------------------------
	About
----------------------------*/

#about{
	width: 360px; /* fix for jQuery height */
}

.content{
	font-family: Helvetica, Verdana, Arial, sans-serif;
	width : 360px;
	display : block;
	min-height : 100px;
	padding : 0 0 0 33px;
	margin : 0 auto;
	font-size: 11pt;
	color: #555555;
	float: left;
}

.content p{
	line-height: 1.5em;
	padding-bottom: 5px;
}

/*--------------------------
	Stalk Me
----------------------------*/

#stalkme{
	width: 422px; /* jQuery height fix */
	float: left;
}

.stalklist{
	width: 360px;
	height: 60px;
	margin: 0 auto;
	padding: 0;	
}

.stalklist li{
	list-style-type: none;
	width: 360px;
	height: 60px;
	display: block;
	float: left;
	margin: 0;
	padding-bottom: 12px;
}

.stalklist li.blog a{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background: url(images/stalkme/blog.png) 0 0 no-repeat;
}

.stalklist li.blog a:hover{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background-position: -351px 0;
}

.stalklist li.twitter a{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background: url(images/stalkme/twitter.png) 0 0 no-repeat;
}

.stalklist li.twitter a:hover{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background-position: -351px 0;
}

.stalklist li.facebook a{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background: url(images/stalkme/facebook.png) 0 0 no-repeat;
}

.stalklist li.facebook a:hover{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background-position: -351px 0;
}	

.stalklist li.linkedin a{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background: url(images/stalkme/linkedin.png) 0 0 no-repeat;
}

.stalklist li.linkedin a:hover{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background-position: -351px 0;
}

.stalklist li.flickr a{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background: url(images/stalkme/flickr.png) 0 0 no-repeat;
}

.stalklist li.flickr a:hover{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background-position: -351px 0;
}

.stalklist li.tumblr a{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background: url(images/stalkme/tumblr.png) 0 0 no-repeat;
}

.stalklist li.tumblr a:hover{
	display: block;
	width: 360px;
	height: 60px;
	text-decoration: none;
	background-position: -351px 0;
}

/*--------------------------
	Contact
----------------------------*/

#contact{
	width: 360px; /* fix for jQuery height */	
	float: left;	
}

#contact h2{
	margin:0 auto;
	padding: 0 0 5px 30px;
	font: 30px "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #55ff5d;	
}

.contactlist{
	width: 360px;
	min-height: 100px;
	margin: 0 auto;
	padding:0;
}

.contactlist li{
	list-style-type: none;
	width: 360px;
	display: block;
	float: left;
	margin: 0;
	padding-left: 30px;
	padding-bottom: 12px;
}

.contactlist li.logo{
	background: url(images/contact_logo_icon.png) no-repeat;
	padding-left: 27px;
	margin-left: 30px;
}


.contactlist li.adr{
	background: url(images/contact_adr_icon.png) no-repeat;
	padding-left: 27px;
	margin-left: 30px;
}

.contactlist li.phone{
	background: url(images/contact_phone_icon.png) no-repeat;
	padding-left: 27px;
	margin-left: 30px;
}

.contactlist li.email a{
	background: url(images/contact_email_icon.png) no-repeat;
	padding-left: 27px;
}

.contactlist li.aim a{
	background: url(images/contact_aim_icon.png) no-repeat;
	padding-left: 27px;
}

.contactlist li.gtalk a{
	background: url(images/contact_gtalk_icon.png) no-repeat;
	padding-left: 27px;
}

.contactlist li.url a{
	background: url(images/contact_url_icon.png) no-repeat;
	padding-left: 27px;
}

.contactlist li.resume a{
	background: url(images/contact_resume_icon.png) no-repeat;
	padding-left: 27px;
}

/*--------------------------
	Footer
----------------------------*/
#footer{
	width: 422px;
	height: 60px;
	margin: 0 auto;
	padding-top: 28px;
	text-align: center;
	background: url(images/header_bottom.png) 0 top no-repeat;
}

/*--------------------------
	Misc Styles
----------------------------*/