/* main body */

body {
	background: #FFFFFF;
	width: 967px;
	margin: 0 auto;
	padding: 0;
	font-size: 62.5%; /* gives base of 10px */
	font-family: "Arial", sans-serif;
}

/* top headline and subhead */
#headtext {
	background: url(images/jpb_home_key2.jpg) no-repeat top right;
	float: left;
	width: 967px;
	margin: 0;
	padding: 0;
	font-family: "Georgia", sans-serif;
}

#headtext h1 {
	padding: 150px 0 0 0;
	margin: 0 83px 0 83px;
	font-size: 6.2em;
	font-weight: normal;
	letter-spacing: -1px;
}

#headtext h2 {
	margin: 24px 0 35px 0;
	padding: 18px 83px 18px 83px;
	font-size: 1.7em;
	font-weight: 100;
	border-top: 4px double #BFBFBF;
	border-bottom: 4px double #BFBFBF;
	color: #666666;
	font-family: "Myriad", "Helvetica Neue Light", "Arial Light", "Myriad", "Helvetica", "Arial", sans-serif;
}

/* main body */

/* navigation bar */
/*This container holds the background image of the navigation bar, to allow the reflection to extend down past the <ul id="nav> that holds the navigation bar.*/
#container {
	clear: both;
	float: left;
	width: 967px;
	height: 634px;
	margin: 0;
	padding: 0;
	background: url(images/jpb_home_menu_sprite.jpg) no-repeat 81px 0;
}
/**for internal pages, smaller sprite for navigation**/
#container.internal {
	background: url(images/jpb_menu_sprite.jpg) no-repeat 0px 0;
}
/* container ul, establishes size and position with bknd img in 1st position */
#nav {
	float: left;
	width: 570px;
	height: 390px;
	margin: 0 81px 0 81px;
	padding: 0;
	position: relative;
/* position is relative so <li> elements may be positioned absolutely within it for sprites */
}
/* white space on top and flush left for navigation books on INTERNAL pages */
#container.internal #nav {
	margin: -20px 0 0 0;
}
/* styles all <li> elements, hiding text with indent. Text is here to degrade for HTML with CSS turned off. Overflow included for browsers that may try to show text despite indent. */
#nav li {
	list-style: none;
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	top: 0;
	text-indent: -9000px;
	overflow: hidden;
}
#nav li, #nav a {
	height: 390px;
	display: block;
}
/* navigation li positioning of each box in the 'image map' HOME */
.articles {
	left: 0; 
	width: 105px;
}

.teaching {
	left: 110px; 
	width: 105px;
}

.marketing {
	left: 320px;
	width: 66px;
}

.design {
	left:415px;
	width:68px;
}

.shows{
	left: 508px;
	width: 78px;
}

.performance{
	left: 595px;
	width: 102px;
}

.artsmanagement {
	left: 705px;
	width: 95px;
}

/* navigation li positioning of each box in the 'image map' INTERNAL */
#container.internal li.articles {
	left: 0; 
	width: 70px;
}

#container.internal li.teaching {
	left: 70px; 
	width: 85px;
}

#container.internal li.marketing {
	left: 225px;
	width: 50px;
}

#container.internal li.design {
	left:295px;
	width:50px;
}

#container.internal li.shows{
	left: 355px;
	width: 65px;
}

#container.internal li.performance{
	left: 415px;
	width: 80px;
}

#container.internal li.artsmanagement {
	left: 495px;
	width: 70px;
}

/* Hover State HOME */
.articles a:hover {
	background: url(images/jpb_home_menu_sprite.jpg) 0 -864px no-repeat;
}

.teaching a:hover {
	background: url(images/jpb_home_menu_sprite.jpg) -110px -864px no-repeat;
}

.marketing a:hover {
	background: url(images/jpb_home_menu_sprite.jpg) -320px -864px no-repeat;
}

.design a:hover {
	background: url(images/jpb_home_menu_sprite.jpg) -415px -864px no-repeat;
}

.shows a:hover {
	background: url(images/jpb_home_menu_sprite.jpg) -508px -864px no-repeat;
}

.performance a:hover {
	background: url(images/jpb_home_menu_sprite.jpg) -595px -864px no-repeat;
}

.artsmanagement a:hover {
	background: url(images/jpb_home_menu_sprite.jpg) -705px -864px no-repeat;
}

/* Hover State INTERNAL */
#container.internal li.articles a:hover, li.current_articles a {
	background: url(images/jpb_menu_sprite.jpg) 0 -844px no-repeat;
}

#container.internal li.teaching a:hover, li.current_teach a {
	background: url(images/jpb_menu_sprite.jpg) -70px -844px no-repeat;
}

#container.internal li.marketing a:hover, li.current_marketing a {
	background: url(images/jpb_menu_sprite.jpg) -225px -844px no-repeat;
}

#container.internal li.design a:hover, li.current_design a {
	background: url(images/jpb_menu_sprite.jpg) -295px -844px no-repeat;
}

#container.internal li.shows a:hover, li.current_shows a {
	background: url(images/jpb_menu_sprite.jpg) -355px -844px no-repeat;
}

#container.internal li.performance a:hover, li.current_perf a {
	background: url(images/jpb_menu_sprite.jpg) -415px -844px no-repeat;
}

#container.internal li.artsmanagement a:hover, li.current_arts a {
	background: url(images/jpb_menu_sprite.jpg) -495px -844px no-repeat;
}

/*Heading for page to right of navigation*/
#right_pagehead {
	float: right;
	width: 397px;
}

#right_pagehead h1 {
	font-family: "Myriad", sans-serif;
	font-weight: 100;
	font-size: 3.4em;
	margin: 0;
	padding: 110px 0 0 40px;
}

/* INTERNAL central area in columns */
#left_column{
	clear: both;
	float: left;
	width:190px;
	margin: 0 0 0 6px;
	padding: 0;
	background: #dfd9d2;	
}
#left_column p.download {
	font-size: 1.4em;
	color: #DE2027;
	text-align: right;
	margin: 0;
	padding: 5px 8px 5px 0;
	font-weight: bold;
}
p.download a {
	text-decoration: none;
	color: #DE2027;
	display: block;
}
#left_column p.skinny_story{
	font-style: italic;
	font-size: 1.3em;
	line-height: 2em;
	font-family: "Myriad", "Arial", sans-serif;
	font-weight: 100;
	width: 170px;
	margin: 0;
	padding: 5px 10px 20px 10px;
	background: #dfd9d2;
}
#headshot_small {
	width: 188px;
	height: 282px;
	border: solid black 1px;
	margin: 0;
	padding: 0;
}
/* image at bottom of left skinny column */
#bottom_column {
	margin: 0;
	padding: 0 0 200px 0;
}
#central_area{
	float: right;
	width:771px;
	margin: 0;
	padding: 0;
}
#left_center_column{
	float: left;
	width: 472px;
	margin: 0;
	padding: 0;
}
#right_center_column{
	float: right;
	width:294px;
	margin: 0;
	padding: 0;
}
#left_center_column p.intro{
	width: 350px;
	margin: 0;
	padding: 0 0 0 20px;
	font-size: 1.2em;
	line-height: 1.8em;
	font-weight: bold;
}
#left_center_column ul.right_align{
	width: 275px;
	margin: 0;
	padding: 20px 0 20px 150px;
	font-size: 1.2em;
	line-height: 1.8em;
	list-style: none;
}
li.source {
	margin: 0;
	padding: 5px 0 14px 0;
	text-align: right;
	font-style: italic;
}
li.quote i{
	font-weight: bold;
	color: #DE2027;
}
p.full_width{
	width: 432px;
	font-size: 1.2em;
	line-height: 1.6em;
	padding: 0;
	padding: 0 20px 0 20px;
}

p.full_width img.right{
	float: right;
	padding-left: 10px;
}

p.full_width img.left{
	float: left;
	padding-right: 10px;
	}
	
#producer li{
	font-size: 1.2em;
	line-height: 1.6em;
}

/*SHOWS central area */
#show_detail{
	float: left;
	width: 771px;
	list-style: none;
	font-size: 1.3em;
}
li.show_credits_left{
	float: left;
	clear: both;
	width: 330px;
	font-weight: bold;
	text-align: right;
	margin: 0;
	padding: 5px 20px 8px 20px;
	line-height: 1.4em;
}
li.show_description_left{
	float: left;
	clear: left;
	width: 310px;
	text-align: right;
	margin: 0;
	padding: 0px 20px 30px 40px;
	line-height: 1.6em;
}
li.show_logo_right{
	float: right;
	width: 371px;
}
li.show_credits_right{
	float: right;
	clear: both;
	width: 330px;
	font-weight: bold;
	text-align: left;
	margin: 0;
	padding: 5px 20px 8px 20px;
	line-height: 1.4em;
}
li.show_description_right{
	float: right;
	clear: right;
	width: 310px;
	text-align: left;
	margin: 0;
	padding: 0px 40px 30px 20px;
	line-height: 1.6em;
}
li.show_logo_left{
	float: left;
	width: 371px;
}

/* ARTICLES central area */
#articles_detail{
	float: left;
	width: 771px;
	list-style: none;
	font-size: 1.3em;
}

#articles_detail p.intro{
	width: 350px;
	margin: 0;
	padding: 0 0 0 20px;
	font-size: 1em;
	line-height: 1.8em;
	font-weight: bold;
	}

/* footer */
#footer_div{
	clear: both;
	float: left;
}
#footer {
	clear: both;
	float: left;
	width: 966px;
	list-style: none;
	margin: 40px 0 0 0;
	padding: 0;
	font-size: 0.8em;
	color: gray;
}

#footer li {
	font-size: 1.8em;
	margin: 0;
	padding: 10px;
}

.leftfooter {
	float: left;
	margin: 0;
	padding-left: 20px;
}

.rightfooter {
	float: right;
}