﻿   html, body {
    padding: 0 0 0 0;
	border: none;
	margin: 0 auto;
	font-family:Helvetica, Arial, Sans-Serif; 
	width:100%;
	font-size:12px;
	top: auto;
	text-align:center;
	
    }
    
    .clear {
clear:both;
height:0px;
overflow:hidden;
}

h1, h2 { 	font-size:18px;  font-family: Georgia, Serif;

	font-style:italic;
	

	font-weight:normal;
	color: #ff7f00;}
h4 { font-size: 12px; }

p {color: #666;}

ul{list-style:none;}
    
  #pagewidth{
	position:relative;
	width:100%;
	text-align:left;
	top: 0;
	z-index: 3;
 
} 
 


#main {
	width: 1020px;
	margin-left:auto;
	margin-right:auto;
	padding-left:0;
	padding-right:0;
	background: #fff;
	
	
}

#masthead {
	width: 1020px;
	margin-left:auto;
	margin-right:auto;
	border: solid 0 #000;
	height: 145px;
	
	margin-top: 10px;
	margin-bottom: 0;
}

#home #masthead {

background: url(../images/home.jpg) no-repeat;
}

#awards #masthead {

background: url(../images/work.jpg) no-repeat;
}


#recently  #masthead {

background: url(../images/recently.jpg) no-repeat;
}

#us  #masthead {

background: url(../images/us.jpg) no-repeat;
}

#workpage  #masthead {

background: url(../images/work.jpg) no-repeat;
}


#odds  #masthead {

background: url(../images/odds.jpg) no-repeat;
}

#bookshelf  #masthead {

background: url(../images/bookshelf.jpg) no-repeat;
}

#blog  #masthead {

background: url(../images/blog.jpg) no-repeat;
}

#contact  #masthead {

background: url(../images/contact.jpg) no-repeat;
}

#clients  #masthead {

background: url(../images/clients.jpg) no-repeat;
}

#footer {
    width: 990px;
	margin-left:auto;
	margin-right:auto;

	color:#3F3F3F; font-family: Helvetica, Arial, Sans-Serif; font-weight: normal; 
	
	padding:15px 0 0 5px;
	border: solid 0 #000;
	background: #eee;
	height:88px;
	margin: 20px 0 20px 12px;
	font-size:11px;
	}
	
	

	.bottomnav a, .bottomnavright a {
	text-decoration: underline;
	color: #ff7f00;
	padding:0;
	}

	
	.bottomnav a:hover, .bottomnavright a:hover {
	text-decoration: none;
	
	}
	
	.bottomnavleft {
	
	display:block;
	text-align:left;
	margin: 0;
	padding:0 40px 0 10px;
	width:173px;
	float:left;
	border-right: 1px solid #ccc;
	height:75px;
	}
	
	.bottomnav {
	
	display:block;
	text-align:left;
	margin: 0;
	padding:0 40px 0 10px;
	width:178px;
	border-right: 1px solid #ccc;
	float:left;
	
	height:75px;
	}
	
		.bottomnavmiddle {
	
	display:block;
	text-align:left;
	margin: 0;
	padding:0 40px 0 10px;
	width:178px;
	border-right: 1px solid #ccc;
	float:left;
	
	height:75px;
	}
	
	
	.bottomnavright 
	{
	    
	    
	display:block;
	text-align:left;
	margin: 0;
	padding:0 40px 0 10px;
	width:220px;
	float:left;
	border-left: 0 solid #ccc;
	height:75px;
	}
	
	
.bottomnav h2, .bottomnavright h2 {
margin:0;
padding:0;
line-height:normal;
font-size:11px;
font-family: Helvetica, Arial, Sans-Serif; 
color: #3F3F3F;
font-weight:bold;
font-style:normal;
}



#navcontainer 
{
    
 font-family:Georgia, serif;
	font-style:italic;
height:65px;
width:992px;
	float:left; 

  
}
#navcontainer ul 
{
height:40px;
width:992px;
float:left;
margin:15px 0 15px 12px;
padding:0;
 border-bottom:1px solid #eee; 
	
}

#navcontainer ul li
{
   float:left; 
   margin:0;
   padding:0;
}

#navcontainer ul li a
{
	width:68px;
	display:block;
	color:#000;
	font-size:14px;
	padding:3px 0 0 0;
	border-top:1px solid #999;
text-transform: capitalize;
text-decoration:none;
margin: 0 5px 0 5px;


}
#navcontainer ul li a.start
{
padding-left: 0;
margin: 0 5px 0 0;

}
#navcontainer ul li a.end
{
border-right: none;
margin: 0 0 0 5px ;

}
#navcontainer ul li a:hover
{
color:#ff7f00;
	border-top:1px solid #ff7f00;
	text-decoration:none;}

#navcontainer ul li.selected a
{
color:#ff7f00;
	border-top:1px solid #ff7f00;
}


a {
	text-decoration: underline;
	color: #ff7f00;
}
a:link {
	text-decoration: underline;
	
}
a:visited {
	text-decoration: underline;
	color: #ff7f00;
}
a:hover {
	text-decoration: underline;
	color: #3f3f3f;
}
a:active {
	text-decoration: none;
	color: #3f3f3f;
}





.orange {
color: #ff7f00;

}
.orangenormal {
color: #ff7f00;

}

.container { 	  float: left; overflow: hidden; width: 1017px; margin:0; padding:0; font-style:normal;}

#maincontent {
float:left;
	margin: 0 0 20px 0;
padding:0;
 	width: 850px;
 
 	 margin-bottom: -2000px; padding-bottom: 2000px;

 

}

#blurb {
	
	float:left;
	margin: 0 0 20px 0;

 	width: 850px;
 
 	 margin-bottom: -2000px; padding-bottom: 2000px;
	line-height:30px;	
 	
 }
 
 #blurb p{
 
 margin-top:0;	
 padding: 0 355px 0 12px;

  font-family: Georgia, Serif;
font-size:18px;
color: #666;
	font-style:italic;
 
 }
 
 #blurb p .date{

 
 
 }
#blurb h1 {

	padding-left:20px;
	margin:  0 0 0 0;
	padding-bottom:15px;
}

#blurb h2 {
	padding-left:20px;
	margin:  0 0 0 0;
	padding-bottom:0;
}


.blurbinternal {
	
	
	float:left;
	margin: 0 0 0 12px;
	width: 997px;
 	padding: 0 0 15px 0;
 	
 	background: #fff;
 	clear:both;
 	border: solid 0 red;
 	border-bottom: solid 1px  #eee;
 }
 

 
 .blurbinternal p{
 
 	
 padding: 5px 0 10px 0;
display:block;
border: solid 0 #000;
 float:left;
 margin:0 0 0 0;
 line-height: normal;
 width: 460px;
 font-family: Helvetica, Arial, Sans-Serif;
 color: #3F3F3F;
 font-weight: bold;
font-style:normal;
 }
  
 .blurbinternal a{
 
 }
 .blurbinternal p .date{

 
 
 }
.blurbinternal h1 {
	padding:0 0 0 0;
	margin:  0 0 0 0;
	
}


.likes {
	
	
	float:left;
	margin-left: 15px 0 0 8px;
	width: 980px;
 	padding: 0 0 20px 12px;
 	
 	background: #fff;
 	border: solid 0 #eee;
 	clear:right;
 	
 }
 
 .likes img {
 
 float:left;
 padding:5px 20px 0 0;
 margin:0 0 0 0;
 display:block;
 border: solid 1px #000;
 }
 
 .likes p{
 
 
 padding: 5px 0 0 0;
display:block;
border: solid 0 #000;
 float:left;
 margin:0 15px 0 0 0;

 font-size:18px;  font-family: Georgia, Serif;

	font-style:italic;
	

	font-weight:normal;
 line-height:30px;
 }
  
 .likes a{
 
 }
 .likes p .date{
 
 
 
 }
.likes h1 {
 
 line-height:30px;

	padding-left:0;
	margin:  0 0 0 0;
	padding-bottom:0;
	
}

.blurbfirst {
	
	float:left;
	margin: 0 10px 0 12px;
	padding: 10px 20px 10px 0;
 
 	background: #fff;
 	border-top: solid 1px #eee;
 	width:665px;
 	
 
 	
 }
 
 .blurbfirstimg 
 {
   
      width:230px;
   float:left;
 padding:5px 0 0 0;
 margin:0 10px 0 0;
 text-align:right;
 
 }

 .blurbfirst img { max-width: 230px; z-index: 100;}
 
 .blurbfirsttext 
 {
     margin: 0 0 0 0;
     float:left;
   width:420px;
     z-index: 1;
 }
 
  .blurbfirsttextright 
 {
     margin: 0 0 0 240px;
     _margin: 0 0 0 120px;
     float:left;
   width:420px;
     z-index: 1;
 }
 .blurbfirst p{
 
 	
 padding: 0;
float:left;
border:solid 0 #000;
 margin:5px 0 0 0;

 color: #666;

  font-family: Helvetica, Arial, Sans-Serif;
 
 }
  
 
.date{

 color: #B1B4B6;
 margin:5px 0 0 0;
 
 
 
 }
.blurbfirst h2 {
	padding:0;
	margin:  0 0 2px 0;
	
	color: #ff7f00;
	font-family: Georgia, Serif;
	 font-weight:normal;

font-style:italic;
	
 }

.blurbfirst h1 {
	padding-left:20px;
	margin:  0 0 5px 0;
	padding-bottom:0;
 }
.blurbrecent {
	
	float:left;
	margin-left: 10px;
	margin-right: 15px;
 	width:680px !important;
    *width:680px;
 	padding: 0 0 15px 0;
 	margin-bottom: 5px;
 	background: #fff;
 	border-bottom: solid 1px #eee;
 	clear:right;
 	margin-top:0;
 }
 
 .blurbrecent img {
 
 
 padding:5px 20px 0 0;
 display:inline;
 /*margin:0 0 0 180px !important;
 *margin: 0 0 0 90px;
 display:block;*/
 }

 .blurbrecent .older {
 
 float:left;
 padding:0 20px 0 0;
 margin:0 0 0 180px !important;
 *margin: 0 0 0 90px;
 display:block;
text-align:right;
width:100px;

 } 
 .blurbrecent p{
 
  float:left;
	margin-top:0;	
 padding: 0 0 0 0;
display:block;
border:solid 0 #000;
 width:380px; 
 margin-right:0;
 margin-bottom:0;

 }
  
 
 .blurbrecent p .date{

 color: #B1B4B6;
 
 
 }
.blurbrecent h1{
	padding-left:20px;
	margin:  5px 0 5px 0;
	padding-bottom:0;

}


.blurbrepeat {
	
	float:left;
	margin: 0 15px 0 10px;
	
	width:630px;
    padding: 20px 40px 20px 0;
 	background: #fff;
 	border: solid 0 red;
 	clear:right;
 
 }
 
 .blurbrepeat img {
 
 float:left;
 padding:5px 20px 0 0;
 margin:0 0 0 12px;
 display:block;
 }

 .blurbrepeat .older {
 
 float:left;
 padding:0 20px 0 0;
 margin:0 0 0 180px;
 _margin: 0 0 0 90px;
 display:block;
text-align:right;
width:100px;

 } 
 .blurbrepeat p{
 
	margin:5px 0 0 0;	
 padding: 0 20px 0 0;
display:block;
border:solid 0 #000;
 width:390px;
 float:left;

 
 }
  
 .blurbrepeat a{
 font-weight:normal;

 
 } 
 .blurbrepeat p .date{

 
 
 }
.blurbrepeat h1{
	padding-left:20px;
	margin:  5px 0 5px 0;
	padding-bottom:0;
}


#contactFormArea {margin-top:10px; padding-left:20px;}
#contactFormArea fieldset{border:0;margin:0 0 15px;padding:0;}
#contactFormArea label{display:block;width:400px;padding:5px 0 3px;}
#contactFormArea input,textarea{width:291px;color:#000;border:1px solid #ccc;margin:1px 0;padding:3px;margin-bottom:5px;}
#contactFormArea .mailingListCheckBox input,#mailing{ float:left;width:20px;margin-top:8px; border: solid 0 #000;}
#contactFormArea .mailingListCheckBox label{ display:inline; width:200px;margin-top:0; border: solid0 #000; padding-top:0;}
#contactFormArea input.submit{width:80px;}
#contactFormArea .submit input{width:80px;margin-top:0;}/*background:transparent url(../images/send.jpg) no-repeat scroll left top;border:medium none;cursor:pointer;height:38px;margin-top:10px;text-indent:-9999px;display:block;width:124px;}
*/


/*clients */

#adsdiv {
  border:0 solid #000;
  padding:0 0 0 0;
  width:710px;
  margin:0 0 100px 20px;
  }
#adverts {
  padding:0;
  margin:0;
  width:710px; 
  position:relative;
  border-top:2px solid #fff;
  border-left:0 solid #eee;
  }
* html #adverts {width:711px; w\idth:710px;}
#adverts li {
  list-style-type:none; 
  width:155px; 
  height:55px; 
  float:left; 
  }
#adverts a {
  background:#fff;
  position:absolute; 
  width:155px; 
  height:55px; 
  display:block;
  font-size:5px;
  padding:2px;
  }
#adverts a img {
  width:155px; 
  height:55px; 
  border:0; 
  }
#adverts a:hover {
  width:155px; 
  height:55px;
  z-index:500;
  background:transparent url(../ads/opaque.gif);
  }

#adverts a:hover img {
  background:#fff; 
  position:absolute; 
  width:155px; 
  height:55px;
  border:4px solid #ff7f00;
  border-width:4px 4px 4px 4px;
  left:-2px; 
  top:-2px;
  }
* html #adverts a:hover img {
  width:155px; 
  height:55px;
  width/**/:155px;
  height/**/:55px;
  }
.clear {clear:both;}
.advert {background:#eee;}
#info em {display:block; clear:both;  text-align:right; padding-right:1em;}
#info p {text-align:center;}
#info p.col4 {text-align:left;}

#outer{float:left; margin-bottom:100px;}

/* always visible */
#outer .holder { padding:0 10px 0 20px; border:0 solid #ddd; margin:0 20px 0 0; width:750px; clear:both;}
#outer .holder p {padding:5px 0 0 0; margin:0 0 0 0;}
#outer .holder p.bold {font-weight:bold;}
#outer .holder h2 {margin:10px 0 2px 0; padding:0; }

/* unclicked style div.more */
#outer div.more b.show {text-decoration:underline; float:left; margin-right:-10px 10px 0 0; padding-bottom:5px !important; *padding-bottom:5px; cursor:pointer; color:#000; font-weight:bold;}
#outer div.more a {color:#000; text-decoration:underline;}
#outer div.more a:hover {color:#ff7f00; text-decoration:underline;}
#outer div.more b.hide {display:none;}
#outer div.more p {display:none;}
#outer div.more img {display:none;}

/* clicked style div.click */
#outer div.click b.show {display:none;}
#outer div.click b.hide {display:block; color:#000; font-weight:bold;cursor:pointer; margin-bottom:10px; float:left; border: solid 0 #000;}
#outer div.click a {color:#ff7f00; text-decoration:underline;}
#outer div.click a:hover {color:#000; text-decoration:underline;}
#outer div.click p {display:block; padding:0; margin-bottom:0;}
#outer div.click img {display:block; float:left; padding-right:10px;padding-bottom:10px;}

.clients {

margin:0 0 0 15px; font-size: 22px; font-weight:bold;
width:700px;
}

.clients  td {

padding:1px;
width:25%;
vertical-align:top;

}

#biog{float:left; border:solid 0 #000; width:680px; clear:both; display:block;}

/* always visible */
#biog .holder { float:left;
	
 	width:680px;
 	padding: 0 0 15px 0;
 	margin-bottom: 0 15px 5px 10px;
 	background: #fff;
 	border-bottom: solid 0 #eee;
 	clear:right;
 	
 	}
#biog .holder p { float:left;
	
	margin:0;	
 padding: 0 10px 0 0;
display:block;
border:solid 0 #000;
 width:420px;


 }

#recentouter{float:left; border:solid 0 #000; width:680px; clear:both; display:block;}

/* always visible */
#recentouter .holder { float:left;
	margin-left: 10px;
	margin-right: 15px;
	color: #000;	
	
 	width:680px !important;
    *width:680px;
 	padding: 0 0 15px 0;
 	margin-bottom: 5px;
 	background: #fff;
 	border-bottom: solid 1px #eee;
 	clear:right;
 	margin-top:0;}
#recentouter .holder p { float:left;
	
	margin-top:0;	
 padding: 0 10px 0 0;
display:block;
border:solid 0 #000;
 width:350px !important;
 *width:350px;
 
 margin-right:0;

 margin-bottom:0;
 }
#recentouter .holder p.bold {font-weight:bold;}
#recentouter .holder h2 {	padding-left:20px;
	margin:  5px 0 5px 0;
	padding-bottom:0;

 color:#000;}

/* unclicked style div.more */
#recentouter div.more b.show {float:left; margin-right:-10px 10px 0 0; padding-bottom:20px !important; *padding-bottom:10px; cursor:pointer; color:#ff7f00; font-weight:bold;}
#recentouter div.more b.hide {display:none;}
#recentouter div.more p {display:none;}
#recentouter div.more img {display:none;}

/* clicked style div.click */
#recentouter div.click b.show {display:none;}
#recentouter div.click b.hide {display:block;color:#ff7f00; font-weight:bold; }
#recentouter div.click p {display:block;  padding:0; margin:0;}
#recentouter div.click img {display:block; text-align:right;float:left;margin-bottom:2px; border:solid 1px #000;}
#recentouter div.click .holder img {display:none;}

	
	#bottomnav p {
	
	
	
	display:block;
	text-align:left;
	margin-left:0;
	margin-top:2px;
	width:300px;
	float:left;
	border: solid 0 #000;
	padding:0;
	}

a.worklink{

color:#666;
text-decoration:none;
cursor:hand;
font-size:18px;  font-family: Georgia, Serif;

	font-style:italic;
	

	font-weight:normal;
}

a:hover.worklink, .worklinka:hover {

color:#ff7f00;
text-decoration:none;

}

a.worklinkclose{

color:#ff7f00;
text-decoration:underline;
cursor:hand;
}

a:hover.worklinkclose, .worklinkclosea:hover {

color:#000;
text-decoration:underline;

}

#worklinks {
float:left;
width: 190px;

border: solid 0 #eee;
margin:10px 10px 0 10px;
}

#workcontent {
float:left;
width: 500px;
display:block;
font-style:normal;

}

#workcontent p {color:#666;font-weight:normal;}

#ongoing {display:none; width:500px;float:left;}
#concepts {display:none; width:500px;float:left;}
#tone {display:none; width:500px;float:left;}
#promotional {display:none; width:500px;float:left;}
#advertising {display:none; width:500px;float:left;}
#annual {display:none; width:500px;float:left;}
#online {display:none; width:500px;float:left;}
#internal {display:none; width:500px; float:left;}
#brand {display:none; width:500px;float:left;}
#editorial {display:none; width:500px;float:left;}
#press {display:none; width:500px;float:left;}
#thomas {display:none; width:500px;float:left;}
a.worklink { float:left;
width: 190px;
display:block;

margin:0 10px 0 0;}

.rightcontent {  border-left: solid 1px #eee; float:left; width:150px; margin: 10px 0 -2000px 0; padding:  0 0 2000px 10px;  }

.rightcontent h2 { font-family: Georgia, Serif;
	 font-weight:normal; font-size:14px;
	
font-style:italic;
	color: #ff7f00; margin:0; padding:0;  }
	
	.rightcontent a { color:#3F3F3F; font-family: Helvetica, Arial, Sans-Serif; font-weight: bold;  text-decoration:none;}
	
	.rightcontent a:hover { color:#ff7f00; }
	.rightcontent p { width: 150px; color:#3F3F3F; font-family: Helvetica, Arial, Sans-Serif; font-weight: normal;  margin:0 0 0 0; padding:0;}
	p.hyphen {color: #ccc; font-weight: normal; margin:0; padding:0;}
	
	.twitter {  float:left; width: 16px; height: 16px; background: url(../images/twitter.png) no-repeat; margin: 0 0 2px 0;}
	.twitterlink { float:left;  height: 16px; margin:2px 0 0 4px; }
	.linkedin { float:left; width: 16px; height: 16px; background: url(../images/linkedin.png) no-repeat; margin: 0 0 0 0;}
	.linkedinlink { float:left;  height: 16px; margin:0 0 0 4px; }
	
	.footerimage {width:26px; float:left;}
	.footertext {float:left; width:185px;}
	.biogpic {display:block;width:230px;float:left;margin:10px 20px 10px 0;}
	.biogpic img {width:230px;}
	a.us {font-weight:normal;float:left;width:200px;display:block;}
	
	.likesnote {font-weight:normal;float:right;color: #ff7f00;width:350px;display:block;border:solid 0 #000; text-align:right;}
	
	h2.grey {color: #666}
	
	
	
	ul#twitter_update_list {
	list-style: none;
	margin:0;
	
	}
	
	ul#twitter_update_list li 
	{
	    font-size:12px;
	margin: 0 0 0 -40px;
	border:solid 0 red;
	}
	
	ul#twitter_update_list li a {color:#000;}
	
	