@charset "UTF-8";
/* M2 Design :: Base Styles */

@import url("reset.css");

body {
	background: #F7F7F7 url(../images/bg_body.png) top left;
	text-align:center;
	color:#555;
	}
	
#wrap {
	margin: 0 auto;
	width:760px;
	text-align:left;
	font-size:100%;
	font: 12px/18px 'Lucida Grande',arial,sans-serif;
	position:relative;
	background: url(../images/wave_wrap.gif) top right no-repeat;
	}

#top {
	background: url(../images/bg_nav.gif) no-repeat;
	width:760px;
	height:37px;
	}

#container {
	background: url(../images/bg_content.gif) repeat-y top;
	}
	
#content {
	position:relative;
	background: url(../images/bg_content.gif) repeat-y top;
	padding:20px;
	}

#bottom {
	background: url(../images/bg_bottom.gif) no-repeat top;
	width:760px;
	height:15px;
	}

p { padding-bottom:1em; }
	
.clear {
	clear:both;  
	height: 0;  
	width: 0;  
	line-height: 0;  
	font-size: .1px; 
	}
	
:focus{outline:0;}

img { border: none; }

a {color:#ff9000;}
a:hover {color:#000}

/* ------ Navigaton ------ */
#nav ul {
	margin:0;
	padding:7px 10px 5px 22px;
	list-style:none;
	}
#nav li {
	float:left;
	margin:0;
	padding:0 0 0 7px;
	}
#nav a {
	float:left;
	display:block;
	padding:6px 14px 10px 9px;
	text-decoration:none;
	color:#FFF;
	}
#nav a:hover {
	color:#333;
	}
#nav #current {
	background: url(../images/navLeft.gif) left top;
	}
#nav #current a {
	background: url(../images/navRight.gif) right top;
	color:#333;
	padding-bottom:6px;
	}


/* ------ Home Page Styles ------ */

h2#banner {
	background: url(../images/home_banner.jpg) no-repeat top;
	height:184px;
	display:block;
	text-indent:-9999em;
	margin-bottom:20px;
	}

#flashcontent {
	margin-bottom:20px;
	z-index:1;
	}

h3 {
	color:#ff9000;
	font-weight:normal;
	font-size:1.1em;
	border-bottom:1px solid #e2e2e2;
	margin-bottom:.5em;
	background:url(../images/h3bg.gif) right no-repeat;
	}


#left {
	width:290px;
	margin-left:10px;
	padding-right:15px;
	padding-bottom:10px;
	float:left;
	border-right:1px solid #ddd;
	}

#right {
	margin-left:330px;
	width:215px;
	}

#right img {
	border:4px solid #d7d7d7;
	margin-bottom:1em;
	width:207px
	}

#right p {
	font-size:.85em;
	line-height:15px;
	}

#right div { padding-top:5px; border-top:1px solid #e1e1e1;}
#right h4 {float:left; padding:5px 0 0 1px;}
a#twitter {margin-left:88px; display:block; width:80px; height:30px; background: url(../images/icon-twitter.jpg) no-repeat; text-indent:-9999em; cursor:pointer; background-position:0 0;}
a:hover#twitter {background-position:0 -32px;}




#home_bendy {
	position:absolute;
	bottom:-10px;
	right:-70px;
	z-index:500;
	}

/*
#left {
	width:270px;
	margin-left:190px;
	float:left;
	}

#right {
	margin: 80px 0 0 490px;
	width:210px;
	min-height:230px;
	}

#right img {
	border:4px solid #d7d7d7;
	margin-bottom:1em;
	}

#right p {
	font-size:.8em;
	}

#home_bendy {
	position:absolute;
	top:170px;
	left:-40px;
	}
*/

#call {
	font-size:1.2em;
	position:absolute;
	right:15px;
	top:90px;
	text-align:right;
	}

#call strong {
	color:#fca116;
	}

#content.home {*padding-bottom: 50px; padding-bottom:40px;}
#content.contact, #content.connect {padding:30px 30px 70px 30px}

/* ------ About Page Styles ------ */
#content.about, #content.clients { padding:30px; }





h2 { font-size:1.4em; color:#333333; margin-bottom:.5em;}
div.intro { width:460px;}
#content.about ul { list-style:disc; padding: 1em 0 1em 30px; margin:0 0 1em 20px; background:#EEE; border-left:2px solid #d7d7d7; width:390px;}
p.intro { font-size:1.1em; margin-bottom:1em;}
.bio { margin-bottom:1.5em;}
.bio p, .bio h3 { 	margin:0 0 .8em 140px;}
.bio p {width:390px;}
.bio img { float:left; }
.bio blockquote { font-size:.9em;float:right; width:115px; background:#EEE; border-left:2px solid #d7d7d7; padding:10px;}
/*#bendyfalling { position:absolute; right:-40px; top:-10px; }*/
#bendyfalling { position:absolute; right:35px; top:30px; }
#trioBios {border-top:1px solid #EEE; margin-top:2em; padding-top:2em;}

/* ------ Studies Page Styles ------ */

#content.studies {padding:30px;}

div.copy {margin-left:365px;}
div.copy ul, div.deliverables ul {padding-left:20px; list-style:disc; margin:0 0 20px 0;}


#studyImg {float:left;}
#studyImg img {border:3px solid #AAA;}

#studyImg p {margin-top:10px;}
#studyImg a {
	padding:2px 10px;
	border:1px solid #999;
	background:#EEE;
	color:#999;
	text-decoration:none;
	cursor:pointer;
	}
	
#studyImg a:hover {
	padding:2px 10px;
	border:1px solid #FF7800;
	color:#FFF;
	background:#FF9000;
	}

#content.studies h1 {font-size:1.4em; color:#333; padding-bottom:.2em;}
#content.studies h5 {font-size:1em; font-weight:normal; margin-bottom:1.5em;}

#content.studies h1 sup {position:relative; font-size:.8em;}

#subnav ul {
	margin:0;
	list-style:none;
	height:2em;
	border-bottom:1px solid #ccc;
	margin-bottom:3em;
	}
#subnav li.header {
	font-weight:bold;
	font-size:1.2em;
	padding-left:0;
	padding-right:5px;
	}
#subnav li {
	float:left;
	margin:0;
	}
#subnav a {
	float:left;
	display:block;
	text-decoration:none;
	color:#999;
	padding:0 13px;
	}
#subnav a:hover {
	color:#000;
	}
#subnav #current {
	background: url(../images/navLeft.gif) left top;
	}
#subnav #current a {
	background: url(../images/navRight.gif) right top;
	color:#333;
	padding-bottom:6px;
	}

	

/* ------ Client Page Styles ------ */

#clientsInfo {
	position:absolute;
	width:200px;
	top:30px;
	padding:10px;
	color:#999
	}

#clientsInfo p {
	margin:0;
	}

#clientsMain {
	width:440px;
	margin-left:260px;
	}
	
#clientsMain div.quote { 
	background:#EEE url(../images/quoteBottom.jpg) bottom center no-repeat; 
	text-indent:-10px;
	}

#clientsMain div.quote span {
	background:#EEE url(../images/quoteTop.jpg) top center no-repeat;
	display:block;
	height:15px;
	}

.clients h4 {
	border-bottom:1px solid #ddd;
	margin-bottom:6px;
	}
.clients blockquote {
	padding: 2px 15px 30px 25px;
	}

.clients blockquote em {
	font-size:1em;
	color:#777;
	font-weight:bold;
	}

.clients p.quoter {font-size:.9em; line-height:normal; border:0; margin-left:55px; color:#000;margin-bottom:3em;}
.clients p.quoter strong {font-size:1.2em; color:#FF7800;}
.clients p.developed {padding-top:5px;  font-size:.9em; line-height:16px; margin-bottom:1em; }





/* ------ Contact Page Styles ------ */
#form {
	margin-left:10px;
	min-height:320px;
	}
#location {
	position:absolute;
	left:590px;
	top:50px;
	}
	

#bendy_half {
	position:absolute;
	bottom:-11px;
	right:201px;
	}

p.intro {	width:400px;}
	
label {
	width:120px;
	float:left;
	padding-top:3px;
	}

p.optin {
	margin-left:116px;
	width:250px;
	}
	
p.optin label {
	width:auto;
	float:left;
	}

p.optin span {
	display:block;
	margin-left:2em;
	}

input.textfield {
	border:1px solid #CCC;
	width:200px;
	height:20px;
	}

input.submit {
	margin-left:140px;
	}

	
fieldset p.privacy {
	margin-left:140px;
	color:#AAA;
	}
	
	
/* ------ Footer Styles ------ */

#footer {
	margin:.5em 0 2em 30px;
	font-size:.8em;
	}

#portfolio_base {
	position:absolute;
	bottom:26px;
	left:6px;
	*bottom:45px;
	_display:none;
	}


/* ------ Connect Landing Page Styles ------ */

.connect p.intro {width:700px; padding:0; }
#video {text-align:center; border-top:1px solid #ddd; border-bottom:1px solid #ddd; background:#eee; padding:20px 0;}
#callout {margin:20px 0 0 370px;}
#callout strong {font-size:1.25em; margin-bottom:3px; color:#555;}


/* ------ News ------ */
#news {width:500px;}
#news div {padding:0 0 .5em 0;}
#news h5 {display:block; font-size:1.15em; color:#000;}
#news span {font-style:italic; display:block; border-top:1px solid #e1e1e1; padding:.5em 0; font-size:.85em;}
#news .archive {text-align:center; border-top:1px solid #e1e1e1; padding-top:.8em; display:none;}