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



/*Main styles*/ 

body 		{background:url('../images/bg.jpg') repeat-x #445052; margin:0; font-family: Arial, Tahoma, Helvetica, sans-serif; color:#FFFFFF; font-size:12px; line-height:18px;}
#container	{width:800px; }
#header		{width:800px;}
#logo		{width:165px; padding-left:20px; float:left;}
#nav		{width:615px; position:relative; float:right;}
#email		{color:#FFFFFF; font-size:14px;  padding:50px 10px 10px 0px; width:600px; text-align:right;}

.clear		{clear:both; padding-bottom:80px;}
.clearplain		{clear:both; padding-bottom:40px;}


.storydivider	{clear:both; padding:20px 0;}

.photoclear		{clear:both; padding-top:10px 0 20px 0;}

.subnavclear	{clear:both;}



/*Navigation styles*/ 

#navigation					{width:290px; float:right; padding:10px 0 0 0px; margin:0; height:76px;}
							/*{width:615px; float:left; text-align:right; height:0px; padding-top:30px; }*/
#navigation .current		{border-top:4px solid #be4380; padding:6px 2px; margin:0;}
#navigation ul				{font-size:16px;  padding:0px; margin:0; font-weight:normal; font-family:Arial, Helvetica, sans-serif;}
#navigation li				{display:block; padding:0 5px; list-style-type:none; }

#navigation li	a,
#navigation li.pipe			{display: block; float: left; width: inherit; height: 0px; margin:0 2px; padding-top:10px; color: #fff; text-decoration: none; font-weight:normal; font-size:0.90em; }

#navigation a:hover			{border-top:4px solid #be4380; text-decoration:none; padding-top:6px;}



#subnav				{width:300px; float:left; padding:0px 0 10px 34px;}

#subnav ul			{font-size:16px;  padding:0px; margin:0; font-weight:normal; font-family:Arial, Helvetica, sans-serif;}
#subnav li			{display:block; padding:0 5px; list-style-type:none;}
#subnav li.pipe, #subnav li a		{display: block; float: left; width: inherit; height: 0px; margin:0 2px; padding-top:10px; color: #fff; text-decoration: none; font-weight:normal; font-size:0.90em; }


/*Main Content homepage*/ 

#maincontent		{width:800px; clear:both;  padding:15px 0;}
#mainstory			{width:800px;}
#mainstory p		{padding-top:20px; }
#mainstory img		{padding-bottom:10px;}
.header				{border-bottom:dotted 1px #ffffff;}
#image				{width:360px; position:absolute; float:left; padding:0px 20px;}
#copy				{width:320px;  padding:60px 0 60px 450px; position:relative;}
#titles				{float:left;}

/*flick*/

#flickr { padding: 0px 0 0 0;  }

#flickr img { margin: 0 8px 8px; border:3px solid #a3aeb1;}


/*Promotion areas homepage*/ 

#promocontent		{float:left; width:100%; padding-top:20px; padding-bottom:40px;}	
#printcolumn		{margin:0 100px 0 280px; width:240px;}
.promocontent		{margin:10px; margin-top:0; width:220px;}
.promocontent img	{padding-bottom:20px;}
.promocontent h1	{width:100%; border-bottom:1px dotted #ffffff;}

#emailmarketing		{float:left; width:180px; margin-left:-780px; padding-top:20px; }
#photography		{float:left; width:200px; margin-left:-260px; padding-top:20px;}



/*Link styles*/ 

#toppage		{text-align:right; padding-right:10px; padding-top:10px; padding-bottom:70px;}


#email a	{color:#FFFFFF; font-size:14px;  padding:0px; text-decoration:none;}
#email a:hover	{text-decoration:underline;}

a.more 	{color:#be4380; text-decoration:none; font-weight:bold; }
a.more:hover {color:#ffffff; text-decoration:none; font-weight:bold; }


/*NEW portfolio page*/

#contentThumbs			{width:760px; padding:20px 0 20px 40px;}
.thumbFramework			{width:170px; float:left; padding-right:20px; }
.dottedline				{border-bottom:dotted 1px #ffffff; width:169px; padding-top:10px;}
.dottedlinedouble		{border-bottom:dotted 1px #ffffff; width:169px; padding-top:28px;}
.dottedlinetriple		{border-bottom:dotted 1px #ffffff; width:169px; padding-top:46px;}
.imagepadding			{padding:10px 0 0 0;}
.projectCopy			{width:170px; float:left; padding-right:20px; }
.projectImages			{width:570px; float:left;}
.projectImages	 img	{padding-bottom:30px;}
.projectTitle			{padding-bottom:20px; border-bottom:dotted 1px #ffffff;}
#portfolioLinks			{float:left; width:120px;padding-left:220px;}


/*Web design page*/

#titles				{width:420px; padding:15px 0 0 40px; }
.subtitle			{width:710px; padding:35px 0 0px 40px;}

#webstory		{width:800px; clear:both; height:220px; padding-bottom:20px;}
.webstoryimage		{float:left; padding:25px 35px; width:340px;}
.webstorycopy		{float:right; width:380px; padding-top:25px; padding-left:10px;   height:0; margin:0;}
.webstorycopy img	{padding-bottom:10px;}


#webstorylast		{width:800px; clear:both; padding-bottom:80px; height:230px;}
.webstoryimagelast		{float:left; padding:25px 0 70px 35px; width:340px;}
.webstorycopylast		{float:right; width:380px; padding-top:25px; padding-left:10px; height:0; margin:0;}
.webstorycopylast img	{padding-bottom:10px;}



/*Contact page*/

#contact		{width:800px; clear:both; padding:0 0 140px 10px; height:430px;}
.contactimage		{float:left; padding:25px 35px; width:340px;}
.contactcopy		{float:right; width:380px; padding-top:25px;   padding-left:10px; height:0; margin:0;}


#form				{padding:1px; font-size:11px; }
#form td			{padding:5px 0px;}
#form table			{background:#596362; border:1px solid #78807a; margin-top:50px; padding:10px;}
.fields				{border:1px solid #78807a; background:url('../images/fields_bg.gif');width:200px;}
#form .button		{background:url('../images/fields_bg.gif'); border:1px solid #adb1a3; font-size:12px; margin-top:15px;}

/*Photography page*/

#photographypage		{width:800px; clear:both; margin-left:0px;}
.photographypageimage		{float:left; padding:25px 35px 0 35px; width:340px;}

.photographypageimagetwo		{float:right; width:380px; padding-top:25px; padding-left:10px; height:0; margin:0;}
#photographypagelast		{width:800px; clear:both; padding-bottom:60px;}
.photographypageimagelast		{float:left; padding:25px 0 70px 35px; width:340px;}

.photographypageimagetwolast		{float:right; width:380px; padding-top:25px; padding-left:10px; height:0; margin:0;}

.title						{padding-top:20px;}
a.weblink					{color:#be4380; text-decoration:none; font-weight:bold; padding-left:0px;}
a.weblink:hover				{color:#ffffff; text-decoration:none; font-weight:bold; padding-left:0px;}

/*Footer styles*/ 

#footer		{clear:both; padding:40px 30px; ;  font-size:11px; color:#263a33;  background:url('../images/footer_bg.gif') repeat-x; position:relative;}

a.footerlink	{font-size:11px; color:#263a33; text-decoration:none;}
a.footerlink:hover	{font-size:11px; color:#263a33; text-decoration:underline;}