﻿/* Boston Symphony Orchestra
   Last Updated: 7-2011
   Author:  Oncall Interactive, LLC

Style definitions found in reset.css

--SUBSCRIPTION STYLES--

Sections:
   
/* =SUBSCRIPTION LIST PAGE
   ----------------------------------------------------*/



/* =SUBSCRIPTION LIST PAGE
   ----------------------------------------------------*/


#list-header
{
 font-size: 11px;   
 color: #323232;    
}

#list-header #title-header
{
    float:left;
    margin-left: 20px;
    width: 180px;
}

#list-header #performances-header
{
    float: left;   
}

#list-header #results-summary
{
    margin: 0;   
    float: right;
     font-size: 11px;   
    color: #323232;   
    font-family: "Lucida Sans",Tahoma,Arial; 
}

.subscription-tabs
{
    margin-bottom: 10px;     
}

#subscription-list
{
   padding-top: 10px;
   border-bottom: 1px solid #E9E9E9;
   margin-bottom: 20px;
   margin-top: 10px;
}

.js #subscription-list
{
    display: none;   
}

#subscription-list .subscription
{
    border-top: 1px solid #E9E9E9;
    width: 700px;
    display: inline-block;
}

#subscription-list .subscription h3
{
    font-weight: bold;   
    font-size: 14px;
    color: #323232;
}

#subscription-list .subscription-header
{
    cursor: pointer;
    color: #5e5e5e;
    display: inline-block;
    padding: 5px 0;
    width: 100%;
}

#subscription-list .subscription-header.active,
#subscription-list .subscription-header:hover
{

    background-color: #e9e9e9;   
    color: Black;
}

#subscription-list .subscription-details
{  
}

#subscription-list .subscription-details .description-text
{
    float: left;
    clear: left;
    font-size:12px;
}

#subscription-list .subscription-title
{
     font-size: 13px;  
     font-family: "BSO Bold", Helvetica, Arial, sans-serif;
     text-transform: uppercase;
     margin-left: 22px;
     display: inline-block;
     width: 175px;
}

#subscription-list .subscription-performances-description
{
    display: inline-block;
    font-size: 12px;
    width: 450px;
}

#subscription-list .subscription-performance-thumbnail
{
    height: 75px;
    width: 75px; 
    float: left;
    margin-right: 10px;
}

#subscription-list .subscription-performance-thumbnail img
{
    max-width: 100%; 
}

#subscription-list .subscription-performance-information
{
    float: left;
    width: 225px;   
}

#subscription-list .subscription-information
{
    float: left;
    margin: 18px 32px 8px;
    width: 700px;
}

#subscription-list .subscription-description
{
    border-right: 1px solid #e1e1e1;
    float: left;
    min-height: 100px;
}

#subscription-list .subscription-description .description-text
{
    font-size: 12px;
    line-height:15px;
    margin: 5px 25px 5px 0;
    width: 300px;    
    color: #5e5e5e;
}

#subscription-list .subscription-tickets
{
    float:right;
    width: 350px;   
}

#subscription-list .subscription-controls
{
    padding: 5px 10px;
    width: 155px;
    height: 140px;
    float: right;
    background-color: #e8e8e8;
    position: relative;
}

#subscription-list .subscription-controls select
{
    font-size: 10px;
    width: 155px;   
}

#subscription-list .subscription-buttons 
{
    float: left;
}

#subscription-list .subscription-buttons .seating-button
{
    width: 165px; 
}


#subscription-list .price-range 
{
	font-family: "BSO Regular", Helvetica, Arial, sans-serif;
    color: #ee386b;
    font-size: 22px;
    word-spacing: 1px;
    font-weight: normal;
}

#subscription-list .subscription-type
{
    background-color: #e9e9e9;
    float: left;
    font-size: 12px;
    height: 10px;
    margin: 8px 10px 8px 0;
    padding: 20px 0;
    text-align: center;
    width: 138px;
    font-weight:bold;
}


#subscription-list .back-navigation
{
    margin-bottom: 15px;
}

#subscription-list .subscription-performances
{
    border-top: 1px solid #E1E1E1;
    clear: left;
    margin: 0 0 0 15px;
    padding: 10px 0;
}

#subscription-list .subscription-performances .performances-label
{
    margin-left: 15px;   
}

#subscription-list .subscription-performance
{
    display: inline-block;
    margin: 10px 0 10px 15px;
    width: 325px;
    position: relative;
}

#subscription-list .subscription-performance input[type=checkbox]
{
    position: absolute;
    left: -25px;
}

#subscription-list .subscription-performance .subscription-performance-title 
{
    line-height: 20px;
    min-height: 40px;
}

#subscription-list .subscription-performance .brand 
{
    color: #303030;
    font-size: 12px;
    line-height: 18px;
    font-weight:bold;
}

#subscription-list .subscription-performance .facility
{
    color: #5e5e5e;
    font-size: 12px;
    line-height: 16px;
    
}

#subscription-list .subscription-performance .facility-city
{
    font-style: italic;   
    margin-left: 2px;
}

/* =PROMOTIONS */

#subscription-list .promotion.subscription
{
    max-height: 150px;
    overflow: hidden;   
    border: 0;
}

#subscription-list .promotion.subscription img
{
    width: 100%;   
}


/* =FLEX SUBSCRIPTIONS LIST */

.subscription-options
{
    background-image: url("../images/layout/checkout_nav_background.jpg");
    background-position: -9px -35px;
    background-repeat: repeat-x;
    min-height: 400px;
    padding: 10px 0 70px 0;
}


.subscription-options .section-header
{
    font-size: 14px !important;
    font-style: normal !important;
    margin-top: 0 !important;
}

.flex-subscription-types
{
    margin-left: 225px;   
}

.flex-subscription-types h2
{
    font-weight: bold;
    text-transform: uppercase;
}

.flex-subscription-type
{
    width: 220px;
    float: left;
    margin-right: 10px;   
    margin-top: 25px;
}

.flex-subscription-type .description
{
    margin: 10px 0;
    color: #919191;
    font-size: 11px;
}

.flex-subscription-type .subscription-controls
{
    margin: 15px 0;
}

.flex-subscription-type label,
.flex-subscription-type .choose-your-own-label
{
    font-size: 11px;
    color: black;
    font-weight: bold;
    display: block;  
    margin: 5px 0; 
}


/* =SUBSCRIPTION RENEWAL */

#renewal-editable
{
    display: none;   
}

#renewal-readonly
{
    display: none;   
}

#renewal .renewal-overview
{
    margin: 10px 0;  
    color: #919191; 
}

.subscription-icon
{
    background-color: #69ae2d;
    border: 2px solid white;
    display: inline-block;
    float: left;
    height: 8px;
    margin: 3px 7px 20px 0;
    width: 8px;
    -webkit-box-shadow: 0 0 3px #929292;
    -moz-box-shadow: 0 0 3px #929292;
    box-shadow: 0 0 3px #929292;
}

#renew-subscriptions .subscription-header
{
background-image: linear-gradient(top, #E8E8E8 35%, #DADADA 85%);
background-image: -o-linear-gradient(top, #E8E8E8 35%, #DADADA 85%);
background-image: -moz-linear-gradient(top, #E8E8E8 35%, #DADADA 85%);
background-image: -webkit-linear-gradient(top, #E8E8E8 35%, #DADADA 85%);
background-image: -ms-linear-gradient(top, #E8E8E8 35%, #DADADA 85%);

background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.35, #E8E8E8),
	color-stop(0.85, #DADADA)
);

    border: 1px solid #929292;
    border-bottom: 1px solid #bcbcbc;
    padding: 5px 10px;
    width: 575px;
    text-transform: uppercase;
    display: inline-block;
}


#renew-subscriptions .subscription-title
{
    font-family: "BSO Bold",Helvetica,Arial,sans-serif;
}

#renew-subscriptions .subscription-short-description
{
    font-family: "BSO Regular",Helvetica,Arial,sans-serif;
    float: left;
}

#renew-subscriptions .subscription-action
{
    float: right;   
    text-transform: none;
    font-size: 12px;
    padding: 2px 0 2px 5px;
}

#renew-subscriptions .subscription-details
{
    width: 575px;
    border: 1px solid #929292;   
    border-top: none;
    border-bottom: none;
    padding: 10px;
}

#renew-subscriptions .subscription-submit
{
    width: 575px;
    border: 1px solid #999999;  
    background-color: #f4f4f4; 
    padding: 10px;
    text-align: right;
    position: relative;
}


#renew-subscriptions .subscription-submit .renew-terms
{
    bottom: 10px;
    color: #5E5E5E;
    float: left;
    font-size: 10px;
    text-align: left;
    width: 230px;
}

#renew-subscriptions .subscription-submit .are-you-sure
{
    font-size: 11px;
    font-weight: bold;   
}

#renew-subscriptions .subscription-submit .i-agree
{
    font-size: 11px;
    margin: 5px 0;
    color: #5E5E5E;
    font-size: 10px;
}

#renew-subscriptions .subscription-submit .i-agree input
{
    margin-right: 5px;
}

#renew-subscriptions .subscription-submit .secondary-button
{
    margin: 5px 0;
    height: auto;
}

#renew-subscriptions .subscription-setting
{
 clear: left;  
 width: 565px; 
 padding: 5px;
 font-size: 11px;
}

#renew-subscriptions .subscription-setting legend
{
    float: left;
    font-weight: bold;
    margin-right: 10px;
    text-align: right;
    width: 155px;
    font-size: 11px;
}


#renew-subscriptions .add-comments textarea
{
    width: 275px;
}

#renew-subscriptions .other-requests
{
    border-top: 1px solid #c9c9c9;   
}

#renew-subscriptions .price-type-inputs,
#renew-subscriptions .other-request-inputs,
#renew-subscriptions .current-seats
{
    display: inline-block;
    width: 400px;
}

#renew-subscriptions .other-request-inputs input
{
    float: left;
    clear:left;
}

#renew-subscriptions .other-request-inputs label
{
    float: left;
    margin: 3px 1px 10px;
    width: 370px;
    font-size: 10px;
}


#renew-subscriptions .seat-price-type label
{
    clear: right;
    float: right;
    width: 120px;
    font-size: 10px;
    color: #5E5E5E;
}

#renew-subscriptions .subscription-setting select
{
    font-size: 11px;
    margin: 0 0 5px;
    width: 275px;
}

#renew-subscriptions .add-subscription
{
    background-image: linear-gradient(top, #424242 20%, #555555 80%);
    background-image: -o-linear-gradient(top, #424242 20%, #555555 80%);
    background-image: -moz-linear-gradient(top, #424242 20%, #555555 80%);
    background-image: -webkit-linear-gradient(top, #424242 20%, #555555 80%);
    background-image: -ms-linear-gradient(top, #424242 20%, #555555 80%);
    background-image: -webkit-gradient(
	    linear,
	    left top,
	    left bottom,
	    color-stop(0.2, #424242),
	    color-stop(0.8, #555555)
    );   
    padding: 3px 10px;
    text-align: center;
    width: 575px;
    border-top: 1px solid #242424;
    border-left: 1px solid #929292;
    border-right: 1px solid #929292;
    border-bottom: 6px solid #323232;
}

#renew-subscriptions .add-subscription-link
{
    color: white;
    font-size: 13px;
    letter-spacing: 0;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    font-family: "BSO Regular",Helvetica,Arial,sans-serif; 
}

#renew-subscriptions .add-subscription-link strong
{
 font-family: "BSO Regular",Helvetica,Arial,sans-serif; 
 font-weight: normal;   
}


/* =SUBSCRIPTION PERFORMANCE SELECTOR */

.subscription-performance-selector {
    padding-bottom: 25px;
    overflow: hidden;
}

.subscription-performance-selector > dl{
    width: 935px;
    border-top: 2px solid #b8b8b8;
    border-bottom: 3px solid #b8b8b8;
    line-height: normal;
    margin-bottom: 25px;
    display: block;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}

.subscription-performance-selector dl .ui-icon{
    display: none;
}

.subscription-performance-selector > dl > dt{
    padding: 8px 35px;
    overflow: hidden;
    background: #e5e5e5 none;
    border-top: 1px solid #b8b8b8;
    border-bottom: 1px solid #fff;
    cursor: pointer;
}

.subscription-performance-selector.single-selector > dl > dt{
    cursor: auto;
}

.subscription-performance-selector > dl > dt .subscription-title{
    width: 100px;
    padding-right: 20px;
    margin-right: 20px;
    border-right: 1px solid #fff;
    float: left;
    margin-top: 3px;
    font-family: "BSO Bold",Helvetica,Arials,sans-serif;
    font-size: 15px;
    color: #5e5e5e;
    text-transform: uppercase;
}

.subscription-performance-selector.single-selector > dl > dt .subscription-title{
    color: #000;
}

.subscription-performance-selector > dl > dt .performance-datetime{
    width: 230px;
    float: left;
    
}

.subscription-performance-selector > dl > dt .performance-date{
    padding: 3px 10px;  
    font-size: 11px;
}

.subscription-performance-selector > dl > dt .performance-title{
    width: 475px;
    float: left;
    margin-top: 3px;
    font-family: "BSO Regular",Helvetica,Arials,sans-serif;
    font-size: 15px;
}

.subscription-performance-selector > dl > dt .subscription-description {
    width: 500px;
    float: left;
    margin-top: 3px;
    font-family: "BSO Regular",Helvetica,Arials,sans-serif;
    font-size: 15px;
    color: #000000;
}

.subscription-performance-selector > dl > dd{
    background: 0 none;
    border: 0 none; 
}

.js .subscription-performance-selector > dl > dd.hidden {
    display: none;
}

.subscription-performance-selector > dl > dd .seat-selector{
    margin-bottom: 0px;
}


.subscription-performance-selector .add-subscription {
    padding: 2px 40px 4px;
    
    float: right;
    margin-right: 50px;
    background-color: #9A0130;
}

.subscription-performance-selector .add-subscription.disabled{
    background-color: #919191;
    cursor: auto;
}
