/* philter style sheet. v1 */




/*
	Global defaults
*/

html{
	margin:0;
	padding:0;
	height:100%;
	width:100%;
	overflow: -moz-scrollbars-vertical;
	overflow-y: auto;
	/*
		Horizontal scrolling is on by default and turned off
		from javascript if the browser width is big enough.
		This way, if javascript is turned off, the page
		will still scroll if the browser window isn't
		wide enough.
	*/
	overflow-x: auto;
}

body{
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	background:#ffffff;
	color:#4b5358;
	font-family:Helvetica, Arial, sans-serif;
}

img,a{
	border:none;
	outline:none;
}

a{
	color:#4b5358;
	font-weight:bold;
	text-decoration:underline;
}

p{
	margin:0;
	padding:5px 0;
	font-size:12px;
	font-weight:normal;
}

/*
h1{
	font-size:45px;
	line-height:46px;
	font-weight:bold;
	margin:0;
	padding:15px 0;
}
*/

h1{
	font-size:28px;
	line-height:28px;
	font-weight:bold;
	margin:0;
	padding:0 0 20px 0;
}


h2{
	font-size:28px;
	line-height:28px;
	font-weight:bold;
	margin:0;
	padding:0 0 20px 0;
}

h3{
	font-size:14px;
	line-height:17px;
	font-weight:bold;
	margin:0;
	padding:5px 0 0 0;
}




/*
	Global styles
*/

.left{
	float:left;
}

.right{
	float:right;
}

.clear{
	clear:both;
}

.red{
	color:#f54c3a;
}

.yellow{
	color:#ffe800;
}

.blue{
	color:#00b6de;
}

.grey{
	color:#4b5358;
}

.no_flash{
	text-align:center;
	width:2000px;
	border-bottom:2px solid #eee;
	height:398px;
	overflow:hidden;
}



/*
	Header
*/

.header{
	position:relative;
	width:700px;
	height:100px;
	margin:0 auto;
}

.header .logo{
	position:absolute;
	bottom:11px;
	left:0;
}

.nav{
	position:absolute;
	text-align:right;
	bottom:16px;
	right:0;
}

.nav a{
	display:inline-block;
	padding-top:11px;
	font-size:14px;
	color:#4b5358;
	font-weight:normal;
	text-decoration:none;
}

.nav a:hover.who, .nav a.who.active {
	background:url(../images/dot_red.gif) no-repeat left top;
}

.nav a:hover.what, .nav a.what.active {
	background:url(../images/dot_blue.gif) no-repeat left top;
}

.nav a:hover.show, .nav a.show.active {
	background:url(../images/dot_yellow.gif) no-repeat left top;
}

.nav a:hover.hello, .nav a.hello.active {
	background:url(../images/dot_grey.gif) no-repeat left top;
}




/*
	Pullout message
*/

.welcome_message, .pullout_message{
	position:relative;
	width:700px;
	margin:0 auto;
	padding-top:25px;
	font-size:40px;
	line-height:41px;
	font-weight:bold;

}



/*
	Main flash areas
*/

#flash_area{
	position:absolute;
	width:2000px;
	height:270px;
	top:230px;
	left:50%;
	margin-left:-1000px;
	overflow:hidden;
}

#flash_area_folio{
	position:absolute;
	width:2000px;
	height:400px;
	top:100px;
	left:50%;
	margin-left:-1000px;
	overflow:hidden;
}


/*
	Main text areas
*/


.text_area{
	position:relative;
	width:700px;
	margin:310px auto 0 auto;
}

.text_area_folio, .text_area_case_study {
	position:relative;
	width:700px;
	margin:422px auto 0 auto;
}

.text_area_folio h1 {
  width: 280px;
}

.text_area_case_study h1 {
  width: 380px;
}

.text_area_case_study ul {
  color:#4b5358;
	font-family:Helvetica, Arial, sans-serif;
  font-size: 12px;
  font-weight: normal;
  padding: 0 0 0 15px;
  margin-top: 3px;
  margin-bottom: 3px;
}

.text_area_case_study li {
  padding-top: 3px;
  padding-bottom: 3px;
}

/*
	Paragraph styles
*/

.home p{
	font-size:13px;
	line-height:18px;
}

.col220{
	width:220px;
	float:left;
	padding:5px 20px 5px 0;
	line-height:16px;
}

.col220_nopad{
	width:220px;
	padding-right:0;
	float:left;
	padding:5px 0;
	line-height:16px;
}

.col280{
	width:280px;
	float:left;
	float:left;
	padding:5px 0;
	line-height:16px;
}

.col280 p{
	padding:5px 0 5px 0;
}

.col320 {
  width:320px;
	float:left;
	float:left;
	padding:5px 0;
	line-height:16px;
}

.col320 p{
	padding:5px 0 5px 0;
}

.col340{
	width:340px;
	padding-left:80px;
	float:left;
	padding:5px 0;
	line-height:16px;
}

.col460{
	width:460px;
	float:left;
	padding:0;
}


/*
	Folio section
*/

.folio_links_wrapper{
	float:left;
	width:340px;
	margin-left:40px;
}

.folio_links{
	width:340px;
	color:#a5a9ab;
	font-size:12px;
	line-height:16px;
	font-weight:normal;
	padding:0 0 10px 0;
	margin:0 0 10px 0;
	border-bottom:1px solid #ececec;
}

.more a{
	font-weight:normal;
	color:#a5a9ab;
	font-size:11px;
	text-decoration:none;
	background:url(../images/arrow_more.gif) no-repeat center left;
	padding-left:8px;
}

.less{
	display:none;
}

.less_link a{
	font-weight:normal;
	color:#a5a9ab;
	font-size:11px;
	text-decoration:none;
	background:url(../images/arrow_less.gif) no-repeat center left;
	padding-left:8px;
}

.folio_links a{
	display:block;
	font-weight:normal;
	color:#a5a9ab;
	text-decoration:none;
}

.folio_links a:hover, .folio_links .active{
	color:#4b5358;
}

.folio_links h1{
	font-size:20px;
	line-height:26px;
	font-weight:bold;
	margin:0;
	padding:0;
}

.folio_col{
	float:left;
	width:100px;
	padding-right:20px;
}

.folio_col_nopad{
	float:left;
	width:100px;
	padding-right:0;
}





/*
	Design Speak section
*/

.design_speak_links{
	float:left;
	width:340px;
	margin-left:80px;
	color:#a5a9ab;
	font-size:12px;
	line-height:16px;
	font-weight:normal;

}

.design_speak_links a{
	display:block;
	font-weight:normal;
	color:#a5a9ab;
	text-decoration:none;
	padding:5px 0;
}

.design_speak_links a:hover, .design_speak_links .active{
	color:#4b5358;
}

.design_speak_col{
	float:left;
	width:100px;
	padding-right:20px;
}

.design_speak_col_nopad{
	float:left;
	width:100px;
	padding-right:0;
}



/*
	Hello Form
*/

.hello_form{
	font-size:11px;
	padding:0;
	margin:0;
	background:#eee;
	overflow:hidden;
	width:460px;
	position:relative;
	display:block;
}

.hello_form form{
	padding:15px;
}

.hello_form label{
	display:block;
}

.hello_form input{
	width:198px;
	border:1px solid #ccc;
	padding:5px;
}

.hello_form select{
	width:210px;
	border:1px solid #ccc;
	padding:4px;
}

.hello_form textarea{
	border:1px solid #ccc;
	font:12px Helvetica, Arial, sans-serif;
	width:418px;
	padding:5px;
}

.hello_form .left-cell {
    padding-right: 10px;
    padding-bottom: 10px;
}
.hello_form .right-cell {
    padding-bottom: 10px;
}
.hello_form button{
	background:#444;
	border:1px solid #222;
	color:#eee;
	padding:5px;
	cursor:pointer;
}

.hello_form #submitted {
  padding: 15px;
  height: 160px;
}

.hello_form .recap_text {
    width:390px;
    margin-top:5px;
}

/*
	Footer
*/

.footer{
	position:relative;
	width:700px;
	margin:0 auto;
	padding:20px 0;
	color:#a5a9ab;
	font-size:12px;
}

.footer a{
	color:#a5a9ab;
	font-weight:normal;
	text-decoration:none;
}