i#menu-icon{ background:url("../images/menu.png?v=1")!important; height:1em; width:1em; background-size:contain!important; } .scroll-top { position: fixed; bottom: 20px; right: 20px; width: 50px; height: 50px; background-color: #fff; color: #000; border-radius: 50%; display: flex; justify-content: center; align-items: center; text-decoration: none; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); transition: background-color 0.3s; z-index: 1000; } .scroll-top:hover { background-color: #fff; text-decoration: none; } /*Custom ShoWare Icons*/ img.sw-icon { /*display: none;*/ } /* Replaces any SVG img Tag inline SVG element*/ img.sw-icon { /*these icons should be hidden until they are updated to SVG to prevent color popping*/ opacity: 0; } svg.sw-icon path { /*overwrite internal styling*/ fill: inherit!important; } svg.sw-icon { /*default size, overwrite with more specific selector: ex. .main-container svg.print-icon*/ width: 1em; height: 1em; } .button .sw-icon { vertical-align: top!important; } .streaming-icon{ height:1em; vertical-align:bottom; fill:currentColor; } /*Generic Controls and Resets*/ img { border: none; } h1 { position: absolute; z-index: 1; text-indent: -9999px; height: 1px; width: 1px; } [aria-hidden="true"] { display: none; } .video-js [aria-hidden="true"]{ display:inline-block; } /*used for site title - not visible by default*/ body { font-size: 100%; } /*IE 6 and 7 render fonts properly*/ #demo-div { width: 100%; line-height: 30px; background: rgba(255, 0, 0, .6); color: white!important; font-size: 15px; font-weight: bold; text-align: center; position: fixed; z-index: 9999; bottom: 0px; height: 30px; box-shadow: 0px 2px 5px RGBA(0, 0, 0, 0.3); text-shadow: 0px 2px 5px RGBA(0, 0, 0, 0.3); } .center-div { margin-left: auto; margin-right: auto; } /*Accessability Features*/ .skip-nav{ position:absolute; top:-200%; left:-200% } *:focus{ outline:2px solid RGBA(128, 128, 128, 0.8)!important; } html body div:focus{outline:none!important;} /*Centers object with actual width - IE MUST be able to calculate the width of the object it will not figure it out if you don't delcare it */ .clear-float { clear: both } .clear:after { content: ""; display: block; clear: both; } html { -webkit-font-smoothing: antialiased } .opt { -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0) } input:-webkit-autofill { -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 0px 1000px white inset!important; } /*HTML5*/ address, blockquote, figure, figcaption, footer, header, legend, pre { display: block; } .mobile-only { display: none!important; } .for-screen-768 { display: none!important; } .hide-image { display: none!important; } .center-text { text-align: center!important; } /*************************Main Page Structure*******************************************/ .body-class { /*Controls of all pages (not pop-ups) */ margin: 0px; padding: 0px; } .head-inner { /*Inner constraints of header - set to site width */ position: relative; z-index: 40; } .showare-nav-inner { /*Inner constraints of showare navigation block - set to site width*/ position: relative; z-index: 50; } .content-wrap{ min-height:700px; } .content-inner { /*inner constraints of main content- set to site width*/ position: relative; } .foot-wrap { /*page-wide wrap of footer area*/ clear: both; } .foot-inner { /*inner constraints of footer*/ position: relative; z-index: 50; } .control-wrap { /*wraps controls (search, calendar, categories, etc...) - height set by jquery in HTMLFooter*/ position: absolute; } /***********************************additional controls for objects within control-box set (search-box on default.asp)***********************/ .main-container { /*MAIN AREA*/ padding: 10px; } .info-box.membership-info-box { margin: 0px; margin-bottom: 10px; } .info-box { /*style for all information boxes - highlight areas*/ padding: 10px; margin-bottom: 10px; margin-top: 10px; box-sizing: border-box; } .price-box { width: 100%; box-sizing: border-box; } .select-seats-wrap { padding: 1em 0; } .select-seats-instructions, .will-call-instructions, .seat-expiration-instructions { display: block; padding: .5em 0; } .select-seats-wrap img#seatmapImage { max-width: 100%; } .sw-block-list { /*building block for psuedo-tables*/ list-style: none; margin: 0px; padding: 0px; } /***************************************************************** Inputs and Controls - defaults *****************************************************************/ input, select, button, textarea { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } input[type="radio"], input[type="checkbox"] { background: none; box-shadow: none; border: none; } input.showare-text, textarea.showare-textarea { display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.43em; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; } input:-ms-input-placeholder { color: #999; } .shorter-inline { display: inline-block!important; width: 30%!important; } .donate-onbehalf-textfield { display: inline-block!important; width: 35.5%!important; } input.showare-text.has-error { border-color: #a94442; } select.showare-select { /*display: block;*/ width: 63%; height: 34px; padding: 6px 12px; padding-right: 30px; font-size: 14px; line-height: 1.43em; color: #555; background-color: #fff; border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; -moz-appearance: none; -webkit-appearance: none; background-image: url("../images/select_down.png")!important; background-repeat: no-repeat!important; background-position: right center!important; } select.showare-select::-ms-expand { display: none; } select[name="monthexp"] { width: 49%!important; display: inline-block!important; float: left; } select[name="yearexp"] { width: 49%!important; display: inline-block!important; float: right; } label.showare-radio-label, .showare-checkbox-label { padding-left: 20px; line-height: 1.43em; display: inline-block; } label.showare-radio-label input.showare-radio, label.showare-checkbox-label input.showare-checkbox { margin-left: -20px; position: absolute; } input.showare-text:focus, select.showare-select:focus { border-color: #66afe9; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); } input.showare-text[disabled], select.showare-select[disabled] { background-color: #eee; cursor: default; } input, select { /*default styling for textboxes, slectboxes, etc styling for inputs*/ color: #666; background-color: #fff; border: 1px solid #ccc; padding: 3px; } input[type="radio"], input[type="checkbox"] { background: none; box-shadow: none; border: none; } .showare-nav { /*main navigation list*/ list-style-type: none; margin: 0px; padding: 0px; } .showare-nav li { float: left; padding: 0px; margin: 0px; } .showare-nav li a { display: block; } .showare-nav li.login-link, .showare-nav li.basket-widget { float: right; } .button { /*class applied to all buttons - this will inherit some rules from the general input selector above*/ border: none; /*remove default borders*/ display: inline-block; white-space: nowrap; text-align: center; cursor: pointer; margin-bottom: .5em; text-decoration: none!important; padding: 7px 1.5em; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; font-family: Roboto, Arial, sans-serif; } .button:hover { text-decoration: none!important; } .standard-button { line-height: 15px; font-size: .8em; padding: 4px; padding-right: 7px; padding-left: 7px; } .button.small-button { line-height: 1em; font-size: .95em; padding: 3px; padding-right: 4px; padding-left: 4px; text-shadow: none; } .button.full-button { box-sizing: border-box; width: 100%; } .button.half-button { box-sizing: border-box; width: 49%; } .button.half-button.button-left { float: left; } .button.half-button.button-right { float: right; } .buy-tickets, .buy-button { padding: 5px; padding-left: 8px; line-height: 1em; } .basket a.buy-more-button {} .redirect { /*aditional styles for redirect buttons*/ color: #C00; } .button.facebook-button { background: #3b5998!important; border: 1px solid #2d4373!important; padding: 13px 14px; } .button.facebook-button:hover { background: #2d4373!important; } .button.twitter-button { background: #55acee!important; border: 1px solid #2795e9!important; padding: 13px 14px; } .button.twitter-button:hover { background: #2795e9!important; } .sw-button-cancel{ background:#B71C1C!important; border:1px solid #D50000!important; color:#fff!important; } .create-account-block .button.half-button { font-size: 14px!important; } .button .social-button-icon { height: 1.3em; margin-right: 1em; margin-top: -.05em; margin-bottom: -.25em; } .header-logo-image { /*main header logo*/ border: none; margin: 0px; padding: 0px; } table .button { float: none !important; /*remove float for buttons inside tables*/ } .button-container.center-buttons { text-align: center; } /* Input with + and - buttons on either side, as seen on orderticketsarea page with quickpick categories*/ .input-with-incremental-buttons .button { width: 20%; background: #eee; color: #333; border: 1px solid #eee; height: 34px; padding: 0 !important; line-height: 34px; text-align: center; font-weight: 800; float: left; clear: none; box-shadow: none; margin-bottom: 0px; } .input-with-incremental-buttons .button:hover:not(.disabled){ background: #f5f5f5; color: #333; border: 1px solid #eee; } .input-with-incremental-buttons .button.disabled, .input-with-incremental-buttons .button.disabled:hover { opacity: .3; background: #eee; color: #333; border: 1px solid #eee; } .input-with-incremental-buttons .qty-small-text { width: 50%; margin: 0 5%; float: left; text-align:center; } /*************************FONTS and Headings***************************/ .control-box .heading-text { margin-top: -5px; } .sub-head { font-weight: 700; } h2 a { /*featured events event titles*/ margin: 0px; margin-bottom: 5px; } h3 { /*Performance list event and performance titles*/ margin: 0px; font-size: 1em; font-weight: normal; } .small-text { font-size: .9em; } .copyright-text { font-weight: 300; font-size: .8em; } .checkout-message-bottom-container { margin-top: 20px; margin-right: inherit; margin-bottom: 20px; margin-left: 10px; } .checkout-ticketfee-description-container { margin-top: 20px; margin-right: inherit; margin-bottom: 20px; margin-left: 10px; } .checkout-agree-container { text-align: right; } #checkoutWrap #agree, #checkoutWrap #MailingList { float: left; margin: 2px 1em 0 1em; } .agree-text { font-weight: 700; } .agree-text, .mailing-list-text { display: block; padding-left: 3em; } .checkout-donation-order-total-wrap { font-size: 1.3em; } .other-donation-label {display: inline-block; padding-right: 5px; float: left;white-space: nowrap;padding-top: 5px;} .other-donation-box {display: inline-block; padding-left: 5px; float: left;} .error-message { /*Error text default*/ Display: block; background-color: #ffd; background-position: left top; background-repeat: no-repeat; padding: 10px; min-height: 40px; vertical-align: center; color: #a94442 !important; border: 1px solid #a94442; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-top: 5px; margin-bottom: 5px; } .error-message.floating-error { display: inline-block; position: absolute; z-index: 900; right: 0px; bottom: 30px; min-height: 2em; line-height: 2em; padding: 0 1em; box-shadow: 1px 1px 3px RGBA(0, 0, 0, 0.4); } div.checkbox-error .error-message.floating-error { left: 5px; bottom: 1.5em; margin: 0px; max-width: 50%; } .error-message.floating-error::after { z-index: -1; position: absolute; top: 100%; left: 15%; max-width: 50%; content: ''; width: 0; height: 0; border-top: solid 7px #ebccd1; border-left: solid 7px transparent; border-right: solid 7px transparent; } div.confirm-message, span.confirm-message { /*Confirm (green) text default*/ Display: block; background-color: #d4edda!important; background-position: left top; background-repeat: no-repeat; padding: 10px 18px!important; min-height: 40px; vertical-align: center; Color: #155724 !important; border: 1px solid #c3e6cb!important; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-top: 5px; margin-bottom: 5px; } .alert-message{ /*Alert (yellow) text default*/ Display:block; background-color:#fcf8e3; background-position:left top; background-repeat:no-repeat; padding:20px; vertical-align:center; Color:#9B3E00 !important; border:1px solid #fbeed5; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-top:5px; margin-bottom:5px; } .seatmap-message-warn, .seatmap-message-notify, .seatmap-message-alert{ padding:10px; border-radius:5px; border: 1px solid #eee; background:#efefef; color:#666; } .seatmap-message-warn{ background:#fcf8e3; color:#9B3E00; border-color:#fbeed5; } .seatmap-message-alert{ background:#fee; color:#a94442; border-color:#a94442; } /************************************************* Block lists DONATIONS, MEMBERSHIPS, FEATURED EVENTS, venues *************************************************/ /*********************************************************************** VENUE LISTING ***********************************************************************/ .venue-listing-item { position: relative; } .venue-listing-venue-info { display: inline-block; float: left; width: 30%; } .venue-listing-link-wrap { position: absolute; right: .5em; top: .5em; } .venue-listing-description { max-width: 50%; margin-left: 30%; } /*********************************************************************** EVENT/Custom LISTING ***********************************************************************/ .featured-items, #swCustomListings { /*div wraps all featured events*/ margin-top: 10px; margin-bottom: 10px; } .custom-list-item h2 a{ font-size:2em; margin-top:0; } .custom-listing-image { float: right; margin-left: 10px; margin-bottom: 10px; box-sizing: border-box; max-width: 100%; } .featured-items-item, .custom-list-item { /*div wraps individual event items in featured events*/ padding: 10px; margin-bottom: 5px; } .constrain-image { padding: 0px; max-width: 100%; } .gutter-left-container-gutter { float: left; width: 30%; margin-right: -310px; } .gutter-left-container-main { float: right; width: 65% } .featured-items .info-box { box-shadow: none; background: transparent; color: inherit; } .featured-items-item .streaming-note, .pl-item .streaming-note{ font-size: 1.2em; line-height:1em; display: block; text-align: right; padding: .25em 0; } .pl-item .streaming-note{ font-size:1.2em; } @media screen and (max-width: 1024px) { .featured-items-item .streaming-note, .pl-item .streaming-note{ text-align:center; } .custom-listing-image { width: 100%; max-width: 100%; } .custom-list-item .button { display: block; width: 100%; font-size: 1.5em; margin: 0.5em 0; } } #donations-wrap { padding: 10px; } #membership-wrap {} /*********************************************************************** MEMBERSHIP FORM ***********************************************************************/ #membership-form { padding: 10px; } .membership-label-button div:first-child { border-radius: 2px; -moz-transition: all .4s; -o-transition: all .4s; -webkit-transition: all .4s; transition: all .4s; text-indent: 0px; margin-bottom: 10px; padding-left: 10px; cursor: pointer; } .membership-label-button input[type=radio] { float: right; margin: 1em; display: none; } .membership-label-button h2.heading-text { display: inline-block; margin: 0px; padding: 5px; padding-left: 0px; } .membership-detail-link, .membership-detail-link.button { /*memberships.asp in my account pages*/ float: right!important; margin-right: 5px; } .membership-label-button div:first-child { padding: 10px 0px; } .variable-amount { padding: 5px 0px; } .level-select-label { cursor: pointer; width: 90%; } /*********************************************************************** DONATION FORM ***********************************************************************/ #donations-form-wrap { margin: 20px 0px; } #donations-wrap .info-box { color: inherit!important; background: transparent; box-shadow: none; } .dim { zoom: 1; filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; } #donations-form-wrap .donation-text { font-weight: normal; font-style: italic; margin-left: 0px; width: auto; display: block; padding-top: 5px; } .donation-controls { margin-top: 20px; } label span.req { color: #c00; } #donate-now-wrap { display: none; padding-top: 10px; margin-top: 10px; } #donate-now-wrap label { font-weight: normal; display: inline-block; padding: 12px 10px 5px 0px; min-width: 120px; } .custom-label { display: inline-block; margin-right: .5em; font-weight: bold; } .donation-onbehalf-container { padding: 20px 0px; } .donation-radio { padding: 0 1em .3em 0; display: inline-block; } .donate-anonymous-text { display: inline-block; padding-bottom: 3px; } .donation-mobile-currency { display: inline-block; padding-right: 5px; font-weight: bold; } .donate-non-featured { padding-top: 20px; } #donate-form dt, #donate-form dd { line-height: 1em; padding: .5em 0; } .donation-column { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 50%; } .donation-column.column-left { float: left; padding-right: 3em; border-right: 1px solid #eee; } .donation-column.column-right { float: right; padding-left: 3em; } .half-left-box { display: inline-block; width: 49%; float: left; } .half-right-box { display: inline-block; width: 49%; float: right; } .divfullwidth { width: 100%; float: none; } /*Promoters Page TODO: Fix to featured styles*/ .promoter-image { float: left; margin-right: 10px; margin-bottom: 10px; max-width: 100%; } .promoter-link { float: left; font-size: 1em; padding-right: 20px; width: 30%; color: inherit; text-shadow: none; } .promoter-event-date { float: left; padding-right: 20px; width: 30%; } .promoter-event-venue { float: left; margin-right: -200px; width: 20%; } .promoter-event { box-shadow: none!important } /**********************Calendar, Locations, Search, Information and Advertisment Controls******************************/ #headerCalendar{ font-size: 10px; } .ui-dialog * { background: none!important; } .ui-dialog{ z-index: 10000; } .ui-dialog[aria-describedby="confirmSpecialSeating"] .ui-dialog-titlebar { display: none!important; } .ui-dialog .ui-dialog-titlebar-close {font-size: 11px!important; width: 40px;} .ui-dialog-buttonset .ui-widget {font-size: 12px; padding: 4px 8px!important;} .ui-widget-content {z-index: 999999;} .search-text { float: left; width: 128px; margin-right: 2px; padding-right: 27px; } #searchButton { margin: 0px; padding: 0px; margin-left: -34px; margin-top: 5px; background: none!important; filter: none; border: none!important; box-shadow: none!important; outline: none; height: 24px; width: 24px; text-indent: -99999px; background-image: url("../images/searchIcon.png")!important; background-repeat: no-repeat; background-position: center center; } .control-box select.showare-select { width: 100%; } #performancesDiv { float: left; } #bundleCalendar{ text-align: center; } #bundleCalendar .calendar-object{ display:inline-block; } #performancesDiv .bundle-performance-select { width: 100%; } .ads-control .ad-image { /*contols default ad images, banners recieve the addotional class .banner-image*/ margin: 10px; display: block; overflow: hidden; } .reporting-link { text-decoration: underline; font-size: 0.75em; padding-bottom: 20px; padding-top: 20px; display: block; text-align: center; } /*************************************************Basket*******************************************/ /* - basket psuedo table - 20% cell base, 1% padding base - Padding and border should be part of cell size - ALL rows contain 5 columns, mergers include padding and borders */ #loading-body { position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; background: RGBA(0, 0, 0, 0.85); z-index: 99; } #loading-body .loading-box { color: #eee!important; font-size: 2.5em; font-weight: bold; margin: 3em; text-align: center; } #loading-body .loading-box i.loading-icon { padding: 0 1em; animation-name: spin; animation-duration: 4s; animation-iteration-count: infinite; } .heard-about-container { text-align: center; } #checkoutComplete #heard-about { float: right; } .basket .basket-space { padding: .5em; } .basket-legend { font-weight: bold; opacity: .8; } .basket-cell { display: inline-block; max-width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 1%; vertical-align: top; } .coupon-form { max-width: 100%; vertical-align: top; } #couponList { list-style: none; float: left; clear: left; margin: 0px; padding: 0px; margin-top: -2px; } .entered-coupon { border-radius: 2px; border: 1px solid #0a0; float: right; padding: .25em 1em; margin: 0 1em .25em 0; background: #fff; color: #666; } .coupon-value { font-weight: bold; text-transform: uppercase; } .new-pricing-note { color: #0a0; } .basket-event a { font-size: 1.2em; } .basket .item-checkbox { width: 10%; text-align: center; margin-right: -10%; /*checkbox sits in padding, to prevent wrapping*/ } .basket-all-toggle, .basket-remove-btn { float: right; margin: 0px; } .basket-event { padding: 1%; } .checkout-confirm-basket tr.basket-header.small-text td { padding-top: 1em; } /************************************************************************************ New Patron ************************************************************************************/ .patron-form { padding: 2em 5em; } .patron-column { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 50%; } #username-error .error-message { width: 50%; line-height: 1.2em; padding-top: .5em; padding-bottom: .5em; } .patron-column.column-left { float: left; padding-right: 3em; border-right: 1px solid #eee; } .patron-column.column-right { float: right; padding-left: 3em; } .patron-form .patron-info { padding-top: 1em; } .patron-form div.no-mobile { /* These fiels exist but are not necisarry, they can be unhidden in the custom stylesheet if necissary, but should never show on mobile. */ display: none; } .patron-form-footer { margin-top: 2.5%; } .patron-form-footer div { margin: .5em; } .patron-form label.patron-info-label { width: 100%; display: block; text-align: left; padding: .75em 0 .25em 0; white-space: nowrap; } .patron-form input.showare-text, .patron-form select.showare-select { width: 100%; margin-right: 0px; max-width: 100%; } .patron-info .patron-info-label { width: 100%; text-align: left; display: inline-block; opacity: 0.8; padding: 1em 0 .25em 0; font-weight: 700; } .patron-upsale-block { margin: .5em 0; padding: .5em 0; } .patron-upsale-block #memberships-wrap dt, .patron-upsale-block #memberships-wrap dd { line-height: 1em; padding: .5em 0; } .patron-upsale-block .donation-info label.showare-radio-label { font-weight: bold; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 20%; } .patron-upsale-block #donations-form-wrap span.donation-text { opacity: 0.8; margin-left: 0px; padding: 0px; float: left; padding-right: 2em; font-style: italic; font-weight: 400; } .patron-upsale-block .level-item label.level-select-label, .patron-upsale-block dt label.level-select-label { line-height: 1.43em; } .patron-upsale-block #donations-form-wrap #other-box { margin-top: .5em; margin-bottom: .25em; } /*memberships*/ .membership-legend-title, .basket-membership-item .level-name { width: 70%; } .membership-legend-price, .basket-membership-item .level-price { width: 20%; text-align: right; } .membership-item-short-description {} .membership-label-button div:first-child:hover, .membership-label-active div:first-child { background: RGBA(0, 0, 0, 0)!important; } .basket-membership-item .level-price { font-weight: bold; } .basket-membership-item .change-price-anchor { float: left; } /*tickets*/ .ticket-legend-title { width: 65%; } .basket-apply-all-wrap { padding: 0 1%; text-align: right; } .basket-ticket-item .ticket-cell { width: 40%; } .basket-ticket-item .price-code-select { width: 35%; text-align: left; border: none; } .basket-ticket-item .price-code-select.narrow-select { width: 25%; } .pricingcode-dropdown { width: 100%; padding-left: .5em; height: 3em; line-height: 3em; } .ticket-legend-fees, .basket-ticket-item .ticket-fees { width: 15%; text-align: right; } .ticket-legend-total, .basket-ticket-item .ticket-total { width: 10%; text-align: right; } .basket-ticket-item .ticket-total { font-weight: bold; } .basket-total-changed-note { width: 20em; float: right; padding-bottom: 1em; } .basket-item-updated-alert { line-height: 3em; font-weight: bold; opacity: 0; color: #0a0; position: absolute; text-shadow: 1px 1px 1px RGBA(255, 255, 255, 0.2); animation-name: updated; animation-duration: .8s; animation-iteration-count: 1; } .item-remove { cursor: pointer; } .basket-delivery-options, .basket-ticket-fee-desc { font-size: .85em; } .basket-footer-left-cell { float: left; width: 30%; box-sizing: border-box; padding: 10px; } .basket-footer-right-cell { float: right; width: 65%; box-sizing: border-box; padding-bottom: 10px; } @media screen and (max-width: 1024px) { .basket-footer-left-cell, .basket-footer-right-cell, .basket-total-wrap, .basket-processing-fee-wrap { width: 100%!important; float: none!important; } } /*donations*/ .donation-legend-title, .basket-donation-item .donation-campaign { width: 50%; } .donation-legend-behalf, .basket-donation-item .donation-behalf { width: 30%; border: none; } .donation-legend-amount, .basket-donation-item .donation-amount { width: 10%; text-align: right; } .basket-donation-item .donation-amount { font-weight: bold; } /*coupon, apply all, and baset footer*/ .coupon-cell { display: inline-block; width: 90%; padding: 1%; text-align: right; } .coupon-block .half-left-box label { line-height: 1rem; } #priceCodeForm .half-right-box .unlock-button { margin-left:.5em; margin-top:15px; } .coupon-block .unlock-button { margin-left: .5em; margin-top: -1px; } .coupon-block { margin-bottom: .25em; } .coupon-block-left { width: 30%; float: left; clear: left; } .coupon-unlock-btn, .basket-remove-btn { width: 10%; text-align: center; border: none!important; } .basket-remove-btn { width: 100%!important; text-align: right!important; } .basket-processing-fee-wrap, .basket-total-wrap { box-sizing: border-box; padding-right: 10px; padding-bottom: .5em; float: right; width: 65%; } .basket-processing-fee-label, .basket-total-label { width: 80%; text-align: right; } .basket-processing-fee, .basket-total { width: 20%; text-align: right; font-weight: bold; margin-right: -100px; } .basket-total { text-decoration: underline; font-size: 1.2em; } #basket .button-container { margin: 2em 0; } .basket-footer { padding: 0 20%; font-size: .8em; } .cc-image { margin-right: 10px; } .sw-fees-list { margin: 0px; padding: 0px; list-style: none; white-space: nowrap; width: 100%; } .sw-fees-list .fees-item, .sw-fees-list .pricing-code .pricing-code-price { display: inline-block; width: 4em; } .sw-fees-list .pricing-code { text-align: right; width: 100%; } .ticket-and-fees-actual-price { font-weight: 500; } .basket td.ticket-cell { position: relative; } .basket div.price-code-select { display: inline-block; white-space: nowrap; } .basket-legend { vertical-align: bottom; } .pricing-code-select-controls, .pricing-code-select-messages { height: 35px; vertical-align: middle; line-height: 35px; } /*All-In Pricing - show/hide fees and total value items*/ .sw-fees-list, .ticket-legend-fees { transition: opacity .2s; } .basket-hide-fees .sw-fees-list, .basket-hide-fees .ticket-legend-fees { opacity: 0; height: 0px; overflow: hidden; } /******************************Gift Card Object************************************************************/ .gift-card-wrap { padding: 10px; width: 80%; margin: 1em auto; } .gift-card-add-container { width: 80%; margin: 0 auto; } .gift-card-cell { display: inline-block; } .gift-card-info-row { padding: .5em 0; } .gift-card-remove-button { float: right; margin: .5em; } .gift-card-number { width: 30%; } .gift-card-balance { width: 30%; } .gift-card-status, .gift-card-remove-check { width: 20%; } .gift-card-remove-check { text-align: center; margin-right: -5%; } .gift-card-add-wrap { line-height: 30px; } .gift-card-image { float: left; margin-right: 1em; } #btnaddgc { float: right; } /****************************** CHECKOUT PAGE - CONFIRMATION AND BILLING *******************************/ .checkout-selection-summary, .active .checkout-selection-summary { max-height: 0px; opacity: 0; overflow: hidden; padding: 0px 1em; background-color: #fff; -moz-transition: max-height 300ms cubic-bezier(0.165, 0.84, 0.44, 1), padding 300ms cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: max-height 300ms cubic-bezier(0.165, 0.84, 0.44, 1), padding 300ms cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transition: max-height 300ms cubic-bezier(0.165, 0.84, 0.44, 1), padding 300ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: max-height 300ms cubic-bezier(0.165, 0.84, 0.44, 1), padding 300ms cubic-bezier(0.165, 0.84, 0.44, 1); } .is-set .checkout-selection-summary { max-height: 1000px; opacity: 1; padding: .5em 1em; background-color: #fff; -moz-transition: max-height 450ms cubic-bezier(0.895, 0.03, 0.685, 0.22), padding 450ms cubic-bezier(0.895, 0.03, 0.685, 0.22); -o-transition: max-height 450ms cubic-bezier(0.895, 0.03, 0.685, 0.22), padding 450ms cubic-bezier(0.895, 0.03, 0.685, 0.22); -webkit-transition: max-height 450ms cubic-bezier(0.895, 0.03, 0.685, 0.22), padding 450ms cubic-bezier(0.895, 0.03, 0.685, 0.22); transition: max-height 450ms cubic-bezier(0.895, 0.03, 0.685, 0.22), padding 450ms cubic-bezier(0.895, 0.03, 0.685, 0.22); } .active.is-set .checkout-selection-summary { max-height: 0px; opacity: 0; overflow: hidden; padding: 0px 1em; background-color: #fff; -moz-transition: max-height 300ms cubic-bezier(0.165, 0.84, 0.44, 1), padding 300ms cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: max-height 300ms cubic-bezier(0.165, 0.84, 0.44, 1), padding 300ms cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transition: max-height 300ms cubic-bezier(0.165, 0.84, 0.44, 1), padding 300ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: max-height 300ms cubic-bezier(0.165, 0.84, 0.44, 1), padding 300ms cubic-bezier(0.165, 0.84, 0.44, 1); } .checkout-selection-summary-details { position: relative; display: block; min-height: 40px; } .checkout-selection-summary-details .selection-summary-name { font-weight: bold; font-size: 1.2em; display: block; } .checkout-selection-summary-details .selection-summary-description { font-size: .8em; font-style: italic; display: block; } .checkout-selection-summary-button { position: absolute; padding: .45em 1em; width: 110px; right: 0px; top: 0px; z-index: 999; } #checkoutPayment.is-set .checkout-selection-summary { padding-top: .5em; } #checkoutPayment .checkout-selection-summary-details #paymentDescriptionSelectedSummary { padding-bottom: 1em; } ul#active-giftcard-list-summary { margin: 0px; padding: 0px; list-style: none; } /* cubic-bezier(0.895, 0.03, 0.685, 0.22); - IN cubic-bezier(0.165, 0.84, 0.44, 1) - OUT */ .section-heading { /*this should inherit all of .heading-text, and be adjusted appropriately*/ font-size: 1.2em; font-weight: bold; display: block; margin-bottom: .25em; } #checkoutWrap { /*min-height: 1000px;*/ } .checkout-summary-wrap { float: right; width: 40%; padding: .5em; } .checkout-form-wrap { float: left; width: 55%; padding: .5em; margin-right: -5%; } .checkout-form-wrap a:not(.button), .checkout-summary-wrap a:not(.button) { color: #666; text-decoration: underline; } .checkout-form-item { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 0px 1px 4px RGBA(0, 0, 0, 0.4); -webkit-box-shadow: 0px 1px 4px RGBA(0, 0, 0, 0.4); box-shadow: 0px 1px 4px RGBA(0, 0, 0, 0.4); margin-bottom: 1.5em; padding: 0; background: #fff!important; color: #333!important; } .heading-text.checkout-form-header { cursor: pointer; width: 100%; border:none; text-align:left; border-bottom: 1px solid #eee; background: #F6F6F6; color: #333; padding: .25em 0; text-indent: .5em; margin: 0px; margin-bottom: 0px; border-radius: .25em; } .step-number { text-shadow: none!important; margin-top: -1px; display: inline-block; } .step-enum { background: #333; display: inline-block; color: #fff; -moz-border-radius: 2em; -webkit-border-radius: 2em; height: 28px; width: 29px; padding: 0; margin: 0; text-align: center; border-radius: 2em; text-indent: 0px; font-size: .8em; line-height: 29px; } .step-enum .fa { display: none; } .is-validated .step-enum { background: #0a0; } .is-validated .step-enum .step-number { display: none; } .is-validated .step-enum .fa { display: inline-block; margin-top: 4px; } .checkout-form-item-content { padding: 0 1em; } .checkout-form-item-content, .shipping-wrap, #deliveryAddressForm, #deliveryAddressList, #billingAddressList, #billingAddressForm, #giftCardForm { overflow: hidden; max-height: 0px; margin-top: 0px; opacity: 0; -moz-transition: max-height 400ms cubic-bezier(0.165, 0.84, 0.44, 1), margin 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22); -o-transition: max-height 400ms cubic-bezier(0.165, 0.84, 0.44, 1), margin 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22); -webkit-transition: max-height 400ms cubic-bezier(0.165, 0.84, 0.44, 1), margin 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22); transition: max-height 400ms cubic-bezier(0.165, 0.84, 0.44, 1), margin 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22); } .active .checkout-form-item-content, .shipping-wrap.show-shipping, #deliveryAddressForm.show-form, #deliveryAddressList.show-form, #billingAddressList.show-form, #billingAddressForm.show-form, #giftCardForm.show-form { max-height: 3000px; margin-top: .5em; overflow: hidden; opacity: 1; -moz-transition: max-height 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22), margin 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22); -o-transition: max-height 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22), margin 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22); -webkit-transition: max-height 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22), margin 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22); transition: max-height 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22), margin 400ms cubic-bezier(0.895, 0.03, 0.685, 0.22); } /*prevent wordy messages from pushing the place order button off the page*/ .confirmation-message-wrap { max-height: 2300px!important; } #deliveryDescriptionSelectedSummary { max-width: 65%; display: inline-block; } .checkout-form-item-content hr { display: block; border-top: 1px solid #ddd; border-bottom: 1px solid #eee; margin: 1em -1em; width: 120%; } .delivery-method-item { position: relative; width:100%; display:block; text-align:left; background:#fff; border: 1px solid #eee; padding: .5em; margin-bottom: .5em; cursor: pointer; -moz-transition: background .4s; -o-transition: background .4s; -webkit-transition: background .4s; transition: background .4s; padding-left: 64px; border-radius: 3px; min-height: 62px; } .delivery-method-item:hover { background: #f5f5f5; } .delivery-method-item.active { background: #00a8e1; border: 1px solid #00a8e1; color: #fff; } .delivery-method-item.active .delivery-method-price { color: #fff; } .delivery-method-item.active svg.sw-icon { fill: #fff; } .delivery-method-item svg.sw-icon { height: 40px; width: 40px; position: absolute; top: 12px; left: 12px; fill: #333; } #___plusone_0 { height: 28.3px!important; width: 50px!important; border-radius: 2px; overflow: hidden; margin-left: -.5px!important; } #___plusone_0 iframe { zoom: .0!important; -webkit-transform: scale(1.19); -webkit-transform-origin: 0 0; -moz-transform: scale(1.19); -moz-transform-origin: 0 0; -o-transform: scale(1.19); -o-transform-origin: 0 0; transform: scale(1.19); transform-origin: 0 0; height: 28px!important; } .delivery-method-name, .delivery-method-price { font-weight: 700; font-size: 1.2em; } .delivery-method-price { display: inline-block; color: #4caf50; float: right; padding-right: 1em; } a.delivery-method, a.delivery-method:hover { text-decoration: none; font-size: 1.2em; display: block; line-height: 1.5em; } .delivery-method-description { display: block; margin: .5em 0; } .delivery-method-description p { margin: 0; } .checkout-main-label, .checkout-address-input, .checkout-address-form input.showare-text, .checkout-address-form select.showare-select { margin-bottom: .5em; } .cancel-button { margin-right: .5em; } .form-button-wrap { clear: both; padding: .5em; } .form-button-wrap .button { float: right; } .address-list-item .form-button-wrap { padding: .5em 0px; } .address-list-item .form-button-wrap .button { float: left; } .checkout-main-label { width: 40%; clear: left; display: none; } .checkout-cc-label, .checkout-cc-input, .checkout-cc-input, .checkout-cvv-input, .checkout-cc-exp { margin-bottom: .5em; } .checkout-cc-label { display: inline-block; width: 40%; } .checkout-cc-input { width: 55%; } .checkout-cc-input::-ms-clear { display: none; } #AcceptedCCTypesContainer { float: left; margin-top: -.5rem; margin-right: -2px; } .ui-AcceptedCCTypesContainer-nopaypal.ui-AcceptedCCTypesContainer {float: left!important;} .ui-AcceptedCCTypesContainer-nopaypal {float: right!important;} .ui-AcceptedCCTypesContainer-label {display: inline-block; float: left; padding-right: 15px; width: 120px; clear: left;} #AcceptedCCTypesContainer img.cc-accepted-image { float: right; margin-right: .25rem; height: 26px; margin-bottom: 5px; } .card-icon { position: absolute; right: 0px; top: 0px; font-size: 1.5em!important; width: 2em; height: 1em; line-height: 1.6em!important; text-align: center; -moz-transition: color .4s; -o-transition: color .4s; -webkit-transition: color .4s; transition: color .4s; } .card-error { color: #a00; } .card-valid { color: #0a0; } .checkout-cc-exp { width: 25%; text-align: center; } .checkout-cvv-input { width: 55%; float: left; } .cvv-info { height: 34px; padding: 0; border-left: 1px solid #ccc; width: 2.5em; line-height: 41px; text-align: center; margin-left: -2.5em; z-index: 9999; position: absolute; color: #333; cursor: pointer; top: 0px; right: 0px; } #giftCardSummaryWrap { margin-top: .5em; } .giftcard-add-button, .giftcard-input { float: right; clear: right; } .giftcard-total-balance-available { padding-right: 1em; } .active-giftcards { list-style: none; padding: 0px; margin: 0px; } .active-giftcard-item { font-size: 1.3em; padding: .25em 0; margin: .25em 0; } .active-giftcard-number { display: inline-block; width: 40%; font-weight: bold; } .active-giftcard-balance { float: right; border: none; } .active-giftcard-total { float: right; border: none; font-weight: bold; } .active-giftcard-remove { float: right; border: none; background-color: inherit; cursor: pointer; } .checkout-form-note { font-style: italic; opacity: .8; } .billing-wrap { clear: both; } #currentShippingAddress, #currentBillingAddress { line-height: 1.4em; padding: .5em 0 0; float: left; } .checkout-address-form.show-form, .shipping-selected-address, .checkout-address-list.show-form { margin-bottom: 3em; } .checkout-address-buttons { float: right; width: 40%; padding-right: .5em; } .checkout-address-buttons .button { width: 100%; margin-bottom: .25em; } .address-list-item { float: left; width: 30%; margin-right: .5%; } .checkout-action-wrap { clear: both; } .checkout-action-wrap .sw-button-primary { float: right; margin-bottom: 1em; } .checkout-donation-button { margin-bottom: .25em; } input.button.checkout-donation-button.round-to-next { font-size: .80em; } .checkout-form-wrap .checkout-donation-button { width: 32.3%; margin-right: 1% } .heard-about-container { text-align: left; } #heard-about-label { display: block; margin-bottom: .5em; } .checkout-donation-image{ max-width: 32.3%!important; width: 32.3%!important; height: auto; margin-right: 1%!important; } .blank-image-donation {width: 0!important} /*Summary Items*/ .checkout-summary-item {} .summary-item-detail { display: block; } .ticket-item-set, .donation-item-set, .membership-item-set { -moz-box-shadow: 0px 1px 4px RGBA(0, 0, 0, 0.4); -webkit-box-shadow: 0px 1px 4px RGBA(0, 0, 0, 0.4); box-shadow: 0px 1px 4px RGBA(0, 0, 0, 0.4); -moz-border-radius: .25em; -webkit-border-radius: .25em; border-radius: .25em; overflow: hidden; margin: .5em 0; background: #fff!important; color: #333!important; } .checkout-basket-item, .checkout-basket-header { margin-bottom: 0px; background: #fff; padding: .75em 1em; } .checkout-basket-header { background: #f6f6f6; border-bottom: 1px solid #eee; -moz-border-radius: .25em .5em 0 0; -webkit-border-radius: .25em .5em 0 0; border-radius: .25em .5em 0 0; } .checkout-bundle-show{ float:right; text-decoration:underline!important; cursor:pointer; } #BundleTicketContainer{ display:none; } #BundleContainer.show-contents #BundleTicketContainer{ } #AdditionalItemsHeader{ padding:.75em 1em; font-weight:bold; } .checkout-basket-item-details { float: left; width: 60%; } .checkout-basket-item-details .seat-info { font-size: 1.1em; font-weight: bold; margin: .2em 0px; } .checkout-basket-item-details .section-name { font-size: 1.1em; } .checkout-basket-item-details .category-name, .checkout-basket-item-details .price-info { font-size: .8em; } .checkout-basket-item-total { float: right; min-width: 25%; text-align: right; font-weight: bold; font-size: 1.4em; list-style: none; margin: 0px; padding: 0px; padding-left: .5em; } .show-fees-link { text-align: right; display: block; clear: right; cursor: pointer; font-size: .75em; } .item-fees-item { opacity: 0.8; text-align: right; font-size: .8em; display: none; } .item-exp-time { opacity: 0.8; font-size: 1em; clear: right; display: block; } .event-title, .performance-title, .fund-title, .membership-title, .checkout-basket-total-label { display: block; font-size: 1.2em; text-decoration: none!important; } .performance-title { border-bottom: 1px solid #eee; } .venue-name, .performance-date, .performance-time { font-style: italic; opacity: 0.8; } .checkout-basket-total-label { display: inline; opacity: 0.8; } .minor-label, .minor-total { font-size: 1em; } .checkout-basket-total { margin-top: 1em; text-align: right; font-weight: bold; font-size: 1.2em; } .disabled { color: #999; cursor: auto; } .checkout-basket-total.final-total { margin-top: .5em; padding-top: .5em; border-top: 2px solid #333; } a.checkout-edit-link { color: inherit; text-decoration: underline; float: right; } .mobile-only-maintain-space { opacity: 0; } .giftcard-input { width: 30%; float: left; margin-right: 0px; } .giftcard-add-button { padding: .45em 0!important; width: 110px; } .error-message.drop-in-message { box-sizing: border-box; min-height: 0px; overflow-y: auto; opacity: 0; display: block; max-height: 0px; padding: 0 1em; height: 0px; -moz-transition: max-height 250ms cubic-bezier(0.895, 0.03, 0.685, 0.22), padding 250ms cubic-bezier(0.895, 0.03, 0.685, 0.22), opacity 200ms; -o-transition: max-height 250ms cubic-bezier(0.895, 0.03, 0.685, 0.22), padding 250ms cubic-bezier(0.895, 0.03, 0.685, 0.22), opacity 200ms; -webkit-transition: max-height 250ms cubic-bezier(0.895, 0.03, 0.685, 0.22), padding 250ms cubic-bezier(0.895, 0.03, 0.685, 0.22), opacity 200ms; transition: max-height 250ms cubic-bezier(0.895, 0.03, 0.685, 0.22), padding 250ms cubic-bezier(0.895, 0.03, 0.685, 0.22), opacity 200ms; margin: 1em 0; } .error-message.drop-in-message.show-me { height: auto; opacity: 1; padding: .5em 1em; max-height: 500px; margin-bottom: 22px; margin-top: 0px; border: solid 1px #ebccd1!important; } /*drop in message for delivery is in the parent object which has no padding*/ #checkoutDelivery .error-message.drop-in-message.show-me { margin-right: 1em; margin-left: 1em; } .has-error { background: RGBA(255, 0, 0, 0.1); } .heading-text.summary-head { border-bottom: 1px solid #eee; background: #F6F6F6; padding: .25em 0; text-indent: .25em; margin: 0px; margin-bottom: 0px; } a.change-link { border: 1px solid #ccc; padding: .25em .5em; border-radius: 3px; margin: .25em 0; text-decoration: none!important; cursor: pointer; } /******************************Misc. objects************************************************************/ .button.cell-header-button{ box-sizing:border-box; width:100%; margin:0; padding:.25em 1em!important; text-align:left; border-radius: 3px 3px 0 0; } .address-container { text-align: center; } .address-box { display: inline-block; text-align: left; padding: 20px; vertical-align: top; width: 250px; } .google-translate-object { position: absolute; top: 0px; right: 0px; z-index: 90; } span.custom-field-message { padding-left: 30%; display: block; margin-left: 1em; padding-right: 15%; } #checkout-finished-header { box-sizing: border-box; padding: 20px; padding-left: 100px; font-weight: 700; font-size: 12px; } #checkout-finished-message { box-sizing: border-box; padding: 20px; } #checkout-finished-header img.checkout-finished-checkbox-image { margin-left: -80px; float: left; } #checkout-finished-header span.checkout-line { display: block; } #checkout-finished-header span.checkout-finished-thank-you { color: #31aa39; font-size: 18px; font-weight: 400; } #checkout-finished-header span.checkout-finished-order-number { font-weight: 500; margin-bottom: 0px; } .checkout-finished-button-wrap { padding: 10px; text-align: right; } .create-account-block .checkout-finished-button-wrap { margin-top: 2em; padding: 0px; } .checkout-finished-split-block { box-sizing: border-box; width: 100%; padding: 20px; } .create-account-block { display: none; } .checkout-finished-block-wrap.show-create-account-block { position: relative; display: flex; } .checkout-finished-block-wrap.show-create-account-block .checkout-finished-split-block { width: 49%; } .checkout-finished-block-wrap.show-create-account-block .create-account-block { display: block; float: left; } .checkout-finished-block-wrap.show-create-account-block .share-block { float: right; margin-left: auto; } .checkout-finished-button-wrap .button { vertical-align: top; } .checkout-finished-button-wrap .full-button { vertical-align: top; padding: 14px; } .ticket-info-performance { padding: .5em 0; border-bottom: 1px solid #eee; } .paypal-button.paypal-button-shape-pill { border-radius: 8px!important; } .theme-label { display: block; /*inline-block;*/ padding: 1em 0 .25em 0; } .theme-custom-field-set { padding-bottom: 1em; border-bottom: 1px solid #eee; margin-bottom: 1em; } span.theme-ticket-info-notes { display: block; margin-top: .5em; margin-bottom: 0px; font-size: .9em; font-style: italic; } span.ticket-info-section, span.theme-ticket-info-type { display: inline-block; width: 30%; float: left; } .bundle-quantity-form { padding-top: 15px; } .bundle-quantity-form label { padding-bottom: 5px; display: block; } .bundle-quantity-form .showare-text { max-width: 20em; } .access-restricted-wrap, .access-denied-wrap { padding:.4em 1em; } .access-restricted-wrap .sw-icon-alert { margin-right: 10px; vertical-align: middle; margin-top: -5px; fill: #a00; } .access-password-form-wrap { width:230px; margin:0px; display: inline-block; margin-right: 20px; float: left; } .restrict-button-wrap { display: inline-block; float: left; margin-top: 2px; } .access-password-form-wrap input{ margin-top: 5px; } .accessdenied-headingtext { margin-bottom: 20px!important; } .restrict-button-continue { float: left; margin-right: 15px; } .membership-type-name { display: table-cell; height: 100%; vertical-align: middle; float: left; line-height: 28px; } .active-members-login-wrap { padding-top: 15px; } .access-restricted-wrap ul.access-restricted-membership-list { padding: 0px; } .access-restricted-wrap ul.access-restricted-membership-list li.access-restricted-membership-item { max-width:700px; padding: 0px .25em 0px 0px; margin:.25em 0 7px 18px; line-height: 25px; } #performanceSelect { padding: 0 1em; } li.access-restricted-membership-item .button { float: right; margin: 0px; } /************************************************* HTML Styles *************************************************/ .redFont { color: #cc0000; } .greenFont { color: #00cc00; } .orderNumber { font-size: 1.2em; font-weight: bold; } hr { /* Title line color */ border: 0; height: 1; } .horizontal-rule-wrap { border-bottom: 1px solid #666; position: relative; height: 1px; overflow: visible; margin: 2em 0px; } .horizontal-rule-text { position: absolute; width: 2em; border-radius: 50%; text-align: center; line-height: 2em; background: #666; top: -1em; left: 50%; margin-left: -1em; color: #fff; } .error-message { border: solid 1px #ebccd1; background: #f2dede; color: #a94442; padding: 10px; margin: 1em auto 1em auto; } .float-right { float: right !important; } .text-align-right { text-align: right!important; } .cc-container { display: block; padding: 10px 0; } /*OrderTickets Pages*/ .quickpick-price-wrap, .quickpick-quantity-wrap { float: left; margin-right: 2.5%; margin-top: -2px; max-width: 320px; } .quickpick-quantity { max-width: 10em; } .quickpick-button { margin-top: 17px; margin-right: 0px; padding: unset; } .button.no-mobile.sw-button-muted { } .quickpick-price-wrap label.ticket-price-label, .quickpick-quantity-wrap label.number-of-tickets-label { font-weight: bold; line-height: .8em; display: inline-block; margin-bottom: 5px; } .order-tickets-area-messages { padding: 2em 0; } .order-tickets-area-button-wrap { padding: 1em 0; text-align: center; } /************************************************* SeatMaps *************************************************/ #seatmap-wrap { overflow: auto; text-align: center; position: relative; margin-top: 1em; width: 100%; } #seatmap-inner { position: relative; transition: font-size .4s; display: inline-block; overflow: visible; min-height: 3em; margin-bottom: 1em; margin-left: 1em; } .button.seatmap-zoom { font-size: 2em; height: 1em; width: 1em; line-height: 1em; clear: none; margin: .5em .5em 0px; } .seatmap-zoom-in { float: right; } .seatmap-zoom-out { float: left; } #seatmap-navigation-wrap { position: relative; } .seatmap-navigation-control { position: absolute; z-index: 90; display: inline-block; } .seatmap-navigation-control .seatmap-navigation-arrow { /*seatmap navigation arrows*/ content: ""; display: inline-block; height: 0px; width: 0px; position: absolute; text-align: center; z-index: 91; border: 1em solid #fff; /*border color determines the arrow color and should be inherited from the control itself in style.css*/ border-color: inherit; cursor: pointer; } #seatmapUp, #seatmapDown { left: 50%; top: 0px; width: 4em; height: 1.5em; margin-left: -2em; } #seatmapUp .seatmap-navigation-arrow { border-top: none; border-left: 1em solid transparent; border-right: 1em solid transparent; margin: .25em 1em; } #seatmapDown .seatmap-navigation-arrow { border-bottom: none; border-left: 1em solid transparent; border-right: 1em solid transparent; margin: .25em 1em; } #seatmapLeft, #seatmapRight { height: 4em; width: 1.5em; margin-top: -2em; } #seatmapLeft { left: 0px; } #seatmapLeft .seatmap-navigation-arrow { border-left: none; border-top: 1em solid transparent; border-bottom: 1em solid transparent; margin: 1em .25em; } #seatmapRight { right: 0px; } #seatmapRight .seatmap-navigation-arrow { border-right: none; border-top: 1em solid transparent; border-bottom: 1em solid transparent; margin: 1em .25em; } /*floating container*/ #seatmap-floating-container { position: absolute; padding: .5em; left: 0px; top: 0px; z-index: 50; display: none; pointer-events: none; margin-left: 1.5rem; margin-top: -1rem; text-align: left; min-width: 10em; } .seatmap-floating-container-label { display: inline-block; width: 80px; } .special-seating-wrap, .seatmap-status-legend { box-shadow: none; text-align: center; border: none; } #stage-field-indicator { text-align: center; font-size: 2em; font-weight: bold; line-height: 1.5em; margin: .25em auto; } /*seats and seatmap cells*/ .seat-container.seatmap-row-label { position: absolute; right: 100%; margin-right: -.5em; z-index: 10; display: inline-block; line-height: .35em; width: auto; white-space: nowrap; } .seat-container { display: inline-block; width: .7em; height: .7em; padding: .05em; margin: .05em; position: absolute; transition: font-size .2s ease-in-out; } .seat { z-index: 20; height: 80%; width: 80%; margin: 10%; } span.special-seating-identifier { line-height: 1em; display: inline-block; width: 100%; font-size: .5em; text-align: center; float: left; transition: opacity .3s; } .seat.off { cursor: pointer; } .seat.off:hover { background-repeat: no-repeat; } .seatmap-status-block, .special-seating-block, .seatmap-price-code-block { line-height: 1.5em; padding: 1%; width: 47%; } .special-seating-name, .seatmap-status-name, .seatmap-price-name { line-height: inherit; font-size: 1em; } .seatmap-status-label { display: block; font-weight: bold; width: 100%; text-align: left; margin-bottom: 5px; } .seatmap-status-legend-item, .seatmap-price-legend-item, .special-seating-item { box-sizing: border-box; line-height: 1.5em; display: inline-block; vertical-align: middle; padding: .5em; padding-left: 1em; min-width: 50%; float: left; text-align: left; } .seatmap-price-legend-item { min-width: 25%; } .seatmap-status-color-box, .seatmap-price-color-box, .special-seating-id { height: 1.5em; width: 1.5em; line-height: 1.5em; display: inline-block; float: left; margin-right: .25em; text-align: center; box-sizing: border-box; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .aisle-seat-background-image { max-width: 100%; max-height: 100%; } #confirmSpecialSeating { display: none; } #confirmSpecialSeating { padding: 1em; } #specialSeatingHeader { font-size: 1.2em; } #specialSeatingConfirm, #specialSeatingDecline { padding: 1.5em 2em; margin: 1em 2em; color: white; border-radius: 4px; border: 1px solid #eee; } #specialSeatingConfirm { background-color: #1B5E20!important; } #specialSeatingDecline { background-color: #D50000!important; } #specialSeatingButtons { text-align: center; } .seatTerms h3 { margin: 1em 0 0 0; font-size: 1.1em; } .seatTerms { display: none; } /************************************************* EventPerformances.asp && Performance Lists && Upcomming Events *************************************************/ .upcomming-events-wrap { /*full wrap of upcomming events*/ } .performance-list-table { font-size: 0.875em; margin-bottom: 10px; } .performance-list-item { /*div style for package and bundle items in performance listings*/ padding: 5px; padding-right: 5px; /*adjust for margins created by hidden cells in performance lists*/ /*clear excessive styling from info-box class*/ box-shadow: none; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; /*aditional styling can go below*/ } .package-item { /*specific class for package items in performance listings*/ } .hdrRow { color: #999; } .login-box { /*coupled with .info-box class to inherit site styles*/ margin: 0px; box-shadow: none!important; /*box shadow will put heavy load on animations*/ -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } .login-box .button { margin: 10px 10px 10px 0px; } .login-box .heading-text { font-size: 1.2em; } .login-form {} .login-form-row { position: relative; padding: .5em 0 .25em 0; } .login-form-row.login-buttons { padding: 1.5em 0 .25em 0; } .login-buttons .button { float: right; margin-left: .5em; } .button .lock-icon { margin-right: .5em; fill: #fff; } .guest-checkout-button-wrap { clear: both; float: right; padding-top: 1em; } .login-column .login-column-header { min-height: 100px; } .multiple-login .login-column { display: inline-block; } .multiple-login .primary-login-column { float: left; width: 55%; } .multiple-login .alternate-login-column { float: right; width: 35%; } .multiple-login .alternate-login-column .login-text { display: block; margin-bottom: 1em; } .multiple-login .multi-login-divider { position: absolute; left: 60%; top: 3em; bottom: 1em; border-left: 1px solid #ddd; width: 1px; } .alternate-login-column .facebook-button .social-button-icon { height: 18px; width: 18px; margin-right: .5em; } .multiple-login .alternate-login-column .button { margin-top: .5em; width: 100%; } .login-form-wrap { position: relative; width: 70%; margin: 1em auto 4em auto; } .login-form-wrap.multiple-login { width: 90%; margin: 1em auto 4em auto; } .login-welcome-text, .register-welcome-text { display: block; margin: 10px 0px; } .reg-checkbox { vertical-align: top; margin-left: 77px; margin-right: -96px; } .reg-message { display: inline-block; margin-left: 100px; } #login-registration-container { padding: 10px; } tr.plRow { padding: 10px } .plButton { vertical-align: bottom; } #epImage2 img { width: 100%; } .event-performances-right { /*wraps all right-side items in eventperformances.asp*/ width: 400px; float: right; margin-left: 10px; margin-right: 10px; } .event-performances-right img#img1 { max-width: 100%; box-sizing: border-box; } .main-container .event-performances-description { overflow: hidden; padding: 0px; } .main-container .event-performances-lower-left { overflow: hidden; padding: 1em 0px; } .main-container .event-performances-lower-right { overflow: hidden; padding: 1em 0px; } .main-container .event-performances-footer { overflow: hidden; padding: 1em 0px; } .related-events-wrap { position: relative; vertical-align: top; } .related-event { width: 30%; position: relative; min-width: 200px; display: inline-block; vertical-align: top; padding: 1%; text-align: left; margin: .5%; } .info-box.package-item { margin: 0px; } /********************************************************** Listin Page Styles ***********************************************************/ .listing-page-banner-image{ width:100%; } .listing-page-title{ float:left; padding-top:.75em; width:66%; } .listing-page-lists-wrap{ float:right; width:33%; } .listing-page-description-wrap{ float:left; clear:left; width:66%; } .listing-page-footer-wrap{ clear:both; } .listing-page-list{ padding:.75em 0; } .listing-page-list-item{ padding:.5em .25em; border-bottom:1px solid #ccc; } .listing-page-list-item-name{ font-weight:bold; font-size:1.2em; } .listing-page-list-item-details{ font-style:italic; opacity:0.8; } @media screen and (max-width: 660px) { .listing-page-title, .listing-page-lists-wrap, .listing-page-description-wrap{ float:none; width:100%; } } /*default performance list styles, custom lists should be set up below this set*/ /*keep responsive styling together with specific list styles to prevent confusion and clutter*/ .performance-list { margin-bottom: .5em; } .no-upcoming .heading-text, .no-upcoming .performance-list { display: none; } /**/ .performance-list .pl-item { -moz-transition: background-color .5s; -webkit-transition: background-color .5s; -o-transition: background-color .5s; transition: background-color .5s; padding: 5px; } .performance-list .pl-item.even-item {} .performance-list .pl-item:hover {} .performance-list .pl-header:hover { background-color: inherit; } .performance-list .pl-header { font-size: .9em; background: none; height: 1em; } .performance-list .pl-page-links { text-align: right; } .performance-list .pl-first-col { display: inline-block; width: 40%; float: left; } .performance-list .pl-second-col { width: 58%; float: right; } .performance-list .pl-event-name { font-size: 1.1em; font-weight: bold; margin-top: 0px; padding-top: 0px; width: 100%; } .pl-event-link { color: inherit; } .performance-list .pl-performance-name { opacity: 0.8; width: 100%; } .pl-venue, .pl-datetime { display:inline-block; font-size: 13px; } .pl-venue { display:inline-block; padding-bottom: .25em; } .pl-popup-link.no-show { display: none!important; } .performance-list .pl-sale-status, .package-item .pl-sale-status { float: right; color: #c00; font-weight: bold; padding: 0px 10px; } .performance-list .pl-description { display: none; } .performance-list .pl-date, .performance-list .pl-time, .performance-list .pl-venue { display: block; } .performance-list .pl-bottom { clear: both; } .qualifier-wrap{ background: RGBA(0,0,0,0.025); border-radius:4px; border:1px solid #eee; box-sizing:border-box; padding:10px 15px 0 15px; margin:5px -5px; } .performance-list .pl-note, .performance-list .qualifier-message, .package-item .qualifier-message { font-style: italic; float: right; padding-bottom: 10px; } .performance-list span.qualifier-message, .package-item span.qualifier-message { float: left; display: block; } .performance-list .qualifier-buy-button, .package-item .qualifier-buy-button{ float:right; margin-left:.5em; margin-bottom:9px; } .performance-list .qualifier-buy-button{ clear: left; } h2.event-header-performance-name .qualifier-name{ float:right; opacity: .6; text-shadow:none; } /* Date Block Type Performance List*/ .performance-list .pl-item.block-date-item { position: relative; min-height: 100px; padding: 10px 0px; padding-left: 115px; } .performance-list .pl-item.block-date-item .pl-date-block.multi-day-dates { display: none; } .performance-list .pl-item.block-date-item.is-multi-day .pl-date-block { display: none; } .performance-list .pl-item.block-date-item.is-multi-day .pl-date-block.multi-day-dates { display: block; } .performance-list .pl-item.block-date-item .pl-date-block { box-sizing: border-box; position: absolute; left: 5px; top: 0px; background: #333; color: #fff; padding: 5px; width: 100px; height: 100px; margin: 10px 0px; text-align: center; font-weight: 700; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; text-shadow: 0px 0px 6px RGBA(0, 0, 0, 0.9); overflow: hidden; } .performance-list .pl-item.block-date-item .pl-date-block .pl-weekday, .performance-list .pl-item.block-date-item .pl-date-block .pl-monthday, .performance-list .pl-item.block-date-item .pl-date-block .pl-month, .performance-list .pl-item.block-date-item .pl-date-block .multi-date, .performance-list .pl-item.block-date-item .pl-date-block .multi-day-date-divide { position: relative; z-index: 20; transition: opacity .5s, color 1s, text-shadow .5s; } .performance-list .pl-item.block-date-item .pl-date-block .pl-weekday { font-size: 28px; line-height: 25px; } .performance-list .pl-item.block-date-item .pl-date-block .pl-monthday { font-size: 50px; line-height: 40px; } .performance-list .pl-item.block-date-item .pl-date-block .pl-month { font-size: 22px; line-height: 25px; } .performance-list .pl-item.block-date-item.is-multi-day .pl-date-block.multi-day-dates .multi-date { line-height: 40px; font-size: 30px; } .performance-list .pl-item.block-date-item.is-multi-day .pl-date-block.multi-day-dates .multi-day-date-divide { line-height: 10px; } .performance-list .pl-item.block-date-item .button.qualifier-buy-button { float: right; margin-left: .5em; margin-bottom: 9px; width: auto; } .performance-list .pl-item.block-date-item .button, .performance-list .pl-item.block-date-item .pl-sale-status { display: block; width: 100%; box-sizing: border-box; text-align: center; margin-bottom: 10px; } .performance-list .pl-item.block-date-item .pl-first-col { width: 60% } .performance-list .pl-item.block-date-item .pl-second-col { width: 35%; border: none; } .performance-list .pl-item.block-date-item .pl-event-name { font-size: 28px; line-height: 26px; margin-bottom: 10px; } .performance-list .pl-item.block-date-item .pl-date-block-image { position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; opacity: .2; background-size: cover; background-position: center center; z-index: 10; transition: opacity .5s; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .performance-list .pl-item.block-date-item:hover .pl-date-block-image { opacity: 1; } .performance-list .pl-item.block-date-item .pl-date-block-image:hover { opacity: .2!important; } .performance-list .pl-item.block-date-item.has-image:hover .pl-date-block div.pl-weekday, .performance-list .pl-item.block-date-item.has-image:hover .pl-date-block div.pl-monthday, .performance-list .pl-item.block-date-item.has-image:hover .pl-date-block div.pl-month, .performance-list .pl-item.block-date-item.has-image:hover .pl-date-block .multi-date, .performance-list .pl-item.block-date-item.has-image:hover .pl-date-block .multi-day-date-divide { opacity: 0; pointer-events: none; } .performance-list .pl-date-block:hover div.pl-weekday, .performance-list .pl-date-block:hover div.pl-monthday, .performance-list .pl-date-block:hover div.pl-month, .performance-list .pl-date-block:hover .multi-date, .performance-list .pl-date-block:hover .multi-day-date-divide { opacity: 1!important; pointer-events: none; } /* Time Block Type Performance List*/ .performance-list .pl-item.block-time-item { position: relative; min-height: 100px; padding-left: 150px; } .performance-list .pl-item.block-time-item .pl-time-block.multi-day-dates { display: none; } .performance-list .pl-item.block-time-item.is-multi-day .pl-time-block { display: none; } .performance-list .pl-item.block-time-item.is-multi-day .pl-time-block.multi-day-dates { display: block; } .performance-list .pl-item.block-time-item .pl-time-block { box-sizing: border-box; position: absolute; left: 5px; top: 0px; background: #333; color: #fff; padding: 5px; width: 135px; height: 100px; margin: 10px 0px; text-align: center; font-weight: 700; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; text-shadow: 0px 0px 6px RGBA(0, 0, 0, 0.9); overflow: hidden; } .performance-list .pl-item.block-time-item .pl-time-block .pl-weekday, .performance-list .pl-item.block-time-item .pl-time-block .pl-time, .performance-list .pl-item.block-time-item .pl-time-block .pl-month, .performance-list .pl-item.block-time-item .pl-time-block .multi-date, .performance-list .pl-item.block-time-item .pl-time-block .multi-day-date-divide { position: relative; z-index: 20; transition: opacity .5s, color 1s, text-shadow .5s; } .performance-list .pl-item.block-time-item .pl-time-block .pl-weekday { font-size: 20px; line-height: 25px; } .performance-list .pl-item.block-time-item .pl-time-block .pl-time { letter-spacing: -2px; font-size: 30px; line-height: 40px; } .performance-list .pl-item.block-time-item .pl-time-block .pl-time span.show-end-time-1{ letter-spacing: -1px; font-size:16px; white-space:nowrap; } .performance-list .pl-item.block-time-item .pl-time-block .pl-month { font-size: 22px; line-height: 25px; } .performance-list .pl-item.block-time-item.is-multi-day .pl-time-block.multi-day-dates .multi-date { line-height: 40px; font-size: 30px; } .performance-list .pl-item.block-time-item.is-multi-day .pl-time-block.multi-day-dates .multi-day-date-divide { line-height: 10px; } .performance-list .pl-item.block-time-item .button:not(.qualifier-buy-button), .performance-list .pl-item.block-time-item .pl-sale-status { display: block; width: 100%; box-sizing: border-box; text-align: center; margin-bottom: 10px; } .performance-list .pl-item.block-time-item .pl-first-col { width: 60% } .performance-list .pl-item.block-time-item .pl-second-col { width: 35%; border: none; } .performance-list .pl-item.block-time-item .pl-event-name { font-size: 28px; line-height: 26px; margin-bottom: 10px; } /*performanceList Calendar*/ #epPerformanceList #eventCalendar { width: 17em; margin: 0em auto 1em auto; font-size:20px; } #epPerformanceList #plCalendar #calendarWidget { display: inline-block; } #epPerformanceList #plCalendar .heading-text, #epPerformanceList #plCalendar #calendarWidget a.close-widget { display: none; height: 0px; width: 0px; overflow: hidden; text-indent: -9999px; } /*category event view - featured event style*/ .featured-list .performance-list .pl-item:hover { background: none; } .featured-list .performance-list .pl-item { position: relative; background: none; } .featured-list .performance-list .pl-datetime, .featured-list .performance-list .pl-venue { display: none; } .featured-list .performance-list .pl-description { display: inline; } .featured-list .performance-list .pl-image { float: right; max-width: 400px; margin: 10px; margin-right: 0px; } .featured-list .performance-list .pl-first-col { width: 100%; } .featured-list .performance-list .pl-second-col { clear: right; } .featured-list .performance-list .pl-header { display: none; } /*eventperformances performance list view*/ #epPerformanceList .performance-list .pl-first-col, #epPerformanceList .performance-list .pl-second-col { float: none; width: auto; } #epPerformanceList .performance-list .pl-header { display: none; } #epPerformanceList .pl-item .button, .event-performances-right .button { min-width: 9em; } /************************************************* Performance/Event list items /*************************************************/ .load-more-button { display: block; text-align: center; margin-bottom: 1em; padding: 0px; } .load-more-button .sw-icon, .load-more-button .active-text { line-height: 2em; } .sw-icon-spinner { -webkit-animation: spin 3s linear infinite; -moz-animation: spin 3s linear infinite; animation: spin 3s linear infinite; text-decoration: none!important; } @-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } } @-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } } @keyframes spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes updated { from { left: 100.5%; opacity: 1; } to { left: 101%; opacity: 0 } } /************************************************* Orderticketsarea.asp/Seatmaps /*************************************************/ #ga-price-code-wrap { margin: 1em auto; border-top: 1px solid RGBA(126, 126, 126, 0.2); border-left: 1px solid RGBA(126, 126, 126, 0.2); border-right: 1px solid RGBA(126, 126, 126, 0.2); border-radius: 4px; max-width:600px; } #ga-price-code-wrap .ga-price-code-row { border-bottom: 1px solid RGBA(126, 126, 126, 0.2); padding: 1em; } #ga-price-code-wrap .price-code-cell { float: left; line-height: 32px; } #ga-price-code-wrap .quantity-cell { float: right; width: 35%; max-width: 175px } #ga-price-code-wrap .quantity-cell .button { width: 20%; background: #eee; color: #333; border: 1px solid #eee; height: 34px; padding: 0 !important; line-height: 34px; text-align: center; font-weight: 800; float: left; clear: none; box-shadow: none; margin-bottom: 0px; } #ga-price-code-wrap .quantity-cell .button.disabled { opacity: .3; } #ga-price-code-wrap .quantity-cell .qty-small-text { width: 50%; margin: 0 5%; float: left; } #ga-price-code-wrap .type-cell { width: 50%; font-weight: bold; } #ga-price-code-wrap .price-cell {} #ga-price-code-wrap .ga-price-code-row:last-of-type { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } @media screen and (max-width: 660px) { #ga-price-code-wrap .type-cell, #ga-price-code-wrap .price-cell { width: 50%; } #ga-price-code-wrap .price-cell { text-align: right; } #ga-price-code-wrap .quantity-cell { float: left; width: 100%; max-width: 100%; } } #seatmap-wrap { margin: 1em auto; } /*********************************************** My Account Page styles ************************************************/ .my-account-items { padding: 10px; } .account-header-info-container { padding: 10px; border-radius:4px; background: RGBA(0, 0, 0, 0.025); box-shadow: 0px 2px 4px RGBA(0, 0, 0, 0.3); margin-bottom: 40px; } .account-created-box, .account-updated-box { width: 35%; float: left; } .customer-credit-box { width: 35%; margin-top: 10px; padding-top: 14px; } .account-control { width: 30%; padding:10px; float: left; box-sizing:border-box; } .account-recent-orders, .account-upcoming-streams { width: 69.5%; padding:10px; float: right; box-sizing:border-box; } .account-holds, .account-memberships { padding: 2.5% 0; } .account-memberships .item-details { padding: 10px 0; } .account-links-list { list-style: none; margin: 0px; padding: 0px; } .account-links-list .button{ margin-bottom:0px; text-align:left; } @media (max-width: 1024px){ .account-links-list .button { text-indent:10px; } div.account-control{ width:100%!important; } ul.account-links-list li { padding: .2em 0 .2em 0; } } .account-links-list li { padding: .2em 1em .2em 0; } .account-links-list li a { display: block; } .patron-edit-middle-initial { display: none; } .patron-all-orders { float: right; padding: .2em .8em!important; margin-top: 10px; } .order-item-details-row { padding: 3px 0; } .required-fields-container { margin: 15px 0; } .addresslist-column { display: inline-block; float: left; padding: .5em; } .addresslist-primary-email { width: 15%; } .addresslist-name-email { width: 29%; } .addresslist-address { width: 27%; } .addresslist-edit-button { width: 22%; text-align: right; } .addresslist-header { padding-left: 7px; display: inline-block; font-weight: bold; } .header-titles { display: inline-block; font-weight: bold; } .addresslist-button-container { display: block; padding: 10px 0px 25px; } .orderslist-column { display: inline-block; float: left; padding: .5em; } .ol-order-number { width: 10%; } .tickets-status{ text-align:right; } .ol-delivery-method { width: 15%; } .ol-order-date { width: 17%; } .ol-first-performance { width: 17%; } .ol-order-total { width: 17%; text-align:right; } .ol-order-status { width: 13%; float: right; text-align:right; } .orderlist-items:nth-child(even) { background: RGBA(0, 0, 0, 0.2); } .orderlist-items:nth-child(odd) { background: RGBA(0, 0, 0, 0.25); } .orderdetail-header-box { padding: 10px; background: RGBA(0, 0, 0, 0.05); border:1px solid RGBA(0,0,0,0.1); border-radius:4px; margin-bottom: 40px; } .orderdetail-header { font-weight: bold; } .orderdetail-subheader { display: block; padding-top: 3px; padding-left: 3px; } .orderdetail-ordernumber { width: 30%; } .orderdetail-orderstatus { width: 30%; } .orderdetail-ordertotal { width: 30%; } .shipping-details { margin-right: 2%; width: 47%!important; } .billing-details { width: 47%!important; float: right!important; } #orders.order-detail { padding: 0 .75em; } #orders { padding: 0 .75em; } #accountOrderList .ol-order-number {width: 100%;} #accountOrderList .ol-delivery-method {width: 100%;} #accountOrderList .ol-order-date {width: 100%;} #accountOrderList .ol-first-performance {width: 100%;} #accountOrderList .ol-order-total {width: 100%; } #accountOrderList .ol-order-status {width: 100%; float: left; margin-right: 0;} #accountOrderList .orderdetails-left-column{float:left;font-size:16px;line-height:1.5em;padding:10px;} #accountOrderList .orderdetails-right-column{float:right;font-size:16px;line-height:1.5em;padding:10px;} #accountOrderList .orderslist-column{ padding:0px; } .billing-items { display: block; } #resaleTray .summary-item{ width:49%; margin-bottom:5px; } .ticket-resale-controls{ clear:right; padding-right:10px; } .order-detail .resell-ticket-button, .order-detail .cancel-resell{ float:right; position:relative; padding-left:40px; margin:0 10px; } .resell-ticket-button .select-icon-on, .cancel-resell .select-icon-on{ display:none; } .resell-ticket-button.sw-selected-button .select-icon-off, .cancel-resell.sw-selected-button .select-icon-off{ display:none; } .resell-ticket-button.sw-selected-button .select-icon-on, .cancel-resell.sw-selected-button .select-icon-on{ display:inline-block; } .orderdetails-list-li .resell-ticket-button i.fa, .orderdetails-list-li .cancel-resell i.fa{ font-size:26px; line-height:1px; position:absolute; left:10px; top:50%; } #resaleTray, #cancelTray, #ticketTransferTray{ position:fixed; box-sizing:border-box; bottom:0px; left:0px; right:0px; padding:20px 10px; box-shadow:0px -2px 4px RGBA(0,0,0,0.4); border-top:1px solid #eee; background:#fff; color:#333; margin-bottom:-300px; transition:margin-bottom 400ms cubic-bezier(0.165, 0.84, 0.44, 1); z-index:9999; padding-bottom:50px; } #ticketTransferTray{ margin-bottom:-700px; padding:20px; } #ticketTransferTray .heading-text{ margin-bottom: 10px; margin-top: 5px; } .transfersummary-item-wrap .row { margin-top: 8px; clear: both; } .transfersummary-item-wrap .row:after { content: ""; clear: both; display: block; } .transfersummary-item-wrap .row label { display: inline-block; float: left; padding-right: 10px; min-width: 150px; line-height: 34px; } h4.terms-heading { margin-top: 0px; margin-bottom: 10px; } #transfer-terms-conditions .button-wrap { padding: 10px; box-sizing: border-box; padding: 20px 10px 0; box-sizing: border-box; text-align: right; } .transfersummary-item-wrap .row input[type=text] { float: left; width: calc(50% - 150px); } #transfer-terms-conditions { margin-top: 20px; padding: 10px 20px; box-sizing: border-box; } .tickettransfer-fields-wrap { padding-top: 16px; } .label-as-button { background: #fff; color: #666; border: 1px solid #666; font-weight: 400; font-size: 15px; line-height: 18px; border-radius: 4px; background-color: transparent; text-transform: capitalize; transition: all .4s; padding: 6px .6em 3px; display: block; position: relative; padding-left: 35px; margin-bottom: 12px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .ticket-selected-totransfer { background: #449d44!important; color: #fff!important; border: 1px solid #398439!important; } .tickettransfer-labeltext { display: inline-block; vertical-align: top; margin-top: 1px; margin-left: 30px; } .transferticket-status-header { display: block; } .transferticket-status-email { display: block; } /* Start Customize Transfer ticket checkbox */ .label-as-button { background: #fff; color: #666; border: 1px solid #666; font-weight: 400; font-size: 15px; line-height: 18px; border-radius: 4px; background-color: transparent; text-transform: capitalize; transition: all .4s; padding: 6px 15px 10px; display: block; position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-align: left; max-width: 150px; margin-bottom: 0; margin-right: 0; float: right; } /* Hide the browser's default checkbox */ .label-as-button input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } /* Create a custom checkbox */ .transferticket-checkmark { position: absolute; top: calc(50% - 9px); left: 15px; height: 16px; width: 16px; border: 1px solid #ccc; } /* On mouse-over, add a grey background color */ .label-as-button:hover input ~ .transferticket-checkmark { background-color: #fff; } /* When the checkbox is checked, add a blue background */ .label-as-button input:checked ~ .transferticket-checkmark { background-color: #449d44; color: #fff; border: 1px solid #fff; } /* Create the checkmark/indicator (hidden when not checked) */ .transferticket-checkmark:after { content: ""; position: absolute; display: none; } /* Show the checkmark when checked */ .label-as-button input:checked ~ .transferticket-checkmark:after { display: block; } /* Style the checkmark/indicator */ .label-as-button .transferticket-checkmark:after { left: 5px; top: 2px; width: 3px; height: 7px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } /* End Customize Transfer ticket checkbox */ #resaleTray.show, #cancelTray.show, #ticketTransferTray.show, #transferCancelTray.show{ margin-bottom:0px; transition:margin-bottom 550ms cubic-bezier(0.895, 0.03, 0.685, 0.22); } #resaleTray .summary-item{ box-sizing:border-box; width:24%; float:right; margin:0 .5%; } #resaleTray .summary-item.selected-wrap{ font-size:20px; font-weight:bold; border-radius:5px; background:RGBA(0,0,0,0.025); border: 1px solid RGBA(0,0,0,0.1); padding:5px 20px; float:left; } #resaleTray .selected-cancel, #resaleTray .selected-submit{ padding-top:0px; } #resaleTray .summary-item .button{width:100%;} #orders li.box-list-item, #orders .tickets-list-events{ border-radius:4px; margin-bottom:10px; padding-top:10px; padding-bottom:10px; border:1px solid #eee; background:#fcfcfc; color:#333; box-shadow:0px 2px 4px RGBA(0,0,0,0.3); } #orders li.box-list-item.cancelled-item { box-shadow:none; opacity:0.5; } #orders li.orderdetails-header-titles{ background:none; border:none; padding:0px; box-shadow:none; } .donations-list { font-size: .9em; } .donation-promoter { width: 23%; } .donation-fund { width: 24%; } .donation-campaign { width: 23%; } .donation-amount { width: 13%; } .donation-status { width: 9%; float: right; } .tickets-list { font-size: .9em; } .tickets-location { width: 30%; } .tickets-pricing { width: 22%; } .tickets-fees { width: 15%; text-align: right; } .tickets-total { width: 10%; text-align: right; } .tickets-status { width: 15%; float: right; } .tickets-list-events { diplay: block; padding: 12px 0px; width: 100%; background: RGBA(0, 0, 0, 0.1); text-indent: 10px; } .orderdetails-item-total { display: none!important; } .tickets-totalfee-label { width: 69.1%; text-align: right; } .tickets-totalfee-amount { width: 10.3%; text-align: right; } .tickets-total-container { padding-top: 15px; } .tickets-total-container li.box-list-item{ background:none!important; box-shadow:none!important; border:none!important; } .tickets-order-total-box .orderslist-column { padding: .2em .5em; } #memberships-wrap label:first-of-type b { display: inline-block; margin-top: .5em; } .holds-button { float: right; padding-top: .25em; } #donationsForm .box-list-item-body { display: block; font-size: 1.2em; padding: .5em 0; clear: both; } #donationsForm .resend-button { float: right; } .membership-useage-legend { opacity: 0.8; font-weight: bold; border-bottom: 1px solid #eee; padding: .25em; } .membership-useage-left-col { width: 45%; float: left; } .membership-useage-right-col { width: 45%; float: right; } .membership-useage-items-item { padding: .15em .25em; background: RGBA(0, 0, 0, 0.025); } .membership-useage-items-item.even-item { background: RGBA(0, 0, 0, 0.01); } /*order details*/ .order-detail-info-wrap { vertical-align: top; } .item-details .detail-label-left { display: inline-block; width: 10%; opacity: 0.8; } .order-detail .block-text { display: inline-block; padding: 0 10px; } .order-detail-info-item { width: 31%; min-width: 200px; padding: 1%; display: inline-block; font-size: .85em; float: left; text-align: left; } .order-detail-info-wrap .order-detail-info-item{ padding:10px; border-radius:4px; } .order-detail-info-item .heading-text { font-size: 1.2em; } .sw-block-list .other-fees-content{ display:inline-block; float:left; padding:0 .5em; } .sw-block-list .other-fees-name{ width:30%; } .sw-block-list .other-fees-seat{ width:37%; } .sw-block-list .other-fees-price{ width:11%; text-align:right; font-size:.9em; } .show-details-link { width: 100%; display: block; text-align: right; line-height: 2em; } .show-details-link span.heading-text { float: left; } .valid-to { float: right; } .membership-contact-info { padding: 1em; } /************************************************* STREAMING CSS /*************************************************/ #showareVideo{width:100%;height:70vh} .orderstream h2 svg.streaming-icon{ vertical-align: top; height:1.15em; width:1.15em; margin-right:.25em; } .basket-item .seatmap-stream-wrap{ font-size:1.5em; } .basket-item .seatmap-stream-wrap svg{ vertical-align:middle; margin-top:-0.2em; } #CreateAccountStreamingInfo svg, .ticket-event-name-stream-indicator svg{ vertical-align:top; margin-top:.1em; } .launch-stream-button{ margin-top:-1.1em; } .inactive-stream{ display:none; } .stream-performance-name{ font-size:1.1em; } .stream-status, .stream-start-time{ margin-right:1em; padding-right:1em; border-right:1px solid #eee; } .stream-status{ font-weight:bold; color:#773; } .stream-status.off{ color:#a00; } .stream-status.on{ color:#0a0; } .launch-stream-button.disabled{ background:#ccc; border-color:#ddd; } .orderticketsvenue #OrderStreamButton{ float:right; } .orderticketsvenue #StreamingAddToCartWrap{ padding-right:351px; } .ordertickets .quickpick-form.has-streaming{ margin-bottom:0px!important; padding-bottom:.5em!important; } #StreamingAddToCartWrap .heading-text{ line-height:1.5em; } #StreamPrice{ font-size:1.5em; margin-right:1em; } #StreamPriceSelect{ width:220px; display:inline-block; } @media (max-width: 1250px){ .orderticketsvenue #StreamingAddToCartWrap{ padding-right:20%; } } @media screen and (max-width: 1024px){ #StreamPrice{ display:block; font-size:1.5em; margin-right:1em; margin-bottom:.5em; } #StreamPriceSelect{ margin-bottom:.5em; width:100%; } .account-upcoming-streams{ width:100%; } .launch-stream-button{ margin-top:.5em; } a.button svg.streaming-icon{ margin:.9em .1em; } .orderticketsvenue #StreamingAddToCartWrap{ padding-right:0px; } .ordertickets #OrderStreamButton{ padding: 7px 1.5em!important; margin-top:0; } } /************************************************* AGENCY and Promo CSS /*************************************************/ .agent-bar-element{ display:inline-block; margin-right:2em; padding:1em 0; } #PromoControlsWrap{ width:60%; float:left; } #PromoCodeInput{ width:calc(65% - 5px); display:inline-block; height: 34px; } #PromoApplyCodeButton{ float:right; max-width:34%; height: 34px; } #ActivePromoInfo{ width:34%; float:right; text-align:right; } @media (max-width: 1024px){ #PromoControlsWrap, #ActivePromoInfo{ width:100%; float:none; text-align:left; } #AgencyContainerWrap{ padding:0 1em; } } /************************************************* POPUP CSS /*************************************************/ #black-content { display: none; background: RGBA(0, 0, 0, 0.6); position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: 9999; } #black-content #draggable { height: 1px; width: 100%; } #draggable #popup-wrap { display: inline-block; position: relative; top: 100px; left: unset!important; margin-left: calc(50% - 175px)!important; padding: 0px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid #333; background: #fff; overflow: hidden; width: 350px; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { #draggable #popup-wrap { margin-left: -100px!important; } } .popup-close-icon { float: right; fill: #666; } .popup-close-icon .sw-icon.close-icon { height: 18px; width: 18px; } #popup-close:hover {} #popup-url { border-radius: 0px; box-shadow: none; background: transparent; display: none; } #popup-wrap #popup-head { display: block; font-size: 18px; line-height: 18px; font-weight: 300; padding: 10px; margin: 0px; background: #fff; border: none; border-bottom: 1px solid #eee; margin-bottom: 5px; cursor: default; cursor: pointer; text-shadow: none!important; } #draggable .popup-body { background: #fff; } .popup-body img { max-width: 100%; } .popup-body.default-font, .popup-body .heading-text {} .popup-bottom-close {} #popup-wrap #fetched { max-height: 500px; overflow-y: auto; overflow-x: hidden; padding: 0px 10px; box-sizing: border-box; width: 100%!important; } #popup-wrap .popup-bottom-close { width: 100%; margin: 0px; margin-top: 10px; width: 100%; -webkkit-border-radius: 0px!important; -moz-border-radius: 0px!important; border-radius: 0px!important; border: none!important; } /*hover modals*/ .hover-modal { position: relative; display: inline-block; } .hover-modal-container { position: absolute; left: 0px; box-shadow: 0px 3px 5px RGBA(0, 0, 0, 0.3); min-width: 400px; max-height: 400px; overflow-y: auto; display: none; z-index: 999; } .hover-modal-loading { display: block; height: 13px; width: 208px; background-image: url(../images/loadingAnimation.gif); background-repeat: no-repeat; } .hover-modal-over .hover-modal-container { bottom: 1em; } .hover-modal-under .hover-modal-container { top: 1em; right: 0px!important; left: auto; } /************************************************* FUZION Insurance CSS *************************************************/ .insurance_panel { font-size: 11px; font-family: Arial, Helvetica, sans-serif; } .insurance_panel .panel_header { background: #e6e6e6; padding: 3px; margin: 0 0 1px 0; } .insurance_panel .panel_body { background: #f5f5f5; } .insurance_panel .insurance_protection_img { padding: 3px; } .insurance_panel .insurance_protection_img div { background: #3630aa; color: #ffffff; width: 100px; height: 50px; text-align: center; } .insurance_panel .insurance_protection_right_column {} .insurance_panel .insurance_input_wrapper {} .insurance_panel .insurance_input {} .insurance_panel .highlight { background: #e6e6e6; } /********************************************* Remove Default buttons from number type fields for webkit browsers - display:none will crash chrome. *********************************************/ input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance: textfield; } /*********************************************** Basket Widget ************************************************/ li.basket-widget #ShoWareBasketWidget { padding: 0px; margin-right: 5px; margin-top: 0px; } .showare-nav li a.aria-basket-link{ height: 1px; width: 1px; position: absolute; opacity: 0; } li.basket-widget #ShoWareBasketWidget .cart-item { line-height: inherit; border-radius: 2px; } li.basket-widget #ShoWareBasketWidget .cart-item-pic { margin: 2px; } li.basket-widget #ShoWareBasketWidget .cart-item-desc { font-weight: bold; text-align: right; } li.basket-widget #ShoWareBasketWidget .cart-item-detail { z-index: 80; line-height: 12px; font-size: 24px; right: 0px; } li.basket-widget #ShoWareBasketWidget table td { color: #fff; } li.basket-widget #ShoWareBasketWidget .cart-item:first-child { margin-top: -1px; padding-top: 6px; } /*Fix for FB share that is out of line on mobile GEM:58666 */ div.fb-share-button > span {vertical-align: top!important;} /*Fix for callout bubble*/ #bubble-container .bubble a { white-space: normal!important; float: left; } .iframe-wrap iframe {height: 50px;} /*patches NOT applied to mobile*/ @media screen and (min-width: 1024px) { .featured-wrap, body.default .pl-wrap { padding: 1em; } } /*mobile style patches*/ @media screen and (max-width: 1024px) { @media screen and (-webkit-min-device-pixel-ratio: 0) { select, textarea, input { font-size: 16px!important; /*safari is the devil, and will zoom in and mess everything up without this*/ } } @media screen and (-webkit-min-device-pixel-ratio:0) { select:focus, textarea:focus, input:focus { font-size: 16px!important; /*safari is the devil, and will zoom in and mess everything up without this*/ } } #PromoApplyCodeButton { line-height: 2em; } .access-restricted-wrap ul.access-restricted-membership-list li.access-restricted-membership-item { max-width: 100%; } .restrict-button-wrap {display: block!important;width: 100%;} .iframe-wrap iframe {height: 50px;} .performance-list .pl-item.block-date-item { padding-bottom: 65px; min-height: 185px; } .performance-list .pl-item.block-date-item .button { width: auto; bottom: 0px; right: 5px; left: 5px; line-height: 50px; } .performance-list .pl-item.block-date-item div.pl-second-col { width: auto; padding-right: 1em; } .pl-item div.pl-second-col { padding-bottom: 10px!important; } .custom-label { display: block; padding-bottom: 5px; } .donation-mobile-currency { padding-top: 2px!important; } .membership-item-short-description { padding-left: 10px; padding-bottom: 10px; } .membership-label-button div:first-child { margin-left: 0px!important; padding: 10px; } .membership-label-button .variable-amount { margin-left: 0px!important; } .performance-list .pl-item.block-date-item.has-image:hover .pl-date-block div.pl-weekday, .performance-list .pl-item.block-date-item.has-image:hover .pl-date-block div.pl-monthday, .performance-list .pl-item.block-date-item.has-image:hover .pl-date-block div.pl-month, .performance-list .pl-item.block-date-item.has-image:hover .pl-date-block .multi-date, .performance-list .pl-item.block-date-item.has-image:hover .pl-date-block .multi-day-date-divide { opacity: 1; } .patron-edit-info { padding: 0 1em; } .checkout-selection-summary-details { min-height: 40px; } .event-performances-right #epPerformanceList { padding: .5em; } .related-events-wrap .related-event { width: 95%; margin: .15em 2.5%; box-sizing: border-box; } .alternate-address-button, .giftcard-add-button { margin-bottom: .5em; } .giftcard-add-button, .giftcard-input { margin-right: 0; width: 100%; padding: 0px; } .valid-to { clear: left; float: left; padding-top: 8px; } .checkout-form-item-content td { display: block; } .no-tablet { display: none!important; } .checkout-main-label { width: 100%; clear: left; } .is-set .checkout-selection-summary { max-height: 1000px; } .cancel-button { margin: .5em 0; } .button.small-button { padding: .5em 1em; } #checkoutWrap #AcceptedCCTypesContainer { margin-right: 0; } #checkoutWrap #AcceptedCCTypesContainer img.cc-accepted-image { float: left; margin-right: 0.25rem; margin-left: 0; margin-bottom: 5px; height: 26px; } #checkout-payment-form label.checkout-cc-label { width: 100%; } .checkout-basket-item-details { width: 50%; } div.checkout-selection-summary .checkout-selection-summary-button { right: auto!important; left: auto!important; margin-left: 0px!important; position: relative; } div.checkout-selection-summary-details { padding-bottom: 5px!important; } .selection-summary-details { display: block; padding-bottom: 5px!important; } .sw-nav { left: 0px!important; } .basket-item-updated-alert { display: none; } .button.add-coupon, #min-max-apply-button { line-height: 2em; } .coupon-cell ul { padding: 0px; width: 100%; } .entered-coupon { width: 100%; margin: 0px; } #calendarWidgetBundles, #performancesDiv { display: block; margin: 0px; float: none; } #calendarWidgetBundles { text-align: center; margin: 0px auto; } .checkout-finished-block-wrap.show-create-account-block .checkout-finished-split-block { width: 100%; float: none; } .checkout-finished-block-wrap.show-create-account-block { display: block; } #username-error.patron-new-error .error-message { margin: 1em 0; float: none; width: 100%; } .button svg.sw-icon { height: 1.2em; width: 1.2em; margin: .9em; } .login-form-row.login-buttons { margin-top: 0px; padding: .5em 0 .5em 0; } .login-form-row { clear: both; margin-top: 1em; } .login-form-row .login-label { display: inline-block; padding-bottom: .25em; } .login-form-row.alternate-login-column .button { clear: none!important; } .login-form-row .button { margin-top: .5em; } .login-form-row .forgot-password-link { clear: both; font-size: 1.5em; width: 90%; margin: 0 auto; text-align: center; display: block; padding: .5em; } .guest-checkout-button-wrap { width: 35%; } .patron-form { padding: 1em; } .patron-upsale-block .button { margin-bottom: .5em; } .shorter-inline { width: 84%!important; float: none!important; } .donate-onbehalf-textfield { width: 100%!important; float: none!important; } .donation-amount { width: 100%!important; float: none!important; } .donations-featured #donations-form-wrap { margin-top: 10px!important; } #donations-form-wrap .donation-text { margin-left: 0px; } .main-container .event-performances-description, .main-container .event-performances-lower-left, .main-container .event-performances-lower-right, .main-container .event-performances-footer { box-sizing: border-box; padding: .5em!important; } .package-item .button { line-height: 2em; margin: .5em auto; } .quickpick-price-wrap, .quickpick-quantity-wrap { width: 47.5%; float: left; margin: .25em 0; } .quickpick-quantity-wrap { margin-left: 5%; } .quickpick-button { float: right; width: 30%; margin-left: -10%; margin-top: 0; margin-right: 0px; } .quickpick-form, .select-seats-wrap, .order-tickets-area-messages { padding: 1em; } .basket-wrap, .basket-button-container { padding: 0 1em; } .basket-button-container .button { margin-bottom: .5em; } .addresslist-primary-email { width: 20%; } .addresslist-name-email { width: 38%; } .addresslist-address { width: 38%; } .addresslist-edit-button { width: 100%; } #frmaddresslist { padding: 0 .75em; } .bundle-quantity-wrap, .bundle-description-wrap, #events { padding: 0 1em; } .bundle-quantity-wrap .bundle-quantity-form .showare-text { max-width: 100%; } .ol-order-number {width: 14%;} .shipping-details {margin-right: 0%; width: 100%!important;} .billing-details {width: 100%!important; float: left!important;} .orderdetails-left-column {float: left; display: inline-block; width: 70%; margin: 0 0 0 1%;} .orderdetails-right-column {float: right; display: inline-block; width: 26%; text-align: right; margin: 0 1% 0 0;} .orderdetails-header-titles {display: none;} .orderslist-container .orderdetails-header-titles {display: block;font-size: 1em;} .orderlist-items { font-size: 1em; padding: 5px 3px;} .orderdetails-left-column .orderslist-column, .orderdetails-right-column .orderslist-column {padding: .2em .5em;} #resaleTray .summary-item{ width:49%; margin-bottom:5px; } .ticket-resale-controls{ padding:0 10px; } .orderdetails-list-li .resell-ticket-button, .orderdetails-list-li .cancel-resell{ margin:0px; } .orderdetails-list-li .resell-ticket-button i.fa, .orderdetails-list-li .cacel-resell i.fa{ font-size:42px; line-height:1px; position:absolute; right: auto; left: 10px; top:50%; } .ol-order-number {width: 100%;} .ol-delivery-method {width: 100%;} .ol-order-date {width: 100%;} .ol-first-performance {width: 100%;} .ol-order-total {width: 100%; } .ol-order-status {width: 100%; float: left; margin-right: 0;} .membership-promoter {width: 100%; float: left;} .membership-alias-type {width: 100%; float: left;} .membership-alias-level {width: 100%; float: left;} .membership-price {width: 100%; float: left; } .membership-benefit {width:100%; float: left;} .membership-status {width: 100%; float: left;} .donation-promoter {width: 100%; float: left;} .donation-fund {width: 100%; float: left;} .donation-campaign {width: 100%; float: left;} .donation-amount {width: 100%; float: left;} .donation-status {width: 100%; float: left;} .sw-block-list .other-fees-name, .sw-block-list .other-fees-seat{ clear:both; width:75%; font-size:.9em; } .sw-block-list .other-fees-price{ float:right; margin-right:1%; width:20%; } .tickets-location {width: 100%;} .tickets-pricing {width: 100%;} .tickets-fees {width: 100%; text-align: right;} .tickets-total {width: 100%; text-align: right;} .tickets-status {width: 100%; float: left;text-align: right;} .orderdetails-item-total {display: inline-block!important; margin-right: 10px;} .tickets-totalfee-label {width: 89.1%; text-align: right;} .tickets-totalfee-amount {width: 10.3%; text-align: right;} .ticket-resale-controls{ clear:both; width:100%; } .tickets-list-events{ text-indent:0px; padding:12px; } .pl-item .qualifier-wrap{ padding:.5em 5px; } .pl-item .button.qualifier-buy-button{ position: static; width:100%; margin:.5em 0px; } #ticketTransferButton.button { margin-right: 0px!important; margin-left: 0px!important; } } @media screen and (max-width: 768px) { h2.event-header-performance-name .qualifier-name{ float:none; display:block; } .button.add-coupon { margin-left: 0px; margin-top: .5em; } .coupon-block-left { width: 100%; } #couponList { width: 100% } .login-form-wrap.multiple-login .alternate-login-column, .login-form-wrap.multiple-login .primary-login-column { float: none; width: 100%; } .multiple-login .multi-login-divider { position: static; height: 1px; width: 100%; border-top: 1px solid #ddd; } .guest-checkout-button-wrap { width: 100%; padding-top: .5em; } #checkoutWrap #checkout-donation-options { padding-top: 1em; } #checkoutWrap #checkout-donation-options:before { content: ""; display: block; border-top: 1px solid #ddd; border-bottom: 1px solid #eee; margin: 1em -1em; width: 120%; } #AcceptedCCTypesContainer { float: right; padding-right: 0px; } #AcceptedCCTypesContainer img.cc-accepted-image { height: 20px; } #checkoutWrap .checkout-donation-button { width: 100%; margin-bottom: .5em; } .checkout-summary-wrap, .checkout-form-wrap, .address-list-item { width: 100%; float: none; } .checkout-delivery-details, .checkout-billing-details, .checkout-payment-details, .checkout-confirmation-total { display: none; } .mobile-only-maintain-space { opacity: 1; } .checkout-address-buttons { float: none; width: 100%; padding-right: .5em; } .checkout-address-buttons .button { width: 100%; margin-bottom: .25em; } #summaryAddressChangeLink { left: auto!important; right: 0px!important; } #tranSpeed { display: none; } .address-list-item { width: 100%; } .checkout-cc-label { width: 100%; } .checkout-cc-exp { width: 45%; } .sw-icon-lock { margin-right: 0; } .checkout-basket-item-details { width: 70%; } .patron-column { width: 100%!important; padding: 0px!important; margin: 0px!important; border: none!important; } .patron-upsale-block .donation-info label.showare-radio-label { width: 45%; } .shorter-inline { width: 100%!important; max-width: 100%!important; } .donation-amount { width: 100%!important; max-width: 100%!important; } #donate-now-wrap label { padding: 12px 10px 5px 0px; } .half-left-box { display: inline-block; width: 100%; } .half-right-box { display: inline-block; width: 100%; } .for-screen-768 { display: block!important; } .addresslist-primary-email { width: 98%; } .addresslist-name-email { width: 98%; } .addresslist-address { width: 98%; } .addresslist-edit-button { width: 100%; } .addresslist-header { display: none!important; } .donation-column { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; } .donation-column.column-left { float: left; padding-right: 0em; border-right: none!important; } .donation-column.column-right { float: right; padding-left: 0em; } /*.ol-order-number {width: 13%;} .ol-delivery-method {width: 15%;} .ol-order-date {width: 17%;} .ol-first-performance {width: 20%;} .ol-order-total {width: 20%; } .ol-order-status {width: 13%; float: right; margin-right: .5em;}*/ .orderdetail-ordernumber { width: 100%; } .orderdetail-orderstatus { width: 100%; } .orderdetail-ordertotal { width: 100%; } .tickets-totalfee-label { width: 84.1%; text-align: right; } .tickets-totalfee-amount { width: 15.3%; text-align: right; } .access-password-form-wrap { width: 100%!important; } .ui-PaypalLogos { margin-right: 0px !important; } .ui-AcceptedCCTypesContainer { margin-right: 0px !important; float: left !important; margin-bottom: 10px !important; padding-top: 0px !important; padding-bottom: 0px !important; } .orderdetails-left-column { float: left; display: inline-block; width: 48%; margin: 1% 0 0% 1%; } .orderdetails-right-column { float: left; display: inline-block; width: 48%; text-align: left; margin: 0% 0 1% 1%; } .transfersummary-item-wrap .row input[type=text] { width: 100%; } .tickettransfer-labeltext { white-space: nowrap; } .tickettransfer-fields-wrap .label-as-button { max-width: 100%; } } #PaypalLogos img { max-height: 26px; width: auto; } /*mobile only*/ @media screen and (max-width: 480px) { .item-details .detail-label-left{ width:auto; padding-right:1em; } #checkoutWrap span#AcceptedCCTypesContainer { float: left; clear:left; padding-top: .5em; padding-bottom: .5em; } #checkoutWrap span#AcceptedCCTypesContainer img.cc-accepted-image { float: left; margin-left: 0; margin-right: 0.25rem; margin-bottom: 5px; height: 26px; } .patron-upsale-block .donation-info label.showare-radio-label { width: 100%; } .account-links-list li { padding: .2em 1em .2em 0; float: left; width: 100%; } .orderdetails-left-column { float: left; display: inline-block; width: 96%; margin: 1% 0 0% 1%; } .orderdetails-right-column { float: left; display: inline-block; width: 96%; text-align: left; margin: 0% 0 1% 1%; } .orderdetails-list-li .orderdetails-left-column { float: none; display: block; width: 100%; margin: 0; } .orderdetails-list-li .orderdetails-right-column { float: none; display: block; width: 100%; text-align: right; margin: 0; } .orderdetails-list-li .tickets-fees{ text-align:left; } .orderdetails-list-li .tickets-fees .fees-item{ float:right; text-align:right; } .orderdetails-list-li .tickets-pricing .orderdetails-pricecode-name, .orderdetails-list-li .tickets-location .orderdetails-area-name{ float:left; } .orderdetails-list-li .tickets-pricing .orderdetails-pricecode-price, .orderdetails-list-li .tickets-location .orderdetails-seat-info{ float:right; } .orderslist-container .orderdetails-left-column { float: left; display: inline-block; width: 58%; margin: 0 0 0 1%; } .orderslist-container .orderdetails-right-column { float: right; display: inline-block; width: 38%; text-align: right; margin: 0 1% 0 0; } .tickets-totalfee-label { width: 75.1%; text-align: right; } .tickets-totalfee-amount { width: 24%; text-align: right; } #resaleTray .summary-item{ width:100%; } #ticketTransferTray .heading-text{ font-size: 20px; margin: 0; } .transfersummary-item-wrap .row label { line-height: 25px; } #transfer-terms-conditions .button-wrap .button { line-height: 2.4; } } /*For the share iframe, we're importing this stylesheet if they are not local, but the iframe is narrow by default, this results in this rather odd media querry*/ @media screen and (max-width: 450px) { .button.half-button { width: 100%!important; margin-bottom: .5em; } .iframe-wrap iframe {height: 110px;} .tickets-totalfee-label { width: 75.1%; text-align: right; } .tickets-totalfee-amount { width: 24%; text-align: right; } } @media only screen and (max-width: 1024px) { .quickpick-quantity-wrap.quickpick-buttons-wrap { max-width: 100%; width: 100% !important; margin-left: 0px !important; } .quickpick-price-wrap { max-width: 48%; } .quickpick-quantity-wrap { max-width: 48%; margin-left: 8px !important; float: right; } input#qpqty { border-radius: 4px; } select#qpqty { border-radius: 4px; } select.showare-select.quickpick-select-price { width: 100%; font-size: 12px!important } select.showare-select { height: 37px; } } /******* Small Screen Phone Adjustments ******/ @media only screen and (max-width : 320px) { #performancesDiv .bundle-performance-select {width: 90%;} #events .button.sw-button-primary { width: 90%; float: none!important;} .basket-ticket-item .ticket-total {display: none;} .multiple-login .multi-login-divider {margin-bottom: 15px;} .large-text {font-size: 28px;} .checkout-basket-item-total { font-size: 1.3em;} } .title-recent-orders { font-weight: bold; color: gray; height: 25px; } .paypal_btn { display: inline-block; font-family: inherit; font-size: 14px; font-weight: bold; color: #fff; text-align: center; padding: 10px 14px; margin: 0; background: #ff6600; border: 0; cursor: pointer; outline: none; } .paypal_btn:hover { background: #e05c04; } .paypal_btn { display: inline-block; font-family: inherit; font-size: 14px; font-weight: bold; color: #fff; text-align: center; padding: 10px 14px; margin: 0; background: #ff6600; border: 0; cursor: pointer; outline: none; } .paypal_btn:hover { background: #e05c04; } @media screen and (max-width: 490px) { .iframe-wrap iframe {height: 110px;} } @media screen and (max-width: 370px) { .ui-AcceptedCCTypesContainer-label {width: 100%!important; padding-bottom: 5px;} } /*pricing code payment restrictions*/ .ss-icon { display: inline-block; height: 1em; width: 1em; text-align: center; cursor: pointer; font-size: 20px; } .custom-tooltip-wrap{ background: #fff!important; color: black; } .custom-tooltip-inner{ background-color: #fff!important; color: black; padding: 2px 7px; font-size: 14px; font-family: 'Roboto', Arial, sans-serif; } @media screen and (max-width: 1024px) { .custom-tooltip-wrap{ -webkit-box-shadow:none!important;box-shadow:none!important; } .custom-tooltip-inner{ -webkit-box-shadow:0 0 5px #aaa;box-shadow:0 0 5px #aaa; padding: 10px; margin-top: -10px; } } /*CSS PERSONALIZADOS*/ .gateway-details { font-size: 0.7em; font-weight: normal; } .basket-toggle-fees{ /*Zoho: #10763*/ margin-top: 30px; } /*Para alinear el FB Widget en la pagina de la funcion*/ .fb_iframe_widget span{ vertical-align: top !important; } .sswacinvalidcode{ font-size: 22px; } .payment-method-item { position:relative; border: 1px solid #eee; padding: .5em; margin-bottom: .5em; cursor: pointer; -moz-transition: background .4s; -o-transition: background .4s; -webkit-transition: background .4s; transition: background .4s; padding-left:64px; border-radius:3px; min-height: 52px; } .payment-method-item:hover{ background: #f5f5f5; } .payment-method-item.active{ background:#00a8e1; border: 1px solid #00a8e1; color:#fff; } .payment-method-item.active .payment-method-price { color:#fff; } .payment-method-item.active svg.sw-icon{ fill:#fff; } .payment-method-item svg.sw-icon{ height:40px; width:40px; position:absolute; top:12px; left:12px; fill:#333; } .payment-method-name, .payment-method-price{ font-weight:700; font-size:1.2em; } .payment-method-price{ display:inline-block; color:#4caf50; float:right; padding-right:1em; } a.payment-method, a.payment-method:hover { text-decoration: none; font-size: 1.2em; display: block; line-height: 1.5em; } .payment-method-description{ display:block; margin:.5em 0; } .payment-method-description p{ } .whatsapp-dialog-content { display: flex; align-items: center; gap: 10px; padding: 15px 10px; } .whatsapp-icon { font-size: 28px; color: #25D366; } .whatsapp-message { font-size: 14px; color: #333; line-height: 1.5; } .custom-whatsapp-button { background-color: #25D366 !important; color: white !important; font-weight: bold; border: none; padding: 6px 12px; border-radius: 4px; } .whatsapp-card { border: 1px solid #25d366; background-color: #f6fffa; padding: 1em; border-radius: 10px; margin-top: 1em; } .whatsapp-header { display: flex; align-items: center; font-weight: bold; margin-bottom: 0.5em; color: #075e54; } .whatsapp-header i { color: #25d366; margin-right: 0.5em; font-size: 1.4em; } .whatsapp-card input { width: 100%; padding: 0.5em; font-size: 16px; border: 1px solid #ccc; border-radius: 6px; } /* Opciones de dropdown con texto recortado */ .country-code-dropdown option { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* Contenedor input adaptado con flex-wrap */ .whatsapp-input-container { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; background: #f8f8f8; padding: 8px 10px; border-radius: 8px; border: 1px solid #ccc; margin-top: 6px; } /* Estilos para los inputs y select */ .country-prefix-selector { padding: 6px 10px; border: 1px solid #ccc; border-radius: 6px; min-width: 200px; font-size: 14px; outline: none; } .whatsapp-number, .whatsapp-number-confirm { padding: 6px 10px; border: 1px solid #ccc; border-radius: 6px; font-size: 14px; outline: none; } .whatsapp-number { flex: 1; min-width: 120px; } .whatsapp-number-confirm { flex: 1 1 100%; min-width: 120px; } /* Ícono WhatsApp */ .whatsapp-input-container img { width: 20px; height: 20px; } /* En desktop, confirmación debajo del input número y alineado a la derecha */ @media (min-width: 600px) { .whatsapp-number-confirm { margin-left: auto; max-width: 100%; /* Resta prefijo + icono + gaps */ } } /* En móvil, los campos en columna */ @media (max-width: 480px) { .whatsapp-input-container { flex-direction: column; align-items: stretch; } .country-prefix-selector { width: 100% !important; } .whatsapp-number, .whatsapp-number-confirm { width: 100%; flex: unset; } } /* Enfoque de inputs */ .whatsapp-number:focus, .country-prefix-selector:focus, .whatsapp-number-confirm:focus { outline: none; border-color: #25D366; box-shadow: 0 0 3px #25D366; } /* Animación de resaltado fuerte */ @keyframes highlight-border-strong { 0% { border-color: #007956; box-shadow: 0 0 0 rgba(0, 121, 86, 0); border-width: 2px; } 50% { border-color: #004f39; box-shadow: 0 0 10px rgba(0, 121, 86, 0.8); border-width: 3px; } 100% { border-color: #004f39; box-shadow: 0 0 5px rgba(0, 121, 86, 0.8); border-width: 1px; } } /* Clase de animación inicial */ .whatsapp-highlight-strong { animation: highlight-border-strong .5s ease-in-out forwards; border-radius: 10px; transition: all 0.3s ease-in-out; } /* Clase persistente que conserva el foco visual */ .whatsapp-highlight-persistent { box-shadow: 0 0 5px rgba(0, 121, 86, 0.7) !important; border-radius: 10px; transition: all 0.3s ease-in-out; } /* Contenedor general de los indicadores */ .password-strength-indicators { margin-top: 10px; padding: 10px; border: 1px solid #ccc; border-radius: 5px; background-color: #f9f9f9; font-size: 0.9em; } /* Etiqueta superior */ .password-strength-indicators label { font-weight: bold; color: #333; margin-bottom: 5px; display: block; } /* Lista sin puntos */ .password-strength-indicators ul { list-style: none; padding: 0; margin: 0; } /* Elemento de lista individual */ .password-strength-indicators li { padding: 4px 0; color: #777; display: flex; align-items: center; } /* Icono antes del texto */ .password-strength-indicators li .icon { margin-right: 8px; font-size: 1.1em; font-weight: bold; min-width: 20px; text-align: center; color: red; } /* X roja por defecto */ .password-strength-indicators li .icon::before { content: '\2717'; /* X */ color: red; } /* Estilos para ítems válidos */ .password-strength-indicators li.valid .icon { color: green; } .password-strength-indicators li.valid .icon::before { content: '\2714'; /* Check */ color: green; } .password-strength-indicators li.valid .text { color: green; } /* Mensaje de éxito final */ #all-conditions-met { display: none; color: green; font-weight: bold; margin-top: 10px; display: flex; align-items: center; } #all-conditions-met .icon::before { content: '\2714'; color: green; margin-right: 8px; } /* --- Resumen de fortaleza --- */ #password-strength-bar { height: 10px; margin-top: 10px; background-color: #e0e0e0; border-radius: 5px; overflow: hidden; } #password-strength-fill { height: 100%; width: 0%; transition: width 0.3s ease; background-color: red; } #password-strength-text { margin-top: 5px; font-weight: bold; text-align: center; } /* RESPONSIVE */ @media (max-width: 600px) { .password-strength-indicators { padding: 8px; font-size: 0.85em; } .password-strength-indicators li { flex-wrap: wrap; } #password-strength-text { font-size: 0.9em; } }