/* CSS Document */
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
/* Reset Starts */
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;
	background:transparent;
	font-family:Helvetica, Arial, sans-serif;
	color:#666666; }
	
body { line-height:1; background:url(../img/generic/background.jpg) 50% 0 no-repeat #e9e9e9;}
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; -moz-outline-style:none; }


/* 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;  }
table .submit, .createAccountTable
{
	border-collapse:separate;
}

* {margin:0; padding:0;}


/* Basic Typographic Styles */
p, h1, h2, h3, h4, h5, h6 { }
p, label { font-family:Helvetica, Arial, sans-serif; font-size:13px; color:#666666; line-height:17px; margin:0 0 10px 0; }
h1 	{ font-family:Helvetica, Arial, sans-serif; font-size:19px; color:#000000; line-height:22px; margin:0 0 10px 0; font-weight:lighter;}
h2 	{ font-family:Helvetica, Arial, sans-serif; font-size:12px; color:#666666; line-height:22px; margin:0 0 10px 0; font-weight:bold; text-transform:uppercase; border-bottom:1px #999999 dotted; display:block;}
h3 	{  font-family:Helvetica, Arial, sans-serif; font-size:20px; color:#7b9fae; line-height:22px; margin:0 0 5px 0; font-weight:lighter; }
h4 	{  font-family:Helvetica, Arial, sans-serif; font-size:13px; color:#000000; line-height:17px; margin:0; font-weight:bold;}
h5  {  }
h6 	{  }
li	{  }
b, strong {font-weight:bold; }

a 		{ text-decoration:none; font-weight:bold; color:#000000; }
a:hover	{ color:#0e83c3; }

img {}
img a:active { border:none; outline:none; ie-dummy: expression(this.hideFocus=true); }


.black {color:#000000;}


/* ===============================================================================
							Generic Styles
=============================================================================== */


#wrap {width:1000px; margin:0 auto; position:relative;}
#logo {position:absolute; top:72px; left:24px;}
#nav {width:1000px; height:140px; position:relative;}

/* Navigation styles */
#navigation { position:absolute; left:376px; top:90px;}
#navigation li { display:inline; margin:0; float:left; }
#navigation li a { font-weight:bold; font-size:12px; color:#000000; margin:0; text-transform:uppercase; padding:12px 16px 13px 16px; display:block; }
#navigation li a:hover { color:#FFFFFF; font-weight:bold;}


#navigation li a.act-home, #navigation li a.act-approach, #navigation li a.act-work, #navigation li a.act-contact {color:#ffffff;}

.act-home { 
	background-repeat:no-repeat;
	background-position:center; 
	color:#ffffff;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='img/nav/home.png');}
.act-home[class] { background-image:url(../img/nav/home.png); }

.act-approach { 
	background-repeat:no-repeat; 
	background-position:center; 
	color:#ffffff;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='img/nav/approach.png');}
.act-approach[class] { background-image:url(../img/nav/approach.png); }

.act-work { 
	background-repeat:no-repeat; 
	background-position:center; 
	color:#ffffff;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='img/nav/work.png');}
.act-work[class] { background-image:url(../img/nav/work.png);}

.act-contact { 
	background-repeat:no-repeat;
	background-position:center;  
	color:#ffffff;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='img/nav/contact.png');}
.act-contact[class] { background-image:url(../img/nav/contact.png);}





/* sub navigation styles */
#external-links { position:absolute; right:0px; top:15px; }
#external-links li { display:inline; margin:0 0 0 8px; float:left;}
#external-links li a { font-weight:bold; font-size:12px; color:#ffffff;  padding:5px; display:block; }
#external-links li a:hover { color:#000000;}







#content {width:1000px; position:relative;}
#content-top {width:1000px; height:378px; position:relative; margin-bottom:15px; background:url(../img/home/content-top-shadow.gif) no-repeat bottom center;}
#content-mid {width:948px; position:relative; margin:0 auto;}

#footer  {width:1000px; height:50px; position:relative; clear:both; border-top:1px #666666 dotted; padding:10px 0;}
.copy {float:right;}



/* IE6 Pop Up Layer */
.rss-popup { padding: 0; position: absolute; top:15px; display:block; left:0px; }
.rss-popup a { text-align:left; font-size:12px; font-weight:normal; color:#666666; display:block;}
 
div.rss-popup div {
	font-style:normal;
	width: 220px;
	height:191px;
	padding:10px;
	position: absolute;
	background:url(../img/generic/popup.gif) no-repeat top;
	top: -220px;
	left: -0px;
	text-align: center;
	z-index: 2;
	display: none; }
		
div.rss-popup div h1, div.rss-popup div p {color:#ffffff;}






/*  Homepage Styles */

#feature{ position:relative; width:736px; height:350px; padding:10px; background:#FFFFFF; overflow:hidden;}



ul#featured { 
	margin:0 12px 0 0; 
	padding:0; 
	display:block; 
	list-style:none; 
	width:756px; 
	height:370px; 
	background:url(../img/home/showcase.jpg) left center no-repeat; 
	padding-left:26px; 
	float:left;}
	
	
ul#featured li { margin:0; padding:0; display:block; width:736px; height:350px; padding:10px; background:#FFFFFF; display:inline;}

#newsletter {float:left; height:350px; width:160px; padding:10px; background:#ffffff; overflow:visible; z-index:50; margin-bottom:15px; }

#bubble { 
	height:96px;
	width:149px;
	z-index:99;
	position:relative;
	top:-40px;
	left:0px;
	margin-bottom:-35px; }
	
input#email { 
	background: url(../img/generic/inputShadow.gif) repeat-x bottom #f2f2f2; 
	border:10px solid #ffffff; 
	font-family:Helvetica, Arial, sans-serif; 
	font-size:14px; 
	padding:8px 8px 11px 8px; 
	height:30px; 
	border-left:0px; 
	margin-bottom:8px; 
	color:#666666;
	width:170px;}
	
	
input.newEmail { 
	background: url(../img/generic/inputShadow.gif) repeat-x bottom #f2f2f2; 
	border:10px solid #ffffff; 
	font-family:Helvetica, Arial, sans-serif; 
	font-size:14px; 
	padding:8px 8px 11px 8px; 
	height:30px; 
	border-left:0px; 
	margin-bottom:8px; 
	color:#666666;
	width:170px;}	
	
	
#intro { width:336px; background:#f2f2f2; padding:18px; float:left; margin-right:12px; margin-bottom:15px;}
#intro h1 { background:url(../img/home/hello.gif) no-repeat left; text-indent:-999px; width:119px; height:40px; }
#intro p { font-family:Helvetica, Helvetica Neue, Arial, sans-serif; font-size:20px; line-height:23px; color:#999999; }


#recent { width:352px; background:#ffffff; padding:10px; float:left; margin-right:12px; margin-bottom:15px;}

#recent div h1 a {font-weight:normal;}

ul.recentNav { margin-top:10px;}
ul.recentNav li { display:inline;}
ul.recentNav li a {display:block; margin-right:5px; float:left; background:#f2f2f2; color:#999999; padding:5px 7px; font-weight:lighter;}
ul.recentNav li a:hover {background:#ccc;}


#location {float:right; width:160px; padding:10px; background:#ffffff;}








/*  Our Approach Styles */

#app-head { 
	position:relative;
	width:948px; 
	height:348px;
	padding:26px;
	background:url(../img/app/appBack.jpg) no-repeat; }

#app-head h1 {font-family:Arial, Helvetica, sans-serif; font-size:22px; font-weight:bold; color:#365b6f; width:564px; line-height:24px; margin-bottom:50px;}

h3.secondary {color:#365b6f;}

#app-panel1, #app-panel2, #app-panel3, #app-panel4, #app-panel5 { 
	width:145px; 
	height:185px; 
	background:url(../img/app/panelShadow.gif) no-repeat bottom #ffffff;
	margin:20px 0;
	padding:15px;
	}

#app-panel1 { float:left; margin-right:12px;}
#app-panel2 { float:left; margin-right:12px;}
#app-panel3 { float:left; margin-right:12px;}
#app-panel4 { float:left; margin-right:12px;}
#app-panel5 { float:right; margin-right:24px;}

#app-panel1 strong, #app-panel2 strong, #app-panel3 strong, #app-panel4 strong, #app-panel5 strong { 
	color:#333333;
	}

img.sticky {margin:-29px 0 5px -10px;}

#app-mid { width:948px; position:relative; padding:26px;}

#services {background:#f2f2f2; width:352px; height:353px; float:left; margin:0 12px 15px 0; padding:10px;}
#services ul {color:#999999; font-size:19px; line-height:22px; margin:0 0 20px 0;}
#services ul li {font-size:19px; margin-bottom:1px;}

#approach {background:#f2f2f2; width:544px; height:353px; float:left; padding:10px;}

img.plan {float:right; margin:0 -36px -80px 0; z-index:99;}

#blog-ad { width:706px; height:126px; clear:both;}

#help { width:189px; height:114px; float:right; margin:-10px -8px -15px 0;}


#webBrief2 {width:160px; background:#FFFFFF; padding:10px; border-top:10px solid #e9e9e9; float:left; margin-bottom:15px;}
#webBrief2 img {margin:20px 0 0 0;}


ul.filter {}
ul.filter li {margin-bottom:5px;}
ul.filter li a {
	font-weight:normal; 
	display:block; 
	padding:7px; 
	border:#ebebeb solid 1px; 
	font-size:13px;
	color:#666666;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px; }
	
ul.filter li a.active {background:url(../img/work/star.jpg) no-repeat 95% 50% #0e83c3; color:#FFFFFF; border-color:#0e83c3; }






/***********************************************************
			         OUR WORK STYLES
***********************************************************/

#work-left { width:756px; float:left; margin:0 12px 15px 26px;}

#work-right { width:180px; float:right; margin:0 26px 15px 0;}


.portfolio { width:736px; background:#FFFFFF; padding:10px; height:auto;}

.work-image { width:736px; height:470px; display:block; background:#000000; margin-bottom:15px; }


ul.work-gallery {width:736px;  margin-bottom:10px; text-align:right;}
ul.work-gallery li {display:inline; margin-left:6px;}
ul.work-gallery li a { font-size:12px; color:#666666; padding:5px 8px; background:#e9e9e9;}
ul.work-gallery li a:hover { font-size:12px; color:#ffffff; padding:5px 8px; background:#aab9c0;}


.work-text { width:362px; float:left; padding:10px 0; height:120px;}
.work-text h1 {margin:0;}
.work-text a {font-weight:normal; color:#666666;}
.work-text a:hover {color:#0e83c3;}


.work-tag {width:352px; float:right; padding:10px 0; height:120px;}
.work-address {width:736px; margin-bottom:10px; border-top:1px #666666 dotted; border-bottom:1px #666666 dotted; clear:both; padding:8px 0;}
.work-address a { font-size:13px; color:#000000; font-weight:normal;}
.work-address a:hover { color:#0e83c3;}
.work-address div {float:right; cursor:pointer; }

.work-close {width:736px; height:30px; margin-bottom:20px; text-align:right; background:#FFFFFF; padding:8px 10px;}
.work-close a {background:url(../img/generic/close.gif) right 50% no-repeat; padding:0 15px 0 0;}


.portfolio .piece { height:325px; overflow: hidden; margin:0; }


.click {
	background: url(../img/work/click-background.jpg) no-repeat right bottom #ffffff; 
	padding:4px 8px;
	z-index:999;
	position:relative;
	display:inline-block;
	text-align:center;
	cursor:pointer;
	width:100px;
	height:25px;
	border-top-left-radius:3px;
	-webkit-border-top-left-radius:3px;
	-moz-border-top-left-radius:3px;
	border-top-right-radius:3px;
	-webkit-border-top-right-radius:3px;
	-moz-border-top-right-radius:3px; 
	 }
	 
.click p { font-size:11px; color:#567f95; font-weight:bold; text-transform:uppercase; margin:4px 0 0 0; }

.shadow {width:756px; height:8px; background:url(../img/work/workShadow.gif) repeat-x; float:left; margin-bottom:25px; }

.mouse {
	cursor:pointer;
	}


/***********************************************************
			         Contact Us STYLES
***********************************************************/

#contact-left { width:352px; height:565px; float:left; padding:40px 10px 10px 10px; background:#ffffff; margin-left:26px; margin-bottom:15px; }
#comment { 
	width:332px; 
	height:130px; 
	background:#fff; 
	border:1px solid #e9e9e9; 
	margin:-15px 0 10px 0; 
	font-family:Helvetica, Arial, sans-serif; 
	font-size:15px; 
	color:#666666;
	padding:20px 10px 10px 10px;}

#sayHello { width:149px; height:82px; position:relative; z-index:99; margin-top:30px;}

#contact-right { width:544px; height:460px; float:right; padding:10px; background:#ffffff; margin-right:26px; margin-bottom:15px;}

/* Google Map Styles */

#siteNotice { width:200px;}
#firstHeading, #bodyContent p  { overflow:visible;}

.genBtn {
	font-family:Helvetica, Arial, sans-serif; 
	font-size:12px;
	color:#FFFFFF; 
	background:url(../img/contact/genBtn.jpg) no-repeat;
	border:none;
	text-align:center;
	text-transform:uppercase;
	width:78px;
	padding:10px 0 15px 0;
	cursor:pointer;
	}

.contactBlog {clear:right; float:right; margin-right:26px;}

.testimonial1 {background: url(../img/work/test-head.jpg) no-repeat #ffffff;}
.testimonial2 {background: url(../img/work/test-head3.jpg) no-repeat #ffffff;}
.testimonial1,  .testimonial2 {width:160px; float:left; padding:70px 10px 10px 10px;}

.test-shadow1 {width:180px; float:left; margin-bottom:15px; height:6px; background:url(../img/work/test-shadow.jpg) no-repeat;}
.test-shadow2 {width:180px; float:left; margin-bottom:80px; height:6px; background:url(../img/work/test-shadow.jpg) no-repeat;}

.testimonial1 p, .testimonial2 p {font-size:12px; line-height:16px;} 
.testimonial1 p strong, .testimonial2 p strong {color:#000000; font-weight:lighter;} 



.return {
	position:absolute;
	top:100px;
	right:30px;
	}
.return p, .return a {color:#FFFFFF;}