@charset "utf-8";
/* Markup by Matthew Rochow */
/* http://www.matthewrochow.com */

/* Reset */
a, abbr, acronym, address, area, b, bdo, big, blockquote, body, button, caption, cite,
code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, h1, h2, h3, h4,
h5, h6, hr, html, i, images, ins, kbd, label, legend, li, map, object, ol, p, param, pre,
q, samp, small, span, strong, sub, sup, table, tbody, td, textarea, tfoot, th, thead,
tr, tt, ul, var {margin:0;padding:0;vertical-align:baseline}

/* Defaults */
:focus {outline:0}
a, a:visited {}
a:hover {}
body {background:#FFF url(../images/bg.jpg) left top repeat;color:#000;font:75%/125% Tahoma,Arial, Sans-Serif;padding: 0 0 100px}
img {border:0;vertical-align:bottom}
fieldset {border:0}
p {margin:0 0 1em}

/* Containers */
#page{background:url(../images/content.png) left top repeat-y;margin:25px auto 0;position:relative;width:1024px}
#page div{background:url(../images/header-bg.jpg) left top no-repeat;margin:0 auto;position:relative;width:1024px}
#page div div{background:url(../images/footer.jpg) left bottom no-repeat;margin:0 auto;overflow:hidden;padding:0 0 163px;position:relative;width:1024px}
#page div div div{background:none;padding:0}
	
/* Header */
#header{height:302px}
#logo{float:left;position:relative}
p#top-banner{background:url(../images/banner.jpg) left top no-repeat;display:inline;float:right;height:33px;margin:21px 30px 0 0;padding:8px 0 0 20px;width:641px}
p#top-banner a{color:#06c1f7;font-size:.835em;text-decoration:none}

	/*Main Navigation*/
	ul#nav{clear:right;list-style:none;padding:53px 0 0;position:relative}
	ul#nav li{float:left;height:1%;margin:0 14px;padding:0;position:relative}
	ul#nav li a{display:block;height:51px;overflow:hidden;position:relative}
	ul#nav li a#about-me-nav{margin:0 0 0 17px;width:117px}
	ul#nav li a#seo-nav{width:202px}
	ul#nav li a#design-nav{width:84px}
	ul#nav li a#portfolio-nav{width:112px}
	
		/*Main Navigation Image Replacements*/
		ul#nav li a span{cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%}
		ul#nav li a#about-me-nav span{background:url(../images/nav.png) left top no-repeat}
		ul#nav li a#seo-nav span{background:url(../images/nav.png) -117px top no-repeat}
		ul#nav li a#design-nav span{background:url(../images/nav.png) -319px top no-repeat}
		ul#nav li a#portfolio-nav span{background:url(../images/nav.png) right top no-repeat}
		
			/*Main Navigation Image Replacements : Hovers and Currents*/
			ul#nav li a#about-me-nav:hover span,ul#nav li.current a#about-me-nav span{background:url(../images/nav.png) left bottom no-repeat}
			ul#nav li a#seo-nav:hover span,ul#nav li.current a#seo-nav span{background:url(../images/nav.png) -117px bottom no-repeat}
			ul#nav li a#design-nav:hover span,ul#nav li.current a#design-nav span{background:url(../images/nav.png) -319px bottom no-repeat}
			ul#nav li a#portfolio-nav:hover span,ul#nav li.current a#portfolio-nav span{background:url(../images/nav.png) right bottom no-repeat}
	
/* Content*/
#page div div #content{background:none;clear:both;color:#fff;display:inline;float:left;margin:0 100px 0 123px;width:803px}
#portfolio #page div div #content{line-height:24px;margin:0 0 0 123px;width:586px}

		/*Portfolio Content*/
		#portfolio #page div div #content div{float:left;height:260px;margin:5px 20px 20px 0;width:262px}
		#portfolio #page div div #content div img{background:#fff;border:1px solid #000;padding:2px}
		#portfolio #page div div #content div a{color:#144a05;float:right;font-size:.835em;font-weight:700;text-decoration:none}
		#portfolio #page div div #content p{margin:9px 0 1em}
		#content h3{color:#a33000;font-size:1.165em;text-transform:uppercase}
		#content h3 span{color:#fff;text-transform:none}
		
/* Sidebar */
#portfolio #page div div #sidebar{background:none;display:inline;float:right;line-height:23px;margin:0 100px 0 0;overflow:visible;padding:0;width:196px}
#portfolio #page div div #sidebar h2{color:#c8ccc5;height:41px;margin-top:-40px;overflow:hidden;position:relative;width:196px}
#portfolio #page div div #sidebar h2 span{background:url(../images/client-thoughts.png) left top no-repeat;height:100%;left:0;position:absolute;top:0;width:100%}
#portfolio #page div div #sidebar blockquote{color:#8c8a8a;font-size:1em;font-weight:700}
#portfolio #page div div #sidebar cite{color:#8c8a8a;float:right;font-size:1em;font-style:normal;font-weight:700}

	/*Next and Previous links*/
	#portfolio #page div div #sidebar a#back,#portfolio #page div div #sidebar a#next{color:#e07032;display:block;font-size:1.5em;font-weight:700;overflow:hidden;position:absolute;text-decoration:none;top:-80px}
	#portfolio #page div div #sidebar a#back{height:32px;top:-87px;width:86px}
	#portfolio #page div div #sidebar a#next{height:25px;right:0;width:80px}
	
		/*Next and Previous Image Replacements*/
		#portfolio #page div div #sidebar a#back span,#portfolio #page div div #sidebar a#next span{cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%}
		#portfolio #page div div #sidebar a#back span{background:url(../images/back.png) left top no-repeat}
		#portfolio #page div div #sidebar a#next span{background:url(../images/next.png) left top no-repeat}

/* Footer */
#page div div #footer{background:url(../images/footer-box.jpg) left bottom no-repeat;bottom:0;clear:both;height:257px;padding:46px 0 0 53px;position:absolute;right:0;width:252px}
#page div div #footer h2{color:#fff;font-size:2.3em;height:48px;line-height:28px;margin:0;overflow:hidden;padding:0;position:relative;width:219px}
#page div div #footer h2 span{background:url(../images/how-to.jpg) left top no-repeat;height:100%;left:0;position:absolute;top:0;width:100%}

	/*How to contact*/
	#page div div #footer ul{list-style:none;padding:20px 0 0;position:relative}
	#page div div #footer ul li a{color:#fff;display:block;margin:6px 0}
	#page div div #footer ul li a#send{height:32px;position:relative;width:205px}
	#page div div #footer ul li a#linkedin{height:48px;position:relative;width:197px}
	#page div div #footer ul li a#vcard{height:31px;position:relative;width:200px}
	
		/*Footer Image Replacements*/
		#page div div #footer ul li a#send span{background:url(../images/send.jpg) left top no-repeat;cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%}
		#page div div #footer ul li a#linkedin span{background:url(../images/profile.png) left top no-repeat;cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%}
		#page div div #footer ul li a#vcard span{background:url(../images/vcard.png) left top no-repeat;cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%}