
/* start css reset */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline;}

* {
	margin:0;
}

ol, ul { list-style: none; }
blockquote, q {	quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

/* remember to define focus styles! */
:focus { outline: 0; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table {	border-collapse: collapse;	border-spacing: 0; }

/* end css reset */

/* generic classes */

html, body { height: 100%; }

.left { float:left; }
.right { float:right; }
img.left { padding: 0 20px 10px 0; }
img.right { padding: 0 0 10px 20px; }

#home-callouts h1 { font-size: 29px; color: #777; line-height:35px; margin:20px 37px; position:relative; }
#home-callouts h1 i { color:#333; }
h1 { font-size: 35px; color: #333; margin-top: -30px; margin-left:62px; position:absolute; }
h2 { font-size: 20px; color: #5a5a5a; margin-bottom:10px; }
#footer h2, #footer h2 a { font-size: 16px; color: #bbb; margin-bottom:10px; }

p { font-size: 16px; font-weight:normal; color:#959595; line-height: 24px;  }
p a { color:#999; }

hr { height:1px; width: 980px; background-color:#ddd; margin:40px 0; }

/* start site IDs and Classes */

body { color:#999999; font-family: "Lucida Sans", arial, tahoma; line-height:18px; background-color:#fff; }

#container { margin: 0 auto -170px; padding:0 0 20px 0; width: 100%; height: auto !important; min-height: 100%; }

#topnav { background: url('/images/bg_nav.png'); background-repeat:repeat-x; height:48px; width:100%; font-size:16px; }
	#topnav ul { margin:0 auto;	width: 980px; padding:16px 0 0 0; }
	#topnav li { padding:10px 22px;	display:inline;	}
	#topnav li.first { padding:10px 0 0 19px; display:inline; }
	#topnav a { color:#999999; text-decoration:none; padding: 5px 8px; }
	#topnav a:hover { color:#000; background-color:#f3df01; -moz-border-radius:4px; -webkit-border-radus:4px; padding: 5px 8px; }
	
#header { /*background-image: url('/images/bg_middle.png'); background-repeat: repeat-x;*/background-color:#fff; height: 175px; }	
#logo { width: 374px; padding-top:5px; margin: 0 auto; }

#content { width: 980px; margin:0 auto; /*background-image: url('/images/contentGlow.jpg'); background-position: top center; background-repeat: no-repeat;*/ }

#home-callouts { }
	#home-callouts .callout-left { width:420px; float:left; padding: 30px 0 0 0; }
		.callout-right img { border: 4px solid #c2c2c2; -moz-border-radius: 4px; -webkit-border-radius: 4px;	padding:0; margin:0 20px 10px 0; }
	#home-callouts .callout-right {	width:533px; float:right; margin: 30px 0 0 0; }		
	#home-callouts a { padding: 10px 7px 12px 1px; color:#777; text-decoration:none;}

.button { padding: 14px 22px; background-image: url('/images/button.png'); background-repeat: no-repeat; color:#777; font-size:18px; width: 243px; height:46px; margin:0 auto; clear:both; }
	
#twitter { clear:both; width: 980px; border-top: 1px solid #ddd; margin:0 auto; padding: 15px; }
	#twitter_div { color:#bfbfbf; font-size:12px; font-weight:normal; }
	#twitter_div a { color:#999; font-size:12px; font-weight:normal; text-decoration:underline; }
	#twitter_update_list li { line-height: 18px; margin: 0 0 4px 10px; list-style-type:circle; list-style-position:outside; }
	#twitter-link { position: relative; margin-top:-20px; }

/* styles for sticky footer */

#main { padding-bottom: 169px;}  /* must be same height as the footer */

#item { width:475px; float: left; margin:40px 0 20px 0; }
.item-icon { width:120px; text-align:center; float:left; padding:0 0 300px 0; }
.item-content { width:440px; }

#item-how { width:475px; float: left; margin:40px 0 0 0; }
.item-icon-how { width:120px; text-align:center; float:left; padding:0 0 225px 0; }


#work-sample { width:900px; float: left; margin:40px 0 0; padding:0 0 40px 0; border-bottom:1px solid #ddd; }
.work-image { padding:0 20px 0 0; float:left; }
.work-image img { width:495px; border:3px solid #ccc; -moz-border-radius: 4px; -webkit-border-radius: 4px;}
.work-content { width:350px; float:right; }
#work-sample a { color:#999; text-decoration:underline; }

/* Work Gallery Styles */
#pagination { text-align:center; margin-bottom:5px; height: 25px; }
#pagination a { margin:10px 0 10px 0; color:#5A5A5A; padding:2px 6px; background-color:#eee; -moz-border-radius:4px; -webkit-border-radius:4px; text-decoration:none; }
#pagination a:hover, #pagination a:active { background-color:#ddd; }
#page1, #page2, #page3 { margin: 0px; }
.cat-title h2 { color:#5A5A5A; margin-left:65px; }


#testimonials { }
#testimonials li { list-style-image: url('/images/testimonials.png'); list-style-position:outside; vertical-align: middle; margin:60px 0 0 75px; padding: 15px; }

#contact { width: 530px; float:left; margin:40px 0 0 63px; }
#contact ul li { display:inline; margin:20px 0 0 40px;}

#about{ width: 845px; float:left; margin:40px 0 0 63px; }

#footer { margin-top: -170px; position: relative; height: 169px; clear:both; background-color:#515151; background-image: url('/images/bg_footerTop.gif'); background-repeat: repeat-x;} 
#footer, .push { height:170px; }
	#footer ul, #footer li { line-height: 24px; font-size: 12px; }
	#footer li a { color:#989898; font-size:12px; text-decoration:none; }
	#footerHolder { width:980px; margin:0 auto; padding-top: 25px; }
		#footerLeft { width: 315px; float:left; }
		#footerRight { width: 665px; float:right; }
			#footerRight h2 { line-height: 30px; }
	#socialIcons, #socialIcons ul { width: 257px; height: 37px; display:inline; }
	ul#socialIcons, #socialIcons li { padding:0; margin:10px 0 0 0; display:inline; }
		#socialIcons li a { filter:alpha(opacity=60); -moz-opacity:.6; -khtml-opacity: .6; opacity: .6; }
		#socialIcons li a:hover { filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1;}
	
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix { display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix { display: block;}
/* End hide from IE-mac */





