@import url('reset.css');

html { background: url('../images/back.gif') top center repeat #45474d; }

body { position: relative; width: 61em; margin: 0 auto 10em; border-top: 1em solid #ef8200; font-family: 'Georgia'; color: #45474d; /*background: url('../images/columns.gif') top center repeat white;*/ }

hr { display: none; }
.clearall { clear: both; }


#pagehead { position: relative; width: 61em; height: 6em; }
	#pagehead h1, #pagehead p { font-size: 0; text-indent: -5000px; overflow: hidden; }
	#pagehead h1 { position: absolute; top: 0; left: 0; width: 176px; height: 96px; background: url('../images/logo.gif') top left no-repeat; }
		#pagehead h1 a { display: block; width: 176px; height: 96px; }
	#pagehead p { position: absolute; top: 32px; right: 17px; width: 137px; height: 32px; background: url('../images/slogan.gif') top left no-repeat; }

	
#pagebody { position: relative; width: 59em; margin: 0 1em; padding: 0.812em 0 2em; border-top: 0.0625em solid #d0d1d2; border-bottom: 0.0625em solid #d0d1d2; }
	body#cover #pagebody { border-top: 0; padding-top: 0; }

	#pagebody h2 { position: absolute; top: 0.9375em; left: 0; width: 14em; height: 1.125em; text-indent: -100em; overflow: hidden; }
		body#services  h2 { background-image: url('../images/head_services.gif'); }
		body#portfolio h2 { background-image: url('../images/head_portfolio.gif'); }
		body#about     h2 { background-image: url('../images/head_about.gif'); }
		body#contact   h2 { background-image: url('../images/head_contact.gif'); }

	.pagesection { clear: both; border-top: 0.0625em solid #ededed; padding: 0.8125em 0 2em; }
		#introduction { border-top: 0; padding-top: 0; }

		.mainsection { float: left; width: 44em; }
			.mainsection h3 { padding-left: 9.95833em; font-size: 150%; margin: 0 0 0.1875em; }
			.mainsection h4 { float: left; width: 11.2em; font-size: 125%; font-style: italic; color: #747579; margin-top: 0.15em; }
			.mainsection h5 { font-size: 75%; font-weight: bold; margin-bottom: 0.375em; padding-left: 20em; text-transform: uppercase; letter-spacing: 0.1667em; color: #747579; }
			.mainsection p { padding: 0 0.5em 0 15em; line-height: 1.5em; text-indent: 1em; }
			h3+p, h4+p, h5+p { text-indent: 0 !important; }
		.sidesection { float: right; width: 14em; margin-top: 0.1875em; }
			
#pagebody a { color: #45474d; text-decoration: none; }
	#pagebody p h2, #pagebody p h3, #pagebody p h4, #pagebody p a, .contentbox h4 a, .contentbox li a { border-bottom: 0.0625em dotted #a2a3a6; }
		#pagebody h2 a:hover, #pagebody h3 a:hover, #pagebody h4 a:hover, #pagebody p a:hover, .contentbox h4 a:hover, .contentbox li a:hover { color: #45474d; text-decoration: none; background-color: #ededed; border-bottom: 0.0625em solid #ededed; }
		#pagebody h2 a:active, #pagebody h3 a:active, #pagebody h4 a:active, #pagebody p a:active, .contentbox h4 a:active, .contentbox li a:active { color: white !important; text-decoration: none; background-color: #ef8200; border-bottom: 0.0625em solid #ef8200; }
		
		#pagebody h2 a, #pagebody h3 a, #pagebody h4 a, #pagebody a.example { border: 0; }
			#pagebody h2 a:hover, #pagebody h3 a:hover, #pagebody h4 a:hover, #pagebody a.example:hover, #pagebody h2 a:active, #pagebody h3 a:active, #pagebody h4 a:active, #pagebody a.example:active { border: 0; }
			#pagebody a.example:hover, #pagebody a.example:active { background: transparent; }
	

#pagefoot { width: 61em; height: 2em; background-image: url('../images/footer.gif'); }
	#pagefoot p { font-size: 0; text-indent: -5000px; overflow: hidden; }



/* MENU */

#pagemenu { position: absolute; top: 2.375em; left: 15.6875em; width: 404px; height: 20px; }
	#pagemenu ul li { float: left; }
		#pagemenu ul li a { display: block; height: 20px; margin-right: 16px; background-image: url('../images/menutabs.gif'); text-indent: -100em; overflow: hidden; }

		#pagemenu ul li#n_services  a { width:  89px; background-position:    0px   0px; }
		#pagemenu ul li#n_portfolio a { width: 106px; background-position:  -89px   0px; }
		#pagemenu ul li#n_about     a { width:  70px; background-position: -195px   0px; }
		#pagemenu ul li#n_contact   a { width:  91px; background-position: -265px   0px; margin-right: 0; }

		#pagemenu ul li#n_services  a:hover { background-position:    0px -20px; }
		#pagemenu ul li#n_portfolio a:hover { background-position:  -89px -20px; }
		#pagemenu ul li#n_about     a:hover { background-position: -195px -20px; }
		#pagemenu ul li#n_contact   a:hover { background-position: -265px -20px; }

		#pagemenu ul li#n_services  a:active { background-position:    0px -40px; }
		#pagemenu ul li#n_portfolio a:active { background-position:  -89px -40px; }
		#pagemenu ul li#n_about     a:active { background-position: -195px -40px; }
		#pagemenu ul li#n_contact   a:active { background-position: -265px -40px; }

		body#services  #pagemenu ul li#n_services  a { background-position:    0px -60px; }
		body#portfolio #pagemenu ul li#n_portfolio a { background-position:  -89px -60px; }
		body#about     #pagemenu ul li#n_about     a { background-position: -195px -60px; }
		body#contact   #pagemenu ul li#n_contact   a { background-position: -265px -60px; }



/* MAIN COVER */

body#cover #centerpiece { width: 59em; height: 22em; padding-bottom: 2em; border-bottom: 1px solid #d0d1d2; margin-bottom: 0.625em; background-image: url('../images/centerpiecetext.gif'); background-position: 15em 14em; }
	body#cover #centerpiece h2 { position: relative; width: 944px; height: 224px; background-image: url('../images/centerpiece.jpg'); font-size: 0; text-indent: -5000px; overflow: hidden; }
	body#cover #centerpiece p { font-size: 0; text-indent: -5000px; overflow: hidden; }
	
body#cover #whatwedo, body#cover #recentprojects { width: 59em; margin-bottom: 2em; line-height: 1.25em; }
	body#cover #whatwedo .module, body#cover #recentprojects .module { float: left; width: 14em; margin-right: 1em; }
		body#cover #whatwedo .module.internet, body#cover #recentprojects .module.internet { margin-right: 0; }

	body#cover #whatwedo h3, body#cover #recentprojects h3 { font-size: 175%; font-style: italic; margin-bottom: 0.3214em; color: #747579; margin-top: 0.1786em; }
	body#cover #whatwedo h4, body#cover #recentprojects h4 { font-size: 75%; font-weight: bold; padding-bottom: 0.5833em; border-bottom: 0.0833em solid #ededed; margin-bottom: 0.5em; text-transform: uppercase; letter-spacing: 0.1667em; color: #747579; }
		body#cover #whatwedo h4 a, body#cover #recentprojects h4 a { display: block; color: #747579; text-decoration: none; }
	body#cover #whatwedo p, body#cover #recentprojects p { line-height: 1.5em; }

	body#cover #whatwedo img { float: right; width: 50px; height: 50px; margin: 0.375em 0 0.25em 0.25em; }
	body#cover #whatwedo p.more { padding-top: 0.4375em; border-top: 0.0625em solid #ededed; margin-top: 0.5em; }
		body#cover #whatwedo p.more a:link { color: #747579; }

body#cover #recentprojects { border-top: 0.0625em solid #d0d1d2; padding-top: 0.625em; margin: 0; }
	body#cover #recentprojects h4 { margin-bottom: 1em; }
	body#cover #recentprojects img { width: 220px; height: 140px; padding: 1px; border: 1px solid #747579; }
		body#cover #recentprojects p.clientname a { font-size: 125%; line-height: 1.25em; color: #747579; text-decoration: none; }




/* SERVICES */

#identitydesign .sidesection,
#printdesign .sidesection,
#internetdesign .sidesection { background: #ededed; width: 13em; padding: 0.5em; }

.sidesection ul.portfolioexamples { list-style: none; width: 13em; }
	.sidesection ul.portfolioexamples li { float: left; width: 4em; height: 4em; margin: 0 0.5em 0.5em 0; }
		.sidesection ul.portfolioexamples li.example3 { margin-right: 0; }
	.sidesection ul.portfolioexamples li a, .sidesection ul.portfolioexamples li a:hover { display: block; width: 4em; height: 4em; border: 0 !important; background-color: transparent !important; }
		.sidesection ul.portfolioexamples li a img { width: 3.75em; height: 3.75em; padding: 0.0625em; border: 0.0625em solid #d0d1d2; background: white; }
			.sidesection ul.portfolioexamples li a:hover img { border: 0.0625em solid #747579; }
			.sidesection ul.portfolioexamples li a:active img { border: 0.0625em solid #ef8200; }

.sidesection p.more { clear: both; font-size: 75%; text-align: center; text-transform: uppercase; letter-spacing: 0.0625em; } 
	.sidesection p.more a { display: block; border-width: 0.0625em; border-style: solid !important; border-color: #d0d1d2 !important; padding: 0.25em 0 0.1875em; background: white !important; }
		.sidesection p.more a:hover { border-color: #747579 !important; background: white !important; }
		.sidesection p.more a:active { border-color: white !important; background: #ef8200 !important; }

body#services p.quote { font: normal 150%/1.1667em 'Georgia'; font-style: italic; color: #ef8200; text-indent: -0.333em; padding: 0 0.25em 0.125em 0; margin-top: -0.25em;  }
body#services p.quotecitation { font: normal 87.5%/1.25em 'Georgia'; color: #747579; text-align: right; text-indent: 0; }





/* PORTFOLIO */

body#portfolio.index .pagesection .mainsection { float: none; }

body#portfolio.index .pagesection h4 { width: 10.4em; }
body#portfolio.index .pagesection ul { width: 45em; padding-left: 14em; }
	body#portfolio.index .pagesection li { float: left; width: 4em; height: 4em; margin: 0 0 1em 1em; }
		body#portfolio.index .pagesection li a img { width: 3.75em; height: 3.75em; padding: 0.0625em; border: 0.0625em solid #d0d1d2; background: white; }
			body#portfolio.index .pagesection li a:hover img { border: 0.0625em solid #747579; }
			body#portfolio.index .pagesection li a:active img { border: 0.0625em solid #ef8200; }

body#portfolio.menu .mainsection, body#portfolio.article .mainsection { float: left; width: 45em; }
body#portfolio.menu .sidesection, body#portfolio.article .sidesection { float: right; width: 14em; margin-top: 0; }

body#portfolio.menu #introduction { width: 44em; border-bottom: 1px solid #d0d1d2; padding-bottom: 2em; margin-bottom: 1em; }

ul.portfoliolist { width: 45em; }
	ul.portfoliolist li { display: block; float: left; width: 11.2em; font-size: 125%; margin: 0 0.8em 0.8em 0; }
		ul.portfoliolist li a { display: block; height: 3.2em; width: 11.2em; padding-top: 0em; }
		ul.portfoliolist li img { float: left; width: 3em; height: 3em; margin-top: 0em; padding: 0.05em; border: 0.05em solid #d0d1d2; margin-right: 0.4em; background: white; }
			ul.portfoliolist li a:hover { background: #ededed; }
			ul.portfoliolist li a:active { background: #ef8200; color: white !important; }

body#portfolio.article .mainsection img { width: 43.75em; height: 15.75em; margin: 0.5em 0 0.25em; padding: 0.0625em; border: 0.0625em solid #d0d1d2; background: white; }
body#portfolio.article .mainsection h3 { font-size: 125%; padding-left: 11.95em;  }
body#portfolio.article .mainsection h4 { float: none; width: 29.333em; font-size: 150%; }


	body#portfolio div.contentbox h4 { padding-bottom: 0; font-weight: bold; }
	body#portfolio div.contentbox ul { list-style: none; margin-top: 0.25em; }
		body#portfolio div.contentbox ul li { padding-left: 1em; margin-bottom: 0.5em; line-height: 1.1875em; background: url('../images/list_bullet.gif') 0.0625em 0.375em no-repeat; }

	body#portfolio.menu div.contentbox, body#portfolio.article div.contentbox { padding-bottom: 0.5em; border-bottom: 1px solid #d2d4da; margin-bottom: 0.5em; }


/* ABOUT */

img#ben_headshot { width: 13.75em; height: 18.75em; padding: 0.0625em; border: 0.0625em solid #d0d1d2; background: white; }


/* CONTACT */

		body#contact #maincontent { width: 29em; margin-left: 15em; }
				body#contact label { display: block; float: left; width: 5em; padding: 0.25em 0; font-family: 'Georgia'; }
					body#contact .required label { color: #df031b; }
	
				body#contact input { margin-bottom: 0.5em; width: 23.5em; border: 0.0625em solid #d0d1d2; padding: 0.1875em; font: normal 1em 'Georgia'; }
					body#contact .required input { background: #ffcccc; }
				body#contact input.submit { margin-bottom: 0.5em; width: 9em; font: normal 1em 'Georgia'; border: 0.0625em solid #d0d1d2; padding: 0.1875em; background: #ededed; margin-left: 10em; }
				body#contact textarea { margin-bottom: 0.5em; width: 28.5em; height: 10em; font: normal 1em 'Georgia'; border: 0.0625em solid #d0d1d2; padding: 0.1875em; }






/* POLITICS */

body.politics #pagehead h1 { background: url('../images/politics/logo.gif') top left no-repeat; }
	body.politics #pagehead p { width: 192px; background: url('../images/politics/slogan.gif') top left no-repeat; }
	
body#cover.politics #centerpiece { background-image: url('../images/politics/centerpiecetext.gif'); }
	body#cover.politics #centerpiece h2 { background-image: url('../images/politics/centerpiece.jpg'); }



/* VIDEO */

body#videopage h3 { font-size: 150%; margin-bottom: 0.5em; }