* {margin:0;padding:0;list-style:none;}
img {border:none;}

body {
	font-family:'Trebuchet MS', Arial, sans-serif;
	font-size:100%;
	text-align:center;
}
h2 {
	text-transform:uppercase;
	margin:0 0 7px 0;
}
h3 {
	font-size:100%;
	margin-bottom:7px;
}
h4 {
	font-size:90%;
	text-transform:uppercase;
}

#container {
	width:775px;
	padding:87px 0 18px 0;
	text-align:left;
	margin:0 auto;
}
#header {
	position:relative;
	width:100%;
}
#header h1 {
	width:295px;height:66px;
	margin:0 0 0 129px;
	position:relative;
	z-index:1000;
}
#header h1 a {
	display:block;
	width:295px;height:66px;
	position:relative;
	z-index:2000;
}
#header h1 span {display:none;}
#header #logo {
	position:absolute;
	width:140px;
	top:-13px;left:15px;
	z-index:500;
}
#header #tagline {
	text-transform:lowercase;
	color:#8BE;
}
#header #tagline p {
	line-height:3.2em;
	padding:0 0 0 165px;
}

#nav {
	margin:0 0 0 15px;
	width:738px;
	font:bold 81.5%/1em Arial,sans-serif;
	border-bottom:1px solid;
}
#nav li {
	float:left;
}
#nav li a {
	display:block;
	line-height:2em;
	letter-spacing:0.2ex;
	margin:1px;
	padding:0 1em;
	text-decoration:none;
}

#nav li a:hover {
	text-decoration:underline !important;
}
#home #nav li#navHome a,
#portfolio #nav li#navPortfolio a,
#contact #nav li#navContact a {
	text-decoration:none;
}

#content {
	margin:1px 0 0 15px;
	width:738px;
	font-size:87.5%;
	letter-spacing:0.1ex;
}
	#content p {margin:0 0 0.7em 0;}
#maincontent {
	width:456px;
	min-height:280px;
	padding:18px;
	float:left;
	margin:0 1px 0 0;
}
#sidebar {
	margin:0 0 0 494px;
	width:207px;
	padding:18px;
	min-height:250px;
	border-left:1px solid;
}
	#sidebar p {font-size:86%;}
	#sidebar .screenshot {border:1px solid;}
	#sidebar p a {font-size:92%;}

#scrollercontrols {
	width:209px;
	text-align:center;
	font-size:75%;
	min-height:1.6em;
}
#scrollercontrols li {
	float:left;
}
#scrollercontrols li a {
	width:69px;
	display:block;
}
#scrollercontrols li a#previousLink {text-align:left;}
#scrollercontrols li a#nextLink {text-align:right;}

#footer {
	margin:1px 0 0 15px;
	padding:0.7em 0 0 0;
	width:738px;
	text-align:center;
	font:normal 62.5%/1em Arial,sans-serif;
	border-top:1px solid;
}

/* Portfolio */
#portfolioNav {margin:-7px 0 12px 0;}
#portfolioNav li {
	font-size:86%;
	line-height:1.1em;
	float:left;
	margin:0 0 0 0.5em;
	padding:0 0.5em 0 0.9em;
	border-left:1px solid;
}
#portfolioNav li.first {
	border:0;
	margin-left:0;
	padding-left:0;
}
#portfolioNav li a {font-size:100%;text-decoration:underline;}
#portfolioNav li.first a {font-weight:bold;}
#portfoliosites .site,
#portfoliologos .logo {
	clear:both;
	margin:0 0 12px 0;
	min-height:150px;
}
#portfoliosites .site img.screenshot,
#portfoliologos .logo img.screenshot{
	float:left;
	border:1px solid;
}
#portfoliosites .site p,
#portfoliologos .logo p {
	margin:0 0 0 217px;
	font-size:86%;
}
#portfoliologos {display:none;}
/* end Portfolio */

/* Contact Form */
#contactform {
	margin:0 0 12px 0;
	position:relative;
}
#contactform #loading {
	position:absolute;
	top:0px;right:0;
	padding:5px 50px;
	border:2px solid #000;
	color:#295785;
	font-size:120%;
	font-weight:bold;
	background:#FFF;
}
#contactform #confirmation {
	border:2px solid #505050;
	font-size:90%;
	font-weight:bold;
	background:#FFF;
	padding:7px;
}
#contactform .alert {
	border-color:red !important;
	color:red !important;
	background:#FFFF99 !important;
}
#contactform li {margin:4px 0;padding:4px 0;}
#contactform li.required label {font-weight:bold;}

#contactform li label {
	width:90px;
	float:left;
	position:relative;
	padding:0.2em 10px 0.2em 0;
	text-align:right;
}
#contactform li input,
#contactform li textarea {
	width:200px;
	margin:0 0 0px 0px;
	padding:0.2em;
	border:1px solid;
}
#contactform li input#submitbtn {
	width:8em;
	margin-left:100px !important;
	display:block;
	font-weight:bold;
}
#contactform li p.reqnote {
	margin:0 0 0 100px;
	font-size:86%;
	font-weight:bold;
	color:#F00;
	display:none;
}
#contactform li.invalid p.reqnote {display:block !important;}
/* end Contact Form */

/* WORKAROUNDS */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {
    display:inline-block;
}
/* Hides from IE-mac \*/
.clearfix {display:block;}
* html .clearfix {height: 1px;}
/* End hide from IE-mac */
/* END WORKAROUNDS */
