/* Seating Chart Stuff */
.seatingPlaceMapDisplay { float:right; width:30%; margin-right:12px; }
.seatingPlaceMapDisplay .categories { width:100% }
.seatingPlaceMapDisplay .categories .price { text-align:right }

.categories tr.header td { font-weight:bold; text-align:left; padding-right:8px }
.categories .keyColor { border:1px solid #333; background:#ccc; width:12px; height:12px; line-height:1px; font-size:1px;  }
.categories .catName { padding-right:8px; } 

.seatingPlaceMapDisplay #selectSeatsReadout #selectSeats_seatCountWrap { margin-bottom:4px;}
.seatingPlaceMapDisplay #selectSeatsReadout #selectSeats_seatCount { float:right; } 
.seatingPlaceMapDisplay #selectSeatsReadout #selectSeats_totalPrice { float:right; }  

.seatingMapWrap { float:left; width:450px; }

.seatingMapAutoScroll { width:99%; overflow:hidden; overflow-x:auto; overflow-y:auto; max-height:400px; border:1px solid #ccc; margin-bottom:8px;   } 

.seatingMapWrap .stage { border:1px solid #333; background:#f1f1f1; padding: 4px; font-weight:bold; margin:auto; margin-bottom:16px; margin-top:16px; text-align:center; width:200px;  }
.seatingMapWrap .stage.stageRight { text-align: center; padding: 5px 20px 5px 10px; margin: 15px; float:right; width:15px; }
.seatingMapWrap .stage.stageLeft { text-align: center; padding: 5px 20px 5px 10px; margin: 15px; float:left; width:15px; }

.seatingPlaceMapMatrix { text-align:center; margin:16px 24px; }
.seatingPlaceMapMatrix .seatingPlaceMapRow { }
.seatingPlaceMapMatrix.seatsCenter .seatingPlaceMapRow { margin:auto; }
.seatingPlaceMapMatrix.seatsRight { text-align:right; }
.seatingPlaceMapMatrix.seatsRight .seatingPlaceMapRow { float:right }
.seatingPlaceMapMatrix.seatsLeft { text-align:right; }
.seatingPlaceMapMatrix.seatsLeft .seatingPlaceMapRow { float:left: 99px; }

/*
.seatingPlaceMapRow {   }
.seatingPlaceMapRow .seatOff {  width:18px; height:18px; margin-right:1px; background:#fafafa;  }
.seatingPlaceMapRow .seat { margin-right:1px; border:1px solid #999; background:#ccc; width:16px; height:14px; line-height:14px; font-size:10px; text-align:center; color:#000; padding-top:1px;  }
.seatingPlaceMapRow .seat.available { border:#333 1px solid; background: #390; }
.seatingPlaceMapRow a:hover .seat.available { background:#3C0 }
.seatingPlaceMapRow .seat.selected { border: 2px solid #000; height:12px; width:14px;}
.seatingPlaceMapRow .seat, .seatingPlaceMapRow .seat a { color:#000 !important; }
.seatingPlaceMapRow .seatUnavailable:after {content: "X"; font-size: 15px; top: 2px;}
.seatingPlaceMapRow .seat:after {background-color: #fff; opacity: 0.3;}
*/

.seatingPlaceMapRow td{
    position:relative;
}
.seatingPlaceMapRow .seat{
    margin-right:1px;
    display:block;
    border:1px solid #999;
    background:#ccc;
    width:18px;
    height:18px;
    line-height:14px;
    font-size:10px;
    text-align:center;
    color:#000;
    padding-top:1px;
    color:#000 !important;
    position:relative;
}
.seatingPlaceMapRow .seat:after{
    display:block;
    position:absolute;
    content:'';
    left:0;
    top:0;
    width:100%;
    height:100%;
    background-color:#fff;
    opacity:0.3;
}
.seatingPlaceMapRow .seat.off{
    background:#fafafa !important;
    border:#fafafa 1px solid;
}
.seatingPlaceMapRow .seat.off:after{
    display:none;
}
.seatingPlaceMapRow .seat.available{
    border:#333 1px solid;
    background:#390;
    cursor:pointer;
}
.seatingPlaceMapRow .seat.available:hover:after{
    display:none;
}
.seatingPlaceMapRow .seat.available .tooltip{
    background:#98c348;
}
.seatingPlaceMapRow .seat.available .tooltip:after{
    border-top:10px solid #98c348;
}
.seatingPlaceMapRow .seatUnavailable{
    opacity:1;
    transition:opacity .25s ease-in-out;
    cursor:not-allowed;
    background-color: #bbb !important;
}
.seatingPlaceMapRow .seatUnavailable:after{
    content:"X";
    font-size:15px;
    font-weight: bold;
    top:2px;
}
.seatingPlaceMapRow .seatUnavailable:hover:after{
    background-color:#888888 !important;
}
.seatingPlaceMapRow .seat.selected{
    border:2px solid #000;
    height:16px;
    width:16px;
}
.seatingPlaceMapRow .seat.selected:after{
    display:none;
}
.seatingPlaceMapRow .seat .tooltip{
    z-index:101;
    position:absolute;
    width:110px;
    height:56px;
    background:#801f14;
    left:-48px;
    top:-62px;
    display:none;
    color:#e5e5e5;
    border-radius:4px;
    font-size:14px;
    line-height:18px;
    font-weight:bold;
    -moz-box-shadow:0px 3px 4px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow:0px 3px 4px 1px rgba(0,0,0,0.4);
    box-shadow:0px 3px 4px 1px rgba(0,0,0,0.4);
}
.seatingPlaceMapRow .seat .tooltip:after{
    display:block;
    content:'';
    position:absolute;
    left:48px;
    bottom:-10px;
    width:0;
    height:0;
    border-left:10px solid transparent;
    border-right:10px solid transparent;
    border-top:10px solid #801f14;
}
.seatingPlaceMapRow .seat.showtip .tooltip{
    display:block;
}

.seatingMapWrap #seatingMap_readout { margin-top:8px; text-align:center; }

.seatToolTip { z-index:101; position:relative; width:1px; height:1px; overflow:visible; left:-150px; }
.seatToolTip .tip  { width:200px; background: url(/images/icons/tooltip_bg_3.png) center left no-repeat; }  
.seatToolTip .tip-top { background: url(/images/icons/tooltip_bg_3.png) top left no-repeat; height:6px; width:200px; font-size:1px; line-height:1px }  
.seatToolTip .tip-title { color:#bbb; font-weight:normal; padding:0px 8px; font-size:13px; line-height:17px; }  
.seatToolTip .tip-text { color:#000; padding:10px 30px 20px 50px; display:none; }  
.seatToolTip .tip-bottom { background:  transparent url(/images/icons/tooltip_bg_3.png) no-repeat left bottom; width:200px; height:10px;font-size:1px; line-height:1px }

.seatingMapWrap .none { display:none; }
.seat{ cursor: pointer }

.seat.seatUnavailable:hover { background-color:#888888 !important; }
.seat.available:hover { background-color:#0013E5 !important; }