/* Generic Elements */

body {
	font:10px Lucida Grande, trebuchet ms, Arial,Helvetica,sans-serif;
	color: #606060;
	background-color: #000000;
	background-image:url(../images/body_bg.gif);
	background-position: top left;
	background-repeat: repeat-x;
	}
	
h2 {
	font-size:1.85em;
	color:#333333;
	margin-bottom:10px;
	}
	
h3 {
	font-size:1.2em;
	font-weight:bold;
	margin:0;
	}
	
h4 {
	font-size:1.25em;
	font-weight:bold;
	margin:0;
	}
h5 {
	font-size:1.65em;
	font-weight:bold;
	margin:20px 0px 15px 0px;
	text-transform:uppercase;
	border-bottom:1px solid #d1d1d1;
}
p {
	font-size:11px;
	line-height:1.5em;
	}

p a:link {
	border-bottom: 1px dotted #999999; 
	color: #999999;
	text-decoration:none;
	padding: 0 0 1px 0; 
	margin: 0; 
	}
	
p a:visited {
	border-bottom: 1px dotted #999999; 
	color: #999999; 
	text-decoration: none; 
	padding: 0 0 1px 0; 
	margin: 0;
	}	
	
p a:hover, a:active {
	color: #CCCCCC; 
	border: none; 
	text-decoration: none;
	}
	
ul {
	list-style-type:disc;
	list-style-position:inside;
	}
li {
	list-style-type:disc;
	list-style-position:inside;
	}
strong {
	font-weight:bold;
	font-style:inherit;
}
em {
	font-weight:inherit;
	font-style:italic;
}
	
/* Generic Classes */

.off {
	display:none;
}
.hide {
	visibility:hidden;
}
.clear {
	clear:both;
}
.center {
	text-align:center;
}

/* Specific Classes */

.flavors:after {
	content: " - ";
	}
		
/* Main Styles */	

#mainContainer {
	margin: 0 auto; 
	padding: 0; 
	width: 924px;
	}
	
/* Specific Styles */

#contentBanner {
	border:1px solid #dddddd;
	width:880px;
	}

#mainContent {
	margin: 15px 0;
	}	

#content {
	margin-bottom:15px;
}
#content p {
	margin: 15px 0;
	font-size:1.2em;
	}
	
#headerContainer {
	width: 924px;
	background-image: url(../images/top_bg.gif); 
	background-position: left bottom; 
	background-repeat: no-repeat;
	}
	
#logo {
	position: relative;
	float: left;
	padding: 15px 0 25px 3px;
	margin: 0;
}
#logo h1 {
	margin:0;
	padding:0;
}
	
#block {
	float: right; 
	width: 200px; 
	height: 100px;
	margin: 0; 
	padding: 0 0 0 0; 
	text-align: right; 
	}
	
/* Newsletter Box */

#newsletterBox {
	float:right;
	background-color:#ffffff;
	margin-top:-6px;
	width:413px;
	}

#newsletterBoxleft {
	float:left;
	width:13px;
	height:45px;
	background: transparent url(../images/newsl.gif) no-repeat left top;
	}
	
#newsletterBoxright {
	float:right;
	width:10px;
	height:45px;
	background: transparent url(../images/newsr.gif) no-repeat right top;
	}
	
#newsletterBoxmid {
	background-color:#ffffff;
	margin-top:12px;
	}	
	
#searchinput {
	float: left; 
	width: auto; 
	padding: 0 8px 0 0;
	}
#searchinput input {
	border:1px solid #cccccc;
	padding:3px;
}
	
#searchgo {
	position: relative; 
	float: right; 
	width: 23px; 
	padding: 0px;
	}
	
/* Top Menu */	

.topMenu {
	background-color: #000000; 
	float: right;
	color:#ffffff;
	padding:10px 0px 10px 14px;
	background-image: url(../images/topmenu_bgblack.gif);
	background-position:bottom right !important;
	background-repeat:no-repeat;
	}
	
.topMenuSocial {
	background-color:#c62128 !important;
	color:#6b191c !important;
	padding:8px 0px 10px 14px;
	float:right;
	background-image: url(../images/topmenu_bgred.gif);
	background-position:bottom left !important;
	background-repeat:no-repeat;
}

.topMenu p {
	color: #FFFFFF; 
	font-size: .95em; 
	padding: 0; 
	margin-right: 10px; 
	line-height: 1em;
	}
	
.topMenu a,
.topMenu a:visited {
	font-size: 1em; 
	font-weight: normal; 
	text-decoration: none;
	color: #FFFFFF;
	margin-right:14px;
}

.topMenu a:hover {
	font-size: 1em;
	font-weight: normal; 
	text-decoration: underline; 
	color: #999999;
}
.topMenuSocial a,
.topMenuSocial a:visited {
	margin-right:14px; 
	color:#ffffff;
	text-decoration:none;
}
.topMenuSocial a:hover {
	text-decoration: underline; 
	color: #000000;
}

.topMenu ul, 
.topMenu li,
.topMenuSocial ul,
.topMenuSocial li {
	display:inline;
	}
	
#topMenuAwards {
	width: auto;
	float: right;
}
	
#topMenuAwards span {
	text-indent: -9999px;
	height: 95px;
	background-position: top left;
	background-repeat: no-repeat;
	display: block;

}

#medium_business_of_the_year {
	width: 195px;
	background-image: url(/images/tbbj-mediumbusinessoftheyear.png);
	float: left;
	margin-right: 40px;
	margin-top: 23px;
}

#best_places_to_work {
	width: 70px;
	background-image: url(/images/tbbj-bestplacestowork.png);
	float: right;
	margin-right: 30px;
	margin-top: 10px;
}
	
/* Main Menu */

#menu {
	margin: 41px 0 0 0; 
	padding: 0 0 18px 20px; 
	position: relative;
	float:left;
	width:480px;
	}
	
#menu ul {
	margin: 0; 
	padding: 0;
	list-style:none;
	}
	
#menu ul li {
	margin: 0 4px 0 0; 
	padding: 0; 
	display: block; 
	float:left; 
	text-align: center; 
	line-height: 1.5em; 
	text-transform: uppercase;
	}
	
#menu ul li ul li {
	margin: 0 0 0 0; 
	padding: 0; 
	display: block; 
	float:none; 
	text-align: center; 
	line-height: 1.5em; 
	text-transform: uppercase; 
	white-space:nowrap;
	}

#menu ul li a {
	color:#FFFFFF; 
	text-decoration:none; 
	font-weight: normal;
	border-style:none;
}
	
#menu ul li a:link,
#menu ul li a:visited {
	background-color: #000000;
	display: block;
	padding: 6px 16px 6px 16px;
	}
	
#menu ul li a:hover {
	color : #101417;
	background-color: #FFFFFF;
	display: block;
	padding: 6px 16px 6px 16px;
	}
	
#menu ul li.active a {
	color : #000000;
	background: #FFFFFF;
	display: block;
	padding: 6px 16px 6px 16px;
	}
	
#menu ul li.active a:visited {
	color : #000000;
	background: #FFFFFF;
	display: block;
	padding: 6px 16px 6px 16px;
	}
	
/* Menu Bar */

#menuBar, #menuBar ul {
	padding: 0;
	margin: 0;
	list-style: none !important;
	}

#menuBar a {
	display: block;
	text-decoration: none;
	padding: 5px 10px 5px 10px;
	border-right: 1px solid #333;
	color: #CCCCCC;
	}

#menuBar li,
#menuBar ul li {
	float: left;
	width:auto;
	}

#menuBar li ul,
#menuBar ul li  {
	float: left;
}

#menuBar li ul {
	position: absolute;
	display: none;
	background-color: #FFFFFF;
	}

#menuBar li:hover ul,
#menuBar li.p7hvr ul {
	display: block;
}

#menuBar ul a:hover {
	background-color: #606060!important;
	color: #FFFFFF!important;
}
/* The single backslash \ character inside this comment
causes IE5 Mac to ignore the following rule, which allows other
browsers to render top-level menu items to their natural width.
Do not edit this rule in any way. */

#menuBar li {
	width: auto;
	}

div.bump {
	padding-top: 25px;
	}

div.autosize {
	display: table;
	width: 1px;
	}
	
div.autosize > div {
	display: table-cell;
	}
	
/* Body Content */

#bodyContainer {
	float:left;
	width: 882px;
	background-color:#ffffff;
	padding:7px 21px 7px 21px;}
	
#contentleft {
	width: 480px; 
	float: left;
	}
	
#contentleft2 {
	width:70%; 
	float: left;
	}
	
#contentleft p {
	line-height:1.75em;
	}
	
#contentleft_news {
	width: 560px; 
	float: left; 
	padding: 0; 
	margin: 0;
	}
	
#contentright {
	width: 350px; 
	float: right; 
	padding: 0 0 0 0; 
	margin: 0;
	}
	
#contentright2 {
	width: 27%; 
	float: right; 
	padding: 0 0 0 0; 
	margin: 0;
	}

#contentright2 ul {
	text-align:left;
	display:block;	
}

#contentright2 li {
	text-align:left;
	display:block;
	margin-bottom:3px;
}
	
#contentright_contact {
	width: 400px; 
	float: right; 
	padding: 0; 
	margin: 0;
	}
	
#contentright_news {
	width: 280px; 
	float: right; 
	padding: 0; 
	margin: 0;
	}
	
#contentright_home {
	width: 370px; 
	float: right; 
	padding: 13px 0 0 0; 
	margin: 0;
	}
		
/* Latest News & Events */

.entry {
	padding: 10px 0 0 0;
	width:auto;
	height:auto;
	}

.entry h2 {
	font-size:1.25em;
	margin-bottom:5px;
	}
	
.newsDate {
	position: relative; 
	float: left; 
	margin: 0 20px 0 10px;
	padding:0px;
	background: url(../images/date_bg.gif) top left no-repeat; 
	width: 48px;
	height: 51px; 
	text-align: center; 
	}
	
.newsDate_b {
	position: relative; 
	float: left; 
	padding: 0 4px 0 0; 
	margin: 0 20px 0 0; 
	background-image: url(../images/date_bg_b.gif); 
	background-position: top left; 
	background-repeat: no-repeat; 
	width: 48px; 
	height: 51px; 
	text-align: center; 
	}

p.month {
	margin: 0; 
	padding: 8px 0 0 0; 
	color: #707274; 
	text-transform: uppercase; 
	font-family: georgia; 
	line-height: .95em;
	}
	
p.day {
	margin: 0; 
	padding: 0; 
	color: #707274; 
	font-family: georgia;
	line-height: .95em;
	font-size: 2em;
	}

.month {
	margin: 0; 
	padding: 8px 0 0 0; 
	color: #FFFFFF; 
	text-transform: uppercase; 
	font-family: georgia; 
	line-height: .95em;
	}
	
.day {
	margin: 0; 
	padding: 0; 
	color: #FFFFFF; 
	font-family: georgia;
	line-height: .95em;
	font-size: 2em;
	}

.newsItem {
	float: left; 
	padding: 0; 
	margin: 0; 
	width: auto; 
	color: #FFFFFF; 
	width:245px;
	}
	
.newsItem h2 a:link,
.newsItem h2 a:visited {
	color:#ffffff !important;
	border-bottom:1px dotted #5F1D22 !important;
}

.newsItem h2 a:hover {
	text-decoration:none !important;
	color:#5F1D22 !important;
}

.newsInput {
	background: url(../images/input_bg.gif); 
	border:1px #ccc solid; 
	padding:4px 2px; 
	margin:0 0 8px 0; 
	color: #6a757d; 
	font-size: 11px; 
	width: 220px; 
	text-align: left; 
	vertical-align: middle;
	}

#latestNews {
	background-color: #ed1c24; 
	color: #fff; 
	}

#latestNews a:link {
	border-bottom: 1px dotted #000000; 
	color: #000000;
	text-decoration:none;
	padding: 0 0 1px 0; 
	margin: 0; 
	}
	
#latestNews a:visited {
	border-bottom: 1px dotted #000000; 
	color: #000000; 
	text-decoration: none; 
	padding: 0 0 1px 0; 
	margin: 0;
	}	
	
#latestNews a:visited:hover {
	color: #ffffff;
	border-bottom: 1px dotted #ffffff; 
	}
	
#latestNews a:hover, a:active {
	color: #000000;
	border-bottom: 1px dotted #ffffff; 
	}	
	
.roundtop {
	background: url(../images/tr.gif) no-repeat top right; 
	position: relative;
	}
	
.roundtop2 {
	background: url(../images/tr.gif) no-repeat top right; 
	position: static;
	}
	
.roundbottom {
	background: url(../images/br.gif) no-repeat top right;
	}
img.corner {
	width: 15px; 
	height: 15px; 
	border: none; 
	display: block !important;
	}
	
.latestContent {
	padding: 0 12px 0 25px;
	margin: 0;
	}
	
.latestContent h1 {
	padding: 4px 0 10px 0;	
	color:#000000;
	font-size:1.8em;
	}
	
.latestContent p {
	color: white;
	}
	
/* Footer */

#footerContainer {
	width: 924px;
	height: 18px;
	background:url(../images/bottom_bg.gif);
	margin: 0 0 25px 0;
	}
	
/* Column Stuff */

.twoColumn {
	width:48%;
	float:left;
	text-align:justify;
	line-height:15px;
}
.twoColumn img {
	border:1px solid #606060;
	margin:0 10px 0 0;
}

.twoColumn2 {
	width:48%;
	float:left;
	text-align:left;
}

.threeColumn {
	width:25%;
	float:left;
	text-align:left;
	margin-top:15px;
	}
.threeColumn2 {
	width:33%;
	float:left;
	text-align:left;
	}

/* Meet The Team */

.teamNav {
	margin:0px auto !important;
	padding:10px 0px 100px 0px;
	text-align:center !important;
	width:900px;
}

.teamNav ul {
	text-align:center !important;
	margin:0px auto !important;
	padding:0px;
}

.teamNav ul li {
	display:inline;
	margin:0px 10px 10px 0px;
	float:left;
	border-right:1px solid #cccccc;
	padding-right:10px;
}

.teamNav ul li a:link,
.teamNav ul li a:visited {
	color:#ed1c24 !important;
	font-size:1.25em !important;
	text-decoration:none;
	font-weight:bold;
}

.teamNav ul li a:hover {
	color:#cccccc !important;
}

.twoColumnBio {
	width:445px;
	text-align:left;
	float:left;
	margin-top:10px;
}
.twoColumnBioPhoto {
	text-align:center;
	float:right;
	margin-top:25px;
	width:422px;
}

.profileInfo h1 {
	font-size:3.5em;
	color:#ed1c24;
	border-bottom:1px solid #cccccc;
	margin-bottom:2px;
	padding-bottom:5px;
	font-weight:bold;
}

.profileInfo h2 {
	font-size:1.5em;
	color:#525252;
	margin-bottom:0px;
}

.profileInfo p {
	margin:0px !important;
}

.profileEmail {
	padding-top:25px !important;
	padding-bottom:2px !important;
}

.profileEmail a:link,
.profileEmail a:visited {
	color:#ed1c24;
}

/* Main Portfolio */

#portfolio {
	width:915px !important;
	margin-top:10px;
	display:inline;

}
.category {
	width:279px !important;
	float:left;
	margin:15px 15px 0px 0px;
}
.category h1 {
	font-size:1.35em;
	text-transform:uppercase;
	margin-bottom:10px;
	color:#525252;
}
.category li,
.category li a:link {
	list-style-type:none;
	width:279px !important;
	height:105px !important;
	border-bottom:1px solid #ed1c24;
	padding-bottom:15px;
	cursor:pointer;
}
.category #advertisements {	
	background-image: url(../images/advertisements_btn.jpg);
	background-repeat:no-repeat;
}
.category #advertisements:hover {
	background-image: url(../images/advertisements_btn_hov.jpg);
}
.category #billboards {
	background-image: url(../images/billboards_btn.jpg);
	background-repeat:no-repeat;
}
.category #billboards:hover {
	background-image: url(../images/billboards_btn_hov.jpg);
}
.category #collateral {
	background-image: url(../images/collateral_btn.jpg);
	background-repeat:no-repeat;
}
.category #collateral:hover {
	background-image: url(../images/collateral_btn_hov.jpg);
}
.category #directmail {
	background-image: url(../images/directmail_btn.jpg);
	background-repeat:no-repeat;
}
.category #directmail:hover {
	background-image: url(../images/directmail_btn_hov.jpg);
}
.category #displays {
	background-image: url(../images/displays_btn.jpg);
	background-repeat:no-repeat;
}
.category #displays:hover {
	background-image: url(../images/displays_btn_hov.jpg);
}
.category #eventcoordination {
	background-image: url(../images/eventcoordination_btn.jpg);
	background-repeat:no-repeat;
}
.category #eventcoordination:hover {
	background-image: url(../images/eventcoordination_btn_hov.jpg);
}
.category #web {
	background-image: url(../images/web_btn.jpg);
	background-repeat:no-repeat;
}
.category #web:hover {
	background-image: url(../images/web_btn_hov.jpg);
}
.category #emarketing {
	background-image: url(../images/emarketing_btn.jpg);
	background-repeat:no-repeat;
}
.category #emarketing:hover {
	background-image: url(../images/emarketing_btn_hov.jpg);
}
.category #multimedia {
	background-image: url(../images/multimedia_btn.jpg);
	background-repeat:no-repeat;
}
.category #multimedia:hover {
	background-image: url(../images/multimedia_btn_hov.jpg);
}

/* Media Portfolio */

.topLogo {
	height:85px;
}

/* Services */

.services {
	font-weight:bold;
}

.sub {
	padding: 0px 0px 2px 40px;
	display:block;
}
.sub2 {
	padding: 0px 0px 2px 60px;
	display:block;
}

/* Jobs */

.position {
	width:800px;
}

.position h4 {
	margin-left:40px;
}
.position p {
	padding-left:40px;
}
.position ul {
	margin:10px 0px 0px 60px;
}
.position li {
	font-size:1.25em;
	list-style-type:disc;
	list-style-position:outside;
	margin-top:10px;
}

/* New Portfolio */

#portfolioNav {
	list-style:none;
	font-weight:bold;
	text-align:center;
	font-size:12px;
	margin:25px 0px 15px 0px;
}
#portfolioNav li {
	list-style:none;
	display:inline;
	padding:7px;
	border-right:1px solid #CCCCCC;
}
#portfolioNav li.end {
	border:0px;
}
#portfolioNav li a {
	color:#ED1C24;
	text-decoration:none;
}
#portfolioNav li a:hover {
	color:#CCCCCC !important;
}

/*
Additional CSS for makeover pages.
*/
#makeoverBanner {
	margin-left: -21px;
	margin-top: -15px;
}
#makeoverNav {
	background: url(/images/makeover/navBg.png);
	height: 23px;
	width: 924px;
	margin-left: -21px;
}
#makeoverNav div {
	margin: 0 auto;
	text-align:center;
}
#makeoverNav #makeoverMenu li {
	display: inline;
	margin: 0 10px 0 10px;
}
#makeoverNav #makeoverMenu li a {
	color: black;
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
}
#makeoverNav #makeoverMenu li a:hover {
	color: #cc3333;
}
#makeoverTopBlock {
	padding-left: 30px;
	margin: 20px 30px 15px 20px;
}
#makeoverTopBlock h1 {
	font-size: 30px;
	margin: 10px 20px;
	color: #cc3333;
	padding-left: 47px;
}
#makeoverTopBlock p {
	margin: 10px 30px;
}
#makeoverContactBlock {
	width: 50%;
	background-color: #ffcc66;
	margin: 0 auto;
	padding: 20px 0 30px 0;
}
#makeoverContactBlock h1 {
	font-size: 30px;
	margin: 10px 30px;
	color: #cc3333;
	padding-left: 110px;
}
#makeoverContactBlock p {
	margin: 10px 30px;
}
#makeoverContentLeft {
	width: 380px; 
	float: left;
	margin-left: 50px;
	background-color: #ffcc66;
	padding: 15px;
}
#makeoverContentLeft h1 {
	font-size: 25px;
	margin: 10px 60px;
	color: #cc3333;
}
#makeoverContentLeft span {
	color: #cc3333;
	font-weight: bold;
}


#makeoverContentLeft li,
#makeoverContentRight li {
	list-style: none;
	font-size: 11px;
	margin: 10px 20px;
	color: #000;
}

#makeoverContentLeft a {
	color: #cc3333;
	font-size: 12px;
	letter-spacing: 1px;
	
}
#makeoverContentRight {
	width: 370px; 
	float: right; 
	padding: 40px 0 0 0; 
	margin: 0;
	overflow:hidden;
}
#makeoverContentRight ul {
	margin-left: 20px;
}
#makeoverContentRight a {
	text-decoration:none;
}
#makeoverContentRight a {
	color:#CC3333;
}
#makeoverContentRight .body a {
	color:black;
}
#makeoverContentRight h1 {
	font-size:20px;
	margin: 10px 20px;
	color: #cc3333;	
	padding: 20px 10px 10px 10px;
	background: url(/images/makeover/rightblockheader.png) top right no-repeat;
}
#makeoverContentRight li {
	margin-top: 10px;
	overflow:hidden;
	line-height:17px;
}
#makeoverContentRight li span.makeoverSteps {
	font-size: 16px;
	color: #cc3333;
	font-weight: bold;
	float:left;
	padding:0;
	margin:0 10px 0 0;
}
#makeoverContentRight li span.body {
	display:block;
	margin-left:70px;
}
span.deadline {
	font-weight: bold;
}
span.rules_header {
	color: #cc3333;
	font-size: 13px;
	font-weight: bold;
	
}




#menuBar li {
	list-style:none !important;
}
#menuBar,
#menuBar ul {
	margin:0 !important;
}
ul {
	margin:0 !important;
}