* { 
	border:0; 
	margin:0; 
	padding:0; }

html, body {
	height:100%;
	width:100%; }

body {
	background:#FFF;
	color:#333;
	font-family:Arial, Helvetica, sans-serif;
	font-size:100%;
	line-height:1em; }

div { 
	position:relative; }

a {
	cursor:pointer; }

.vert-center {
	height:50%;
	margin-bottom:-150px; }

.sorry {
	background:url(../img/sorry.png) center top no-repeat;
	height:300px;
	margin:0 auto;
	width:800px; }

.pe {
	cursor:pointer;
	display:block;
	height:35px;
	position:absolute;
		right:150px; bottom:35px;
	width:170px; }

.pad {
	padding:20px; }

.clear { 
	clear:both; }

.hidden {
	display:none; }



h2, h3 {
	font-style:normal;
	font-weight:normal;
	line-height:1.3em; }

h2 {
	color:#333;
	font-family:'FranklinGothicFS-MedCd', Arial, Helvetica, sans-serif;
	font-size:16px; }

h3 {
	color:#CC0000;
	font-family:'FranklinGothicFS-CdIt', Arial, Helvetica, sans-serif;
	font-size:15px;
	letter-spacing:0.02em; }
		
		h3 strong {
			color:#999;
			font-family:'FranklinGothicFS-MedCd', Arial, Helvetica, sans-serif;
			font-weight:normal; }
				
				h3 a:hover strong {
					color:#333; }

.lc {
	text-transform:lowercase; }




.wrapper {
	clear:both;
	height:700px;
	margin:0 auto;
	position:relative;
	width:1050px; }

.wrapper * {
	opacity:0.0; }


.logo {
	opacity:0.0;
	position:absolute;
		top:0; left:0; }

		.wrapper.load .logo {
				top:250px; }
		
		.tagline {
			color:#999;
			font-family:'FranklinGothicFS-Cd', Arial, Helvetica, sans-serif;
			font-size:16px;
			font-weight:normal;
			letter-spacing:0.02em;
			line-height:20px;
			position:absolute;
				top:272px; left:600px; }
				


#Nav1 {
	background:url(../img/nav1-bg.gif) no-repeat;
	height:85px;
	padding-left:35px;
	position:absolute;
		top:0; right:0;
	width:430px; }
		
		.nav a {
			background:#CCC url(../img/nav1-btn-grey-and-red.png) repeat-x;
			background-position:0 0;
			color:#FFF;
			display:inline-block;
			font-family:'FranklinGothicFS-MedCd', Arial, Helvetica, sans-serif;
			font-size:17px;
			letter-spacing:0.025em;
			line-height:18px;
			padding:14px 0 6px 8px;
			text-transform:lowercase;
			width:123px; }
		
		.nav a.active {
			background-position:0 -38px; }
			
		#Nav1 a {
			margin:35px 2px 0 0; }



#Content {
	position:absolute;
		top:100px; right:0px; left:25px; }

#Content.profile {
	background:url(../img/profile-bg.png) 268px top no-repeat; }
		
		.photo, .large-slide, .small-slide img, .zoom img {
			border:solid 3px #E8E8E8; }
		
		.large-slide, .small-slide {
			display:none; }
		
		.large-slide {
			position:relative; }
		
		.small-slide {
			display:none;
			position:absolute; }
				
				.large-slide.active, .small-slide.active {
					display:block; }
		
		.zoom {
			display:none;
			position:absolute;
				top:0; left:0;
			z-index:700; }
				
				.enlarge, .close {
					background:#E8E8E8;
					height:26px;
					position:absolute;
						top:3px; right:3px;
					width:26px;
					z-index:600; }
				
				.enlarge {
					background:#E8E8E8 url(../img/arrow-red-right.png) -1px -1px no-repeat; }
						
						a:hover.enlarge {
							background:#E8E8E8 url(../img/arrow-right-hover.png) 0 0 no-repeat; }
				
				.close {
					background:#E8E8E8 url(../img/close-x.png) center 50% no-repeat; }
		
		.transition {
			background:url(../img/slide-trans2.gif) -3000px 0 no-repeat;
			height:511px;
			position:absolute;
				top:0; left:0;
			width:1000px; }
		
		.small-transition {
			background:url(../img/slide-trans-sm2.gif) -1752px 0 no-repeat;
			height:412px;
			position:absolute;
				top:0; left:0;
			width:584px; }
		
		
		
		#Photo {
			background:#EEE;
			float:left;
			height:412px;
			overflow:hidden;
			width:584px; }
				
				.slide {
					float:left; }
		
		
		.home-project-title {
			background:url(../img/home-title-bg.png) 0 0 repeat-x;
			color:#FFF;
			font-family:'FranklinGothicFS-Cd', Arial, Helvetica, sans-serif;
			font-size:16px;
			height:26px;
			letter-spacing:0.01em;
			line-height:26px;
			padding-left:10px;
			position:absolute;
				top:3px; left:3px;
			width:555px; }
				
				.home-project-title div {
					display:none; }
						
						.home-project-title .active {
							display:block; }
						
				.home-project-title strong {
					font-family:'FranklinGothicFS-MedCd', Arial, Helvetica, sans-serif;
					font-weight:normal; }
				
				.home-project-title a {
					background:#E8E8E8 url(../img/arrow-red-right.png) 0 0 no-repeat;
					display:inline-block;
					float:right;
					height:26px;
					text-transform:lowercase;
					width:26px; }
				
		
		#ProfileInfo {
			padding:20px;
			position:absolute;
				top:0; left:275px;
			width:270px; }
				
		
		
		#ContactInfo {
			padding:20px;
			position:absolute;
				top:0; left:275px;
			width:270px; }
				
				#ContactInfo h2 {}
				
				#ContactInfo p {
					color:#666;
					font-family:'FranklinGothicFS-Cd', Arial, Helvetica, sans-serif;
					font-size:15px;
					font-weight:normal;
					letter-spacing:0.015em;
					line-height:1.3em;
					margin-bottom:1em; }
						
						#ContactInfo p strong {
							color:#333;
							font-family:'FranklinGothicFS-MedCd', Arial, Helvetica, sans-serif;
							font-weight:normal; }
						
						#ContactInfo p em {
							color:#CC0000;
							font-family:'FranklinGothicFS-CdIt', Arial, Helvetica, sans-serif;
							font-weight:normal;
							font-style:normal;
							text-transform:lowercase; }
						
						#ContactInfo a {
							border-top:solid 1px #CCC;
							border-bottom:solid 1px #CCC;
							color:#CC0000;
							display:block;
							font-family:'FranklinGothicFS-MedCd', Arial, Helvetica, sans-serif;
							font-size:16px;
							line-height:30px;
							margin:1.5em 0 0.25em; }
								
								#ContactInfo a:after {
									content:' »'; }
									
								#ContactInfo a:hover, #ContactInfo a.active {
									color:#333; }
								
								#ContactInfo a.active {
									cursor:default; }
						
						#ContactInfo .addy {
							display:none; }
								
								#ContactInfo .addy.active {
									display:block; }
								
						
		
		
		#Details {
			background:#F8F8F8 url(../img/details-bg.png) left top no-repeat;
			display:block;
			height:412px;
			margin-right:26px;
			overflow:hidden;
			position:absolute;
				top:0; right:0;
			width:405px; }
		
		#Details.list {
			background:#F8F8F8 url(../img/details-bg-full.png) left top no-repeat;
			z-index:0; }
		
		#Details.projects {
			z-index:100; }
		
		#Details.profile {
			background:none; }
		
		#Details .charlotte {
			display:none; }
				
				.projects .all-details {
					height:378px;
					overflow:hidden;
					position:absolute;
						top:0; left:0;
					width:1000px; }
				
				.news .all-details {
					height:378px;
					overflow:hidden;
					position:absolute;
						top:0; right:0;
					width:810px; }
				
				.details-copy {
					float:left;
					height:378px;
					overflow:hidden;
					width:405px; }
						
						.details-copy h2 {
							margin-bottom:0.25em; }
								
								.details-copy h2 a {
									color:#333;
									cursor:default;
									display:inline;
									margin-right:5px; }
								
								.details-copy h2 .date {
									color:#CC0000;
									font-family:'FranklinGothicFS-CdIt', Arial, Helvetica, sans-serif;
									font-size:15px;
									letter-spacing:0.015em;
									margin-left:5px; }
						
						.details-copy h3 {
							font-size:14px;
							line-height:1em;
							margin-bottom:1em; }
						
						.details-copy p {
							color:#777;
							font-size:13px;
							line-height:1.7em;
							margin:0 0 0.85em 15px; }
						
						.slash {
							color:#999;
							margin-left:5px; }
				
						
						.details-list {
							height:412px;
							overflow:hidden; }
						
						.details-list a {
							display:block;
							margin-bottom:19px; }
						
						.details-list h2 {
							margin-bottom:0.25em; }
						
						.details-list h3 {
							font-size:14px;
							line-height:1em; }
						
						.details-list h4 {
							color:#AAA;
							font-family:'FranklinGothicFS-Cd', Arial, Helvetica, sans-serif;
							font-size:16px;
							font-weight:normal;
							line-height:1.3em;
							margin:0 20px 23px 0; }
								
								.details-list h4 a {
									color:#555;
									display:inline;
									margin-right:5px; }
										
										.details-list h4 a:hover {
											color:#000;
											text-decoration:underline; }
							
								.details-list h4 .date {
									color:#CC0000;
									font-family:'FranklinGothicFS-CdIt', Arial, Helvetica, sans-serif;
									font-size:15px;
									letter-spacing:0.015em;
									margin-left:5px; }
						
						form {
							padding-top:10px; }
									
						.field, textarea {
							background:#FFF !important;
							border:solid 1px #DDD;
							color:#999;
							display:block;
							font-family:Arial, Helvetica, sans-serif;
							font-size:12px;
							font-weight:bold;
							line-height:1em;
							margin-bottom:10px;
							padding:5px 8px;
							width:300px; }
						
						textarea {
							line-height:1.3em; }
						
						.submit {
							background:url(../img/nav1-btn-red.png) 0 0 repeat-x;
							color:#FFF;
							cursor:pointer;
							display:block;
							font-family:'FranklinGothicFS-MedCd', Arial, Helvetica, sans-serif;
							font-size:14px;
							line-height:26px;
							margin-left:228px;
							width:90px; }
							
							
							
							
				
				#SectionNav {
					height:33px;
					line-height:33px;
					position:absolute;
						right:15px; bottom:0; left:15px; }
						
						#SectionNav a {
							color:#CCC;
							cursor:default;
							font-family:'FranklinGothicFS-Cd', Arial, Helvetica, sans-serif;
							font-size:15px;
							line-height:31px; }
						
						#SectionNav a.active {
							color:#666; }
						
						#SectionNav a:hover.active {
							color:#333;
							cursor:pointer; }
						
						
						
						.section-nav {
							display:block;
							font-family:'FranklinGothicFS-Cd', Arial, Helvetica, sans-serif;
							font-size:15px;
							height:33px;
							line-height:33px;
							margin:0 20px;
							position:relative; }
						
						.section-nav a, .sn-descript {
							color:#CCC;
							display:inline-block;
							line-height:31px;
							height:33px; }
						
						.section-nav a.active {
							color:#666; }
						
						.section-nav a:hover.active {
							color:#333;
							cursor:pointer; }
						
						
						
						.prev, .next {
							height:26px;
							min-width:26px;
							position:absolute;
								top:0; }
						
						.prev {
							background:url(../img/arrow-left.png) left 3px no-repeat;
							left:0; }
								
								a:hover.prev {
									background:url(../img/arrow-left-hover.png) left 3px no-repeat; }
						
						.next {
							background:url(../img/arrow-right.png) right 3px no-repeat;
							right:0; }
								
								a:hover.next {
									background:url(../img/arrow-right-hover.png) right 3px no-repeat; }
						
						
						
						#SectionNav .prev {
							background:url(../img/arrow-left.png) left 3px no-repeat;
							padding-left:26px;
							position:absolute;
								top:0; left:0; }
						
						#SectionNav .middle {
							position:absolute;
								top:0; right:125px; left:125px;
							text-align:center; }
						
						#SectionNav .next {
							background:url(../img/arrow-right.png) right 3px no-repeat;
							padding-right:26px;
							position:absolute;
								top:0; right:0; }
		

#VisibleArea {
	float:left;
	height:505px;
	overflow:hidden;
	position:relative;
	width:750px; }
		
		.all-content {
			position:absolute;
				top:0; left:0;
			width:1250px; }

		.column {
			background:#FFF url(../img/column-bg.png) left top no-repeat;
			float:left;
			height:505px;
			position:relative;
			width:250px; }
				
				.column h3 {
					line-height:45px;
					padding-left:20px;
					text-transform:lowercase; }
				
				a.jump-up {
					background:url(../img/arrow-sm-red-up.png) center top no-repeat;
					border-bottom:solid 1px #DDD;
					display:block;
					height:13px;
					margin:0 12px 10px 0; }
				
				a.jump-down {
					background:url(../img/arrow-sm-red-down.png) center bottom no-repeat;
					border-top:solid 1px #DDD;
					display:block;
					height:13px;
					margin:10px 12px 0 0; }
				
				.view {
					height:410px;
					overflow:hidden;
					position:relative; }
				
				.view ul {
					position:absolute;
						top:0; }
				
				.column ul {
					list-style:none;
					margin:0 20px 0 20px; }
				
						.column li {
							background:url(../img/bullet.png) 0 4px no-repeat;
							font-size:12px;
							line-height:1.3em;
							margin-bottom:0.75em;
							padding-left:15px; }
								
								.column li.disabled {
									color:#CCC; }
								
								.column li a {
									color:#999;
									text-decoration:none; }
										
										.column li a:hover {
											color:#333; }


#ViewAllNav {
	background:url(../img/project-nav-bg.png) 0 0 no-repeat;
	float:right;
	height:505px;
	margin-right:26px;
	text-align:center;
	width:236px; }
		
		.viewall-links {
			margin-top:150px; }
		
		.viewall-links h3 {
			line-height:25px;
			text-transform:lowercase; }
		
		
		
		
		
		
		#Thumbs {
			clear:both;
			padding:6px 4px;
			position:relative; }
				
				.thumb {
					display:inline-block;
					position:relative; }
				
				.number {
					background:#CCC url(../img/nav1-btn-grey.png) repeat-x;
					color:#FFF;
					display:block;
					font-size:12px;
					height:17px;
					line-height:17px;
					margin-right:3px;
					text-align:center;
					width:17px; }
						
						a:hover.number, .number.active {
							background:#CCC url(../img/nav1-btn-red.png) repeat-x; }
						
						.preview {
							background:url(../img/thumb-bg.png) 0 0 no-repeat;
							display:none;
							height:99px;
							position:absolute;
								top:-100px; left:-45px;
							width:105px;
							z-index:500; }
								
								.preview img {
									border:none;
									margin:15px 0 0 17px; }



#Nav2 {
	padding:0 0 27px 35px;
	position:absolute;
		bottom:0; right:0;
	width:430px; }
		
		#Nav2 a {
			margin:35px 2px 0 0; }



#Subnav, 
#Services, 
#Mission, 
#Profiles {
	display:none; }

#Subnav {
	position:absolute;
		top:512px; left:620px;
	width:131px; }
		
		#Subnav a {
			background:url(../img/subnav-bg.png) repeat;
			color:#FFF;
			display:block;
			font-family:'FranklinGothicFS-MedCd', Arial, Helvetica, sans-serif;
			font-size:15px;
			height:21px;
			letter-spacing:0.015em;
			line-height:21px;
			margin-top:3px;
			padding-left:8px;
			text-shadow:#CCC 0 0 3px;
			text-transform:lowercase; }
				
				#Subnav a:hover, 
				#Subnav a.active {
					background:url(../img/subnav-bg-solid.png) repeat; }


#Services, 
#Mission, 
#Profiles {
	position:absolute;
		top:512px; left:751px;
	width:273px; }

		
		#Services a, 
		#Mission a, 
		#Profiles a {
			background:url(../img/subnav-bg.png) repeat;
			color:#FFF;
			display:block;
			font-family:'FranklinGothicFS-MedCd', Arial, Helvetica, sans-serif;
			font-size:15px;
			height:21px;
			letter-spacing:0.015em;
			line-height:21px;
			margin-top:3px;
			margin-left:3px;
			padding-left:8px;
			text-shadow:#CCC 0 0 3px;
			text-transform:lowercase; }
		
		/* OVERRIDE */
		#Profiles a {
			font-size:14px;
			text-transform:none; }
				
				#Services a:hover, 
				#Services a.active,
				#Mission a:hover,
				#Mission a.active,
				#Profiles a:hover,
				#Profiles a.active {
					background:url(../img/subnav-bg-solid.png) repeat; }



#Nav3 {
	color:#CCC;
	font-family:'FranklinGothicFS-Cd', Arial, Helvetica, sans-serif;
	font-size:13px;
	letter-spacing:0.015em;
	padding:0 0 33px 25px;
	position:absolute;
		bottom:0; left:0; }
		
		#Nav3 a {
			color:#AAA;
			margin:0 5px; }
				
				#Nav3 a:hover {
					color:#CC0000; }






.jScrollPaneContainer {
	float:left;
	overflow:hidden;
	position:relative;
	z-index:1; }

.jScrollPaneTrack {
	cursor:pointer;
	height:100%;
	position:absolute;
		top:0; right:0;
	width:26px; }

.jScrollPaneDrag {
	background:url(../img/scroll-drag-bg.png) left top repeat-y;
	cursor:pointer;
	position:absolute;
	overflow:hidden; }

.jScrollPaneDragTop {
	position:absolute;
		top:0; left:0;
	overflow:hidden; }

.jScrollPaneDragBottom {
	overflow:hidden;
	position:absolute;
		bottom:0; left:0; }

a.jScrollArrowUp {
	background:url(../img/arrow-up.png) left top no-repeat;
	display:block;
	height:26px;
	overflow:hidden;
	position:absolute;
		top:0; right:0;
	text-indent:-2000px;
	width:26px;
	z-index:1; }

a.jScrollArrowUp:hover {
	background:url(../img/arrow-up-hover.png) left top no-repeat; }

a.jScrollArrowDown {
	background:url(../img/arrow-down.png) no-repeat;
	display:block;
	height:26px;
	overflow:hidden;
	position:absolute;
		right:0; bottom:0;
	text-indent:-2000px;
	width:26px;
	z-index:1; }

a.jScrollArrowDown:hover {
	background:url(../img/arrow-down-hover.png) no-repeat; }

a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color:#f00;*/ }