@import url("/style/structure.css");
@import url("/style/nav.css");
@import url("/style/mojoToolsAdminBar.css");
	
/*
-----------HTML Elements---------
*/
html {
	height: 100%;
	background: url('/images/theme/html-bg.png') top center;
}
body {
	min-height: 100%;
	background: url('/images/theme/body-bg.png') top center repeat-x;
	_background: none;
	font: 14px/20px "Trebuchet MS", Arial, Helvetica, san-serif;
}
p, ul, ol, table {
	margin: 0 0 1em;
}
h1 {
	color: #a97200;
	font-size: 30px;
	font-weight: normal;
	margin-bottom: .25em;
}
h2 {
	margin-bottom: .75em;
	color: #43308d;
}

/*
-----------Site-wide Tags-----------
*/
.boxShadow {
	display: inline-block;
	-moz-box-shadow: 2px 2px 5px #cfcfcf;
	-webkit-box-shadow: 2px 2px 5px #cfcfcf;
}
.hr {
	display: block;
	height: 10px;
	background: #eeeaf2;
}
.credits,
.showCredits {
	border: solid #ebdcc6;
	border-width: 1px 0;
	padding: 7px 0;
	font-style: italic;
	zoom: 1;
}
.showCredits 
{
	width: 90%;
	margin: .5em 0;
}
.validator {
	display: block;
	margin: 7px 0;
	border: solid 1px #8B0000;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	padding: 2px 8px;
	color: #8b0000 !important;
	background: #fef0f0;
	font: 12px/20px "Trebuchet MS", Arial, Helvetica, san-serif;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdd8d8', endColorstr='#fff7f7');
	background: -webkit-gradient(linear, left top, left bottom, from(#fdd8d8), to(#fff7f7));
	background: -moz-linear-gradient(top, #fdd8d8, #fff7f7);
	width: 250px;
}
.required {
	color: #be0000 !important;
	font-weight:bold;
	font-size: 12px;
}

/*
-----------MoJo Btns-----------
*/
.mojoBtnHolder 
{
	float: right;
	padding: 10px 0;
}

.topBtn
{
	padding-top: 36px;
}

.mojoBtn, .mojoBtn span {
	color: #F0F7F1;
	display: inline-block;
	*display: inline;
	background: url("/images/theme/mojobtn.png") top left no-repeat;
	font-family: "Trebuchet MS", Verdana, Arial, Times, serif;
	font-size: 14px;
	font-weight: bold;
	line-height: 28px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	zoom: 1;
}
.mojoBtn {
	color: #000;
	padding-left: 7px;
}
.mojoBtn:hover, .mojoBtn:hover span {
	background-image: url("/images/theme/mojobtn-hover.png");
}
.mojoBtn span {
	padding-right: 7px;
	background-position: right bottom;
}
.mojoBtn span span {
	padding: 0 0 1px;
	background-position: center center;
	background-repeat: repeat;
}


/*
-----------Page Layout-----------
*/
#pageWrap {
	width: 960px;
	position: relative;
}
#pageContent {
	padding: 15px 65px;
	background: #fff url('/images/theme/pagecontent-bg.png') top center repeat-x;
	zoom: 1;
}
#content {
	padding-bottom: 20px;
}

/*
-----------Tables-----------
*/
.tableDisplay {
	margin-right: auto;
	margin-left: auto;
	border: 1px solid #998dc7;
	border-collapse: collapse;
	background: #fff;
}
.tableDisplay thead {
	background: #ccc6e8;
	color: #6554ab;
}
.tableDisplay td, .tableDisplay th {
	padding: 5px;
	border: solid #998dc7;
	border-width: 0 1px;
}
.tableDisplay tbody th { text-align: left; }
.tableDisplay .altItem { background: #e8e4f3; }
table .note {
	display: block;
	margin: .5em 0;
	color: #666;
	font-size: 12px;
	font-weight: normal;
	line-height: 14px;
}

/*
-----------Form Display-----------
*/
.formDisplay thead th, .formDisplay thead td {
	text-align: center;
}
.formDisplay th, .formDisplay td {
	padding: 3px 5px;
	vertical-align: top;
}
.formDisplay th {
	text-align: right;
	width: 120px;
}
.formDisplay label {
	margin-left: 5px;
}

/*
-----------Header-----------
*/
#header {
	position: relative;
	height: 105px;
	background: #fff8e6 url('/images/theme/header-bg.png') top center;
}
#header .logo, #header .location, #header .portal { position: absolute; }
#header .logo { top: 7px; left: 34px; }
#header .location { top: 35px; left: 499px; }
#header .portal { top: 22px; right: 21px; }
#header .portal:hover {
	opacity: 0.70;
  filter: alpha(opacity=70);
}

/*
----------Nav Design-----------
*/
#navWrap {
	z-index: +1;
}
#navWrap ul {
	display: inline-block;
	*display: inline;
	width: 100%;
	zoom: 1;
}
#navWrap li {
	position: relative;
	margin: -2px 0 -5px;
	border-top: 1px solid #352477;
	border-bottom: 4px solid #1c133e;
}
#navWrap li a {
	padding: 5px 11px;
	border-top: 1px solid #9486cc;
	border-right: 1px solid #352576;
	border-bottom: 1px solid #4e36ab;
	border-left: 1px solid #4e36ab;
	color: #fff;
	background: #3e2e7b;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e3e91', endColorstr='#2f2068');
	background: -webkit-gradient(linear, left top, left bottom, from(#4e3e91), to(#2f2068));
	background: -moz-linear-gradient(top, #4e3e91, #2f2068);
	text-decoration: none;
	zoom: 1;
	_width: 1px;
	_white-space: nowrap;
}
#navWrap li a:hover, #navWrap li.sfHover a {
	background: #7563bc;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7563bc', endColorstr='#2f2068');
	background: -webkit-gradient(linear, left top, left bottom, from(#7563bc), to(#2f2068));
	background: -moz-linear-gradient(top, #7563bc, #2f2068);
}
#navWrap, #navWrap li.last {
	border-top: 1px solid #850204;
	border-bottom: 4px solid #3d0000;
}
#navWrap ul, #navWrap li.last a {
	border-top: 1px solid #be605e;
	border-bottom: 1px solid #850201;
	background: #810707;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a20e0f', endColorstr='#5f0000');
	background: -webkit-gradient(linear, left top, left bottom, from(#a20e0f), to(#5f0000));
	background: -moz-linear-gradient(top, #a20e0f, #5f0000);
}
#navWrap li.last a {
	border-right: none 0;
	border-left: 1px solid #8d0001;
}
#navWrap li.last a:hover {
	background: #ba6565;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ba6565', endColorstr='#5f0000');
	background: -webkit-gradient(linear, left top, left bottom, from(#ba6565), to(#5f0000));
	background: -moz-linear-gradient(top, #ba6565, #5f0000);
}

#navWrap ul ul {
	width: 180px;
	border: none 0;
	border-top: 4px solid #291d5c;
	background: #433287;
}
#navWrap li li, #navWrap li li.last {
	border: none 0;
	margin: 0;
}
#navWrap li li a, #navWrap li li.last a, #navWrap li.sfHover li a {
	border: solid #6851c8;
	border-width: 0 1px 1px 1px;
	padding: 4px 11px;
	filter: none;
	background: none 165px 50% no-repeat;
	font-size: 12px;
	_width: auto;
	_white-space: normal;
}
#navWrap li li a:hover, #navWrap li li.last a:hover {
	filter: none;
	background: #533ea8 165px 50% no-repeat;
}
#navWrap li li a.sf-with-ul {
	background-image: url('/images/theme/nav-arrow.gif');
}
#navWrap.nav ul ul ul {
	margin-top: -30px;
	left: -1px !important;
	border-top: 1px solid #6851c8;
	z-index: -1;
}


/*
-----------Bread Crumb-----------
*/
#breadCrumb {
	margin-bottom: 15px;
	font-size: 11px;
	text-transform: uppercase;
}
#breadCrumb ul { margin: 0; padding: 0; }
#breadCrumb li {
	margin: 0 6px 0 0;
	float: left;
	list-style: none;
}

/*
-----------Show Photos-----------
*/
#photoGallery
{
	background: #000;	
}
/*
-----------General Column Formatting-----------
*/


/*
-----------Home Page Formatting-----------
*/
.homePage #breadCrumb { display:none; }
#upcomingShowsSlideshow { background: url('/images/theme/slideshow-bg.png') top center repeat-x; zoom: 1; }
#upcomingShowsSlideshow .content { margin: auto; background: #000; }
#upcomingShowsSlideshow .content .clr {
	height: 27px;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#492b6f', endColorstr='#32105d');
	background: -webkit-gradient(linear, left top, left bottom, from(#492b6f), to(#32105d));
	background: -moz-linear-gradient(top, #492b6f, #32105d);
}
#upcomingShowsSlideshow .showOptions {
	height: 27px;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #3e1e66;
}
#upcomingShowsSlideshow .showOptions a { position: absolute; top: -15px; }
#upcomingShowsSlideshow .showOptions .hypTickets { left: 115px; }
#upcomingShowsSlideshow .showOptions .hypMore { left: 275px; }
#upcomingShowsSlideshow .showOptions .hypAuditions { left: 434px; }
.homePageColumns .first { width: 545px; margin-right: 30px; }
.homePageColumns .second { width: 255px; margin-top: 20px; }
.homePageColumns .showList .second { width: 400px; margin-top: 0px; }

/*
----------Sidebar----------
*/
#sidebarRight { display: none; }
.hasSidebar #content { width: 635px; float: left; }
.hasSidebar #sidebarRight { display: block; width: 175px; margin-left: 20px; float: left; }

#sidebarRight .castPoster {
	padding: 9px;
	display: block;
	border: 1px solid #e7d5ba;
	background: #fff9e7;
}
#sidebarRight .castPoster .col { text-align: center; }
#sidebarRight p {
	margin-bottom: 10px;
}


/*
----------Footer----------
*/
#footer {
	position: relative;
	padding: 10px 0 0 0;
}
#footer, #footer a {
	color: #fff;
	font-size: 13px;
	line-height: 16px;
	text-decoration: none;
}
#footer small {
	font-size: 11px;
}
#footer strong { color: #c68600; }
#footer .preFooter { position: relative; height: 116px; margin-bottom: 25px; background: #000; }
#footer .preFooter .sponsors { position: absolute; top: 13px; left: 37px; }
#footer .preFooter .connections { position: absolute; top: 13px; right: 21px; }
#footer .floatLt, #footer .floatRt { margin: 0 35px; }

/*
----------Show List and Pages----------
*/
.showsListPage .showInfo { width: 50%; _width: 49.9%; float: left; }
.showsListPage .showList .second { width: 275px; _width: 274px; }
.showList .first { width: 120px; margin-right: 20px; }
.showList .second { width: 405px; }
.showList .showInfo { margin-bottom: 20px; }
.showList .showName, .showList .showDates, .auditionList .auditionName, .auditionList .auditionDates {
	display: block;
	font-weight: bold;
	color: #666;
}
.showList .showName a, .auditionList .auditionName {
	font-size: 17px;
	font-weight: bold;
	color: #000;
	text-decoration: none;
}
h2.showDates {
	font-size: 16px;
	color: #000;
}
h2.showDates strong {
	font-size: 20px;
	display: block;
	color: #43308D;
}
.showList .showName a:hover { text-decoration: underline; }
.showList .showBuyTickets, .showList .showBuyTickets a, .showList .showMore, .showList .showMore a, .showList .showAuditions, .showList .showAuditions a {
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
}
.showViewAll {
	display: inline-block;
	*display: inline;
	border: 1px solid #a97200;
	padding: 2px 8px;
	color: #fff;
	background: #8e0304;
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
	zoom: 1;
}

.audition 
{
    margin-bottom: 25px;
}

/* 
----------Progress Indicator---------- 
*/
#formSteps {
	width: 100%;
	margin-bottom: 10px;
}
#formSteps div {
	color: #c0c0c0;
	padding: 0 10px;
	margin: 3px 0;
	float: left;
}
#formSteps div.active  {
	background: #278536;
}
#formSteps div.clr {
	float: none;
	border-right: none 0;
}
#formSteps div.last {
	border-right: none 0;
}
#formSteps div span {
	display: block;
	padding: 2px 2px;
}
#formSteps div.active span {
	color: #fff;
}

/* 
----------Actor Portal---------- 
*/
#actorPortal :hover.boxShadow {
	opacity: 0.80;
  filter: alpha(opacity=80);
}


/* 
----------Error Page---------- 
*/
.errorSuggestions {
	padding-left: 40px;
}
.errorSuggestions li {
	padding: 3px 0;
}


/*
------------------ Seat Picker Ticket List ----------------------
*/
#selectedTickets {
	position: absolute;
	top: 33px;
	left: 236px;
	height: 252px;
	width: 222px;
	z-index: 1;
}
#selectedTickets .content {
	padding: 2px 10px
}
#ticketList {
	list-style: none;
	margin: 0;
	padding: 0;
}

#ticketList div {
	float: left;
}
#selectedTickets span, #divTicketInfo span {
	float: left;
	display: block;
}
.seat {
	width: 50px;
}
.cost {
	width: 60px;
}
.type {
	width: 92px;
}
div.type {
	padding: 3px 0;
	font-size: 11px;
	line-height: 14px;
}
#divTicketInfo #ticketList  {
	width: auto;
	height: auto;
}
#divTicketInfo {    
	margin-bottom: 14px;
}


/*
------------------ Seat Picker Checkout Pages ----------------------
*/
.ticketCol
{
	padding: 0 0 0 15px;
}


#receipt .mojoBtnHolder
{
	float: none;
	margin: 0 auto;
	text-align: center;
}

.pageBreak
{
	page-break-after:always;	
}

.pageSeparator
{
	height: 5px;
	border-top: 2px dashed #278536;
}

#ifTickets
{
	width: 650px;
	height: 500px;
	border: 1px solid #000;
	display: block;
	margin: 0 auto;
}

/*
------------------ Lightbox Style Popup ----------------------
*/

#backgroundPopup{
	display:none;
	position:absolute;
	height:100%;
	width:100%;
	top:0;
	left:0;
	background:#000000;
	z-index: 900;
}
.popup{
	display:none;
	position:absolute;
	z-index: 999;  
    background-repeat: repeat-y;
}
.lg{
	width:708px;
}
.lg .popupContent {
	padding:10px 25px;
	float: none; 
	background-image: url(/images/seatingChart/popup/popup-lg-bg.gif); 
}
.lg .dialog{
	padding: 10px 25px;	
}

.popup .top { display: block; }
.popup .btm { display: block; }
.popup .bg { display: block; position: absolute; top: 7px; left: 7px; z-index: 10; }

.popupContent {
	padding: 25px 23px 25px 34px;
	color: #fff;
	float: left;
}
#popupClose {
	right: 25px;
	top: 11px;
	position:absolute;
	display:block;
	cursor: pointer;
}
