body {
	color: #555;
	background: #fff;
	text-align: center;
	font-family: 'Gill Sans', Helvetica, Arial, sans-serif;
	font-size: .8125em;
}

* {
	margin: 0;
	padding: 0;
}
.hide,
.print-only,
.page-url {
	display: none;
}

.note {
	color: blue;
	font-style: italic;
}

/* --------------------------------------------------------------------------
=wrapper
-------------------------------------------------------------------------- */
#wrapper {
	margin: 0 auto;
	text-align: left;
	width: 980px;
	/*overflow: auto;*/
}

#_wrapper {background: transparent url(/images/ui/_grid.png) 0 0 repeat-y;}
#_wrapper {background: transparent url(/images/ui/_grid-6col.png) 0 0 repeat-y;}

/* --------------------------------------------------------------------------
=header
-------------------------------------------------------------------------- */
#header {
	position: relative;
	left: 20px;
	padding: 10px 0;
	width: 940px;
	height: 25px;
	border-bottom: 1px solid #999;
}

/* ----------------------------------
=logo
----------------------------------- */
#logo,
#logo a {
	background: transparent url(/images/ui/grunsfeld-shafer.gif) 10px 0 no-repeat;
}
#logo {
	float: right;
	display: block;
	width: 400px;
	height: 25px;
	text-indent: -9999px;
	overflow: hidden;
}
#logo a {
	display: block;
	float: left;
	width: 400px;
	height: 25px;
}
#logo a:hover {
	background-position: 10px -25px;
}

#logo-print {
	display: none;
}

/* --------------------------------------------------------------------------
=nav
-------------------------------------------------------------------------- */
#nav {
	display: block;
	float: left;
	width: 366px;
	height: 35px;
}
* html #nav {
	overflow: hidden; /* this fixes weird height issue in IE6 */
}
#nav ul {
	margin: 0;
	padding: 0;
}
#nav li {
	float: left;
	height: 35px;
	list-style: none;
}
#nav li a {
	display: block;
	height: 35px;
	text-indent: -9999px;
	overflow: hidden;
}

/* 54 92 66 58 96 = 366 */
#nav-home a {
	width: 54px;
	background: transparent url(/images/ui/nav.gif) 0 0 no-repeat;
}
#nav-home a:hover {
	background-position: 0 -35px;
}
#nav-home a.current {
	background-position: 0 -70px;
}
#nav-projects a {
	width: 92px;
	background: transparent url(/images/ui/nav.gif) -54px 0 no-repeat;
}
#nav-projects a:hover {
	background-position: -54px -35px;
}
#nav-projects a.current {
	background-position: -54px -70px;
}
#nav-news a {
	width: 66px;
	background: transparent url(/images/ui/nav.gif) -146px 0 no-repeat;
}
#nav-news a:hover {
	background-position: -146px -35px;
}
#nav-news a.current {
	background-position: -146px -70px;
}
#nav-firm a {
	width: 58px;
	background: transparent url(/images/ui/nav.gif) -212px 0 no-repeat;
}
#nav-firm a:hover {
	background-position: -212px -35px;
}
#nav-firm a.current {
	background-position: -212px -70px;
}
#nav-contact a {
	width: 96px;
	background: transparent url(/images/ui/nav.gif) -270px 0 no-repeat;
}
#nav-contact a:hover {
	background-position: -270px -35px;
}
#nav-contact a.current {
	background-position: -270px -70px;
}

/* --------------------------------------------------------------------------
=quick-nav
-------------------------------------------------------------------------- */
.quick-nav {
	display: block;
	height: 15px;
}
.quick-nav span.prev,
.quick-nav span.next {
	display: block;
	width: 15px;
	height: 15px;
	text-indent: -9999px;
	overflow: hidden;
	float: left;
}
.quick-nav span.prev a,
.quick-nav span.next a {
	display: block;
	width: 15px;
	height: 15px;
}
.quick-nav span.prev a {
	background: transparent url(/images/ui/nav-arrows.gif) 0 0 no-repeat;
}
.quick-nav span.next a {
	background: transparent url(/images/ui/nav-arrows.gif) -15px 0 no-repeat;
}
.quick-nav span.prev a:hover {
	background-position: 0 -15px;
}
.quick-nav span.next a:hover {
	background-position: -15px -15px;
}
.quick-nav .count {
	line-height: 15px;
}

#subnav .quick-nav {
	position: relative;
	top: 5px;
	right: 20px;
	width: 80px;
	float: right;
}
#subnav .quick-nav .count {
	float: left;
	width: 50px;
	text-align: center;
}

/* --------------------------------------------------------------------------
=content
-------------------------------------------------------------------------- */
#content {
	margin: 10px 0 0 0;
	padding-left: 20px;
	width: 960px;
	min-height: 480px;
	float: left;
	clear: both;
}
* html #content {
	height: 480px;
}

/*
headings
----------------------------------------*/
h1, h2, h3, h4 {
	font-weight: normal;
	text-transform: uppercase;
}
h1,
.featured h2 {
	font-size: 125%;
	letter-spacing: .1em;
}
h1 {
	margin: 0 0 15px 0;
	color: #600;
}
h2 {
	padding: 0 0 1em 0;
	font-size: 100%;
	letter-spacing: .1em;
}
h3 {
	padding: 0 0 1em 0;
	font-size: 100%;
	letter-spacing: .1em;
}
h4 {
	margin: 0 0 .5em 0;
	padding: 0 0 .3em 0;
	font-size: 100%;
	letter-spacing: .1em;
}

/*
html
----------------------------------------*/
p {
	padding-bottom: 1em;
	line-height: 1.5em;
}
ul {
	text-indent: 0;
	padding-bottom: 1em;
}
li {
	list-style: none;
	line-height: 1.5em;
}

/* --------------------------------------------------------------------------
=home
-------------------------------------------------------------------------- */
#content.home {
	margin-top: 35px;
}
#billboard {
	display: block;
	width: 940px;
	height: 480px;
	overflow: hidden;
}
#billboard a {
	padding: 0;
	display: block;
	width: 940px;
	height: 480px;
}


/* --------------------------------------------------------------------------
=projects and news
-------------------------------------------------------------------------- */
#project,
#story,
#contact {
	float: left;
	clear: both;
	width: 940px;
	height: 480px;
}
#copy {
	float: left;
	width: 320px;
	height: 360px;
	overflow: hidden; /* <-- write too much; it won't display */
}

/* --------------------------------------------------------------------------
=projects
-------------------------------------------------------------------------- */
.projects h2 {
	float: left;
	width: 700px;
}
.projects p.all {
	text-align: right;
	float: right;
	width: 220px;
	padding: 0 20px 0 0;
}

/* -------------------------------------
=featured
------------------------------------- */
.featured {
	width: 460px;
	float: left;
	margin-right: 20px;
}
.featured h2 {
	margin: 0 0 10px 0;
	padding: 0;
}
.featured span {
	margin: 0 0 15px 0;
	display: block;
	float: left;
	clear: both;
	width: 460px;
	height: 360px;
	overflow: hidden;
}
.featured p.all {
	text-align: right;
	font-style: italic;
	text-transform: uppercase;
}

/* -------------------------------------
=thumbnails
------------------------------------- */
.thumbnails {
	width: 960px;
	padding: 0 0 10px 0;
	float: left;
	clear: both;
}
.thumbnail {
	margin-right: 20px;
	float: left;
	width: 220px;
	height: 200px;
}
.thumbnail span.img-wrapper {
	display: inline-block;
	width: 220px;
	height: 160px;
	/*margin-bottom: 5px;*/
	overflow: hidden;
}
.thumbnail span.title {
	margin-top: 5px;
	display: block;
	clear: both;
	width: 220px;
	/*line-height: 1.1em;*/
}

/* -------------------------------------
=project
------------------------------------- */
#project #narrative {
	width: 320px;
	height: 250px;
	overflow: auto;
}

.project-nav,
#story .quick-nav {
	margin: 0 0 15px 0;
	float: left;
	clear: both;
	width: 100%;
}
.project-nav .quick-nav {
	float: left;
	width: 175px;
}
.project-nav .quick-nav .count,
#copy .quick-nav .count {
	padding-left: 5px;
	float: left;
	width: 140px;
}

.project-nav #more-info,
.project-nav #more-news {
	margin: 0 10px 0 0;
	float: left;
	width: 16px;
}
#more-info a,
#more-news a {
	float: left;
	display: block;
	width: 16px;
	height: 16px;
	text-indent: -9999px;
	overflow: hidden;
}
#more-info a {
	background: transparent url(/images/ui/info.gif) 0 0 no-repeat;
}
#more-news a {
	background: transparent url(/images/ui/more.gif) 0 0 no-repeat;
}
#more-info a:hover,
#more-info a:visited:hover,
#more-news a:hover,
#more-news a:visited:hover {
	background-position: 0 -16px;
}
#more-info.current a:link,
#more-info.current a:hover,
#more-info.current a:visited,
#more-info.current a:visited:hover,
#more-news.current a:link,
#more-news.current a:hover,
#more-news.current a:visited,
#more-news.current a:visited:hover {
	background-position: 0 -32px;
}

/* --------------------------------------------------------------------------
=slideshows
-------------------------------------------------------------------------- */
.slide {
	float: right;
	display: block;
	width: 600px;
	height: 480px;
	overflow: hidden;
	text-align: right;
}
.caption {
	float: left;
	width: 320px;
	height: 120px;
	text-align: right;
	font-style: italic;
}

/* --------------------------------------------------------------------------
=projects - more info
-------------------------------------------------------------------------- */
#project #info,
#project #news {
	float: right;
	padding: 20px;
	width: 560px;
	height: 440px;
}
#project #info h2,
#project #news h2 {
	color: #333;
}
#project #info ul,
#project #news ul {
	float: left;
	width: 100%;
	padding: 0 0 2em 0;
	border-top: 1px solid #999;
}
#project #info ul li,
#project #news ul li {
	padding: .3em 0;
	border-bottom: 1px solid #999;
	float: left;
	clear: both;
	width: 100%;
}
#project #info ul li strong,
#project #news ul li strong  {
	font-weight: normal;
	display: block;
	float: left;
	width: 25%;
}
#project #info ul li span,
#project #news ul li span {
	float: right;
	width: 74%;
}

/* --------------------------------------------------------------------------
=news
-------------------------------------------------------------------------- */
#stories {
	float: left;
	clear: both;
	width: 960px;
	padding: 0 0 20px 0;
}
.story {
	border-bottom: 1px solid #999;
	padding: 15px 0;
	float: left;
	width: 460px;
	height: 100px;
	margin: 0 20px 0 0;
}
.story span {
	width: 160px;
	height: 100px;
	overflow: hidden;
	float: left;
	margin: 0 20px 0 0;
}
.story span img {
	float: left;
}
.story h2 {
	padding: 0 0 .5em 0;
	text-transform: none;
	letter-spacing: 0;
	font-size: 125%;
}

.story .date,
#story p.date {
	color: #999;
	font-size: 90%;
	text-transform: uppercase;
	letter-spacing: .1em;
}
#story p.date {
	padding: 0 0 1em 0;
}

/* --------------------------------------------------------------------------
=archives
-------------------------------------------------------------------------- */
#archives ul {
	float: left;
	width: 940px;
	padding: 0 0 2em 0;
	border-top: 1px solid #ccc;
}
#archives ul li {
	padding: .3em 0;
	border-bottom: 1px solid #ccc;
	float: left;
	clear: both;
	width: 100%;
}
#archives ul li span.date {
	font-weight: normal;
	display: block;
	float: left;
	width: 120px;
	color: #666;
	text-transform: uppercase;
}
#archives ul li span.title {
	float: left;
	width: 480px;
}
#archives ul li span.categories {
	float: left;
	width: 320px;
}

/* --------------------------------------------------------------------------
=firm
-------------------------------------------------------------------------- */
#intro {
	float: left;
	width: 300px;
}
#main {
	float: right;
	padding: 0 20px 0 0;
	width: 620px;
}
#main.lists {
	float: right;
	padding: 0;
	width: 640px;
}
ul.column {
	float: left;
	width: 140px;
	margin: 0 20px 0 0;
}

/* --------------------------------------------------------------------------
=people
-------------------------------------------------------------------------- */
#people {
	width: 960px;
	height: 480px;
	overflow: hidden;
}
.person {
	margin: 10px 20px 10px 0;
	float: left;
	width: 300px;
}
.person span.professional-title {
	padding-left: 1em;
	color: #999;
}

img.portrait {
	margin: 15px 0 0 0;
	float: left;
}

#bio {
	padding: 15px 20px 20px 0;
	float: right;
	width: 460px;
}
#bio h1 {
	margin: 0 0 .3em 0;
	font-size: 125%;
}
#bio h2 {
	font-size: 100%;
}

a.pdf {
	padding: 0 0 4px 20px;
	background: transparent url(/images/ui/icon-pdf.gif) 0 0 no-repeat;
}

/* --------------------------------------------------------------------------
=contact
-------------------------------------------------------------------------- */
#contact #info {
	float: left;
	width: 300px;
}
#contact #info p.phone span,
#contact #info p.fax span {
	text-transform: uppercase;
	letter-spacing: .1em;
	font-size: 90%;
	display: inline-block;
	width: 30px;
}
#contact #info p.phone {
	padding: 0;
}
#contact-form {
	padding: 40px 0;
	float: right;
	width: 620px;
}
#map	{
	width:620px;
	height:480px;
	float:right;
}

/* --------------------------------------------------------------------------
=footer
-------------------------------------------------------------------------- */
#footer {
	display: block;
	width: 960px;
	float: left;
	clear: both;
	color: #aaa;
	font-size: 90%;
}
#footer p.copyright {
	padding: 15px 0;
	text-align: right;
}
