/***
main.css - MAIN STYLESHEET
v0.1 - 2008-07-17
- Initial verion
v0.2 - 2008-08-08
- added outline specifics for tab nav, breaking away from HTML templates version
v0.3 - 2008-08-13
- removed specific (non-performance, non-bio) tab definitions, put them into tabs.css (in Umbraco)
v0.31 - 2008-08-15
- revised drop down colours and text size
v0.4 - 2008-08-25
- added exceptions to some of the frame styles to handle when the side module is not present
v0.5 - 2008-08-28
- added media_frame and board_frame definitions
v0.6 - 2008-09-15
- Change main nav code to support one large background image instead of 8 individual ones
v0.61 - 2008-09-16
- Removed all commented out code and redundant CSS, to optimize size
v0.62 - 2008-11-19
- Added styles for photo captions
***/
/*** GENERAL STYLES ***/
body{padding:0; margin:0; font-family:Georgia,"Times New Roman"}
a{text-decoration:none; color:#b54739}
a:hover{text-decoration:underline}
a img{border:0}
form{margin:0; padding:0}
.generic_content ul li, .tab_content ul li{list-style:none; background-image:url(../images/bullet_dash.gif); background-position:0px 7px; padding-left:15px; background-repeat:no-repeat}

/* Clearfix */
.clearfix:after{content:"."; display:block; height:0; clear:both; visibility:hidden}

.clearfix{display:inline-block}

/* Hides from IE-mac \*/
* html .clearfix{height:1%}
.clearfix{display:block}
/* End hide from IE-mac */ 
.download{background:url(../images/but_download.gif) no-repeat 0px 2px; padding-left:17px}
.pdf{background:url(../images/board/icon_pdf_download.gif) no-repeat 0px 3px; padding:0 0 0 15px}
.inline_gallery{display:none}

blockquote{color:#333}
blockquote cite{display:block; margin-top:10px}

/*** FRAME STYLES ***/
#siteframe{width:980px; margin:0 auto; position:relative; padding:0 0 20px 0}
#header{position:relative}
#header #utilnav{position:absolute; bottom:37px; right:0}
#header #utilnav ul{padding:0; margin:0; list-style:none}
#header #utilnav li{float:left; border-left:1px solid #000; font-size:12px; padding:0 6px}
#header #utilnav li.first{border:0px}
#header #utilnav li.last{padding-right:0}
#header #utilnav a{color:#000}
#footer{background-color:#efefef; padding-left:140px; clear:both}
#footer #footernav{font-size:12px; color:#888; background-color:#f5f4f4; border-left:1px solid #888; border-right:1px solid #888; height:24px; width:783px; position:relative; top:0; left:0}
#footer #footernav ul{list-style:none; padding:0; margin:0; position:absolute; top:4px; right:20px}
#footer #footernav li{float:left; border-left:1px solid #888; padding:0 6px}
#footer #footernav li.first{border:0}
#footer #footernav a{color:#888; padding:0; margin:0; display:block}
#footer #footernav a:hover{color:#555}
/*** NAV ***/
#nav{background-color:#efefef; height:37px; padding:0 0 0 140px; position:relative; /* KLUDGE for IE6:z-index issue - http://www.last-child.com/conflicting-z-index-in-ie6/ */z-index:50}
#nav ol{list-style:none; margin:0; padding:0; width:785px; height:37px; background-color:#b54739}
#nav ol.blank{width:785px; height:37px; background-color:#b54739}
#nav ol li{float:left; margin:0; padding:0; background-color:#b54739}
#nav ol li a em{display:none}
#mainnav_home{display:block; width:56px; height:37px; background:url(../images/frame/mainnav.gif) no-repeat 0px 0px}
#mainnav_home:hover{background-position:left bottom}
#mainnav_performances{display:block; width:122px; height:37px; background:url(../images/frame/mainnav.gif) no-repeat -56px 0px}
#mainnav_performances:hover{background-position:-56px bottom}
#mainnav_subscribe{display:block; width:94px; height:37px; background:url(../images/frame/mainnav.gif) no-repeat -178px 0px}
#mainnav_subscribe:hover{background-position:-178px bottom}
#mainnav_support{display:block; width:77px; height:37px; background:url(../images/frame/mainnav.gif) no-repeat -272px 0px}
#mainnav_support:hover{background-position:-272px bottom}
#mainnav_youth_outreach{display:block; width:134px; height:37px; background:url(../images/frame/mainnav.gif) no-repeat -349px 0px}
#mainnav_youth_outreach:hover{background-position:-349px bottom}
#mainnav_artist_training{display:block; width:128px; height:37px; background:url(../images/frame/mainnav.gif) no-repeat -483px 0px}
#mainnav_artist_training:hover{background-position:-483px 0px}
#mainnav_company{display:block; width:109px; height:37px; background:url(../images/frame/mainnav.gif) no-repeat -611px 0px}
#mainnav_company:hover{background-position:-611px bottom}
#mainnav_video{display:block; width:65px; height:37px; background:url(../images/frame/mainnav.gif) no-repeat -720px 0px}
#mainnav_video:hover{background-position:-720px bottom}
#nav .subnav{padding-bottom:3px; background-color:#efefef; display:none; z-index:999; width:auto; height:auto}
#nav .subnav li.first{padding-top:3px}
#nav .subnav li{float:none; background-color:#efefef}
#nav .subnav li a{color:#333; font-size:11px; padding:5px 30px 5px 13px; margin:2px 0; display:block; /* KLUDGE:for IE6 */width:180px}
#nav .subnav li a:hover{color:#fff; background-color:#b54739; text-decoration:none}
#nav #sub_performances{position:absolute; top:37px; left:196px}
#nav #sub_subscribe{position:absolute; top:37px; left:318px}
#nav #sub_support{position:absolute; top:37px; left:412px}
#nav #sub_youth_outreach{position:absolute; top:37px; left:598px}
#nav #sub_company{position:absolute; top:37px; left:489px}

/*** PAGE-SPECIFIC GENERAL STYLES ***/
.bodyframe{width:840px; padding:30px 0px 0px 140px; margin-bottom:20px}
/* EXCEPTIONS */
#calendar_frame{padding:30px 0 0 0; width:930px}
#breadcrumb{color:#b54739; font-size:15px; font-style:italic; padding:0 0 10px 0; margin:0; font-weight:normal}
/* EXCEPTION */
#calendar_frame #breadcrumb{margin:0 0 0 140px}
/*** BIO PAGE ***/
#bio_pic{float:left; padding-top:20px}
#bio_content{float:left; padding-top:20px; width:500px; padding-left:20px}
#bio_content h1{padding:0; margin:0; font-size:37px; font-weight:bold; font-family:"Arial Narrow",Arial,Helvetica}
#bio_content h2{padding:0; margin:0; font-weight:bold; color:#888}
#bio_content .dek{font-size:15px; font-weight:bold; /* FIX:Min-height fix for IE6 and others */min-height:18px; height:auto !important; height:18px}
#bio_content .dek p{margin:15px 0px}
/*** PERFORMANCE PAGE ***/
#performance_media{width:267px; padding-right:10px; padding-top:5px; float:left; font-size:12px}
#performance_photos{clear:both; margin:10px 0}
.photogallery_list, .seatingmap_list{display:none}
#performance_videos{clear:both}
#performance_photos .thumb, #performance_videos .thumb{float:left; margin-right:10px; display:block}
.thumb img{display:block}
#performance_media h6{font-size:13px; font-weight:bold; padding:0; margin:0}
#performance_media #sponsor{padding-top:15px; width:260px; clear:both}
#performance_media #sponsor h6{color:#888; font-size:11px; font-weight:normal; padding:0; margin:0}
#performance_media #sponsor img{display:block; margin:4px 0}
#performance_content{float:left; width:508px}
#performance_content h1, #performance_content h2, #performance_content h3{padding:0; margin:0; font-weight:bold; font-family:"Arial Narrow",Arial,Helvetica}
#performance_content h1{font-size:37px}
#performance_content h2, #performance_content h3{color:#888; font-size:23px}
#play_title{display:block; margin-bottom:8px}
#play_write{display:block}
#performance_dates{display:block}
#buy_ticket_but{display:block; /* KLUDGE:IE6 doesn't like the margin; on performance pages,the tab nav jumps when clicked; tupid IE6 */padding:20px 0; width:130px}
#buy_ticket_but img{display:block}

#performance_content .tab_content{width:485px}
#content_artist_profile .dek{font-style:italic}

/*** PERFORMANCE MINI-CALENDAR ***/
.talkback{background-color:#a4d2f0}
.earlybird{background-color:#eaba47}
.openingnight{background-color:#a8c864}
.enrichment{background-color:#ff0}
.school{background-color:#ff6db6}
.closingnight{background-color:#b2b2b2}

/*** TICKET OVERLAY/HAND OFF ***/
#tickOverlay{position:absolute; top:0; left:0; z-index:90; width:100%; height:500px; background-color:#000}
#tickHolder{width:100%; text-align:center; z-index:100; position:absolute; left:0}
#tickMessageHolder{position:relative; margin:0 auto; width:290px; height:170px; background:#fff url(../images/performances/bkgrnd_logo_handoff_yc.gif) no-repeat right top; text-align:left; padding:15px 180px 15px 30px; font-size:13px}
#handoff_cancel{float:left; margin-top:5px}
#handoff_confirm{float:right}

/*** GENERIC PAGE AND GENERIC LANDING PAGE ***/
#picHolder{padding:0 15px 10px 0; float:left; width:267px}
#masthead{padding:15px 0px 0px; position:relative}
/* KLUDGE:Hack for IE6 - gives relative container "hasLayout"*/
* html #masthead{zoom:1}
/* KLUDGE:Hack for IE6 - shims the credits down into position */
*html #credits{margin-bottom:-1px}
#masthead img{display:block}
#credits{position:absolute; bottom:0; left:0; padding:15px; width:755px; background-color:#888; font-size:13px; color:#fff; text-align:right}
#credits p{margin:0; padding:0}
#credit_link{width:785px; padding-bottom: 15px; text-align:right}
#credit_anchor{font-size:11px; display:block; width:80px; padding:5px; float:right; clear:both}
#credit_anchor:hover{background-color:#B54739; color:#fff; text-decoration:none}
/* EXCEPTION */
.alt_layout #masthead{/* padding:0 15px 10px 0; float:left; */padding:0px}
.alt_layout #credits{width:237px}
.alt_layout #credit_link{width:267px; padding: 0;}
.generic_content{font-size:15px}
/* EXCEPTION */
/* Landing pages and Artist page only */
#generic_landing_frame .generic_content, #artist_frame .generic_content{width:785px}
/* Calendar only */
#calendar_frame .generic_content{margin-left:140px}
/* Normal pages */
#generic_frame .generic_content, #media_frame .generic_content, #board_frame .generic_content{font-size:15px; width:600px; float:left; clear:both}
/* EXCEPTION */
/* This is used when the right module is suppressed */
#siteframe #generic_frame .generic_content_extra, #siteframe #media_frame .generic_content_extra, #siteframe #board_frame .generic_content_extra{width:785px}
.generic_content h1{padding:0; margin:0 0 10px 0; color:#b54739; font-size:20px; font-style:italic; font-weight:normal}
/* EXCEPTION */
.alt_layout h1, .flashhdr_h1{margin-bottom:10px}
.generic_content h2{padding:0; margin:0; color:#b54739; font-size:16px; font-style:italic; font-weight:normal}
.generic_content p{margin-top:0px; margin-bottom:15px}
#module_side{width:218px; margin-left:20px; float:left; font-size:15px}
/* EXCEPTION */
/* This is for when they're using a square image layout, it makes the right module move down
to line up with the square image */
#generic_frame .module_alt_layout, #media_frame .module_alt_layout, #board_frame .module_alt_layout{margin-top:43px}
#module_side h3{margin:0px; padding:0px; color:#fff; background-color:#b54739; font-size:15px; font-style:italic; padding:3px 0 0 10px; /* FIX:Min-height fix for IE6 and others */min-height:23px; height:auto !important; height:23px}

/*** FOOTER MODULES ***/
#footer_modules{border-top:1px solid #b2b2b2; padding-top:10px; margin-top:10px; font-size:15px}
#footer_modules p{margin-top:0px; margin-bottom:15px}
#footer_modules ul{list-style:none; padding:0; margin:0}
#footer_modules ul li, #footer_modules div.module{width:415px; float:left; margin-left:10px}
#footer_modules ul li.first, #siteframe #footer_modules div.first{margin-left:0px; clear:both}
/* EXCEPTION */
/* Artist landing page uses 3 module layout instead of two */
#artist_landing_frame #footer_modules ul li, #artist_landing_frame #footer_modules div.module{width:273px; float:left; margin-left:10px}
#artist_landing_frame #footer_modules ul li.first, #artist_landing_frame #footer_modules div.first{margin-left:0px; clear:both}
#footer_modules ul li h3, #footer_modules div.module h3{margin:0px; color:#fff; background-color:#888; font-size:16px; font-style:italic; padding-left:10px}
#footer_modules ul li h3.highlight, #footer_modules div.module h3.highlight{background-color:#b54739}
#footer_modules div.module div{padding:10px 0 0 10px}

/*** PAGE TABS ***/
/* EXCEPTION */
/* Landing pages and Artist page only */
#generic_landing_frame #generic_tab_content, #artist_tab_content, #season_tab_content{width:840px}
/* Normal pages */
#generic_frame #generic_tab_content, #media_frame #generic_tab_content, #board_frame #generic_tab_content{width:600px; float:left}
/* EXCEPTION */
/* This is for when the right side module is supressed on generic pages */
#siteframe #generic_frame .tab_content_extend, #siteframe #media_frame .tab_content_extend, #siteframe #board_frame .tab_content_extend{width:840px}
#tab_nav{list-style:none; padding:0; margin:0; border-top:1px solid #b2b2b2}
/* EXCEPTION */
#artist_frame #tab_nav{padding-left:182px}
#tab_nav li{float:left; padding:0; margin:0; border-left:1px solid #b2b2b2}
#tab_nav li.first{border-left:none}
#tab_nav li a{display:block; height:26px; padding:0 10px; background-color:#efefef; background-position:10px 0px; background-repeat:no-repeat; color:#efefef; font-size:8px; outline:0px none}
#tab_nav li a.on{background-position:10px -26px; background-color:#fff}
#tab_nav li a em{display:none}

/*** TAB CONTENT ***/
.tab_content{clear:both; padding:15px 10px 0 0; display:none; font-size:15px; /* FIX:Min-height fix for IE6 and others */min-height:400px; height:auto !important; height:400px}
/* EXCEPTION */
/* Give tab content some more head space on generic pages */
#generic_tab_content .tab_content{padding-top:30px}
/* Different min-height */
#season_tab_content .tab_content{/* FIX:Min-height fix for IE6 and others */min-height:330px; height:auto !important; height:330px}
.tab_content p{margin-top:0}
.tab_content h3, #performance_content .tab_content h3{padding:0; margin:0; color:#b54739; font-size:16px; font-style:italic; font-weight:normal; font-family:Georgia,"Times New Roman"}
.tab_content h4{padding:0; margin-bottom:0; color:#000; font-size:15px; font-style:italic; font-weight:bold}
.bodyframe .tab_content_on{display:block}

/*** SUBSCRIBE - Chart styles ***/
.subscribe_chart{text-transform:uppercase; border-collapse:collapse; border:0; margin:0; padding:0; float:left}
/* EXCEPTION */
.generic_content .subscribe_chart{float:none; margin:15px 0}
.subscribe_chart img{display:block}
.subscribe_chart th{font-size:11px; font-weight:normal; text-align:left}
.subscribe_chart th.label{border-right:1px solid #ccc; padding:0 0 12px 6px}
.subscribe_chart th.price{border-right:1px solid #ccc; padding:0 0 12px 15px}
/* EXCEPTION */
table.subscribe_chart th.last{border-right:0px}
.subscribe_chart td.label{font-size:11px; border-right:1px solid #ccc; padding-left:6px}
.subscribe_chart td.price{font-size:15px; border-right:1px solid #ccc; padding:5px 0 5px 15px}
/* EXCEPTION */
table.subscribe_chart td.last{border-right:0px}
.subscribe_benefits{display:block; float:left; width:510px; padding-left:35px}
.subscribe_benefits ul{list-style:none; margin:0; padding:0}
.subscribe_benefits ul li{padding:0; margin:5px 0px; background-image:none}
/*** ARTISTS - artist list styles ***/
.artist_list, .name_list{list-style:none; padding:0; margin:0}
.tab_content .name_list{padding-top:15px}
.tab_content .artist_list li{float:left; width:135px; height:186px; border-bottom:1px solid #b2b2b2; margin-top:4px; padding:0px; padding-right:3px; /* tab_content and this needed to override earlier background-image */background-image:none}
.artist_list li img{display:block; margin-bottom:2px}
.artist_list a, .artist_list em{display:block; font-size:11px}
.tab_content .name_list li{margin:0px 10px 0 0; width:190px; height:60px; float:left; /* tab_content and this needed to override earlier background-image */padding:0px; background-image:none}
.name_list a, .name_list em{display:block; font-size:11px}
/*** ARTIST LANDING PAGE ***/
#primary_artist{float:left; width:273px; font-size:11px; margin-top:15px}
#secondary_artist{float:left; width:500px; font-size:11px; margin-top:15px}
#primary_artist p, #secondary_artist p{margin-bottom:15px}
#primary_artist a, #primary_artist em, #secondary_artist a, #secondary_artist em{display:block}
#primary_artist img, #secondary_artist img{display:block; margin-bottom:15px}
/*** SEASON PAGE ***/
.season_list{list-style:none; padding:0; margin:0}
.tab_content .season_list li{float:left; display:block; position:relative; margin:0; padding:0 10px 10px 0; width:187px; height:100px; background-image:none}
.season_list a{display:block; width:187px; height:100px; background-position:top left; background-repeat:no-repeat}
.season_list li.expired a{background-position:bottom left}
.season_list li.expired a:hover{background-position:top left}
.season_list a em{display:none}

/*** CORPORATE SPONSOR LIST ***/
.sponsor_list img{padding:10px 0}
.sponsor_list td{text-align:center}
/*** VIDEOS ***/
#video_frame #generic_tab_content .tab_content{padding-top:10px}
#video_frame .tab_content ul{list-style:none; padding:0; margin:0}
#video_frame .tab_content ul li{background-image:none; padding-right:15px; display:block; float:left; width:225px}
#video_frame .tab_content ul li img{display:block}
/*** BENEFITS CHART ***/
.benefits_chart{border-collapse:collapse}
.benefits_chart th{padding:0 27px}
.benefits_chart th.key{padding:0; vertical-align:bottom}
.benefits_chart th div{background-color:#efefef; padding:10px; text-transform:uppercase; text-align:left; font-size:11px; font-family:Georgia,"Times New Roman"; font-weight:normal}
.benefits_chart td{vertical-align:middle; text-align:center; padding:15px 0; border-top:1px solid #ccc}
.benefits_chart tr td *, .benefits_chart tr td{font-family:Georgia,"Times New Roman"; font-size:11px}
.benefits_chart tr.first td{border:0px}
.benefits_chart td.benefit{text-align:left}

/*** LOGIN PAGE ***/
.login_form td{font-weight:bold}
.login_form td input{font-weight:normal}
.login_form .umbGroupButton{background-color:#b54739; color:#fff; font-weight:bold; font-family:Georgia,"Times New Roman"; padding:5px 10px; border:0px}

