html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, font, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td {

	margin: 0;

	padding: 0;

	border: 0;

	outline: 0;

	font-size: 100%;


}

/* remember to define focus styles! */

:focus {

	outline: 0;

}


ol, ul {

	list-style: none;

}
h1 { 
font-size:16px;
text-align:left;
margin:10px 0px 0px 5px;
color: #FFF;
z-index:20}

h3 { 
font-size:16px;
text-align:left;
line-height:35px;
color: #FFF;}

a:link, a:visited, a:active {
	color: #86cade;
	text-decoration: none;
	}

a:hover {
	color: #69b8d1;
	text-decoration: none;
	}

		
/*layout*/

#container {
	position: relative;
	margin:auto;
	width:881px;
	height:100%;
	}
	
body {
	background-image: url(images/background.jpg);
	background-repeat: repeat-y;
	background-color: #fff;
	background-position:top;
	font-family: Helvetica, Arial, Tahoma, sans-serif;
	color: #fcfcfc;
	line-height:22px;
	text-decoration:none;
	}
	
#header {
	background-image: url(images/header.jpg);
	position:relative;
	top:16px;
	width:881px;
	height:513px;
	}
#postit {
	background:url(images/postit.png) bottom;
	display:block;
	position:absolute;
	left:720px;
	top:60px;
	width:260px;
	height:250px;
	z-index:3;
	}
#postit:hover{background-position: top;}

#workheader{
	height:65x;
	width:338px;
	position:relative;
	top:25px;
	left:44px;
		}
#latestslider{
	background-image:url(images/slider.jpg);
	height:623px;
	width:790px;
	position:relative;
	margin: auto;
	top:25px;
		}
#workslider{
	background-image:url(images/workbg.jpg);
	height:622px;
	width:790px;
	position:relative;
	margin: auto;
	top:18px;
		}
.thumbnail {
border:6px solid #508ba8;
float:left;
height:224px;
margin:17px 5px 0 24px;
position:relative;
top:11px;
left:34px;
}
.thumbnail:hover {
border:6px solid #e2f5ff;
}
.thumbnail2 {
border:6px solid #508ba8;
float:left;
height:180px;
margin:17px 5px 15px 24px;
position:relative;
top:47px;
left:22px;
}
.thumbnail2:hover {border:6px solid #e2f5ff;}

/*thumbnail rollovers*/
.enlarge2 {
	background:url(images/enlarge.png) no-repeat center; display:block; position:absolute; width:180px; height:180px; z-index:-1;}
.enlarge:hover span {
	background:url(images/enlarge.png) no-repeat 0 0 center; display:block; position:absolute; width:180px; height:180px; z-index:1;}
.enlarge:hover span p {font: 17px Arial, Helvetica, sans-serif; color:#FFF; text-align:center; z-index:2; font-weight:bold; background:url(images/enlargetextbg.png); width:auto; height:auto; padding:5px 2px 5px 2px; margin-top:110px;}

/*video thumbnail rollovers*/
.play2 {
	background:url(images/play2.png) no-repeat 0 0; display:block; position:absolute; width:280px; height:224px; z-index:-1;}
.play:hover span {
	background:url(images/play2.png) no-repeat 0 0; display:block; position:absolute; width:280px; height:224px; z-index:3;}
.play:hover span p {font: 17px Arial, Helvetica, sans-serif; color:#FFF; z-index:2; font-weight:bold; text-align:left; background:url(images/enlargetextbg.png); max-width:280px; height:auto; padding:8px 5px 8px 15px; margin-top:145px;}

/*featured image rollovers*/
.enlargefeatured2 {
	background:url(images/enlarge2.png) no-repeat center; display:block; position:absolute; width:338px; height:270px; z-index:-1;}
.enlargefeatured:hover span {
	background:url(images/enlarge2.png) no-repeat 0 0 center; display:block; position:absolute; width:338px; height:270px; z-index:1;}
.enlargefeatured:hover span p {font: 19px Arial, Helvetica, sans-serif; color:#FFF; z-index:2; font-weight:bold; text-align:center; background:url(images/enlargetextbg.png); max-width:338px; height:auto; padding:11px 2px 11px 2px; margin-top:175px;}

/*featured video rollovers*/
.playfeatured2 {
	background:url(images/play.png) no-repeat 0 0; display:block; position:absolute; width:338px; height:270px; z-index:-1;}
.playfeatured:hover span {
	background:url(images/play.png) no-repeat 0 0; display:block; position:absolute; width:338px; height:270px; z-index:3;}
.playfeatured:hover span p {font: 19px Arial, Helvetica, sans-serif; color:#FFF; z-index:2; font-weight:bold; text-align:left; background:url(images/enlargetextbg.png); max-width:338px; height:auto; padding:9px 5px 9px 20px; margin-top:175px;}


#scribble1 {
	background-image:url(images/latestwork.gif);
	width:136px;
	height:107px;
	position:absolute;
	left:884px;
	top: 750px;}

#scribble2 {
	background-image:url(images/getintouch.gif);
	width:129px;
	height:142px;
	position:absolute;
	left:890px;
	top: 100px;}
	
#mainpanel{
	background-image: url(images/about_panel.jpg);
	height:592px;
	width:881px;
	position:relative;
	top:60px;
	z-index:1;
		}
#about{
	position:absolute;
	left:28px;
	top:120px;
	width:360px;
	height:463px;
	z-index:2;
}
#about .image {
	float:right;
	margin-left: 5px;
}
#updates {
	position:absolute;
	left:464px;
	top:120px;
	width:383px;
	height:463px;
	overflow:auto;
	z-index:2;
}
#CV {
	position:absolute;
	left:154px;
	top:460px;
	width:201px;
	height:80px;
	z-index:2;
}
#footer{
	background-image:url(images/footer.jpg); height:416px; width:886px; position:relative; top:95px;}
	
#featured {
	background-image:url(images/featured.jpg); height:316px; width:881px; position:relative; top:56px;}
.featuredtitle { position:absolute; top:77px; left:50px; font-size:20px;}
.featuredabout {font-size:14px; left:60px; position:absolute; top:120px; width:385px;height:160px; overflow:hidden;}
.featuredimage {position:absolute; width:338px; height:270px;top:18px; left:506px; border: solid 5px #c76f6f;}
.featuredimage:hover {border:5px solid #d58b8b;}

/*navigation*/
	#nav{list-style:none;}
	#nav li{display:inline; list-style:none; width:140px; height:120px; ; text-indent:-9999px;}
	#nav li a{background:url('images/navigation.jpg') 0 0 no-repeat; color:#FFF; top:255px; text-decoration:none; display:block; height:100%; position:absolute;}

#nav li.home a {height:56px; width:219px;}
#nav li.home a:hover{background-position: 0 -248px;}
#nav li.home a.selected{background-position: 0 -248px;}

#nav li.work a {background-position: 0 -56px; height:69px; width:240px; top:311px;}
#nav li.work a:hover{background-position: 0 -304px;}
#nav li.work a.selected{background-position: 0 -304px;}

#nav li.blog a {background-position: 0 -125px; height:58px; width:219px; top:380px;}
#nav li.blog a:hover {background-position:0 -373px; width:365px;}
#nav li.blog a.selected {background-position:0 -373px; width:365px;}

#nav li.contact a{background-position: 0 -183px; height:58px; width:320px; top:438px;}
#nav li.contact a:hover{background-position:0 -430px;}

/*work links*/
#nav li.video a{background-position: -240px -58px; height:73px; width:130px; left:240px; top:313px;}
#nav li.video a:hover{background-position:-240px -306px;}
#nav li.video a.selected{background-position:-240px -306px;}

#nav li.threed a{background-position: -370px -58px; height:72px; width:75px; left:370px; top:313px;}
#nav li.threed a:hover{background-position:-370px -306px;}
#nav li.threed a.selected{background-position:-370px -306px;}

#nav li.graphics a{background-position: -445px -58px; height:75px; width:191px; left:445px; top:313px;}
#nav li.graphics a:hover{background-position:-445px -306px;}
#nav li.graphics a.selected{background-position:-445px -306px;}

#nav li.photos a{background-position: -636px -58px; height:80px; width:250px; left:636px; top:313px;}
#nav li.photos a:hover{background-position:-636px -306px;}
#nav li.photos a.selected{background-position:-636px -306px;}


#navbg {
	background:url(images/navigation.jpg)  -870px -72px no-repeat;
	position:absolute;
	width:50px;
	height:67px;
	left:872px;
	top:327px;
}
/*footer nav*/

#footer_video {
	position:absolute;
	left:7px;
	top:386px;
	width:143px;
	height:30px;
	z-index:2;
}
#footer_3d {
	position:absolute;
	left:192px;
	top:386px;
	width:60px;
	height:30px;
	z-index:2;
}
#footer_graphics{
	position:absolute;
	left:295px;
	top:386px;
	width:223px;
	height:30px;
	z-index:2;
}
#footer_photos{
	position:absolute;
	left:555px;
	top:386px;
	width:183px;
	height:30px;
	z-index:2;
}	
#footer_art{
	position:absolute;
	left:770px;
	top:386px;
	width:91px;
	height:30px;
	z-index:2;
}


/*footer*/
#contact {
	height:289px;
	width:373px;
	position:absolute;
	left:505px;
	top:97px;
}
#contactanchor {
	position:absolute;
	left:269px;
	bottom:600px;
	width:1px;
	height:1px;
	z-index:2;
}
#copyright {
	color:#333333;
	position:relative;
	top:470px;
	text-align:center;
	font-size:13px;
	line-height:17px;
	padding-bottom:50px;
}	
#myspace_link {
	position:absolute;
	left:214px;
	top: 295px;
	width:53px;
	height:50px;
}
#twitter_link {
	position:absolute;
	left:40px;
	top: 296px;
	width:49px;
	height:50px;
}
#facebook_link {
	position:absolute;
	left:98px;
	top: 295px;
	width:53px;
	height:50px;
}
#vimeo_link {
	position:absolute;
	left:156px;
	top: 295px;
	width:53px;
	height:50px;
}

#tweet {
	position:absolute;
	left:50px;
	top:88px;
	width:370px;
	height:159px;
	color:#FFF;
	overflow: visible;
}
#tweet a {

  color: #fff;

}

#tweet SPAN.time {
  font-style: italic;
  margin-left:10px;
  color: #c5c5c5;
  font-size:16px;
}

#tweet SPAN.status {
  font-style: normal;
  font-size:20px;
  line-height:28px;
}
#tweet SPAN.image {
	padding-right: 13px;
	float:left;
		
	}

/* contact form */

.notification_error {
border: 2px solid #666;
height: auto;
width: 80%;
padding: 6px 0px 5px 15px;
margin: -17px 0 14px 0;
text-align: left;
}

.notification_ok {
font-size:16px;
width: 85%;
text-align: center;
margin-top: 40px;

}

.button
{
border: 1px solid #999999; 
border-top-color: #CCCCCC; 
border-left-color: #CCCCCC; 
background: white;
color: #333333; 
font: 11px Verdana, Helvetica, Arial, sans-serif;
padding:2px;

}

/* Label */
label  { width: 100px; margin: 5px; float: left; text-align: left;
}

/* Input, Textarea */
input, textarea
{
margin-bottom: 12px;
padding: 3px; 
float: left;
 
border-top-color: #CCCCCC; 
border-left-color: #CCCCCC; 

color: #333333;
font:Arial, Helvetica, sans-serif;
font-size:12px;

-moz-border-radius: 3px;
}
.textbox{
	width:170px;
}
.commentbox {
	width:200px;
	overflow:auto;
}

/* BR */

br { clear: left; }