/*
reset.css
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.8.0r4
*/
html {
	background:#FFF;
	margin:0;
	padding:0;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td {
	margin:0;
	padding:0;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

fieldset,img {
	border:0;
}

address,caption,cite,code,dfn,em,strong,th,var,optgroup {
	font-style:inherit;
	font-weight:normal;
}

del,ins {
	text-decoration:none;
}

li {
	list-style:none;
}

caption,th {
	text-align:left;
}

h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}

q:before,q:after {
	content:'';
}

abbr,acronym {
	border:0;
	font-variant:normal;
}

sup {
	vertical-align:baseline;
}

sub {
	vertical-align:baseline;
}

legend {
	color:pink;
}

input,button,textarea,select,optgroup,option {
	font-family:inherit;
	font-size:inherit;
	font-style:inherit;
	font-weight:inherit;
}

input,button,textarea,select {
	font-size:100%;
}


	
/* begin sound collective sctv1.css*/
html {
	background-color:#E9EC91;
}

body {
	overflow:hidden;
	background-color:#E9EC91;
}


	
/* !color palette ----------------*----------------*----------------*----------------*---------------- 

	brown		512B0C
	blue		57B6DD
	orange		DB461F
	red		B92300
	slate		084253
	greenish	D6DE23
*/

	
/* !typography ----------------*----------------*----------------*----------------*---------------- */
html {
	font-size:12px;
	line-height:18px;
	color:#1B4568;
}

a {
	text-decoration:none;
	color:inherit;
	outline-width:0;
}

a:hover {
	color:#B92300;
}

p a {
	font-weight:bold;
	border-bottom:1px dotted;
	color:#512B0C;
}

h1,h2,h3,h4,h5,h6 {
	font-family:UnionRegular, Georgia;
	font-size:14px;
}

p,li {
	font-family: "Helvetica Neue Regular", "HelveticaNeue-Regular", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

body {
	font-size:12px;
	line-height:1.8333333333333em;
	margin:0;
	padding:0;
}

h1 {
	margin:0;
	font-size:1.6666666666667em;
	line-height:1.1em;
	margin-bottom:1.1em;
}

h2 {
	margin:0;
	font-size:1.5em;
	line-height:1.2222222222222em;
	margin-bottom:1.2222222222222em;
}

h3 {
	margin:0;
	font-size:1.3333333333333em;
	line-height:1.375em;
	margin-bottom:1.375em;
}

h4,h5,h6 {
	margin:0;
	font-size:1.1666666666667em;
	line-height:1.5714285714286em;
	margin-bottom:1.5714285714286em;
}

p,ul,blockquote,pre,td,th,label {
	margin:0;
	font-size:13px;
	line-height:1.8333333333333em;
	margin-bottom:1.8333333333333em;
	color:#222;
}

p.small {
	margin:0;
	font-size:.83333333333333em;
	line-height:2.2em;
	margin-bottom:2.2em;
}

table {
	border-collapse:collapse;
	margin-bottom:1.8333333333333em;
}

h2 + p,h3 + p,h4 + p {
	margin-top:-1.8em;
}

h3 + h4 {
	margin-top:-1.375em;
}

h4 + h5 {
	margin-top:-1.5714285714286em;
	margin-bottom:0;
}

h2+ul,h3+ul,h4+ul,h5+ul,h6+ul {
	margin-top:-1.8333333333333em;
}


	
/* classes */
.chunky {
	font-family:ChunkFiveRegular;
}

.union {
	font-family:UnionRegular;
}

.brown {
	color:#512B0C;
}

.blue {
	color:#57B6DD;
}

.orange {
	color:#DB461F;
}

.red {
	color:#B92300;
}

.slate {
	color:#084253;
}

.puke {
	color:#D6DE23;
}

.caps {
	text-transform:uppercase;
	letter-spacing:.05em;
}


	
/* !main blocks ----------------*----------------*----------------*----------------*---------------- */
#bg {
	background-image:url(i/buildings.png);
	width:17920px;
	height:1200px;
	overflow-y:hidden;
	background-position:left bottom;
	position:absolute;
	bottom:0;
	left:0;
	z-index:-100;
}

#header {
	position:fixed;
	margin-left:25px;
	margin-top:20px;
}

#logo {
	width:200px;
	float:left;
}


	
/* page wrapper is the big giant box
div.box are the wrappers for the pages
div.content-wrap is the white transparent box
div.content are the pages themselves, with the sheena easton paint splatters
*/
#page-wrapper {
	width:17920px;
}

.box {
	width:2800px;
	float:left;
	clear:none;
	margin-top:80px;
}

.content-wrap {
	background-image:url(i/bg-yellow-trans.png);
	width:880px;
	margin-left:25px;
	height:540px;
	padding:20px 20px 5px;
}

.content {
}

.left-col {
	width:300px;
	float:left;
	background-image:url(i/blurbs.png);
	background-repeat:no-repeat;
	display:inline-block;
	min-height:300px;
}

.right-col {
	margin-left:350px;
	height:520px;
	width:528px;
	overflow:hidden;
}


	
/* !blurbs for different sections ----------------*----------------*----------------*----------------*---------------- */
#manifesto .left-col {
	background-position:-300px 0;
}

#raves .left-col {
	background-position:0 0;
}

#who-we-are .left-col {
	background-position:-600px 0;
}

#contact .left-col {
	background-position:-900px 0;
}


	
/* !the main menu and logo ----------------*----------------*----------------*----------------*---------------- */
#logo a {
	font-family:ChunkFiveRegular, UnionRegular;
	color:#512B0C;
	text-transform:uppercase;
	letter-spacing:-.02em;
	font-size:28px;
}

#logo a:hover {
	color:#B92300;
}
/*ryan edit*/
#menu {
	margin-left:380px;
	height:30px;
	width:540px;
	margin-top:-10px;
}
/*end ryan edit*/

#menu li {
	float:left;
}

#menu a {
	background-image:url(i/menu.png);
	text-indent:-9999px;
	display:block;
	height:30px;
}

#menu li.mm-our-work a {
	width:100px;
	background-position:0 0;
}

#menu li.mm-manifesto a {
	width:108px;
	background-position:-100px 0;
}

#menu li.mm-raves a {
	width:66px;
	background-position:-208px 0;
}

#menu li.mm-who-we-are a {
	width:115px;
	background-position:-274px 0;
}

#menu li.mm-contact a {
	width:81px;
	background-position:-389px 0;
}

#menu li.mm-our-work a:hover {
	background-position:0 -30px;
}

#menu li.mm-manifesto a:hover {
	background-position:-100px -30px;
}

#menu li.mm-raves a:hover {
	background-position:-208px -30px;
}

#menu li.mm-who-we-are a:hover {
	background-position:-274px -30px;
}

#menu li.mm-contact a:hover {
	background-position:-389px -30px;
}
/*ryan insert*/
#menu ul.social {
	float: left;
	clear: none;
	margin-left: 10px;
	background-image: none;
}
#menu ul.social a.face, #menu ul.social a.twit { 	
	background-image:url(i/bg-twit.png);
	text-indent:-9999px;
	display:block;
	width: 30px;
	height:30px;
	text-align: center;
	background-repeat:no-repeat;
	background-position: 5px 5px;
}
#menu ul.social a.twit {
	background-position: -30px 5px;
}
#menu ul.social a.face:hover {
	background-position: 5px -25px;
}
#menu ul.social a.twit:hover {
	background-position: -30px -25px;
}
/*end ryan insert*/


	
/* !home page ----------------*----------------*----------------*----------------*---------------- */
h1.intro,#home h2 {
	margin:50px 50px 0;
	font-family:Georgia, serif;
	font-weight:100;
	font-size:21px;
	line-height:50px;
	font-style:italic;
	letter-spacing:.04em;
}

h1.intro span {
	font-family:ChunkFiveRegular;
	font-style:normal;
}

#home h2 {
	margin:0 50px 0 0;
	text-align:center;
	display:block;
	float:right;
	width:300px;
	height:300px;
	background-image:url(i/spatter.png);
	background-position:-1200px;
	line-height:200px;
	color:#084253;
}


	
/* !who-we-are ----------------*----------------*----------------*----------------*---------------- */
#who-we-are ul {
}

#who-we-are li a {
	font-family:ChunkFiveRegular, Georgia, Helvetica, serif;
	color:#512B0C;
	text-transform:uppercase;
	letter-spacing:-.02em;
	font-size:16px;
	line-height:32px;
}

#who-we-are li span {
	font-family:Georgia, serif;
	font-style:italic;
	font-size:1em;
	padding-left:1em;
	color:rgb(27,69,104);
}

#who-we-are a:hover {
	color:#B92300;
}

#who-we-are .right-col {

}

#bio-wrapper {
	width:500px;
	height:520px;
	overflow:auto;
	/*z-index: auto;*/
	position: absolute; 
	outline: 0;
}

#bio-panes {
	padding-bottom: 200px;
}

#bio-panes h4 {
	color:#57B6DD;
}

img.headshot {
	float:right;
	margin:0 0 10px 10px;
	position:relative;
}


	
/* !our work ----------------*----------------*----------------*----------------*---------------- */
#our-work .left-col {
	background-image:url(i/spatter.png);
	background-position:-600px 0;
}

#our-work .left-col a {
	font-family:ChunkFiveRegular, Helvetica, Georgia;
	color:#512B0C;
	display:inline;
	letter-spacing:.08em;
	font-size:16px;
	line-height:28px;

	
/*32*/
	margin-right:12px;

	
/*new*/
	display:block;
	padding-left:8px;
}

#our-work .left-col div.clips a:first-child {
	text-transform:uppercase;
	border-bottom:1px solid;
	border-top:1px solid;
	padding-top:2px;
	margin-bottom:2px;
}

#our-work .left-col a:hover {
	color:#B92300;
	border-bottom-color:#512B0C;
	background-image:url(i/bg-white-trans-75.png);
	background-image:url(i/bg-yellow-trans.png);
}

#our-work a.playing,#our-work a.playing:hover {
	color:#57B6DD;
	border-bottom-color:#512B0C;
	background-image:url(i/bg-white-trans.png);
}

#our-work a.paused {
	color:#DB461F;
	border-bottom-color:#512B0C;
	background-image:url(i/bg-white-trans.png);
}

#our-work span.subtitle {
	font-family:Georgia;
	font-style:italic;
	font-size:12px;
}


	
/* this is the flowplayer, not the beach */
#playa {
	width:400px;
	height:300px;
	width:528px;
	height:396px;
}


	
/* ! manifesto ----------------*----------------*----------------*----------------*---------------- */

	
/* ! raves ----------------*----------------*----------------*----------------*---------------- */
#raves .blurb {
	padding-bottom:1em;
	margin-bottom:1em;
	border-bottom:1px dotted #DB461F;
}

#raves h4,#raves h5 {
	text-align:right;
	font-size:13px;
}


	
/* ! contact ----------------*----------------*----------------*----------------*---------------- */
#contact ul {
	margin-top:4px;
}

#contact li {
	font-family:UnionRegular, Georgia, serif;
	color:#512B0C;
	text-transform:uppercase;
	letter-spacing:-.02em;
}

#contact h1.intro {
	margin:-4px 0px 1.1em 0;
	font-size:1.6666666666667em;
	line-height:36px;
}

#contact h1.intro span a {
	white-space:nowrap;
	border-bottom:1px dotted;
}

#contact h1.intro span a:hover {
	color:#B92300;
}


	
/* !flexcroll ----------------*----------------*----------------*----------------*---------------- */

	
/* force fleXcroll to always display the vertical scrollbase */
.flexcroll {
	padding-right:28px;
	width:500px;
}
.contentwrapper { }
/*pad the bottom of the content so the scroll bar will show some margin*/
.contentwrapper:after {
	clear: both;
	content:' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 180px;
}

.vscrollerbase {
	visibility:visible!important;
}

.scrollgeneric {
	line-height:1px;
	font-size:1px;
	position:absolute;
	top:0;
	left:0;
}

.vscrollerbase {
	width:15px;
	background-color:#999;
}

.vscrollerbar {
	width:15px;
	background-color:#DB461F;
}

.vscrollerbarbeg {
	background:#DB461F -45px -30px no-repeat;
	width:15px;
	height:15px!important;
}

.vscrollerbarend {
	background:#DB461F -45px 0 no-repeat;
	width:15px;
	height:15px;
}

.hscrollerbase {
	height:15px;
	background-color:white;
}

.hscrollerbar {
	height:15px;
	background-color:black;
}

.scrollerjogbox {
	width:15px;
	height:10px;
	top:auto;
	left:auto;
	bottom:0;
	right:0;
	background-color:gray;
}