.seat-selection {
    margin: 10px auto;
    /*width: 950px;*/
}

.seat-selection * {
    padding: 0;
    margin: 0;
}

.seat-selection .seat-area {
    text-align: center;
}

.seat-selection .seat-area .seat-area-desc {
    line-height: 35px;
    display: none;
}

.seat-selection .seat-row-seat {
    display: inline-block;
    border: 1px solid transparent;
    text-align: center;
    width: calc(32px / 1.5);
    height: calc(32px / 1.5);
    margin: 5px;
    vertical-align: -webkit-baseline-middle;
    border-radius: 2px;
}

.seat-selection .seat-row-seat span {
    display: block;
    width: calc(28px / 1.5);
    height: calc(28px / 1.5);
    margin: 0.2px 0px 0px 0.2px;
    /*background: #b9b9b9;*/
    border-radius: 28px;
    border: 1px solid #ffffff;
    line-height: calc(28px / 1.5);
}

.seat-selection .seat-row-seat.seat-yes {
    border-color: #8a8a8a;
    /*background-color: #fafafa;*/
    border-radius: 28px;
}

.seat-selection .seat-row-seat.can-select {
    /*background-color: #fff;*/
    cursor: pointer;
}

.seat-selection .seat-row-seat.can-select span {
    /*background-color: #fff;*/
    font-size: 0.8em;
}

.seat-selection .seat-row-seat.current-selected.can-select span {
    background-color: #219D53;
}

.seat-selection .seat-row-seat.current-selected.can-select:hover span {
    background-color: #219D53;
}

.seat-selection .seat-row-seat.can-select:hover span {
    background-color: #dcdcdc;
}

.seat-selection .row-indicator {
    margin-right: 10px;
    color: green;
}

.seats-container {
    min-width: 450px;
}

.ship {
    /* border: 1px solid; */
    /*border-radius: 100px 363px 363px 100px;*/
    /*min-width: 1400px;*/
}

.seat-selection .movie-screen {
    /*width: 100%;*/
    text-align: center;
    height: 90px;
    margin: 15px 0px 15px 0px;
    font-size: 0.8em;
    color: #626573;
    background-color: #dfdfdf;
    box-shadow: inset 0px 7px 12px 0px #9c9c9c;
    border-radius: 0px 0px 1000px 1000px;
}

.seat-selection .seat-proccess-panel {
    text-align: right;
    position: absolute;
    /*right: 9%;*/
    /*top: 10%;*/
    z-index: 100;
    padding: 10px 20px;
    background: #fff;
}
.selected-badge {
    border-radius: 5px;
    width: 55px;
    line-height: 30px;
    font-size: 14px;
    padding: 0px 15px;
    border: 1px solid;
}
.seat-map-footer{
    min-height: 70px;
}


/*.seat-selection .layout-action-btn{*/


/*padding: 5px 20px;*/


/*color: #fff;*/


/*cursor: pointer;*/


/*background-color: burlywood;*/


/*border: 1px solid #e7e7e7;*/


/*box-shadow: 0px 2px 5px 0px #2b2b2b;*/


/*border-radius: 2px;*/


/*}*/

.seat-selection .layout-action-btn[disabled] {
    box-shadow: none;
    /*background-color: #b1b1b1 !important;*/
    /*border-color: #828282 !important;*/
    cursor: not-allowed;
}

.layout-action-btn {
    border: 2px solid;
    /*border-color: #00c1f8;*/
    /*background-color: #fff;*/
    /*color: #00c1f8;*/
    padding: 5px 10px;
    cursor: pointer;
}

.layout-action-btn:disabled {
    border: 2px solid;
    /*border-color: #00c1f882;*/
    /*background-color: #d7d7d7;*/
    /*color: #00c1f882;*/
}

.screen-small {
    width: 300px !important;
}

.sold-seat>span {
    background-color: #F38086!important;
}

.reserved-seat>span {
    background-color: #FB8832!important;
}

.seat-number {
    font-size: 0.6rem!important;
    font-weight: bold;
}

.hide-seat {
    display: none!important;
}

.seat-map-modal{
    width: 100%;
    height: 70vh;
}
.seat-map-modal > .modal-body {
    overflow: overlay;
}
@media (min-width: 576px) {
    .seat-map-modal > .modal-body {
        padding: 0px 25px 0px 0px;
    }
}
@media (max-width: 575px) {
    .seat-map-modal > .modal-body {
        padding: 0px 50px 0px 0px;
    }

}
@media (max-width: 355px) {
    .seat-map-modal > .modal-body {
        padding: 5px 0px 5px 0px;
    }


}
@media (max-width: 320px) {
    .seat-map-modal > .modal-body {
        padding: 5px 0px 5px 0px;
    }

}
@media (min-width: 390px) {
    .seat-map-modal > .modal-body {
        padding: 5px 30px 5px 75px;
    }
}
@media (max-width: 435px) {
    .seat-map-modal > .modal-body {
        padding: 5px 20px 5px 20px;
    }
}
@media (min-width: 600px) {
    .seat-map-modal > .modal-body {
        padding: 5px 45px 5px 75px;
    }
}
.legend-avail{
    color: #333;
}
.legend-selected{
    color: #219D53;
}
.legend-reserved{
    color: #FB8832;
}
.legend-occupied{
    color: #F38086;
}
.legend-ticket-1{
    color: rgba(8, 75, 255, 0.42);!important;
}
.legend-ticket-2{
    color: #c3a40085;!important;
}
.legend-ticket-3{
    color: #6118184f;!important;
}
.legend-item{
    font-size: 48px;
    line-height: 1;
}
.legend-blocked{
    color: #BEBEBE !important;
    font-size: 48px;
    line-height: 1;
}
.legend-avail > .checkmark{
    background-color: #FFFFFF;
}
.legend-selected > .checkmark{
    background-color: #219D53;
}
.legend-reserved > .checkmark{
    background-color: #FB8832;
}
.legend-occupied > .checkmark{
    background-color: #F38086 ;
}
.legend-blocked > .checkmark{
    background-color: #BFBFBF;
}

.seat-map-legend .legend-avail small, .seat-map-legend .legend-selected small,
.seat-map-legend .legend-reserved small, .seat-map-legend .legend-occupied small,
.seat-map-legend .legend-blocked small, .legend-ticket-1 small, .legend-ticket-2 small ,
.legend-ticket-3 small{
    vertical-align: middle;
    font-size: 11px;
    margin: 5px 5px 5px 5px;
    display: inline-block;
}
.price-template-bg1 span, .legend-ticket-1 > .checkmark{
    background-color: rgba(8, 75, 255, 0.42);!important;
}
.price-template-bg2 span, .legend-ticket-2 > .checkmark{
    background-color: #c3a40085;!important;
}
.price-template-bg3 span{
    background-color: #6118184f;!important;
}
.price-template-bg-blocked span, .legend-ticket-3 > .checkmark{
    background-color: #BFBFBF;
}

.seat-map-dialog{
    max-width: 96vw!important;
    top: 10%;
}
/*scroll*/
.map-modal-content::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
/* Track */
.map-modal-content::-webkit-scrollbar-track {
    background: #E6E5E6;
    border: 4px solid transparent;
    background-clip: padding-box;
    border-radius: 10px;
}

/* Handle */
.map-modal-content::-webkit-scrollbar-thumb {
    background: #E6E5E6;
    border-radius: 10px;
}

/* Handle on hover */
.map-modal-content::-webkit-scrollbar-thumb:hover {
    background: #DDDDDD;
}