/* Drumbeat Version 2 */

html, body, div, span, p, h1, h2, h3, h4, h5, h6, ul, li, hr, img {
	border: 0;
	margin: 0;
	padding: 0;
}

a {
	color: #2C242C;
	text-decoration: none;
}

a:hover {
	text-decoration: none;
	color: #7D7D84;
}

.clearboth {
	clear: both;
}

body {
	background-color: #fff;
	color: #2C242C;
	font-size: 9px;
	font-family: 'century gothic', Tahoma, sans-serif;
}


#container {
	margin: 0 auto;
	width: 744px;
}



/* Header */

#header {
	margin-top: 36px;
}

#header h1 {
	float: right;
}

#blog {
	float: left;
	margin-top: 15px;
}

#contact {
	float: right;
	font-size: 1.2em;
	margin-right: 85px;
}

#contact ul {
	float: left;
	list-style-type: none;
	margin-left: 30px;
	text-align: right;
}

#contact ul li {
	line-height: 100%;
}

#contact ul li a {
	text-decoration: none;
}

#contact ul li a:hover {
	text-decoration: none;
}

/* New Navigation*/

#main_navigation {
	text-transform: uppercase;
	float: right;
	margin: 31px 82px 0 0;
	width: 470px;
	font-weight: normal;
	
}

#main_navigation h3 {
	font-weight: normal;
	font-size: 16px;
	float: left;
	margin-left: 30px;
	letter-spacing: -1px;
}

#menu-call, #menu-call-portfolio, #menu-call-contact, #menu-call-resource {		
	float:left;
	margin-right:0;
}

	#menu-container {
	}

	#menu-container-portfolio {
	}
	
	#menu-container-portfolio {
	}
	
	#menu-container-resource {
	}
	
	#menu, #menu-portfolio, #menu-contact, #menu-resource {
		position:absolute;
		display:inline;
		z-index: 99;
		width: 100px;
		background: #fff;
		margin:  16px 0 0 0;
		padding: 15px 3px 3px 3px;
		display: none;
		list-style-type: none;
		text-align: right;
	}
	
	#menu {
		margin-left: 55px;
	}
	
	#menu-portfolio {
		margin-left: 160px;
	}

	#menu-contact {
		margin-left: 260px;
	}
	
	#menu-resource {
		margin-left: 360px;
	}
	
	#menu li, #menu-portfolio li, #menu-contact li, #menu-resource li {
		background:none;
		padding:0 4px 0 0;
		margin:3px;
	}
	
	.mlnk, .mlnk-portfolio, .mlnk-contact, .mlnk-resource {
		display:block;width:100%;
		text-decoration:none;
		
	}


/* Main Content */

#main_content { /* Content container for everything except the portfolio sub pages (the ones with image galleries) */
	clear: both;
	float: left;
	font-size: 1.1em;
	line-height: 1.5em;
	margin: 107px 0 0 0;
	width: 744px;
}

#portfolio_content { /* Content container for portfolio sub pages (with image galleries) */
	clear: both;
	float: left;
	font-size: 1.1em;
	line-height: 1.5em;
	margin: 48px 0 0 0;
	width: 744px;
}

#content {
	float: left;
	text-align: right;
	width: 529px;
}

#green_strip {
	background-color: #bbdc3c;
	float: right;
	height: 490px;
	margin: 0 6px 0 179px;
	width: 30px;
}

#green_strip_portfolio { /* For Green Strip on portfolio sub pages, as it needs a top margin */
	background-color: #bbdc3c;
	float: right;
	height: 485px;
	margin: 59px 6px 0 179px;
	width: 30px;
}



/* Home */

#home img {
	clear: both;
	float: right;
}

#home img:first-child {
	margin-bottom: 30px;
}


#home p {
	text-align: right;
}

#home p+p {
	margin-top: 13px;
}

#home1_copy {
	float: left;
	margin-left: 30px;
	width: 290px;
}

#home2_copy {
	float: left;
	margin-left: 50px;
	width: 220px;
}

#home3_copy {
	float: left;
	margin-left: 60px;
	width: 220px;
}

#home4_copy {
	float: left;
	margin-left: 80px;
	width: 215px;
}

#home5_copy {
	float: left;
	margin-left: 30px;
	width: 230px;
}

#home6_copy {
	float: left;
	margin-left: 100px;
	width: 180px;
}

#home7_copy {
	float: left;
	margin-left: 45px;
	width: 225px;
}



/* About */

#about img {
	clear: both;
	float: right;
}

#about img:first-child {
	margin-bottom: 55px;
}

#about p {
	text-align: right;
}

#about p+p {
	margin-top: 13px;
}

#philosophy_copy {
	float: left;
	margin-left: 170px;
	width: 240px;
}

#approach_copy {
	float: left;
	margin-left: 160px;
	width: 260px;
}

#pledge_copy {
	float: left;
	margin-left: 150px;
	width: 250px;
}

#studio_copy {
	float: left;
	margin-left: 180px;
	width: 230px;
}

#ourclients img {
	clear: both;
	float: right;
	margin-bottom: 55px;
}

#ourclients ul {
	float: left;
	list-style-type: none;
	text-align: right;
	width: 140px;
}

#ourclients img + ul {
	clear: both;
	margin-right: 29px;
}

#ourclients ul + ul {	width: 180px;
}

#ourclients ul li {
	line-height: 1.5em;
}


#ourclients h2 {
	font-size: 12px;
}

#ourclients h3 {
	font-size: 12px;
}

/* Portfolio */

#portfolio img {
	clear: both;
	float: right;
}

#portfolio img:first-child {
	margin-bottom: 30px;
}

#portfolio p {
	text-align: right;
}

#print_copy {
	clear: both;
	float: right;
	margin-bottom: 78px;
	width: 270px;
}

#branding_copy {
	clear: both;
	float: right;
	margin-bottom: 59px;
	width: 290px;
}

#campaigns_copy {
	clear: both;
	float: right;
	margin-bottom: 59px;
	width: 290px;
}

#web_copy {
	clear: both;
	float: right;
	margin-bottom: 83px;
	width: 300px;
}

#exhibition_copy {
	clear: both;
	float: right;
	margin-bottom: 65px;
	width: 280px;
}

#portfolio ul {
	background-color: #272327;
	clear: both;
	color: #fff;
	float: right;
	font-size: 1.1em;
	font-weight: normal;
	height: 168px;
	letter-spacing: -1px;
	list-style-type: none;
	width: 145px;
}

#portfolio ul li {
	margin: 0 3px 2px 0;
}

#portfolio ul li a {
	color: #fff;
}

#portfolio ul li a:hover {
	color: #bbdc3c;
}

#top_menu_item { /* First link in the portfolio sub menu */
	padding-top: 8px;
}

#title_print { /* Positioning the Title of each portfolio sub menu */
	color: #fff;
	float: right;
	font-size: 1.1em;
	font-weight: normal;
	letter-spacing: -1px;
	margin: 471px 0 0 503px;
	position: absolute;
}

#title_branding {
	color: #fff;
	float: right;
	font-size: 1.1em;
	font-weight: normal;
	letter-spacing: -1px;
	margin: 471px 0 0 478px;
	position: absolute;
}

#title_campaigns {
	color: #fff;
	float: right;
	font-size: 1.1em;
	font-weight: normal;
	letter-spacing: -1px;
	margin: 471px 0 0 468px;
	position: absolute;
}

#title_web {
	color: #fff;
	float: right;
	font-size: 1.1em;
	font-weight: normal;
	letter-spacing: -1px;
	margin: 471px 0 0 507px;
	position: absolute;
}

#title_exhibition {
	color: #fff;
	float: right;
	font-size: 1.1em;
	font-weight: normal;
	letter-spacing: -1px;
	margin: 471px 0 0 479px;
	position: absolute;
}



/* Portfolio Gallery */

#portfolio_gallery { /* Gallery script */
	float: right;
	height: 544px;
}

.stepcarousel { /* Gallery script */
	position: relative;
	overflow: auto;
	height: 544px;
	width: 533px;
}

.stepcarousel .belt { /* Gallery script */
	position: absolute;
	left: 0;
	top: 0;
	
}

	/* FireFox 2 */
		html>/**/body .stepcarousel, x:-moz-any-link {
			height: 530px;
			width: 580px;
		} 

	/*Correct Later versions of firefox and ie 7 */
		html>/**/body .stepcarousel, x:-moz-any-link, x:default {
			height: 544px;
			width: 533px;
		}

.stepcarousel .panel { /* Gallery script */
	float: left;
	overflow: hidden;
	width: 562px;
}



.menu { /* Slide up Menu on portfolio sub pages */
	margin: 531px 0 0 85px;
	position: absolute;
	z-index: 90;
}

.menu dt { /* Slide up Menu black title box */
	background-color: #272327;
	color: #fff;
	font-size: 11px;
	font-weight: normal;
	cursor: pointer;
	height: 12px;
	padding: 0 3px 1.5px 0;
	text-align: right;
	width: 142px;
	line-height: -1px
}

.menu dd { /* Slide up Menu dd surrounding the ul below */
	display: none;
	overflow: hidden;
	position: absolute;
	right: 0;
	z-index: 200;
}

.menu ul { /* Slide up Menu list of links */
	background-color: #272327;
	clear: both;
	color: #fff;
	float: right;
	font-size: 10px;
	font-weight: normal;
	height: 154px;
	list-style-type: none;
	width: 145px;
	line-height: -1px
}

.menu ul li {
	margin: 0 3px 2px 0;
}

.menu ul li a {
	color: #fff;
}

.menu ul li a:hover {
	color: #bbdc3c;
}



#project_name { /* Div surrounding project name (green box) */
	background-color: #c1d72f;
	color: #000;
	font-size: 1.1em;
	height: 12px;
	letter-spacing: -1px;
	margin: 531px 0 0 230px;
	padding: 0 1px 1.5px 0;
	position: absolute;
	width: 146px;
	z-index: 110;
}

#project_name div { /* Move project's name to the right */
	margin-right: 3px;
}



.details { /* Slide up DETAILS on portfolio sub pages */
	color: #66666c;
	margin: 531px 0 0 377px;
	position: absolute;
	z-index: 100;
}

.details dt { /* Slide up DETAILS white title box */
	background-color: #fff;
	cursor: pointer;
	font-size: 1.1em;
	height: 12px;
	padding: 0 90px 1.5px 14px;
	text-align: left;
	width: 52px;
}

.details dd { /* Slide up DETAILS large white copy box */
	background: #fff url(../media/images/portfolio/gallery_navigation/details_dot.gif) no-repeat top left;
	cursor: pointer;
	display: none;
	overflow: hidden;
	position: absolute;
	right: 0;
	width: 303px;
	z-index: 200;
}

#print { /* Slide up DETAILS copy */
	float: right;
	height: 149px;
	line-height: 1.7em;
	margin: 5px 4px 0 0;
	width: 270px;
	cursor: pointer;
}



#gallery_nav {
	background-color: #7d7d84;
	float: right;
	height: 14px;
	margin: 531px 0 0 433px;
	position: absolute;
	text-align: left;
	width: 100px;
	z-index: 120;
}

#gallery_nav img {
	margin: 0 2px 0 5px;
}

#left_arrow {
	padding-right: 36px
}

#right_arrow {
	padding-left: 36px;
}



/* Contact */

#location {
	float: right;
}

#location img {
	clear: both;
	float: right;
	margin-left: 0px;
}

#googlemaplink {
	margin-top: 70px;
}



#email { /* Div surrounding the Email form */
	color: #000;
	float: left;
}

#email img {
	float: right;
	margin-bottom: 30px;
}

#email dl {
	width: 350px;
}

#email dt {
	float: left;
	clear: left;
}

#email dd {
	margin-left: 80px;
}

#email form {
	float: right;
}

.email_ul { /* Name: Email: Message: List */
	float: left;
	list-style-type: none;
}

.email_ul2 { /* Name: Email: Message: text fields List */
	float: right;
	list-style-type: none;
}

#email ul li {
	margin-bottom: 6px;
}

#label_name {
	margin-top: 5px;
}

#label_email {
	margin-top: 13px;
}

#label_message {
	margin-top: 12px;
}

.email { /* Name and email address text fields */
	height: 16px;
	margin-left: 18px;
	width: 219px;
}

#email textarea { /* Message textarea */
	height: 85px;
	margin: 0 0 0 18px;
	padding: 0;
	width: 223px;
}

#addme { /* ul for 'add me to drumbeat mailing list' */
	clear: both;
	float: right;
	list-style-type: none;
	width: 250px;
}

.submit { /* Div that surrounds the submit button */
	margin-top: 10px;
}

#submit { /* Submit Button */
	width: 100px;
}



/* Footer */

#portfolio_footer { /* Extra div for portfolio sub pages (ones with gallery) to push #bookmarks down into the right place */
	padding-top: 59px;
}

#bookmarks {
	clear: both;
	margin: 520px 0 0 60px;
	position: relative;
}

#bookmarks ul {
	list-style-type: none;
}

#bookmarks ul li {
	float: left;
	height: 20px;
	margin: 0 0 10px 0;
}

#bookmarks ul li img {
	margin: 0 2px 0 12px;
}

#bookmarks ul li a:hover {
	text-decoration: none;
}

.bookmark { /* Social website name */
	padding-top: 2px;
}

.whatarethese {
	padding: 2px 0 0 20px;
}

/* FireFox 2 */
html>/**/body #container, x:-moz-any-link {font-weight:bold;} 

/*Correct Later versions of firefox and ie 7 */
html>/**/body #container, x:-moz-any-link, x:default {font-weight:normal;}


body:empty #container { background: red; }
/* Target All versions of firefox */
html>/**/body #main_navigation , x:-moz-any-link { width: 480px; }