
/* ------------------------------------------------------------- LAYOUT */

body {
	background-color: #100d21;
	background-image: url(images/headerBG.gif);
	background-repeat: repeat-x;
}
#lights {
	background-image: url(images/swirlslights.png);
	height: 890px;
	width: 100%;
	background-repeat: no-repeat;
	background-position: center top;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 0;
}
#stage {
	background-image: url(images/stage.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	width: 100%;
	position: relative;
	z-index: 1;
	padding-bottom: 570px;
	color: #a69fad;
}
.center {
	margin: 0 auto;
	width: 900px;
	position: relative;
}

/* ------------------------------------------------------------- HEADER */

h1 {
	position: absolute;
	top: 52px;
	left: 50%;
	margin-left: -260px;
	width: 465px;
	height: 149px;
}
h1 a {
	background-image: url(images/PerformingArts-trans.png);
	width: 465px;
	height: 149px;
	display: block;
	text-indent: -9999px;
}
#sfcc {
	display: block;
	text-indent: -9999px;
	background-image: url(images/SFCC-trans.png);
	width: 121px;
	height: 75px;
	position: absolute;
	top: 89px;
	left: 50%;
	margin-left: 300px;
}

/* ------------------------------------------------------------- NAVIGATIONS */

#iefix {
	padding-top: 248px;
}
#nav {
	position: relative;
	width: 100%;
	background-image: url(images/black20.png);
}
#navSeries {
	position: relative;
	background-image: url(images/black50.png);
	width: 100%;
}
#nav .center {
	width: 775px;
}
#navSeries .center {
	width: 775px;
}
#nav li, #navSeries li {
	float: left;
}
#nav a, #navSeries a {
	display: block;
	color: #cfc2c7;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
}
#nav a {
	padding: 12px 15px 10px 15px;
	font-size: 13px;
}
#navSeries a {
	font-size: 11px;
	padding: 7px 14px;
}
#nav a:hover, #navSeries a:hover {
	color: #fae09b;
}
#nav .about .about, #nav .tickets .tickets, #nav .contact .contact, #nav .calendar .calendar, #nav .facts .facts, #navSeries .artist .artist, #navSeries .matinee .matinee, #navSeries .jazz .jazz, #navSeries .summer .summer, #navSeries .kaleidoscope .kaleidoscope {
	background-image: url(images/black30.png);
	color: #fae09b;
}

/* ------------------------------------------------------------- GET TICKETS */

#tickets {
	margin: 0 auto;
	width: 725px;
	padding: 35px 0;
}
#tickets a {
	display: block;
	float: left;
	width: 119px;
	height: 17px;
	padding: 16px 27px;
	background-image: url(images/getticketsBG.png);
	background-repeat: repeat-x;
	color: #090d16;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 13px;
	text-shadow: 1px 1px 0px #70a9d0;
	letter-spacing: 2px;
	margin-right: 24px;
}
#tickets a:active {
	background-position: bottom;
}
#tickets p {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	color: #f9d87b;
	line-height: 24px;
	margin: 0;
	padding-top: 1px;
}

/* ------------------------------------------------------------- SERIES DETAILS */

#series {
	background-image: url(images/seriesBG.png);
	background-repeat: repeat-y;
	background-position: 5px 0px;
}
#series div {
	float: left;
	width: 167px;
	margin: 0 5px;
	padding: 30px 24px 14px 24px;
	line-height: 20px;
}
#series h2 {
	margin: -30px -24px 0 -24px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 19px;
	color: #fff5da;
	line-height: 24px;
}
#series h2 a {
	color: #fff5da;
	display: block;
	padding: 12px 24px 8px 24px;
}
.artist h2 {
	background-color: #3a0d30;
}
.matinee h2 {
	background-color: #521328;
}
.jazz h2 {
	background-color: #60211d;
}
.summer h2 {
	background-color: #60211d;
}
.kaleidoscope h2 {
	background-color: #4a2e10;
}
#series h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 14px;
	margin-top: 20px;
}
.artist h3 {
	color: #8e2877;
}
.matinee h3 {
	color: #bf2150;
}
.jazz h3 {
	color: #b23621;
}
.summer h3 {
	color: #b23621;
}
.kaleidoscope h3 {
	color: #b26a1c;
}
#series h4, .event h4 {
	font-size: 16px;
	font-weight: bold;
	margin: 8px 0 -4px 0;
	line-height: 18px;
}
#series h4 a, .event h4 a {
	color: #e5e3f0;
}
#series h4 a:hover, .event h4 a:hover {
	border-bottom: solid 1px #5f5774;
}
#series p, .event p {
	margin-top: 16px;
}
#series .date, .event .date {
	font-size: 10px;
	color: #858394;
}
#series img.thm {
	margin: 21px 9px 0 0;
	float: left;
}

/* ------------------------------------------------------------- UPCOMING EVENTS */

#events {
	padding-top: 40px;
	width: 750px;
	margin: 0 auto;
}
#calendar {
	float: left;
	margin-right: 10px;
	width: 294px;
}
#calendar td {
	background-image: url(images/black30.png);
	padding: 9px;
	font-size: 16px;
	text-align: center;
	height: 20px;
}
#calendar .title td {
	background-image: none;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #64b3ea;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 3px;
}
#calendar .title span {
	display: block;
	position: relative;
	width: 100%;
}
#calendar .title a {
	color: #fff;
	display: block;
	font-size: 18px;
	position: absolute;
	top: 0px;
}
#calendar .title a.prev {
	left: 6px;
}
#calendar .title a.next {
	right: 6px;
}
#calendar a {
	color: #b92150;
}
#calendar .today {
	color: #64b3ea;
}
#calendar .empty {
	background-image: url(images/black20.png);
}
.event {
	background-image: url(images/black30.png);
	width: 160px;
	height: 154px;
	float: left;
	margin: 40px 0 0 10px;
	padding: 20px;
	line-height: 20px;
}
.event .date {
	margin-top: 0;
}

/* ------------------------------------------------------------- INTERIOR CONTENT */

#content {
	width: 450px;
	margin: 0 0 0 50px;
	float: left;
}
#content h2, #content h3, #content h4 {
	font-family: Georgia, "Times New Roman", Times, serif;
}
#content h2, #content h3, #content h4, #content p, #content ul, #content ol, #content table {
	margin-top: 28px;
	line-height: 22px;
}
#content h2 {
	font-size: 32px;
	color: #64b3ea;
	padding: 14px 4px;
	border-bottom: solid 1px #080610;
}
#content h3 {
	font-size: 20px;
	color: #ea3b57;
	margin-bottom: -8px;
	margin-top: 32px;
}
#content h4 {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 3px;
	color: #ea3b57;
	margin-bottom: -16px;
}
#content h3 a, #content h4 a {
	color: #ea3b57;
	border-bottom: solid 1px #211125;
}
#content h3 a:hover, #content h4 a:hover {
	border-bottom: solid 1px #621f36;
}
#content a {
	color: #fff;
	border-bottom: solid 1px #807c89;
}
#content a:hover {
	border-bottom: 0px;
}
#content #ticketList {
	border-collapse: collapse;
	width: 100%;
}
#content #ticketList td, #content #ticketList th {
	padding: 2px 5px;
	text-align: center;
}
#content #ticketList th {
	background-image: url(images/black20.png);
	border: solid 1px #100d21;
	border-bottom: solid 1px #080610;
}
#content #ticketList td {
	border: solid 1px #080610;
}
#content #ticketList td.left {
	text-align: left;
}
#content p.small {
	font-size: 11px;
	margin-top: 18px;
	margin-bottom: -15px;
	line-height: 18px;
}

/* ------------------------------------------------------------- SIDEBAR */

#sidebar {
	width: 295px;
	float: left;
	margin: 78px 0 0 30px;
}
#sidebar img.eventimg {
	margin-bottom: 60px;
}
#sidebar #calendar {
	margin-top: -38px;
}
#sidebar .event {
	width: 110px;
	margin: 20px 10px 0 0;
	padding: 16px;
	height: auto;
}
#sidebar .event:last-child {
	margin-right: 0;
}
#sidebar .time {
	display: none;
}
