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

* { margin:0; padding:0; }
img { border: none; }
h1, h2 { color: #3c240b; font-weight: normal; }
p { font-size: 14px; margin: 10px 0; line-height: 20px; }
p.error { color: red; font-size: 12px; }
input, textarea { font-size: 14px; padding: 2px;}
input.error, textarea.error { border: 1px solid red; padding: 3px; }

a { outline: none; color: #eb1818; }
a:hover { color: #3c240b; background: #f9e8b4; }

body { background: black url(../images/body_background.png) repeat-x left top; color: black; font-family: "Trebuchet MS", Arial, sans-serif; }

#success, #failure { padding: 5px; position: absolute; bottom: 32px; right: 13px; width: 256px; }
#success { background: #c2faa7; color: #285c0e; }
#failure { background: #eea0a0; color: #5c0e0e; }

#wrapper { width: 970px; margin: 0 auto;  padding-top: 95px; position: relative; }

	#awards { position: absolute; top: -62px; left: 0; width: 100%; height: 78px; z-index: 3; }
		#stripe { height: 23px; background: url(../images/stripe.png) repeat-x center top; text-align: center; font-size: 14px; }
		#designshack { background: url(../images/award.png) no-repeat left bottom; width: 134px; height: 76px; position: relative; top: -23px; margin: 0 auto; }
			#designshack a { display: block; width: 110px; position: relative; left: 11px; top: 30px; }
			#designshack a:hover { text-decoration: none; }
	
	#header { height: 90px; background: transparent url(../images/main_header.png) no-repeat left top; }
		#header span.hidden { display: block; text-indent: -5000px; }
		#header a#webpaged { display: block; width: 375px; height: 50px; position: relative; left: 20px; text-indent: -5000px; }
		#header a:hover#webpaged { background: none; }

		#navigation { position: absolute; top: 80px; right: 15px; }
			#navigation ul { list-style: none; }
			 #navigation ul li { float: left; font-size: 18px; color: white; padding: 5px 15px; }
			 	#navigation ul li a { display: block; color: #3c240b; text-decoration: none; }
				#navigation ul li a:hover { color: white; background:none; }		

	#content-box { background: url(../images/content_background.png) repeat-y left top; padding: 0 5px; margin-top: -3px; }
		
		#content { padding: 0 20px; overflow: auto; }
			#content h1 { font-size: 20px; padding: 0 5px; margin-bottom: 5px; border-bottom: 1px solid #3c240b; }
			#content h2 { font-size: 18px; padding: 0 5px; }
			#content p { margin-left: 5px; margin-right: 5px; }
	
			#content-header img { margin-bottom: 15px; }
			
			.project { float: left; margin-top: 15px; }
				.project h2, .about h2 { margin-left: 19px; border-bottom: 1px solid #cccccc; background: #aaa url(../images/h2_background.png) repeat-x left top; color: white; margin-bottom: 0; }
				.about h2 { margin-left: 0 }
				
				.two-box-left { float: left; width: 605px; }
				.two-box-right { float: left; width: 305px; padding: 17px 0 0 5px; position: relative; }
					.two-box-right p { margin-top: 0; margin-bottom: 0; }
					
					.two-box-right dl { }
						.two-box-right dt { font-size: 16px; color: #b71313; }
						.two-box-right dd { font-size: 14px; margin: -2px 5px 8px 20px; line-height: 20px; }
	
			.three-box { width: 290px; float: left; }
			.three-box.middle { margin: 0 25px; }
			.three-box.about { padding-top: 20px; }
			.three-box#contact { position: relative; }
				.three-box#contact img { margin-left: 81px; }
				img#me { margin-left: 11px; }
				#content .three-box h1 { margin-bottom: 5px; }
				
			#about-box img, #portfolio-box img, #contact-box img { margin-left: 81px; }
			#portfolio-box {  }
			#contact-box { background: url(../images/contact.png) no-repeat 224px 15px; position: relative; }
				#contact-box h1 { margin-right: 65px; }
				#contact-box input[type=text], #contact-box textarea, #contact input[type=text], #contact textarea { width: 260px; }
			
		#content-footer { clear: left; height: 140px; background: url(../images/content_footer_background.png) no-repeat left bottom; margin-bottom: 10px; position: relative; }
	 		#content-footer p { position: absolute; top: 60px; font-size: 16px; text-align: center; width: 100%; }
			#content-footer a { color: #eb1818; }
			#content-footer a:hover { color: #3c240b; background: #f9e8b4; }