/* reset */

* {
	margin:0;
	padding:0;
}
/* - - - - - - - - - - - - - - - - - - - - - - 
				  TYPOGRAPHY					
- - - - - - - - - - - - - - - - - - - - - - - */


@font-face {
	font-family: 'RalewayThin';
	src: url('../fonts/raleway_thin-webfont.eot');
	src: local('Raleway Thin'), 
	     local('RalewayThing'),
	      url('../fonts/raleway_thin-webfont.woff') format('woff'), 
		  url('../fonts/raleway_thin-webfont.ttf') format('truetype'), 
		  url('../fonts/raleway_thin-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}



body { background-color:#efefef; font-family:Helvetica, Arial, sans-serif; overflow-x:hidden; }

p { margin:15px 0; line-height:20px; }
	
p, li { font-size:14px; }

p.intro { font-weight:bold; }

ul, ol { margin:10px 0 20px; }

li { color:#000; margin:5px 0; }

a { color:#3aa7d6; text-decoration:none; outline:none; }

a:hover { color:#333; text-decoration:underline; }

h1, h2, h3, h4, h5, h6 { font-family: Helvetica, Arial, sans-serif; }

ul, ol { padding-left:5px; }

.fl { float:left; }

.fr { float:right; }

h2 {
	color:#3399cc;
	font-family:RalewayThin, Helvetica, Arial, sans-serif;
	font-weight:normal;
	letter-spacing:1px;
	font-size:35px;
	padding:15px 0;
	text-shadow:1px 1px 1px #CCCCCC;
}
h2.home { font-size:38px; }

h3 {
	color:#2d2d2d;
	font-family:RalewayThin, Helvetica, Arial, sans-serif;
	font-weight:normal;
	letter-spacing:1px;
	font-size:22px;
	padding:5px 0;
	border-bottom:1px dashed #b5dcf1;
	text-shadow:1px 1px 1px #CCCCCC;	
}
h4 {
	color:#3399cc;
	font-size:16px;
	padding:5px 0;
	border-bottom:1px dashed #B5DCF1;
}
.bold { color:#3399cc; }


/* - - - - - - - - - - - - - - - - - - - - - - 
				   LAYOUT					
- - - - - - - - - - - - - - - - - - - - - - - */

#container {
	clear:both;
	height:100%;
	margin:0 auto;
	position:relative;
}

#full-width { width:100%; }

#container .inside {
	clear:both;
	height:100%;
	margin:0 auto;
	position:relative;
	width:980px;
}

#content { 
	width: 625px;
	float:left;
	margin:25px 0 10px 0;
	}
	
	#content a, #sidebar a.link { background:#ddd; padding:5px 2px 2px 2px; }
	#content a:hover, #sidebar a.link:hover { background:none; text-decoration:none; }
	
	#content.full { width:980px; }
	#content.full h3 { clear:both; }

#content ul li {
	padding:14px 0 0 25px;
	display: block;
	font-size: 13px;
	font-weight: bold;
	background: url(../images/check-about.jpg) no-repeat;
	background-position: 0px 12px; 
}

#sidebar {
	width:315px;
	float:left;
	margin:25px 0 10px 30px;
}


.alignright { float:left; margin:0 10px 10px 0; }

/* - - - - - - - - - - - - - - - - - - - - - - 
					HEADER					
- - - - - - - - - - - - - - - - - - - - - - - */

#header {
	height:108px;
	border-bottom:2px solid #3399cc;
	background: url(../images/header-bg.jpg) repeat-x;
}
#header .inside {
	height:100%;
}
h1#logo a {
	background: url(../images/logo.png) no-repeat 0 -115px;
	text-indent:-9999px;
	display:block;
	z-index:1000;
	height:108px;
	width:350px;
	overflow:hidden;
}
h1#logo a:hover { background-position:0px 0px; }

.title { height:65px; border-bottom:3px solid #3399cc; -moz-box-shadow:0px 2px 9px #ccc; background:#ffffff; }
.title.home { height:15px !important; }

/* - - - - - - - - - - - - - - - - - - - - - - 
				  NAVIGATION					
- - - - - - - - - - - - - - - - - - - - - - - */

#navigation {
	position:absolute;
	top:-26px;
	right:15px;
}
#navigation li {
	float:left;
	display:block;
	margin:16px 0 0 0;
	width:100px;
	font-size:16px;
	font-weight:bold;
}

#navigation li#nav-home a:hover { background:url(../images/nav-current-bg1.png) no-repeat 0 0; color:#3aa7d6; }
#navigation li#nav-portfolio a:hover { background:url(../images/nav-current-bg1.png) no-repeat -100px 0; color:#3aa7d6; }
#navigation li#nav-services a:hover { background:url(../images/nav-current-bg1.png) no-repeat -200px 0; color:#3aa7d6; }
#navigation li#nav-about a:hover { background:url(../images/nav-current-bg1.png) no-repeat -300px 0; color:#3aa7d6; }
#navigation li#nav-blog a:hover { background:url(../images/nav-current-bg1.png) no-repeat -400px 0; color:#3aa7d6; }
#navigation li#nav-contact a:hover { background:url(../images/nav-current-bg1.png) no-repeat -500px 0; color:#3aa7d6; }


.current-home { background:url(../images/nav-current-bg1.png) no-repeat 0 0px; color:#3aa7d6 !important; }
.current-portfolio { background:url(../images/nav-current-bg1.png) no-repeat -100px 0; color:#3aa7d6 !important; }
.current-services { background:url(../images/nav-current-bg1.png) no-repeat -200px 0; color:#3aa7d6 !important; }
.current-about { background:url(../images/nav-current-bg1.png) no-repeat -300px 0; color:#3aa7d6 !important; }
.current-contact { background:url(../images/nav-current-bg1.png) no-repeat -500px 0; color:#3aa7d6 !important; }

#navigation li a {
	color:#ccc;
	display:block;
	text-decoration:none;
	text-align:center;
	line-height:120px;
	height:110px;
}
#navigation li a span:hover { color:#3aa7d6; }


/* - - - - - - - - - - - - - - - - - - - - - - 
				    BUTTONS					
- - - - - - - - - - - - - - - - - - - - - - - */

a.button-contact {
	background:transparent url(../images/contact-button.png) no-repeat 0 0;
	display:block;
	height:30px;
	overflow:hidden;
	text-indent:-9999px;
	width:108px;
}
a:hover.button-contact {
	background:transparent url(../images/contact-button.png) no-repeat 0 -30px;
}

#container .launch-site {
	background:transparent url(../images/launch-site.png) no-repeat 0 0;
	display:block;
	height:26px;
	overflow:hidden;
	text-indent:-9999px;
	width:92px;
	float:right;
}
#container .launch-site:hover {
	background:transparent url(../images/launch-site.png) no-repeat 0 -26px;
}

a.button-portfolio {
	background:transparent url(../images/view-portfolio.png) no-repeat 0 0;
	display:block;
	height:50px;
	overflow:hidden;
	text-indent:-9999px;
	width:211px;
	position:absolute;
	top:425px;
	left:594px;
}
a:hover.button-portfolio {
	background:transparent url(../images/view-portfolio.png) no-repeat 0 -47px;
}

/* - - - - - - - - - - - - - - - - - - - - - - 
				   SIDEBAR					
- - - - - - - - - - - - - - - - - - - - - - - */

#container ul.checkmarks li {
	margin:15px 0 30px;
	list-style-type:none;
	color:#414042;
}
ul.checkmarks {
	margin-left:0;
	padding-left:0;
}
#container ul.checkmarks li em {
	font-style:normal;
	font-weight:bold;
	text-transform:uppercase;
	color:#3aa7d6;
}
#container ul.docs {
	padding-left:30px;
}
#container ul.docs li {
	color:#414042;
	list-style-image:url(../images/doc.png);
	margin:15px 0;
}
#container ul.docs li em {
	font-style:normal;
	font-weight:bold;
	text-transform:uppercase;
	color:#3aa7d6;
}



/* - - - - - - - - - - - - - - - - - - - - - - 
				 HOME SLIDER				
- - - - - - - - - - - - - - - - - - - - - - - */
#home-page {
	position:relative;
	height:537px;
	width:981px;
	margin-left:10px;
	background: #efefef url(../images/home-bg.jpg) no-repeat top center;
}


/* - - - - - - - - - - - - - - - - - - - - - - 
			      PORTFOLIO					
- - - - - - - - - - - - - - - - - - - - - - - */

.portfolio-box {
	width:265px;
	float:left;
	background-color:#eeeeee;
	margin:45px 19px 30px 19px;
	padding:10px;
	position:relative;
	border:1px solid #ccc;
	
	-moz-box-shadow:0px 0px 8px #999;
	-webkit-box-shadow:0px 0px 8px #999;
	box-shadow: 0px 0px 8px #999;
}

.portfolio-item { background:none !important; }

.portfolio-box a { background:none; padding:0 !important; }
.portfolio-box img { border:3px solid #444; margin-bottom:5px; opacity:.8; filter:alpha(opacity=80); }
.portfolio-box img:hover { opacity:1.0; filter:alpha(opacity=100); }
.portfolio-box p { margin:8px 0; }

.personal-project {
	position:absolute;
	border:none !important;
	right:8px;
	top:-27px;
}

/* - - - - - - - - - - - - - - - - - - - - - - 
			       SERVICES					
- - - - - - - - - - - - - - - - - - - - - - - */
.services-box { min-height:330px; height:330px; border-bottom:2px solid #3399cc; margin-bottom:20px; }
.services-box.last { border-bottom:none; margin-bottom:0;}

#services-page { margin-bottom:20px; overflow:hidden; }

#services-page img { border:3px solid #444444; margin-bottom:10px; opacity:0.8; -moz-box-shadow:0px 0px 5px #999; -webkit-box-shadow:0px 0px 5px #999; }
#services-page img:hover { opacity:1.0; }

.services-left { float:left; width:330px; }

#services-page ul  {
	padding:0px;
	margin:0px;
	float:right;
	width:635px;
}

#services-page ul li {
	color:#757575;
	margin:0px 0px 25px 0px;
	padding:0px 0 0 65px !important;
}

#services-page ul li.custom-site-design { background: url(../images/services-icons.jpg) no-repeat 0 15px !important; }
#services-page ul li.seo { background: url(../images/services-icons.jpg) no-repeat 0 -82px !important; }
#services-page ul li.valid-code { background: url(../images/services-icons.jpg) no-repeat 0 -193px !important; }
#services-page ul li.kick-start { background: url(../images/services-icons.jpg) no-repeat 0 -289px !important; }
#services-page ul li.brochure { background: url(../images/services-icons.jpg) no-repeat 0 -410px !important; }
#services-page ul li.business-cards { background: url(../images/services-icons.jpg) no-repeat 0 -522px !important; }
#services-page ul li.brand-recognition { background: url(../images/services-icons.jpg) no-repeat 0 -625px !important; }
#services-page ul li.who-are-you { background: url(../images/services-icons.jpg) no-repeat 0 -727px !important; }
#services-page ul li.stand-out { background: url(../images/services-icons.jpg) no-repeat 0 -825px !important; }

#services-page h3 {
	font-weight:bold;
	color:#2d2d2d;
	font-family: Helvetica, Arial, sans-serif;
	font-size:16px;
	padding:3px 0;
	border:none;
	text-shadow:none !important;
}
#services-page p { font-weight:normal; margin:0; padding:0; }
#services-page span { line-height:20px; font-size:13px; }



/* - - - - - - - - - - - - - - - - - - - - - - - - 
				    ABOUT			
- - - - - - - - - - - - - - - - - - - - - - - - - */
#about-me { margin-bottom:20px; overflow:hidden; }

#about-me img { float:left; }

#about-me ul  {
	padding:0px;
	margin:0px;
	float:right;
	width:635px;
}

#about-me ul li {
	color:#757575;
	margin:0px 0px 12px 0px;
	padding:0px 0 0 65px !important;
}

#about-me ul li.small-town-boy { background: url(../images/about-me-image.jpg) no-repeat 0 28px !important; }
#about-me ul li.art-enthusiast { background: url(../images/about-me-image.jpg) no-repeat 0 -92px !important; }
#about-me ul li.video-game-veteran { background: url(../images/about-me-image.jpg) no-repeat 0 -228px !important; }
#about-me ul li.music-lover { background: url(../images/about-me-image.jpg) no-repeat 0 -354px !important; }
#about-me ul li.moravian-college-grad { background: url(../images/about-me-image.jpg) no-repeat 0 -465px !important; }

#about-me h3 {
	font-weight:bold;
	color:#2d2d2d;
	font-family: Helvetica, Arial, sans-serif;
	font-size:16px;
	padding:3px 0;
	border:none;
	text-shadow:none !important;
}
#about-me p { font-weight:normal; margin:0; padding:0; }

h3.links { position:absolute; margin-top:12px; border:none; }


/* - - - - - - - - - - - - - - - - - - - - - - 
				    FOOTER					
- - - - - - - - - - - - - - - - - - - - - - - */

#footer {
	color:#666;
	clear:both;
	padding:10px 0 25px 0;
	width:100%;
	margin:20px auto 0px auto;
	position:relative;
	height:185px;
	background:#22272a url(../images/footer-bg.jpg) repeat-x;
	border-top:2px solid #3399cc;
	overflow:hidden;
}
#footer .block {
	margin:0 15px;
	float:left;
	width:215px;
	border-style:none;
	color:#ccc;
}
#footer .big {
	width:435px !important;
}
#footer .short {
	height:160px !important;	
}
#footer h4 {
	border-bottom:1px dashed #E2E2E2;
	color:#E2E2E2;
	font-family:RalewayThin,Helvetica,Arial,sans-serif;
	font-size:20px;
	font-weight:normal;
	letter-spacing:1px;
	padding-bottom:5px;
}
#footer a {
	color:#3aa7d6;
}
#footer a:hover {
	color:#EEE;
}

#twitter_update_list {
	list-style:outside;	
}

#twitter_update_list li {
	list-style-type: none;
	padding:6px 0;
	background:transparent url(../images/check_small_footer.png) no-repeat scroll 0px 8px;
	text-indent:20px;
}

#twitter_update_list span {
	color:#ccc;
}
#twitter_update_list a {
	display:inline;
	color:#3aa7d6;
}
.flickr-footer {
	display: block;
	height: 24px;
	width:46px;
	text-indent: -9999em;
	text-decoration: none; 
	z-index: 1000; 
	background: url(../images/flickr-footer.png) no-repeat;
	position:relative;
	top:8px;
}
.flickr-footer:hover {
	background-position: 0px -24px;	
}
.twitter-footer {
	display: block;
	height: 46px;
	width:38px;
	text-indent: -9999em;
	text-decoration: none; 
	z-index: 1000;
	background: url(../images/twitter-footer.png) no-repeat;
	position:relative;
	top:-29px;
	left:59px;
}
.twitter-footer:hover {
	background-position:0 -46px;	
}
.rss-footer {
	display: block;
	height: 45px;
	width:46px;
	text-indent: -9999em;
	text-decoration: none; 
	z-index: 1000;
	background: url(../images/rss-footer.png) no-repeat;
	position:relative;
	top:-75px;
	left:115px;
}
.rss-footer:hover {
	background-position:0 -45px;	
}

 

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
                  CONTACT PAGE
- - - - - - - - - - - - - - - - - - - - - - - - - - */

/* -- social profiles - - */

#social-profiles {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	margin-bottom: 5px;
	clear:both;
}
 
	#social-profiles li { margin-bottom: 5px; }
 
		#social-profiles li a {
			display: block;
			height: 43px;
			width:44px;
			margin:0 3px;
			text-indent: -9999px;
			float:left;
			padding:0; }
			
 			#account-twitter, #account-twitter a { background: url(../images/social-profiles.jpg) no-repeat; }
				#account-twitter a:hover { background-position:0px -46px; }
			#account-facebook, #account-facebook a { background: url(../images/social-profiles.jpg) -51px 0px no-repeat; }
				#account-facebook a:hover { background-position:-51px -46px; }
			#account-linked, #account-linked a { background: url(../images/social-profiles.jpg) -101px 0px no-repeat; }
				#account-linked a:hover { background-position:-101px -46px; }
			#account-flickr, #account-flickr a { background: url(../images/social-profiles.jpg) -151px 0px no-repeat; }
				#account-flickr a:hover { background-position:-151px -46px; }
			#account-stumble, #account-stumble a { background: url(../images/social-profiles.jpg) -202px 0px no-repeat; }
				#account-stumble a:hover { background-position:-202px -46px; }
			#account-rss, #account-rss a { background: url(../images/social-profiles.jpg) -253px 0px no-repeat; }
				#account-rss a:hover { background-position:-253px -46px; }
				
			 
			 
/* - - form - - */
hr { 
	color: inherit; 
	height: 0; 
	margin: 6px 0 6px 0; 
	padding: 0; 
	border: 1px solid #ddd; 
	border-style: none none solid; 
}

#contact { 
	padding: 10px; 
 }

/* Form style */

label {
	display: inline-block;
	float: left;
	line-height: 40px;
	padding-right:10px;
	text-align:right;
	height:25px;
	width: 115px;
	font-size: 15px;
}
input, textarea, select {
	margin: 0;
	padding: 5px;
	color: #666;
	background: #f5f5f5;
	border: 1px solid #ccc;
	margin: 5px 0;
	font-size:13px;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
}
input:focus, textarea:focus, select:focus {
	border: 1px solid #999;
	background-color: #fff;
	color:#333;
	-moz-box-shadow: 0px 0px 5px #06F;
}
input.submit {
	cursor: pointer;
	border: 1px solid #222;
	background:#333;
	color:#fff;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
}
input.submit:hover {
	background:#444;
}
fieldset {
	padding:10px;
	border-top:1px solid #ddd;
	border-left:none; border-bottom:none; border-right:none;
}
legend {
	padding:7px 10px;
	font-weight:bold;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
}
span.required {
	font-size: 13px;
	color: #ff0000;
} /* Select the colour of the * if the field is required. */
/* Style for the error message */

.error_message {
	display: block;
	height: 22px;
	line-height: 22px;
	background: #FBE3E4 url(..images/error.gif) no-repeat 10px center;
	padding: 3px 10px 3px 35px;
	margin: 10px 0;
	color:#8a1f11;
	border: 1px solid #FBC2C4;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
}
#succsess_page h1 {
	background: url(../images/success.gif) left no-repeat;
	padding-left:22px;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
                         404 
- - - - - - - - - - - - - - - - - - - - - - - - - - */

body.error404 { 
	background:#39A3D3 url(../images/error-bg.png) repeat-x scroll 0 0; 
	margin:0;
	padding:0;
	text-align:center;
}

.error-404 {
	background: url(../images/error-404.jpg) no-repeat;	
	text-indent:-9999em;
}

.error-bg {
	height:392px;
	position:absolute;
	left:0;
	top:142px;
	width:934px;
}

body.error404 h1#logo a { margin:0 auto; top:20px; }

body.error404 h2 { margin-top:415px; color:#fff; }

body.error404 #navigation { position:absolute; top:585px; right:200px; }

body.error404 #navigation li a { color:#fff; }
body.error404 #navigation li a span:hover { background:#fff !important; color:#79777A; }
