/*
	CSS file for Washington Square Arts and Films
	Author:	Net Theory 
					http://www.nettheory.com/

*/

/* 	

	*** MAIN ***
	---------------------------------------------------------------------

	*** Color Palette ***
	---------------------------------------------------------------------	
	Orange:			#f79239
	Green/Gold:		#b8ac1f
	Olive Green:	#818413 

*/



/* Body & Global
------------------------------------ */
* {
	margin: 0;
	padding: 0;
}			

body {
	font: 62.5% "helvetica neue", arial, sans-serif;	 
	height: 100%;
}   

h1 {
	text-indent: -1000em;
	background: url(../images/logo-trans.png) no-repeat;
	width: 500px;
	height: 38px;
	margin: 72px 0 5px;
	float: left;
}

h1 a {
	display: block;
	height: 100%;
}

h2 {
	font-weight: normal;
	color: #fff;
	font-size: 1.8em; /* was 2.7em */
	margin: 45px 45px 15px 0;
	padding: .1em 0 1em;
/*	border-top: 1px solid #f79239;
	border-bottom: 1px solid #f79239; */
	width: 222px;
	float: left;
	clear: none;
	}

#left-col h2 {
	margin-right: 0;
	}

h2 a:link, h2 a:visited, h2 a:hover, h2 a:active {
	text-decoration: none;
	color: #fff;
	}

h3 {
	color: #fff;
	font-size: 1.6em;
	line-height: 1.3em;
}

h3.invis {
	text-indent: -1000em;
	position: absolute;
	}

h4 {
	color: #fff;
	font-size: 1.3em;
	line-height: 1.5em;
}

#homepage h3 {
	border: none;
	margin-top: .2em;
	width: 100px;
	display: inline;
}

p, address, td {
	font-size: 1.3em;
	line-height: 1.5em;
	color: #fff;
	font-style: normal;
} 



ul {
	list-style-type: none;
	font-size: 1.3em;
}

li {
	color: #fff;
}

address {
	font-size: 1.2em;
	margin-bottom: 2em;
}

a {
	text-decoration: none;
	outline: 0;
}

a:link, a:visited {
	color: #f79239;
	}

a:hover, a:active {
	color: #fff;
	}

img {
	border: none;
}

table {
	border-collapse: collapse;
}
	
table tr td {
	padding-right: 1.5em;
	vertical-align: top;
	}
	
	
/* Structure
------------------------------------ */
#super-container { 
	/* used to center site. Do not float */	
	margin: 0 auto;
	width: 100%;
	height: 100%;
}		 

		#header-container {															
			float: left;
			clear: left;
			width: 100%;
		}  
		#header {															
			width: 940px;
			margin: 0 auto;
		}  
		.hdr-white {
			border-top: 3px solid #beb125;
		}
		#content-container {	
			float: left;
			clear: left;
			width: 100%;
		}			 
		#content {													  
			width: 940px;
			margin: 0 auto;
			min-height: 540px;
		}
		#footer-container {	  
			float: left;
			clear: left;														
			width: 100%;
			/* border-top: 1px solid #f79239; */
		}
		#footer {	  
			clear: left;
			width: 940px;
			margin: 0 auto;
		}		

ul#top-nav {
	float: right;
	clear: none;
	margin: 95px 0 0;
	width: 440px;
}

ul#top-nav li {
	float: right;
	clear: left;
	margin: 0 0 .3em 1px;
	display: inline;
}

ul#top-nav a {
	color: #fff;
	padding: .4em .8em;
	}

ul#top-nav li a:hover,
ul#top-nav li a:active, 
ul#top-nav li a.on {
	background-color: #0a0a0a;
	text-decoration: none;
}

#content #copy {
	float: left;
	clear: none;
	margin: 45px 0 90px ;
	width: 673px;
}

#content p {
	margin-bottom: 1.3em;
}

#content #copy ul {
	float: left;
	clear: none;
	width: 222px;
}

#content #copy ul li {
	margin-bottom: 1.5em;
}


#content #copy ul#sub-nav {
	width: 673px;
	margin: -42px 0 -12px 0;
	font-size: 1.7em;
}

#content #copy ul#sub-nav li {
	background-color: #262626;
	display: block;
	float: left;
	clear: none;
	margin-right: 1px;
	text-align: center;
	text-transform: uppercase;
}

#content #copy ul#sub-nav li.two {
	width: 335px;
}
#content #copy ul#sub-nav li.three {
	width: 223px;
}

#content #copy ul#sub-nav li.last {
	margin: 0;
}

#content #copy ul#sub-nav li a {
	font-size: 0.7em;
	display: block;
	padding: .4em .6em;
	height: 100%;
}

#content #copy ul#sub-nav li a:link,
#content #copy ul#sub-nav li a:visited {
	color: #fff;
}

#content #copy ul#sub-nav li a:hover,
#content #copy ul#sub-nav li a:active {
	color: #f79239;
	text-decoration: none;
}

#content #copy ul#sub-nav li.on a {
	color: #fff !important;
	background-color: #3b3b3b;
}



ul#bottom-nav {
	float: left;
	clear: left;	
	width: 100%;
	}

ul#bottom-nav li {
	float: left;
	clear: none;
	margin: .3em 0 1em 0;
	display: inline;
	}

ul#bottom-nav li a {
	padding: .4em .8em;
}

#footer a {
	color: #fff;
	}

#copyright {
	color: #b3b3b3;
	float: right;
	margin: 0 0 1em;
	}

#copyright a {
	color: #b3b3b3;
	}

#footer p {
	font-size: 0.8em;
}


#left-col {
	width: 222px;
	margin-right: 45px;
	float: left;
	clear: left;
	color: #fff;
	}

	#left-col ul#sub-nav {
		clear: left;
		float:left;
		width:100%;
		margin-top: 15px;
	}

	#left-col ul#sub-nav li {
		display: block;
		/* background-color: #262626;
		text-align: center;
		text-transform: uppercase; */
		margin-bottom:2px;
	}

	#left-col ul#sub-nav li a {
		display: block;
		padding: 2px 0;
		height: 100%;
	}

	#left-col ul#sub-nav li a:link,
	#left-col ul#sub-nav li a:visited {
		color: #f79239;
	}

	#left-col ul#sub-nav li a:hover,
	#left-col ul#sub-nav li a:active {
		color: #fff;
		text-decoration: none;
	}

	#left-col ul#sub-nav li.on a {
		color: #fff !important;
		/* background-color: #3b3b3b; */
	}

#content #copy ul.thumbnails {
	width: 673px;
	float: left;
	clear: none;
	margin-bottom: 15px;
}

#content #copy ul.thumbnails li {
	display: block;
	width: 328px;
	margin: 0 15px 15px 0;
	height: 81px;
	float: left;
	clear: none;
	/* background-color: #b8ac1f; */
}

#content #copy ul.thumbnails li.right {
	margin-right: 0;
}

#content #copy ul.thumbnails li a {
	color: #000;
	text-decoration: none;
	height: 100%;
	display: block;
}

#content #copy ul.thumbnails li img {
	width: 143px;
	height: 81px;
	float: left;
	clear: none;
	margin-right: 15px;
}

	#content #copy ul.thumbnails li img#emmy {
		width: 42px;
		height: 50px;
		position:relative;
		top:-50px;
		right:-14px;
		clear:none;
		float:right;
	}

#content #copy ul.thumbnails li span {
	float: left;
	clear: none;
	width: 160px; 
	margin-top: 4px;
	cursor: pointer;
}

#content #copy ul.thumbnails li span strong {
	font-size: 1.1em;
}

#content #copy ul.thumbnails li span cite {
	font-size: 1.1em;
	font-weight: bold;
	font-style: normal;
}

	#content #copy ul.thumbnails li span .smaller {
		font-size: 0.9em;
	}

/* HOMEPAGE 
---------------------------------*/
#flash {
	width: 970px;
	height:416px;
	margin: 30px -15px 0;
}

#homepage #content {
	min-height: 510px;
	}

#news-teaser {
	margin: 0 0 30px 43px;
	}
#news-teaser h2, #news-teaser p {
	display: inline;
	}

#news-teaser p {
	font-size: 1.4em;
	margin-left: 1.6em;
	}


/* DIRECTORS
---------------------------------*/
#content #copy ul#director-list-left {
	width: 300px;
	margin-left: 79px;
}

.director-reel h2 {
	margin-bottom: 0;
}

	
	
/* INDIVIDUAL DIRECTOR PAGE
---------------------------------*/
.director-reel #left-col p,
.screening #left-col p {
	float: left;
	clear: left;
}
 
.director-reel h3,
#film-tv h3 {
	margin-bottom: .3em;
	clear: both;
	font-size: 1.5em;
	}

/*.screening h2,
.screening #left-col {
	width: 199px;
	}*/

.screening h3 {
	float: left;
	clear: left;
	font-size: 1.3em;
	font-weight: normal;
}

.screening h3 span {
	font-weight: bold;
	font-size: 1.1em;
}

.screening #movie {
	float: left;
	clear: none;
	width: 640px;
	margin: 45px 0 90px 0;
	}


/* INTEGRATED (DIGITAL)
---------------------------------*/
#digital #hover1,
#digital #hover2,
#digital #hover3,
#digital #hover4,
#digital #hover5,
#digital #hover6,
#digital #hover7,
#digital #hover8,
#digital #hover9,
#digital #hover10 {
	display: none;
	position: relative;
	top: 0;
	left: 0;
}

body#digital .hover p{
	margin-top:-5px;
}

#digital #left-col p {
	float: left;
	clear: left;
}

#digital h3 {
	margin-bottom: .3em;
	font-weight: normal;
	}

#digital h3 {
	float: left;
	clear: left;
	font-size: 1.3em;
	font-weight: normal;
}

#digital h3 span {
	font-weight: bold;
	font-size: 1.1em;
}



/* NEWS
---------------------------------*/
#news h3 {
	font-weight: normal;
	text-transform: uppercase;
	margin-bottom: 1.3em;
}

#news .blurb {
	margin-bottom: 20px;
}

/* CONTACT US
---------------------------------*/
#contact-us #content #copy ul#sub-nav {
	width: 230px;
	margin: 0 57px 0 0;
}

#contact-us #content #copy ul#sub-nav li {
	clear: left;
	margin-right: 0;
	width: 230px;
	text-transform: none;
}

.contact-right-col {
	float: left;
	clear: none;
	width: 370px;
}

#contact-commercials,
#contact-film-tv,
#contact-talent-management,
#contact-theatrical,
#contact-accounting,
#contact-business {
	display: none;
}

#contact-us #content a:link,
#contact-us #content a:visited {
	color: #fff;
	}

#contact-us #content a:hover,
#contact-us #content a:active {
	color: #f79239;
	}


/* TALENT MANAGEMENT and THEATRICAL
---------------------------------*/
#content #copy ul.roster {
	width: 650px;
	float: left;
}

#content #copy ul.five {
	width: 500px;
} 

#content #copy ul.four {
	width: 400px;
}

ul.roster li {
	display: block;
	font-weight: bold;
	width: 81px;
	margin-right: 15px;
	height: 124px;
	float: left;
	clear: none;
}

ul.roster li.last {
	margin-right: 0;
}

ul.roster li a:link,
ul.roster li a:visited {
	color: #000;
	text-decoration: none;
	/* background-color: #b8ac1f; */
	display: block;
	height: 100%;
}

ul.roster li a:hover,
ul.roster li a:active {
	/* background-color: #fff; */
}

ul.roster li img {
	width: 81px;
	height: 81px;
	float: left;
	clear: none;
	}

ul.roster li span,
ul.roster li cite {
	float: left;
	clear: left;
	width: 81px;
	margin: 4px 0 0 3px;
	cursor: pointer;
}

ul.roster li span.longname {
	font-size: 0.8em;
	line-height:12px;
}


	
	
/* BIO
------------------------------------ */
.talent-bio #content #copy ul {
	font-size: 1.2em;
	}

.talent-bio h3 {
	font-size: 1.7em;
	font-weight: normal;
	line-height: 1.4em;
	margin: -5px 0 20px;
	}

.talent-bio #copy img {
	width: 222px;
	float: right;
	margin: 0 0 30px 45px;
	}

.talent-bio table tr td {
	padding-top: 10px;
}







/* Must be last! */			
/* Utilities 
------------------------------------ */  
.caption {
	font-size: 1em;
	}

.noBottom {
	margin-bottom: 0 !important;
}

.clear-l 	{ clear: left; }
.clear-r	{ clear: right; }
.clear-b	{ clear: both; }

.float-l { float: left; }
.float-r { float: right; }

.play-all { 
	width:200px;
	margin-top: 15px; 
}
