﻿/*css for mobile qtt*/
@media only screen and (max-width: 1024px) {

    .mobile-qtt {
        display: block;
    }

    .desktop-qtt, .banner-left {
        display: none;
    }
    .mobile-qtt .banner-exchange-btn {
        left: 82%;
        transform: rotate(90deg);
        top: 117px;
    }

    .mobile-qtt .layout--6-6 > .column {
        width: 50%;
        float: left;
    }

    .mobile-qtt .layout--8-4 > .column:first-of-type, .mobile-departing-popup .layout--8-4 > .column:first-of-type {
        width: 66.66666667%;
        float: left;
    }

    .mobile-qtt .layout--8-4 > .column:last-of-type, .mobile-departing-popup .layout--8-4 > .column:last-of-type {
        width: 33.33333333%;
        float: left;
    }

    #mob-tabs {
        background: #fff;
        border: 0px;
        border-radius: 0px;
    }

    .railcard-modal-top .quantity-group {
        float: none;
    }

    .display-flex {
        display: flex;
    }

    .railcard-mobile-pop .amount-group, .railcard-mobile-pop .quantity-field {
        width: 100%;
    }

    .mobile-qtt-form {
        padding-bottom: 15px;
        border-bottom: 1px #ccc solid
    }

    .mobile-qtt-primary-btn {
        margin-top: 30px;
        width: 100%
    }

    .railcard-mobile-pop .modal-content {
        border: 0px;
    }
    .remove-railcard-section:nth-child(1), .view-railcard-section {
        padding-top: 15px;
        position: relative;
        z-index: 1;
    }
    .remove-railcard-section, .view-railcard-section {
        display:flex;
    }
    .mobile-qtt .remove-railcard, .mobile-qtt .view-railcard {
        float: left;
        padding-left: 10px;
        position: relative;
        z-index: 1;
        min-width: 25%;
    }

    .mobile-qtt .view-dropdown {
        position: static;
        margin-top: 25px;
        border: 0px;
        padding: 10px 0;
    }

        .mobile-qtt .view-dropdown .remove-railcard-section {
            padding-bottom: 0px;
        }

    .railcard-mobile-pop .modal-content, .returning-returning-popup .modal-content, .mobile-departing-popup .modal-content {
        top: 0 !important;
        width: 100%;
        height: auto;
        min-height: 100%;
    }

    .railcard-mobile-pop, .returning-returning-popup, .mobile-departing-popup {
        padding-top: 0px !important;
    }

        .returning-returning-popup .modal-content, .mobile-departing-popup .modal-content {
            border-radius: 0px !important;
            border: 0px;
        }

    .m_railcard {
        display: flex;
        align-items: center;
    }

    .m_chooserailcard {
        width: 50% !important;
    }

    .amount_m {
        width: 32% !important;
        padding: 0px 10px;
    }

    .subrailcard_m {
        width: 91% !important;
    }

    #m_railcardclose {
        display: inline-block;
        margin-top: 1px;
        margin-left: -8px;
        width: 18%;
        line-height: 16px;
        text-align: center;
    }

    .m_anotherrailcarddrpdown {
        float: left;
        width: 51%;
        margin-right: 10px;
    }

    .another_amount_m {
        float: left !important;
        width: 28.5% !important;
    }

    #m_anotherrailcardclose {
        margin-top: 25px;
        display: inline-block;
    }

    .closeanotherrailcard {
        display: inline-block;
        margin-top: 14px;
        padding-left: 10px;
        float: left !important;
        width: 16%;
        line-height: 15px;
        text-align: center;
    }

    .m_rc_options:after {
        content: "";
        visibility: hidden;
        display: block;
        clear: both;
    }

    .closeanotherrailcard::after {
        clear: both;
    }

    .m_railcard_opt {
        display: flex;
        align-items: flex-end;
    }

    .railcard_bdr {
        border-top: 1px #ccc solid;
        margin-top: 15px;
    }

    .m_firstdropdowm {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding-left: 12px;
    }

    #m_AdultandChildren {
        width: 97%;
    }

    .railcard-alert {
        width: 25px;
        margin-right: 10px;
    }

    .default_railcard_close.closeanotherrailcard {
        width: 16%;
        text-align: center;
        line-height: 15px;
        margin-top: 10px;
    }

    .closeanotherrailcard {
        width: 16%;
        text-align: center;
        line-height: 15px;
        margin-top: 10px;
    }
    .button-minus:hover, .button-plus:hover {
        background: #E2F5E9 !important;
    }

    .text-dark[disabled] {
        color: #080808 !important;
    }
    .button-minus:hover, .button-plus:hover {
        background: #E2F5E9 !important;
    }

    .text-dark[disabled] {
        color: #080808 !important;
    }
    .mobile-qtt .ui-datepicker {
        border: 0px;
        box-shadow: 0 0 0;
    }
    .mobile-qtt .ui-datepicker {
        border: 0px;
        box-shadow: 0 0 0;
    }

    .m_tooltip-default-message, .m_tooltip-enabldate-message, .m_tooltip-disabldate-message, .m_tooltip-default-message_tt, .m_tooltip-enabldate-message_tt, .m_tooltip-disabldate-message_tt,
    .m_tooltip-default-message_ST, .m_tooltip-enabldate-message_ST, .m_tooltip-disabldate-message_ST {
        text-align: center;
        padding: 10px 0;
        border-bottom: 1px #ddd solid;
        border-top: 1px #ddd solid;
    }

    .mobile-qtt .ui-datepicker-calendar .ui-state-disabled .tooltip-checker {
        display: none !important
    }
    .m_tooltip-default-message, .m_tooltip-enabldate-message, .m_tooltip-disabldate-message, .m_tooltip-default-message_tt, .m_tooltip-enabldate-message_tt, .m_tooltip-disabldate-message_tt,
    .m_tooltip-default-message_ST, .m_tooltip-enabldate-message_ST, .m_tooltip-disabldate-message_ST {
        text-align: center;
        padding: 10px 0;
        border-bottom: 1px #ddd solid;
        border-top: 1px #ddd solid;
    }

    .mobile-qtt .ui-datepicker-calendar .ui-state-disabled .tooltip-checker {
        display: none !important
    }
    table.ui-datepicker-calendar tr:first-of-type>th {
    background: #fff !important;
}
    .mobile-qtt .modal-dialog{
        margin:0px !important;
        height:100%;
    }
    table.ui-datepicker-calendar tr:first-of-type > th {
        background: #fff !important;
    }
}


@media(max-width:767px) {
    .mobile-qtt .column, .returning-returning-popup .column, .mobile-departing-popup .column {
        margin-bottom: 0px !important;
    }

    .returning-returning-popup .return-stations-nearme {
        padding-right: 0px;
        padding-left: 0px
    }
    .spac-tabs {
        position: absolute;
        top: -40px;
        left: 195px;
    }
    .mobile-qtt .ui-datepicker-calendar .ui-state-disabled span {
        width: 32px !important;
    }
}

@media(max-width:576px) {
    .depart-time label, .arrive-by-time label {
        width: 40%;
    }
}
@media (max-width: 479px) {
    .mobile-qtt .banner-right #mobile-departing-date-popup .modal-content .column .depart-inner-tabs .time-selector-btn-grp {
        margin-top: 20px !important;
    }
    .specific-date-tab .layout--8-4 .column {
        width: 100% !important;
    }

    #tabsMobile-6 .time-selector-btn-grp, #m-arrival-date-tabs-6 .time-selector-btn-grp {
        margin: 0px -5px 10px 5px !important;
    }

    .specific-date-tab .depart-time {
        padding-top: 0px !important
    }
}
@media(max-width:460px) {
    .spac-tabs {
        position: relative;
        top: auto;
        left: auto;
    }
}
