/*
Theme Name: NathanLoehlein
Theme URI: http://nathanloehlein.com
Description: Personal Design for nathanloehlein.com
Author: Nathan Loehlein
Author URI: http://nathanloehlein.com
Tags: grey, gray, green, white, two0column

	All Rights Reserved. Copyright 2010

*/
@charset "utf-8";
/* CSS Document */

/*----------------------------------

CSS Reset for HTML 5 

----------------------------------*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
body {
	line-height:1;
}

article, aside, dialog, figure, footer, header,
hgroup, nav, section {
	display:block;
}

nav ul {
	list-style:none;
}

blockquote, q {
	quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}

a {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

p {
	color:#222;
}

ins {
	background-color:#ff9;
	color:#000;
	text-decoration:none;
}

mark {
	background-color:#ff9;
	color:#000;
	font-style:italic;
	font-weight:bold;
}

del {
	text-decoration: line-through;
}

abbr[title], dfn[title] {
	border-bottom:1px dotted #000;
	cursor:help;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

hr {
	display:block;
	height:1px;
	border:0;
	border-top:1px solid #cccccc;
	margin:1em 0;
	padding:0;
}

input, select {
	vertical-align:middle;
}

/*----------------------------------

Defaults

----------------------------------*/

h1 {
	font-size:2.4em;
}

h2 {
	font-size:2.0em;
}

h3 {
	font-size:1.8em;
}

h4 {
	font-size:1.6em;
}

h5 {
	font-size:1.4em;
}

h6 {
	font-size:1.2em;
}

p {
	font-size:10px;
}

ol, ul {
	list-style-type:none;
}

a {
	text-decoration:none;
	color:#008701;
}

/*----------------------------------

HTML, BODY, WRAPPER

----------------------------------*/

html, body {
	width:100%;
	height:100%;
	position:relative;
}

body {
	font:10px normal verdana, helvetica, arial, sans-serif;
	line-height:1.3em;
	background:#eaeaea url(http://nathanloehlein.com/files/images/gray-wood.jpg) center -10px repeat;
	color:#2a2a2a;
}

#wrapper {
	width:960px;
	margin:30px auto 10px;
}

/*----------------------------------

HEADER

----------------------------------*/

header {
	width:960px;
	float:left;
	font-size:10px;
}

	header hgroup {
		float:left;
		width:480px;
		margin-top:10px;
	}
	
		header hgroup h2 {
			color:#fff;
			font-size:4.8em;
			line-height:1em;
			height:48px;
			margin:-16px 0 0;
			padding:0;
		}
		
		header hgroup h1 {
			color:#008701;
			font:2.2em italic helvetica, arial, verdana, sans-seriif;
			font-style:italic;
			letter-spacing:-1px;
			word-spacing:-1px;
			margin:-7px 0 0;
			padding:0;
			line-height:1em;
			height:22px;
		}
		
	header nav {
		float:right;
		width:460px;
		background:#f6f6f6;
		border:1px solid #fff;
		border-radius:5px;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
		box-shadow:1px 1px 2px #333;
		-moz-box-shadow:1px 1px 2px #333;
		-webkit-box-shadow:1px 1px 2px #333;
	}
	
		header nav a {
			display:block;
			float:left;
			margin:5px 0;
			padding:7px 28px 7px 27px;
			font-size:1.2em;
			border-left:1px solid #E6FFE6;
			border-right:1px solid #C5E0C5;
		}
		
			header nav a:first-child {
				border-left:0px;
			}
			
			header nav a:last-child {
				border-right:0px;
			}
			
			header nav a:hover {
				color:#002100;
			}
		
/*----------------------------------

FEATURED-SLIDER

----------------------------------*/

div#featured-slider {
	position:relative;
	float:left;
	width:960px;
	height:320px;
	margin:20px 0;
	clear:left;
	overflow:hidden;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	box-shadow:1px 1px 2px #000;
	-moz-box-shadow:1px 1px 2px #000;
	-webkit-box-shadow:1px 1px 2px #000;
}

	div#featured-slider section.featured {
		position:absolute;
		top:0px;
		left:0px;
		float:left;
		width:960px;
		height:320px;
		overflow:hidden;
		color:#2a2a2a;
		background:transparent;
		z-index:0;
	}
	
		div#featured-slider section.featured#slider-1 {
			z-index:2;
		}
		
			div#featured-slider section.featured img.featured-image {
				position:absolute;
				left:0px;
				top:0px;
				width:960px;
			}
					
		div#featured-slider section.featured div.featured-content.horizontal {
			position:absolute;
			display:block;
			background:#fff;
			background:rgba(255,255,255,.7);
			bottom:0px;
			width:960px;
			min-height:80px;
			box-shadow:0px -1px 2px #333;
			-moz-box-shadow:0px -1px 2px #333;
			-webkit-box-shadow:0px -1px 2px #333;
		}
		
		div#featured-slider section.featured div.featured-content.vertical {
			position:absolute;
			display:block;
			background:#fff;
			background:rgba(255,255,255,.7);
			bottom:0px;
			right:0px;
			width:268px;
			height:320px;
			border-right:1px solid rgba(255,255,255,.3);
			box-shadow:-2px 0px 2px #333;
			-moz-box-shadow:-2px 0px 2px #333;
			-webkit-box-shadow:-2px 0px 2px #333;
		}
		
			div#featured-slider section.featured div.featured-content h2 {
				padding:15px 15px 5px;
				color:#008700;
				text-shadow:1px 1px 1px #999;
				line-height:1.2em;
			}
			
			div#featured-slider section.featured div.featured-content p {
				padding:5px 15px 15px;
				max-width:500px;
				font-size:1.2em;
				color:#2a2a2a;
			}
			
	div#featured-slider img.corner-overlay {
		position:absolute;
		z-index:999;
		left:0px;
		top:0px;
	}
	
	div#featured-slider ul#featured-switcher {
		width:248px;
		position:absolute;
		right:20px;
		bottom:20px;
		z-index:1000;
	}
	
		div#featured-slider ul#featured-switcher li {
			float:left;
			width:60px;
			height:60px;
			margin:0px 0px 0px 20px;
			border:1px solid #77cb77;
			overflow:hidden;
		}
		
			div#featured-slider ul#featured-switcher li img {
				width:60px;
				height:60px;
			}
		
			div#featured-slider ul#featured-switcher li:hover {
				border:1px solid #449844;
			}
			
			div#featured-slider ul#featured-switcher li.active {
				border:1px solid #004300;
			}


/*----------------------------------

#main-content

----------------------------------*/

div#main-content {
	background:#f6f6f6;
	float:left;
	clear:both;
	width:960px;
	margin:10px 0;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	box-shadow:1px 1px 2px #000;
	-moz-box-shadow:1px 1px 2px #000;
	-webkit-box-shadow:1px 1px 2px #000;
}

	div#main-content a {
		color:#008700;
		font-weight:bold;
	}
	
		div#main-content a.outside-link {
			font-weight:normal;
			color:#225422;
		}

	div#main-content span.first-letter {
		font-size:6.1em;
		font-family:Cambria, "Cambria New", Georgia, "Times New Roman", Times, serif;
		font-weight:bold;
		float:left;
		margin:0px 5px 2px 0px;
		line-height:.7em;
		height:50px;
	}
	
	div#main-content p.right-paragraph {
		text-align:right;
	}

	div#main-content article {
		padding:5px 15px;
		margin:10px 0;
		float:left;
		width:590px;
		border-right:1px solid #C5E0C5;
	}
	
		div#main-content article h3 {
			margin-bottom:12px;
			color:#004300;
		}
		
		div#main-content article p {
			font-size:1.3em;
			line-height:1.6em;
			margin-bottom:1.6em;
			float:left;
			width:275px;
			text-align:justify;
		}
		
			div#main-content article p#column-1 {
				margin-right:30px;
			}
	
	div#main-content aside {
		margin:10px 0;
		padding:5px 15px;
		width:295px;
		float:right;
	}
	
		div#main-content aside h4 {
			margin-bottom:12px;
			color:#004300;
		}
		
		div#main-content aside p {
			font-size:1.3em;
			line-height:1.6em;
			margin-bottom:1.6em;
			text-align:justify;
			width:280px;
		}
			
/*----------------------------------

#portfolio-content

----------------------------------*/
	
div#portfolio-content {
	background:#f6f6f6;
	float:left;
	clear:both;
	width:960px;
	margin:10px 0;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	box-shadow:1px 1px 2px #000;
	-moz-box-shadow:1px 1px 2px #000;
	-webkit-box-shadow:1px 1px 2px #000;
}

	div#portfolio-content a {
		color:#008700;
		font-weight:bold;
	}
	
	div#portfolio-content a.outside-link {
		font-weight:normal;
		color:#225422;
	}

	div#portfolio-content article {
		padding:5px 12px 5px 15px;
		margin:10px 0;
		float:left;
		width:590px;
		border-right:1px solid #C5E0C5;
	}
	
		div#portfolio-content article img.about-image {
			float:right;
			border:1px solid #444;
		}
	
		div#portfolio-content article h3 {
			margin-bottom:12px;
			color:#004300;
		}
		
		div#portfolio-content article p {
			font-size:1.3em;
			line-height:1.6em;
			margin-bottom:1.6em;
			float:left;
		}
		
			div#portfolio-content article p.wrap {
				width:300px;
			}
	
	div#portfolio-content aside {
		margin:10px 0;
		padding:5px 5px 5px 0;
		width:325px;
		float:right;

	}

		div#portfolio-content aside h4 {
			margin-bottom:12px;
			color:#004300;
		}
		
		div#portfolio-content aside p {
			font-size:1.3em;
			line-height:1.6em;
			margin-bottom:1.6em;
			text-align:justify;
			width:280px;
		}
		
		div#portfolio-content aside div#thumbs {
			margin-top:-4px;	
		}

			div#portfolio-content ul.thumbs li {
				width:98px;
				height:98px;
				margin:4px;
				float:left;
			}
			
				div#portfolio-content ul.thumbs li a.thumb {
					padding:0;
					border:1px solid #004300;
					height:96px;
					width:96px;
					min-height:96px;
					float:left;		
				}
			
				div#portfolio-content ul.thumbs li.selected a.thumb {
					border:1px solid #008701;	
				}
			
					div#portfolio-content ul.thumbs li a.thumb img {
						float:left;
						width:96px;
						height:96px;
					}


	#slideshow {
		max-height:300px;
		max-width:580px;
		border:1px solid #008701;
		overflow:hidden;
		padding:0;
	}

	#slideshow img {
		margin:-13px 0 0;
		padding:0;
	}
	
	div#controls {
		position:relative;
		height:20px;
		width:582px;
	}

	div.ss-controls {
		position:absolute;
		left:281px;
	}


	div.nav-controls {
		width:582px;
		height:15px;
	}

		div.nav-controls a.prev {
			float:left;	
		}
	
		div.nav-controls a.next {
			float:right;	
		}
		
	.caption h4 {
		color:#004300;	
		margin:10px 0;
	}
	
	.caption p {
		color:#242424;
		clear:left;
	}
	

/*----------------------------------

#about-content

----------------------------------*/

div#about-content {
	background:#f6f6f6;
	float:left;
	clear:both;
	width:960px;
	margin:10px 0;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	box-shadow:1px 1px 2px #000;
	-moz-box-shadow:1px 1px 2px #000;
	-webkit-box-shadow:1px 1px 2px #000;
}

	div#about-content a {
		color:#008700;
		font-weight:bold;
	}
	
	div#about-content a.outside-link {
		font-weight:normal;
		color:#225422;
	}

	div#about-content article {
		padding:5px 15px;
		margin:10px 0;
		float:left;
		width:590px;
		border-right:1px solid #C5E0C5;
	}
	
		div#about-content article img.about-image {
			float:right;
			border:1px solid #444;
		}
	
		div#about-content article h3 {
			margin-bottom:12px;
			color:#004300;
		}
		
		div#about-content article p {
			font-size:1.3em;
			line-height:1.6em;
			margin-bottom:1.6em;
			float:left;
		}
		
			div#about-content article p.wrap {
				width:300px;
			}
	
	div#about-content aside {
		margin:10px 0;
		padding:5px 15px;
		width:295px;
		float:right;
	}

		div#about-content aside h4 {
			margin-bottom:12px;
			color:#004300;
		}
		
		div#about-content aside p {
			font-size:1.3em;
			line-height:1.6em;
			margin-bottom:1.6em;
			text-align:justify;
			width:280px;
		}
		
			div#about-content aside p span.date {
				float:left;
				width:280px;
				font-size:1.1em;
			}
			
			div#about-content aside p span.title {
				font-weight:bold;
				float:left;
				width:280px;
			}
			
			div#about-content aside p span.company {
				float:left;
				margin-bottom:10px;
				padding-bottom:8px;
				border-bottom:1px solid #C5E0C5;
				width:280px;
				font-style:italic;
			}

/*----------------------------------

#blog-content

----------------------------------*/

div#blog-content {
	background:#f6f6f6;
	float:left;
	clear:both;
	width:960px;
	margin:10px 0;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	box-shadow:1px 1px 2px #000;
	-moz-box-shadow:1px 1px 2px #000;
	-webkit-box-shadow:1px 1px 2px #000;
}

	div#blog-content a {
		color:#008700;
		font-weight:bold;
	}
	
	div#blog-contentt a.outside-link {
		font-weight:normal;
		color:#225422;
	}

	div#blog-content article {
		padding:5px 15px;
		margin:10px 0;
		float:left;
		width:690px;
		border-right:1px solid #C5E0C5;
	}

div#blog-content article div.post {
float:left;
clear:left;
position:relative;
width:670px;
padding:0 0 20px;
}

div#blog-content article div.post+div.post {
border-top:2px solid #222;
padding:20px 0;
}
	
		div#blog-content article h3 {
			margin:10px 0 8px;
			color:#004300;
			clear:left;
float:left;
		}

		
		
		div#blog-content article div.entry {
font-size:1.4em;
line-height:1.7em;
margin-bottom:.5em;
float:left;
clear:both;
padding:15px 15px;
width:620px;
}

div#blog-content article div.entry pre {
width:600px;
font-size:12px;
float:left;
clear:both;
margin-bottom:20px;
}

		div#blog-content article p {
			font-size:14px;
			float:left;
clear:both;
margin-bottom:20px;
		}

div#blog-content article p.postmetadata {
line-height:20px;
font-size:12px;
}
div#dsq-content div.dsq-request-user-info {
clear:both;
}

div#blog-content article div.entry pre {
padding:5px 10px;
background:#d8d8d8;

}
	
	div#blog-content aside {
		margin:10px 0;
		padding:0 15px 15px;
		width:195px;
		float:right;
	}

div#blog-content aside li {
list-style-type:none;
}

		div#blog-content aside h2 {
			margin:24px 0 12px;
			color:#004300;
		}

div#blog-content aside li table caption {
font-size:1.2em;
font-weight:bold;
padding: 0 0 2px;
}

div#blog-content aside li table td {
padding:2px;
}
		
		div#blog-content aside p {
			font-size:1.3em;
			line-height:1.6em;
			margin-bottom:1.6em;
			text-align:justify;
			width:280px;
		}

div#blog-content aside li ul li {
margin:2px 0 0 5px;
}

/*----------------------------------

#contact-content

----------------------------------*/

div#contact-content {
	background:#f6f6f6;
	float:left;
	clear:both;
	width:960px;
	margin:10px 0;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	box-shadow:1px 1px 2px #000;
	-moz-box-shadow:1px 1px 2px #000;
	-webkit-box-shadow:1px 1px 2px #000;
}

	div#contact-content a {
		color:#008700;
		font-weight:bold;
	}
	
	div#contact-content a.outside-link {
		font-weight:normal;
		color:#225422;
	}

	div#contact-content article {
		padding:5px 15px;
		margin:10px 0;
		float:left;
		width:590px;
	}
	
		div#contact-content article h3 {
			margin-bottom:12px;
			color:#004300;
		}
		
		div#contact-content article h4 {
			margin:20px 0px 10px;
			color:#004300;
			float:left;
			padding-bottom:10px;
			width:590px;
			border-bottom:1px solid #C5E0C5;
		}
		
		div#contact-content article p {
			font-size:1.3em;
			line-height:1.6em;
			margin-bottom:.3em;
			float:left;
			clear:left;
		}
		
			div#contact-content article p.voice-widget {
				float:right;
				clear:none;
			}

		div#contact-content div.social a {
			float:left;
			width:150px;
			padding:7px;
			height:32px;
			background:#222;
			margin:10px;
			border-radius:5px;
			-moz-border-radius:5px;
			-webkit-border-radius:5px;
			box-shadow:1px 1px 2px #333;
			-moz-box-shadow:1px 1px 2px #333;
			-webkit-box-shadow:1px 1px 2px #333;
		}
		
			div#contact-content div.social a p {
				float:right;
				color:#aaa;
				font-size:1.6em;
				padding-top:8px;
				line-height:1.0em;
			}
						
			div#contact-content div.social a:hover {
				box-shadow:2px 2px 3px #555;
				-moz-box-shadow:2px 2px 3px #555;
				-webkit-box-shadow:2px 2px 3px #555;
				margin:9px 11px 11px 9px;
			}

				div#contact-content div.social a:hover p {
					color:#fff;
				}

	div#contact-content aside {
		margin:10px 0;
		padding:5px 15px;
		width:295px;
		float:right;
		border-left:1px solid #C5E0C5;
	}

		div#contact-content aside h4 {
			margin-bottom:12px;
			color:#004300;
		}
		
		div#contact-content aside p {
			font-size:1.3em;
			line-height:1.6em;
			margin-bottom:1.6em;
			text-align:justify;
			width:280px;
		}

/*----------------------------------

FOOTER

----------------------------------*/

footer {
	clear:both;
	margin:0 0 10px;
	width:960px;
	/*background:#f6f6f6;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	box-shadow:1px 1px 2px #333;
	-moz-box-shadow:1px 1px 2px #333;
	-webkit-box-shadow:1px 1px 2px #333;*/
}

	footer p {
		color:#aaa;
		padding:0 15px 10px;
	}
	
		footer p a {
			color:#aaa;	
		}
		
			footer p a:hover {
				color:#fff;	
			}