/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* Base Layout */
body{
	background:	url(/4.0/images/bg-page.png) repeat-x 0 0;
}
#container{
	width:		986px;
	padding:	7px;
	position:	relative;
	left:		50%; 
	margin:		0 0 0 -500px;
}
label{
	cursor:		pointer;
}
/* utilities */
.error{
	border-color: red !important;
}
label.checked{
	background-color:	#EFD !important;
	border-color:		#CEA !important;
}
/* Section:Header.Nav */
div.header{
	height:		60px;
	padding:	50px 0 10px;
}
	div.header ul.nav li{
		float:	left;
	}
	div.header ul.nav a[title='Home']{ /* main */
		margin-left:	0;
		margin-right:	50px;/* 
        margin-right:	155px; for blog hidden alpha launch */
		width: 			311px;
		height:			43px;
		display:		block;
	}
	div.header ul.nav li + li a{ /* all sub sections */
		height:		30px;
		display:	block;
		padding:	0 20px;
		line-height:30px;
		width:		60px;
		margin:		10px 2px 0;
	}
	div.header ul.nav li + li a:focus,
	div.header ul.nav li + li a:hover{
		background:	url(/4.0/images/sprite-nav.png) no-repeat 0px 0px ;
	}
	html[id="wwp:about"] div.header ul.nav a[title="About"],
	html[id="wwp:services"] div.header ul.nav a[title="Services"],
	html[id="wwp:portfolio"] div.header ul.nav a[title="Portfolio"],
	html[id="wwp:method"] div.header ul.nav a[title="Methodology"],
	html[id="wwp:contact"] div.header ul.nav a[title="Contact"],
	html[id="wwp:blog"] div.header ul.nav a[title="Blog"]{
		/* current page */
		background:			url(/4.0/images/sprite-nav.png) no-repeat 0px -30px ;
		cursor: 			default;
		text-decoration:	none;
	}

.content{

}
/* Section:Slideshow */
	.slideshow{
		width:		986px;
		height:		394px;
		position:	relative;
		
		background:	url(/4.0/images/bg-carousel.png) no-repeat 0 0;
	}
	.slideshow .panes{
		position:	absolute;
		left:		50px;
		top:		5px;
		overflow:	hidden;
		height:		380px;
		width:		880px;
	}
	.slideshowControls ul{
		position:	absolute;
		bottom:		10px;
		left:		50%;
		width:		51px;
		margin-left:-20.5px;
	}
	.slideshowControls li{
		width:		5px;
		height:		5px;
		float:		left;
		margin:		5px;
		cursor:		pointer;
		border:		1px solid #ccc;
		border-radius:			10px;
		-moz-border-radius:		10px;
		-webkit-border-radius:	10px;
	}
	.slideshowControls li.active{
		background:	#ccc;
	}
	.slideshowControls .button{
		background:		url(/4.0/images/sprite-carousel-nav.png) no-repeat;
		height:			380px;
		width:			50px;
		position:		absolute;
		top:			5px;
		cursor:			pointer;
	}
	.slideshowControls .button[title='previous']{
		left:			2px; 
		background-position: 0;
	}
	.slideshowControls .button[title='previous']:hover{
		background-position: -100px;
	}
	.slideshowControls .button[title='next']{
		right:			6px; 
		background-position: -50px;
	}
	.slideshowControls .button[title='next']:hover{
		background-position: -150px;
	}
	.slideshow .panes a[href='/4.0/contact/consultation']{
		width:			258px;
		height:			47px;
		display:		block;
		position:		absolute;
		left:			1804px;
		bottom:			57px;
		background:		url(/4.0/images/overlay-button.png) no-repeat 0 -47px;
        text-indent:	-9999px;
	}
	.slideshow .panes a[href='/4.0/contact/consultation']:focus,
	.slideshow .panes a[href='/4.0/contact/consultation']:hover{
		background:		url(/4.0/images/overlay-button.png) no-repeat 0 0;
	}

/* Section:Pitch.Main */
	.pitch.main{
		
	}
	.pitch.main div{
		height:		230px;
		padding-top:25px;
		margin:		50px 0;
		float:		left;
	}
		.pitch.main div h3{
			height:			40px;
			line-height:	40px;
			margin-bottom:	15px;
			background:		url(/4.0/images/icons-pitch-main.png) no-repeat;
		}
		.pitch.main div p{
			margin-bottom:	2em;
		}
	.pitch.main .testimonial{
		border-right:	1px solid #dedede;
		padding-right:	17px;
		width:			305px;
	}
		.pitch.main .testimonial h3{
			background-position:	right 0;
		}
	.pitch.main .global{
		border-right:	1px solid #dedede;
		position:		relative;
		padding:		25px 17px 0;
		width:			305px;
	}
		.pitch.main .global h3{
			background-position:	right -40px;
		}
		.pitch.main .global p{
			padding:		0px;
		}
		.pitch.main .global img{
			position:		absolute;
			left:			50%;
			margin-left:	-132px;
			bottom:			0;
		}
	.pitch.main .trust {
		padding-left:	17px;
		width:			305px;
	}
		.pitch.main .trust h3{
			background-position:	right -80px;
		}

/* Section:Pitch.Secondary */
	.pitch.secondary{
		clear:		both;
		width:		986px;
		height:		125px;
		background:	url(/4.0/images/bg-pitch-secondary.png) 0 0 no-repeat;
	}
	.pitch.secondary div{
		width:		483px;
		height:		125px;
		float:		left;
		display:	block;
	}
	.pitch.secondary div a{
		padding:	40px 50px 0 100px;
		width:		333px;
		height:		85px;
		display:	block;
		background:	url(/4.0/images/icons-pitch-secondary.png) 0 0 no-repeat;
	}
	.pitch.secondary div.booklet a{
		background-position:	25px 0;
	}
	.pitch.secondary div.about a{
		background-position:	25px -125px;
	}

/* Section:Footer */
.footer{
	height:		189px;
	background:	url(/4.0/images/bg-footer.png) repeat-x 0 0;
	clear: 		both;
	width:		100%;
}
.twitter{
	position:		relative;
	padding-top:	80px;
	padding-bottom:	20px;
	margin:			70px 0 -140px;
	background:		url(/4.0/images/bg-twitter.png) no-repeat 0 0;
	width:			400px;
	clear:			both;
}
	.twitter .tweet{
		position:		absolute;
		left:			114px;
		top:			20px;
		width:			255px;
	}

.sitemap{
	position:		absolute;
	left:			420px;
	bottom:			-127px;
}
.sitemap li{
    float:      	left;
}
.sitemap li a{
	color:			#173648;
    font-size:		16px;
    letter-spacing:	1.1pt;
	display:    	block;
    width:			160px;
    margin:			5px 20px 5px 0;
    padding:		5px 0 0 10px;
    border-bottom:	1px dashed #ccc;
}
.sitemap li a:hover,
.sitemap li a:focus{
    background:		rgba(255,255,255,.2);
}
/* Section:Page.Heading */
.focusarea h1{
	background:		url(/4.0/images/bg-page-heading.png) no-repeat 0 0;
	width:			726px;
	height:			120px;
	padding:		60px 70px 20px 190px;
}

/* Section:Page.Prototype.Main */
.focusarea .main{
	width:			520px;
    padding:		20px;
    float:			left;
    -moz-box-shadow: 1px 1x 2px rgba(64,64,64,1);
}

/* Section:Page.Prototype.Secondary */
.focusarea .secondary{
	width:			380px;
    padding:		55px 20px;
    float:			right;
}
/* Section:Page.Prototype.Single */
.focusarea .single{
	width:			780px;
    padding:		20px 50px;
}

/* Section:Page.Prototype.Descriptive */
.focusarea > .descriptive{
	float:		left;
	width:		537px;
	padding:	30px;
}
	.focusarea > .descriptive h4{
		padding-left:	150px;
	}
	.focusarea > .descriptive p{
		padding-left:	150px;
		margin-bottom:	2em;
	}
	.focusarea > .descriptive > dl{
    	padding-left:	150px;
    }
/* Section:Page.Prototype.List */
.focusarea >.list{
	float:		left;
	width:		329px;
	padding:	30px;
}
	.focusarea .list > dl > dt + dd,
	.focusarea .list > dl > dt{
		margin-bottom:		2em;
	}
	.focusarea .list > dl > dt + dd + dt{
		margin-bottom:		1em;
	}
	.focusarea .list > dl > dd > dl > dd > ul{
		margin-left:		2em;
	}

/* Section:Page.FAQ */
	.faq.descriptive dl{
    	padding:			0;
    }
    .faq.descriptive dd{
    	margin:				5px 0 30px;
    }
	.faq.descriptive dd p{
    	padding:			0px;
    }
    .faq.descriptive dd ul{
    	padding:			10px 50px 0;
        list-style:			disc;
    }
    .faq.descriptive dd dd{
    	margin:				0 20px 10px;
    }
/* Section:Page.Services */
	.services.descriptive p{
		background:		url(/4.0/images/icons-services.png) no-repeat 30px 0;
    }
	.services.descriptive p.websites{
		background-position:	30px 0;
	}
	.services.descriptive p.landing{
		background-position:	30px -145px;
	}
	.services.descriptive p.newsletters{
		background-position:	30px -310px;
	}
/* Section:Page.Contact */
#form_wrapper {
    padding:		20px 35px 20px 70px;
    width:			435px;
}
	#form_wrapper fieldset{
    	border-top:		1px dashed #ccc;
        padding:		20px 0 20px 155px;
        position:		relative;
        width:			300px;
    }
	#form_wrapper legend{
    	position:		relative;
    }
	#form_wrapper legend span{
    	position:		absolute;
        left:			-155px;
        top:			35px;
        width:			250px;
    }
    #form_wrapper label span{
    	display:		block;
        padding:		0 0 10px;
    }
    #form_wrapper input[type=text]{
    	border:			1px solid #ccc;
        padding:		8px 3px;
        margin:			0 0 15px;
        width:			286px;
    }
    #form_wrapper fieldset + fieldset + fieldset label{
    	display:		block;
        padding:		3px;
        border:			1px solid #d5d0bf;

        border-radius:		5px;
        -moz-border-radius:		5px;
        -webkit-border-radius:		5px;
    }
    #form_wrapper fieldset + fieldset + fieldset legend span{
    	top:			15px;
    }
    #form_wrapper fieldset + fieldset + fieldset legend + label,
    #form_wrapper fieldset + fieldset + fieldset legend + label + label + label + label + label + label{
    	width:			286px;
        margin:			5px 0;
    }
    #form_wrapper fieldset + fieldset + fieldset label{
    	display:		inline-block;
        width:			130px;
        margin:			5px 0;
        background:		#f0eee8;
    }
    #form_wrapper fieldset textarea:focus,
    #form_wrapper fieldset label > input[type=text]:focus{
		border-color: 	#aa99aa !important;
    	background:		#f9f9f9 !important;
    }
    #form_wrapper fieldset + fieldset + fieldset label:hover,
    #form_wrapper fieldset + fieldset + fieldset label.focus{
    	background:		#f9f9f9 !important;
    }
    #form_wrapper fieldset + fieldset + fieldset legend + label + label,
    #form_wrapper fieldset + fieldset + fieldset legend + label + label + label + label{
        margin-right:	15px;
    }
    #form_wrapper label[for=elaborate]{
    	width:			450px;
        margin:			30px 0 10px -155px;
        border:			none;
        background:		none;
    }
    #form_wrapper textarea{
    	width:			450px;
        height:			300px;
        margin:			0 0 0 -155px;
        border:			1px solid #ccc;
    }
    #form_wrapper input[type=submit]{
    	margin:			20px;
		width:			258px;
		height:			47px;
		display:		block;
        border:			0;
        background:		url(/4.0/images/contact-button.png) no-repeat 0 -46px;
	}
    #form_wrapper input[type=submit]:focus,
    #form_wrapper input[type=submit]:hover{
		background-position:	0 0;
	}

.formComplete{
    border:		1px solid #eee;
    background:	#fafafa;
    padding:	20px;
    margin-top:	5px;

    -webkit-box-shadow:	1px 1px 2px rgba(25,25,25,.3);
    -moz-box-shadow:	1px 1px 2px rgba(25,25,25,.3);

    border-radius: 			2px;
    -moz-border-radius:		2px;
    -webkit-border-radius:	2px;
}
	.formComplete dt{
    	margin:		13px 0 3px;
    }
	.formComplete dd{
        margin:		3px 20px;
        white-space: pre;
    }
#contactSide{
}
	.vcard#hcard-Work-Work-Play{
        line-height:	1.5em;
        margin-bottom:	30px;
    }
    #contactSide .ajaxReturn{
    	margin-top:		10px;
        background:		#faa;
    }

/* Section:Page.About */
.about .portrait{
	float:			left;
    width:			165px;
    margin:			0 20px 20px 0;
}
.about .portrait img{
	background:		url(/4.0/images/bg-grad-char.jpg) no-repeat 0 -100px;
    border:			7px solid #ccc;
}
.about .portrait span{
	text-align:		center;
    display:		block;
}
.about .joga > p,
.about .seven > p{
	padding-left:	20px;
    margin-bottom:	1em;
}
.about .person{
	min-height:		400px;
    border-bottom:	1px dotted #fafafa;
}
.about .person + .person{
	min-height:		0;
    border-bottom:	none;
    margin-top:		20px;
}
/* Section:Page.Method */
.descriptive .discovery,
.descriptive .design,
.descriptive .keepInTouch{
	background:		url(/4.0/images/sprite-icons.png) no-repeat 0 0;
}
.descriptive .discovery{
	background-position:	0 -400px;
}
.descriptive .design{
	background-position:	0 -600px;
}
.descriptive .keepInTouch{
	background-position:	0 -1200px;
}
.descriptive .development{
	background:				url(/4.0/images/icon-puzzle.png) no-repeat 0 0;
}
.descriptive .launch{
	background:				url(/4.0/images/icon-launch.png) no-repeat 0 0;
}
/* Section:Page.Philosophy */
.descriptive .philosophy,
.descriptive .pick,
.descriptive .mighty,
.descriptive .standard{
	background:		url(/4.0/images/sprite-icons.png) no-repeat 0 0;
}
.descriptive .philosophy{
	background-position:	0 -1400px;
}
.descriptive .pick{
	background-position:	0 -600px;
}
.descriptive .mighty{
	background-position:	0 -1000px;
}
.descriptive .standard{
	background-position:	0 -420px;
}

/* Section:Page.Testimonials */
.testimonials .m{
	background:				url(/4.0/images/icon-person-m.png) no-repeat 0 0px;
}
.testimonials .f{
	background:				url(/4.0/images/icon-person-f.png) no-repeat 0 0;
}

/* Section:Page.Portfolio */
#portfolio{
	padding:			10px 0 0 25px
}
#portfolio > .key{
	padding:			10px 20px;
    font-size:			16px;
    font-weight:		bold;
}/* base typography */
html, body{
	font-family:	Arial, Helvetica, sans-serif;
	font-size:		12px;
	font-weight:	normal;
	color: 			#666;
    line-height:	1.5em;
}
a{
	color:			#2f90f2;
	text-decoration:	none;
}
a:visited{
	color:			#55a3f2;
}
a:hover{
	color:			#85a3f2;
	text-decoration:	underline;
}
.accent1{
	color:			#804080;
}
.highlight-pink{
	color:			#c1006d;
}
.highlight-blue{
	color:			#56b3be
}
/* Section:Global.Header.Nav */
div.header ul.nav a{
	color:			#666666;
	text-align:		center;
	text-shadow:	1px 1px 1px rgba(255,255,255,.2)
}
div.header ul.nav a:focus,
div.header ul.nav a:hover{
	text-decoration:none;
	color:			#ffffff;
	text-shadow:	1px 1px 1px rgba(0,0,0,.2)
}
div.header ul.nav a[title="Home"],
div.header ul.nav a[title="Home"]:hover{
	font-size:		44px;
	color:			#333333;
	text-indent:	-9999px;
	background: 	url(/4.0/images/text-head-wwp.png) no-repeat 0 0;
}
html[id="wwp:about"] div.header ul.nav a[title="About"],
html[id="wwp:services"] div.header ul.nav a[title="Services"],
html[id="wwp:portfolio"] div.header ul.nav a[title="Portfolio"],
html[id="wwp:method"] div.header ul.nav a[title="Methodology"],
html[id="wwp:contact"] div.header ul.nav a[title="Contact"],
html[id="wwp:blog"] div.header ul.nav a[title="Blog"]{
	/* current page */
	/* this would be simpler with tokenized css */
	color:			#ffffff;
	font-weight:	bold;
}
/* Section:Page.Home.Pitch.Main */
.pitch.main h3{
	font-size:		18px;
	color:			#454545;
	text-shadow:	2px 2px 5px rgba(0,0,0,.2);
}
.pitch.main p{
	font-size:		14px;
   	line-height:	1.5em;
	color:			#6d7073;
	letter-spacing:	1pt;
}
.pitch.main p.author{
	text-align:		right;
}
.pitch.main p a{
	color:			#2f90f2;
	text-decoration:	underline;
}
/* Section:Global.Pitch.Secondary */
.pitch.secondary a,
.pitch.secondary{
	font-family:	Georgia, "Times New Roman", Times, serif;
	font-size:		14px;
	font-style:		italic;
	letter-spacing:	.5pt;
	line-height:	1.5em;
	color:			#524f4f;
	text-decoration:	none;
}
.pitch.secondary a em{
	color:			#2f90f2;
	text-decoration:	underline;
}

/* Section:Global.Footer */
.tweet{
	color:			#fff;
	font-family:	Arial, Helvetica, sans-serif;
	font-size:		13px;
	font-weight:	bold;
	line-height:	1.5em;
	text-shadow:	1px 1px 2px rgba(0,0,0,.4)
}
.sitemap li a{
	color:			#173648;
    font-size:		16px;
    letter-spacing:	1.1pt;
}
.sitemap li a:hover,
.sitemap li a:focus{
	border-color:	#173648;
    color:			#666;
    text-decoration: none;
}
/* Section:Page.Heading */
.focusarea h1{
	font-family:	Arial, Helvetica, sans-serif;
	font-size:		30px;
	color:			#1b9694;
	line-height:	1.5em;
	letter-spacing:	1pt;
	font-weight:	normal;
    text-shadow:	1px 1px 2px rgba(32,32,32,.2);
}

/* Section:Page.Prototype */
.descriptive h4,
.descriptive > dl > dt,
.list > dl > dt,
.list > dl > dt + dd > dl > dt{
	color:			#2ca2a2;
	line-height:	1.5em;
	font-size:		15px;
	font-weight:	bold;
	font-style:		normal;
}
.descriptive > dl > dd,
.list > dl > dd,
.list > dl > dd + dt + dd > dl > dt,
.descriptive p, .list p{
	color:			#848a8a;
	line-height:	1.5em;
	font-size:		15px;
	font-weight:	normal;
}

/* Section:Page.Contact */
#form_wrapper legend span,
#form_wrapper label[for=elaborate]{
	font-size:		12px;
    font-weight:	bold;
}
#form_wrapper label span{
    text-transform:	uppercase;
}
#form_wrapper input{
	font-size:		16px;
    color:			#666;
}
#contactSide{
	line-height:	1.5em;
    color:			#848a8a;
    font-size:		15px;
}
	.vcard#hcard-Work-Work-Play{
        line-height:	1.5em;
    }
.formComplete dt,
#contactSide .fn.n,
#contactSide dt{
	font-size:		14px;
    color:			#2ca2a2;
    font-weight:	bold;
}


/* Block:Portrait */
.portrait span{
	font-weight:	bold;
}