@import url("./whitespace-reset.css");

body {
	font: normal 12px Arial, Helvetica, sans-serif;
	color: #FFF;
	background: #5B3930; }
	
body#home, body#contact {	background: #2F0F06; }
body#wwd { background: #76BC41; color: #2F0F06; }
body#work {background: #fff; color: #2F0F06;}
	
a { text-decoration:  none; }
a:focus { outline: none; }

#sitewrapper {
	width: 860px;
	margin: 0 auto;
	padding: 0 0 30px 0; }

#header {}

h1#logo {
	float: left;
	height: 32px;
	padding: 59px 0 2px; }
	h1#logo a {
		display: block;
		width: 85px;
		height: 27px;
		background: transparent url("../images/logo_blue.gif") 0 0 no-repeat;
		text-indent: -5000px; }
	body#contact h1#logo a { background: url(../images/logo_green-br.gif) 0 0 no-repeat; }	
	body#wwd h1#logo a { background: url(../images/logo_brown-gr.gif) 0 0 no-repeat; }	
	body#work h1#logo a { background: url(../images/logo_blue-bl.gif) 0 -1px no-repeat; }	
				
ul#nav {
	float: right;
	padding: 67px 6px 0 0;
	font-size: 9px; }
	#nav li {
		display: inline;  }
	#nav a {
		padding: 10px 8px 10px 7px;
		text-transform:  uppercase;
		color: #907872; }
	body#wwd #nav a.active, body#wwd #nav a:hover,
	body#contact #nav a.active, body#contact #nav a:hover,
	body#home #nav a.active, body#home #nav a:hover   {
		color: #FFF !important; }	
	#nav a.nav_contact {
		padding-right: 0; }	

	body#wwd #nav a { color: #BCE2A5; }
	body#work #nav a { color: #8E7871; }
		body#work #header #nav a:hover { color: #2F0F06 !important; }
			
body#wwd #nav .nav_wwd,
body#home #nav .nav_home,
body#contact #nav .nav_contact { color: #FFF; }
body#work #nav .nav_work {color: #2F0F06;}

#content {
	overflow: auto;
	clear: both;
	padding: 113px 0 77px;
	background: url(../images/bg_header.png) 0 8px no-repeat; }
	#content p {
		font-size: 13px; }
	body#work #content { background: url(../images/bg_header_4white.gif) 0 8px no-repeat; }
#footer {
	padding: 10px 0 0;
	font-size: 10px;
	text-transform: uppercase;
	color: #907872;
	background: url(../images/bg_footer.png) no-repeat; }
	body#wwd #footer { color: #BCE2A5; }

/* Homepage
---------*/
#home #content {
	padding: 109px 0 77px 0;
	background: none; }
	#home #content h2 {
		padding: 0 0 53px 0;
		font: italic normal 20px Georgia; }
	#home #content p.positioning {
		height: 185px;
		padding: 0 0 8px 0;
		background: transparent url("../images/hdr_home.gif") 0 0 no-repeat;
		text-indent: -5000px; }
	#home #content a.btn_seek-breakthrough {
		display: block;
		width: 282px;
		height: 12px;
		margin: 5px 0 0;
		background: transparent url("../images/btn_see-a-breakthrough.gif") 0 0 no-repeat;
		text-indent: -5000px; }

/* What we do
-----------*/
		#wwd #content h1 {
			height: 31px;
			padding: 0 0 22px 0;
			background: transparent url("../images/hdr_seeking-breakthrough.gif") 0 0 no-repeat;
			text-indent: -5000px; }
		#wwd #content h2 {
			height: 75px;
			padding: 0 0 39px 0;
			background: transparent url(../images/hdr_breakthrough-app.gif) 0 0 no-repeat;
			text-indent: -5000px; }
		#wwd #content img {
			float: right;
			margin: 0 19px 0 0; }
		#wwd #content #text-copy {
			padding: 0 350px 25px 0; }
		#wwd #content #text-copy h3 {
			color: #FFE353;
			font-size: 16px;
			font-weight: normal; }
			#wwd #content #text-copy p {
				padding: 0 0 15px;
				line-height: 140%; }
				#wwd #content #text-copy p strong {
					color: #FFF;
					font-weight: normal; }
				#wwd #content #text-copy p strong em {
					font-style: normal;
					color: #FFE353; }
		#wwd #content a.btn_how-we-do-it {
			display: block;
			width: 126px;
			height: 16px;
			margin: 0 0 0 5px;
			background: transparent url("../images/btn_how-we-do-it.gif") 0 0 no-repeat;
			text-indent: -5000px; }
			#wwd a {color: #fff;}
				#wwd a:hover {color: #fff; text-decoration: underline;}
/* Our work
-------------*/			
		#work #content h1 {
			height: 31px;
			padding: 0 0 22px 0;
			background: transparent url("../images/hdr_forward-thinking.gif") 0 0 no-repeat;
			text-indent: -5000px; }
		#work #content h2 {
			height: 75px;
			padding: 0 0 39px 0;
			background: transparent url(../images/hdr_work.gif) 0 0 no-repeat;
			text-indent: -5000px; }
		#work #text-copy .picRow {
			margin-bottom: 26px;}
		#work #text-copy .txtRow {
			padding-bottom: 26px;
			height: 90px;}
	    #work #text-copy img { 
			margin-right: 60px;}
		#work #text-copy img.right {
			margin-right: 0px;}
		#work #text-copy h3 {
			color: #31b5c8;
			font-size: 14px;
			font-style: italic;
			font-weight: normal;
			font-family: Georgia,Times,serif;
			margin-bottom: 17px;
			margin-top: -9px;}
		#work div.descript {
			height: 88px;
			width: 244px;
			border-right: 1px dashed #2f0f06;
			float: left;
			padding-left: 28px;}
			#work div.descript p {
				font-size: 11px;
				line-height: 140%;
				width: 243px;}
		#work div.descript.right {
			border:none;}
		#work div.descript.left {
			padding-left: 0px;
			width:274px;}
		#work div.descript.mid {
			width: 280px;
			padding-left: 32px;}

/* How we do it
-------------*/
#how-we-do-it { background: #abd481; }
	#how-we-do-it #header h1 a { background: transparent url("../images/logo_brown.png") 0 0 no-repeat; }
	#how-we-do-it #content {
		padding: 160px 0 0 0;
		background: transparent url("../images/bg_how-we-do-it.gif") 0 20px no-repeat; }
		#how-we-do-it #content h1 {
			padding: 0 0 5px 0;
			font: italic normal 17px Georgia; }
		#how-we-do-it #content h2 {
			height: 17px;
			padding: 0 0 50px 0;
			background: transparent url("../images/hdr_how-we-do-it.gif") 0 0 no-repeat;
			text-indent: -5000px; }
		#how-we-do-it #content ul {
			position: relative;
			clear: both;
			float: left;
			width: 100%;
			min-height: 202px;
			height: 202px;
			margin: 0 0 53px 0;
			background: transparent url("../images/bg_list_how-we-do-it.gif") 0 0 repeat-y; }
		html > body #how-we-do-it #content ul { height: auto; }
		#how-we-do-it #content li {
			float: left;
			width: 195px;
			padding: 0 28px 0 0;
			font-size: 11px;
			color: #511529; }
			#how-we-do-it #content li h3 {
				height: 26px;
				padding: 0 0 16px 0;
				text-indent: -5000px; }
			#how-we-do-it #content li p.absolute {
				position: absolute;
				top: 177px;
				line-height: 150%; }
			#how-we-do-it #content li#step-1 h3 { background: transparent url("../images/hdr_step-1.gif") 0 0 no-repeat; }
			#how-we-do-it #content li#step-1 p {
				left: 0;
				top: 192px; }
			#how-we-do-it #content li#step-2 h3 { background: transparent url("../images/hdr_step-2.gif") 0 0 no-repeat; }
			#how-we-do-it #content li#step-2 p.absolute { left: 223px; }
			#how-we-do-it #content li#step-3 h3 { background: transparent url("../images/hdr_step-3.gif") 0 0 no-repeat; }
			#how-we-do-it #content li#step-3 p.absolute { left: 446px; }
		#how-we-do-it #content li#step-4 { padding: 0; }
			#how-we-do-it #content li#step-4 h3 { background: transparent url("../images/hdr_step-4.gif") 0 0 no-repeat; }
			#how-we-do-it #content li#step-4 p.absolute { left: 669px; }

/* Contact
--------*/
#contact #content h1 {
	height: 77px;
	padding: 0 0 47px 0;
	background: transparent url("../images/hdr_contact.gif") 0 0 no-repeat;
	text-indent: -5000px; }
#contact #content ul {
	float: left;
	width: 100%;
	margin: 0 0 -8px; }
	#contact #content ul li {
		float: left;
		width: 220px;
		padding: 0 75px 0 0;
		background: url(../images/img_dash-column.gif) top right no-repeat; }
	#contact #content ul li#geninq {
		padding-left: 29px; }
	#contact #content ul li#careers {
		width: 212px;
		padding-right: 0;
		padding-left: 29px;
		background: none; }
	#contact #content ul h3 {
		padding: 0 0 11px 0;
		font: italic normal 14px Georgia;
		color: #FFF353; }
	#contact #content ul p {
		padding: 0 0 8px;
		font-size: 11px; }
	#contact #content ul a {
		color: #FFF353;
		text-decoration: none; }
	#contact #content ul a:hover { text-decoration: underline; }

/* Portfolio
----------*/
#portfolio { background: #ffffff; }
#portfolio #header h1 a { background: transparent url("../images/logo_portfolio.png") 0 0 no-repeat; }
#portfolio #content {
	padding: 52px 0 0 0;
	background: transparent url("../images/bg_work-fios.jpg") 0 14px no-repeat; }
#portfolio #header ul li a.btn_about {
	width: 31px;
	background: transparent url("../images/btn_about_work.png") 0 100% no-repeat; }
#portfolio #header ul li a.btn_work {
	width: 28px;
	background: transparent url("../images/btn_work_work.png") 0 100% no-repeat; }
#portfolio #header ul li a.btn_services {
	width: 41px;
	background: transparent url("../images/btn_services_work.png") 0 100% no-repeat; }
#portfolio #header ul li a.btn_ideas {
	width: 25px;
	background: transparent url("../images/btn_ideas_work.png") 0 100% no-repeat; }
#portfolio #header ul li a.btn_contact {
	width: 41px;
	background: transparent url("../images/btn_contact_work.png") 0 100% no-repeat; }
#portfolio #main {
	float: left;
	width: 407px;
	padding: 20px 56px 0 0; }
	#portfolio #main a.btn_next-client {
		display: block;
		float: right;
		width: 49px;
		height: 7px;
		margin: 10px 0 0 0;
		background: transparent url("../images/btn_next-client.gif") 0 0 no-repeat;
		text-indent: -5000px; }
	#portfolio #main h1 {
		padding: 0 0 22px 0;
		font: italic normal 16px Georgia;
		color: #5b3930; }
	#portfolio #main h2 {
		height: 102px;
		background: transparent url("../images/hdr_work-fios.gif") 0 0 no-repeat;
		text-indent: -5000px; }
	#portfolio #main p {
		height: 66px;
		background: transparent url("../images/text_work-fios.gif") 0 0 no-repeat;
		text-indent: -5000px; }
	#portfolio #main a.btn_launch {
		display: block;
		width: 89px;
		height: 17px;
		background: transparent url("../images/btn_launch-application.gif") 0 0 no-repeat;
		text-indent: -5000px; }
	#portfolio #content ul {
		clear: both;
		float: left;
		width: 100%;
		margin: 40px 0 0 0;
		background: transparent url("../images/bg_list_work.gif") 0 0 repeat-y; }
	#portfolio #content li {
		float: left;
		width: 194px;
		padding: 0 24px 0 0;
		font-size: 11px; }
	#portfolio #content li#step-2 { padding: 0 33px 0 0; }
	#portfolio #content li#step-4 { padding: 0; }
		#portfolio #content li h3 {
			height: 26px;
			padding: 0 0 16px 0;
			text-indent: -5000px; }
		#portfolio #content li p {
			padding: 0 0 10px 0;
			color: #5b3930; }
		#portfolio #content li#step-1 h3 { background: transparent url("../images/hdr_step-1_work.gif") 0 0 no-repeat; }
		#portfolio #content li#step-2 h3 { background: transparent url("../images/hdr_step-2_work.gif") 0 0 no-repeat; }
		#portfolio #content li#step-3 h3 { background: transparent url("../images/hdr_step-3_work.gif") 0 0 no-repeat; }
		#portfolio #content li#step-4 h3 { background: transparent url("../images/hdr_step-4_work.gif") 0 0 no-repeat; }
		#portfolio #content li a.btn_view-screens {
			display: block;
			width: 45px;
			height: 7px;
			background: transparent url("../images/btn_view-screens.gif") 0 0 no-repeat;
			text-indent: -5000px; }