/*Hello, there what are doing here? Get your own code thank you! This means you craig!*/

/* 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 { border:0; }

/* MAIN
-------------------------------------------------------- */
body{font-size:62.5%; font-family: helvetica, arial, sans-serif; color:#444; padding:0 1em; background:#ededed /*url(../images/body_all.jpg) top repeat-x*/;}
#wrapper{position:relative; width:960px; margin:0 auto; padding:0 10px 10px 20px;}
.clear{clear:both;}

/* MAIN STRUCTURE
-------------------------------------------------------- */
header#title{ float:left; padding:20px; width:940px; padding:10px; border-bottom:#d5d5d5 2px solid;}
	header#sub_header {padding: 5px 0;}
	
section#iphone{ float:left; padding:20px; width:940px; padding:10px; border-top:#d5d5d5 2px solid;}

section#front_page_header { width:960px; padding:0; margin:0; float:left; border-bottom:#d5d5d5 2px solid; }
section#main_wrap {width:640px; padding: 0; margin: 10px 0; float:left; }
	section#main_wrap article#featured_work{ width:300px; padding:5px 10px; float:left;}
section#sidebar {width:280px; float:left; padding:0 0 0 40px; margin:10px 0;}
	section#sidebar div#twitter {border-top:#d5d5d5 2px solid; padding:10px 0 0;}
	section#sidebar div#twitter ul#twitter_update_list li{border-top:#d5d5d5 1px solid; display:block; padding:3px 0 0; margin:0 0 5px;}
	section#sidebar div#twitter ul#twitter_update_list li a:hover{text-decoration:underline;}

section#gallery_wrap {width:960px; padding: 0; margin: 10px 0; float:left;}
	section#scent_systems{ float:left; padding:20px; width:940px; padding:10px; border-bottom:#d5d5d5 2px solid; position: relative; }
		span.expand_button{ background:#ddd ; padding: 8px 10px 6px; display: block; position: absolute; top: 10px; left: 10px; font-size: 14px; text-transform: uppercase; cursor:pointer; }
		div#scent_text{ width: 500px; height: auto; display: none; background: #ddd; position: absolute; top: 39px; left: 10px; padding: 10px; }
	section#gallery_wrap article#third{ width:300px; padding:5px 10px; float:left;}
	section#gallery_wrap article#two_third{ width:620px; padding:5px 10px; float:left;}
		.button_buy{ width:150px; height:40px; background:url(../images/button_buy.png) top; cursor:pointer; display: block; position: relative; }
		.button_free{ width:150px; height:40px; background:url(../images/button_free.png) top; cursor:pointer; display: block; position: relative; }
		.button_buy span.hover, .button_free span.hover{ background-position:bottom; position: absolute; }
			
.resume_block{ width:460px; margin:20px 10px 0; float:left; padding: 0;}
	.resume_block ul { margin-top: 14px; }
	.resume_block h4{ font-size:14px; margin:6px 0; padding: 5px 0 0; line-height:1em; display: block; border-top:#D5D5D5 solid 1px ; }

/*useful generic divs, use generic class then any other class*/
.generic{ float:left; padding-top:1em; margin-bottom:1em;}
	.twotwenty{ width:220px; padding:10px;}
	.sevenhun{ width:700px; padding:10px; }

section#illustration_wrap{float: left; margin: 20px 0 0; padding: 0; width: 960px; background: url(../images/illustration.jpg) no-repeat 0 -20px; height: 1580px;}
	section#illustration_wrap div.bas_blurb{ width:220px; position:absolute; left:460px; top:200px; }
	section#illustration_wrap div.tower_blurb{ width:420px; position:absolute; left:40px; top:500px; }
	section#illustration_wrap div.noel_blurb{ width: 200px; position: absolute; left: 730px; top: 620px; }
	section#illustration_wrap div.muse_blurb{ width:420px; position:absolute; left:40px; top:1015px; }
	section#illustration_wrap div.egg_blurb{ width:420px; position:absolute; left:500px; top:1195px; }
	section#illustration_wrap div.smash_blurb{ width:420px; position:absolute; left:40px; top:1480px; }

footer#footer { width:940px; height:20px; padding:10px; border-top:#aaa solid 2px; display:block;}
	footer#footer li { display: inline-block; display: -moz-inline-stack; zoom: 1; *display: inline; margin:0 5px; }
	footer#footer ul { text-align:center; margin: 0; padding: 0;}
	footer#footer a { text-decoration: none; }
	footer#footer a:hover { text-decoration: underline; }
	
/* NAVIGATION
-------------------------------------------------------- */
nav#nav_wrap{ width:960px; height: 60px; display:block; border-bottom:#aaa 2px solid;}
	nav#nav_wrap span.logo {margin:20px 18px 0 10px; background:url(../images/logo_yellow.png) top; height:30px; width:30px; display:block; float:left;}
	nav#nav_wrap span.logo:hover {background-position:bottom;}

	div#navigation {float:right; display:block; margin:20px 0 0 10px;}
	div#navigation a{border: none; background: none; font-weight: normal; }
	
	/* -- Base -- */
	ul.nav,ul.nav li,ul.nav ul {list-style: none;margin: 0;padding: 0; text-shadow: #d5d5d5 0 -1px 0;}
	ul.nav {position: relative;z-index: 597; }
	ul.nav li {float: left; line-height: 1.3em; vertical-align: middle; zoom: 1;}
	ul.nav li.hover,ul.nav li:hover {position: relative; z-index: 599; cursor: default;}
	ul.nav ul {visibility: hidden;position: absolute;top: 100%;left: 0;z-index: 598;width: 100%;}
	ul.nav ul li {float: none;}
		
	/* -- Style -- */
	ul.nav {font-weight: bold;}
	ul.nav li {padding:10px 10px 8px; margin:-1.5px; letter-spacing:0; float:right;}
	ul.nav li a {/*color:#8f8f8f;*/ font-size:14px;}
	ul.nav li a:hover {	text-decoration: none;}
	ul.nav li.hover, ul.nav li:hover {background:#ddd; text-decoration:none;}
	ul.nav li.current {background:#ddd;}

/* BUTTONS
-------------------------------------------------------- */	
span.button{ width:150px; height:40px; }
span.button_buy{ width:150px; height:40px; background:url(../images/button_buy.png) top; cursor:pointer;}
span.button_type{ width:150px; height:40px; background:url(../images/button_type.png) top; cursor:pointer;}
span.button_free{width:150px; height:40px; background:url(../images/button_free.png) top; cursor:pointer; }
	span.button_type:hover, span.button_buy:hover, span.button_free:hover{ background-position:bottom; }

/* HEADINGS
-------------------------------------------------------- */
h1{ font-size:4.5em; font-style:bold; line-height:1em; color:#000;}
h2{	font-size:2.5em; line-height:0.9em; color:#444;}
h3{	font-size:20px; line-height:22px; color:#000;}
h4{	font-size:14px; margin:0 0 6px; line-height:1em; }

/* PARAGRAPHS
-------------------------------------------------------- */
p{font-size:1.2em; line-height:1.5em; margin-bottom:1em; font-family: helvetica, arial, sans-serif; }
p+p { text-indent: 20px; }

/* LINKS
-------------------------------------------------------- */
a {color: #444; font-weight:bold; text-decoration: none; }
a:link, a:visited {text-decoration:none; font-weight:bold;}
a:hover {text-decoration:none;}
p a { color:#444; text-decoration: none; padding: 1px 2px; background: #f9fc7e; border-bottom: 1px dotted #666; }
p a:hover { color: #666; background: none; }
a.clear{text-decoration: none; background: none; border: none; padding: 0;}

/* IMAGES
-------------------------------------------------------- */
img{ font-size:1em; margin: 0 0 10px;}
img.left-img{font-size:1em; float:left; margin-bottom:1.8em; margin-right:1.8em; }
img.right-img{ font-size:1em; float:right; margin-bottom:1.8em; margin-left:1.8em; }
	img.border{ border:1px solid #ccc;}
img.logo{font-size:1em; float:left; margin:20px 18px 0 0; }
a img {	border: none; }
a img.left-img { float: left; }

/* - EXTRAS
-------------------------------------------------------- */
.generic strong{ font-variant:small-caps; }
.generic em{ font-style:italic; font-weight:inherit; }

/* LISTS
-------------------------------------------------------- */
ul{ margin-bottom:1em; }
ul li{ font-size:1.2em; line-height:1.4em; margin: 0 0 10px; }

