body { font-family:Verdana, Arial, Helvetica, sans-serif;}
@-webkit-keyframes bounce {
  0%, 20%, 40%, 60%, 80%, 100% {-webkit-transform: translateY(0);}
  50% {-webkit-transform: translateY(-5px);}
} 

@keyframes bounce { 
  0%, 20%, 40%, 60%, 80%, 100% {transform: translateY(0);}
  50% {transform: translateY(-5px);} 
} 

.bounce { -webkit-animation-name: bounce;animation-name: bounce;}
#seatingmodule { width:100%; height:auto; float:left;}
.seating-container { width:768px; margin:0 auto;}
.seating-main { width:100%; height:auto; float:left;background: #dedcdc;
padding: 20px;}	
.seating-top { width:100%; height:auto; float:left;}
.seating-legends {width:100%; height:auto; float:left;margin: 10px 0;padding:0px;box-sizing: border-box;}
.seating-legends ul { line-height:normal; margin:0; padding:0;}
.seating-legends ul li { list-style:none; padding: 7px 7px;margin: 0 4px 0 0;float: left;border-radius: 3px; position:relative;}
.seating-legends ul li label {font-size: 12px;color: #fff;display: inline-block;line-height: 23px;margin: 0;}
.seating-legends ul li input { display: block;margin: 6px 4px 0 0;float: left; left:13px;-ms-transform: scale(2);
-moz-transform: scale(2);
-webkit-transform: scale(2);
-o-transform: scale(2);
padding: 10px;}
.seating-legends ul li.hold {background: #f89090;}
.seating-legends ul li.book {background: #aeb0ad;}
.seating-legends ul li.available {  background: #44386a; }
.seating-legends ul li.unavailable {  background: #c8c8c8; }
.seating-legends ul li.yourseat {  background: #b3d236; }
.seating-legends ul li.blocked {  background: #6e3737; }
.seating-legends ul li.releasseat {  background: #787777; }



.seating-bottom { width:100%; height:auto; float:left;}
.theatre-screen { width:100%; height:auto; float:left; background:#50B1D1; text-align:center; padding:10px 0 25px; font-size:12px; position:relative; color:#fff}
.theatre-screen:before {content: '';background-image: url('../images/arrowdown.png');height:100%;width: 100%;position: absolute;right: 0px;bottom:-10px;z-index:9;background-position: center center;background-size:20px;background-repeat: no-repeat;-moz-animation: bounce 5s infinite;-webkit-animation: bounce 5s infinite;animation: bounce 5s infinite;animation-duration:1.5s;}



.theatre-seatchart {width:100%; height:auto; float:left;padding:16px 16px;box-sizing: border-box;}
.box {width: 25px;height: 25px;float: left;border: solid 1px #A8A8A8;margin-right: 7px;margin-bottom: 7px;text-align: center;font-size: 12px;line-height: 23px; cursor:pointer;}
.release {width: 25px;height: 25px;float: left;border: solid 1px #A8A8A8;margin-right: 7px;margin-bottom: 7px;text-align: center;font-size: 12px;line-height: 23px;cursor:pointer;}


.seating-footer { width:100%; height:auto; float:left;}
.seating-footer .buttonbook {width:auto; height:auto; float:right;text-align: right;margin: 10px 0 0 8px;}
.seating-footer .buttonbook a { font-size: 16px;color: #FFFFFF;background: #28C1D5;text-decoration: none;display: inline-block;padding: 8px 12px;font-weight: bold;border-radius: 3px;}

.seating-footer #hold {width:auto; height:auto; float:right;text-align: right;margin: 10px 0 0 8px;}
.seating-footer #hold a { font-size: 16px;color: #FFFFFF;background:#f89090;text-decoration: none;display: inline-block;padding: 8px 12px;font-weight: bold;border-radius: 3px;}

.seating-footer #unavailable {width:auto; height:auto; float:right;text-align: right;margin: 10px 0 0 8px;}
.seating-footer #unavailable a { font-size: 16px;color: #FFFFFF;background: #c8c8c8;text-decoration: none;display: inline-block;padding: 8px 12px;font-weight: bold;border-radius: 3px;}

.seating-footer #blocked {width:auto; height:auto; float:right;text-align: right;margin: 10px 0 0 8px;}
.seating-footer #blocked a { font-size: 16px;color: #FFFFFF;background:#6e3737;text-decoration: none;display: inline-block;padding: 8px 12px;font-weight: bold;border-radius: 3px;}

.seating-footer #release {width:auto; height:auto; float:right;text-align: right;margin: 10px 0 0 8px;}
.seating-footer #release a { font-size: 16px;color: #FFFFFF;background:#787777;text-decoration: none;display: inline-block;padding: 8px 12px;font-weight: bold;border-radius: 3px;}


.theatre-seatchart .hold {background: #f89090;}
.theatre-seatchart .book {background: #aeb0ad;}
.theatre-seatchart .available {  background: #44386a; }
.theatre-seatchart .unavailable {  background: #c8c8c8; } 
.theatre-seatchart .yourseat {  background: #b3d236; }
.theatre-seatchart .blocked {  background: #6e3737; color:#fff;}
.theatre-seatchart .booked {background: #aeb0ad;}

.seating-product {
    width: 100%;
    float: left;
    border-bottom: solid 1px #cdcccc;
    padding: 0 0 10px;
    margin: 0 0 5px;
}

.numberofseats { width: 90px; float: left;margin: 0 10px 0 0;}
.variation_title {font-weight: 600;text-transform: capitalize;line-height: 20px;width: 100%;float: left;margin-bottom: 5px;}
.variation_price { width: auto; float: left; margin-right: 0; padding-right: 0;}
.senior_price {width: auto;float: left;border-left: solid 1px #000;margin-left: 8px;padding-left: 8px;}
.student_price {width: auto;float: left;border-left: solid 1px #000;margin-left: 8px;padding-left: 8px;}


#seatingmodel .modal-dialog {width: 230px; margin: 30px auto;}
#seatingmodel .modal-dialog select { width:100%;}
#seatingmodel .modal-dialog label { width:100%;margin: 3px 0px;}
#seatingmodel .modal-dialog button {padding: 8px 10px;margin-left: 0;margin-top: 10px;width: 100%;font-size: 17px;font-weight: 600;}

.theatrespinner { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); position: fixed; left: 0; top: 0; z-index: 99;}
.theatrespinner img {position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);}