.component-jumbotron .component-journey-check-form {
    margin: 0px auto 0;
}

.component-journey-check-form .qtt-form-stations .departure-station,
.component-journey-check-form .qtt-form-stations .arrival-station {
    padding-right: 0;
}

.component-journey-check-form .qtt-form-stations .station-switch {
    display: none;
}

.component-journey-check-form {
    max-width: 822px;
    margin: auto;
}

.component-journey-check-form .hidden {
    display: none;
}

.component-journey-check-form .validation {
    clear: both;
}

.component-journey-check-form .validation .validation-error-message {
    padding-bottom: 0;
    padding-top: 1px;
}

.component-journey-check-form .validation-error-message {
    clear: both;
    display: inline-block;
    color: #fff !important;
    text-align: left;
    margin-top: 12px;
    padding: 0;
}

.component-journey-check-form .form-control {
    padding-left: 10px;
    padding-top: 2px;
    font-size: 14px;
    line-height: 14px;
    width: 100%;
    background: #fff !important;
    cursor: pointer;
    border: none !important;
    height: 42px;
    border-radius: 4px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-indent: 1px;
    text-overflow: unset;
}

.component-journey-check-form .form-control.disabled {
    cursor: not-allowed;
}

body div.component-journey-check-form .form-row .select2 .select2-selection--single .select2-selection__rendered {
    font-size: 16px !important;
    font-weight: 400;
    padding-left: 10px !important;
    height: 42px;
    line-height: 42px;
}

body div.component-journey-check-form .form-row .select2 .select2-selection--single .select2-selection__rendered .select2-selection__placeholder {
    font-family: "D-DIN-PRO", sans-serif;
    color: #061B2B !important;
    height: 42px;
    line-height: 42px;
    font-size: 16px !important;
    font-weight: 400;
}

div.component-journey-check-form div.fancy-select.disabled {
    opacity: 0.5;
}

div.component-journey-check-form div.fancy-select div.trigger {
    padding-left: 11px;
    font-size: 14px !important;
    width: 100%;
    height: 42px;
    cursor: pointer;
    background: #fff;
    color: #061B2B;
    text-align: left;
}

div.component-journey-check-form div.fancy-select div.trigger:after {
    content: '\e900';
    font-family: icons, sans-serif;
    font-weight: 400;
    position: absolute;
    top: 1px;
    right: 9px;
    left: auto;
    color: #0092CB !important;
    box-sizing: border-box;
    font-size: 10px;
}

div.component-journey-check-form div.fancy-select div.trigger.open {
    background: #fff;
    color: #7A8498;
    box-shadow: none;
}

div.component-journey-check-form div.fancy-select ul.options {
    list-style: none;
    margin: 0;
    position: absolute;
    top: 40px;
    left: 0;
    visibility: hidden;
    opacity: 0;
    z-index: 50;
    max-height: 200px;
    overflow: auto;
    background: #fff;
    min-width: initial;
}

div.component-journey-check-form div.fancy-select ul.options.open {
    visibility: visible;
    top: 50px;
    text-align: left;
    opacity: 1;
    border-width: 0px;
}

div.component-journey-check-form div.fancy-select ul.options.overflowing {
    top: auto;
    bottom: 40px;
    transition: opacity 300ms ease-out, bottom 300ms ease-out, visibility 300ms ease-out;
}

div.component-journey-check-form div.fancy-select ul.options.overflowing.open {
    top: auto;
    bottom: 50px;
    transition: opacity 300ms ease-out, bottom 300ms ease-out;
}

div.component-journey-check-form .fancy-select ul.options {
    padding: 0px;
}

div.component-journey-check-form .fancy-select ul.options.above {
    bottom: 100% !important;
    top: auto !important;
    border-radius: 4px;
}

div.component-journey-check-form .fancy-select ul.options.below {
    top: 0 !important;
    bottom: auto !important;
    border-radius: 4px;
}

div.component-journey-check-form .fancy-select ul.options li {
    font-size: 14px;
    padding-left: 11px;
    margin-bottom: 0px;
}

div.component-journey-check-form .fancy-select .options li.selected:after {
    position: absolute;
    right: -8px;
    top: 12px;
    color: #37aa32;
}

div.component-journey-check-form .narrow-padding>div {
    padding-left: 0;
    padding-right: 2px;
}

.new-qtt-journey-check-form .station-switch,
.new-qtt-journey-check-form .qtt-form-stations .station-switch {
    top: 40px;
}

.new-qtt-journey-check-form {
    max-width: none !important;
    padding-top: 15px;
}

.new-qtt-journey-check-form div[class*="layout--"] div[class*="layout--"] {
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.new-qtt-journey-check-form .new-qtt-column {
    width: 100%;
}

.new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select {
    min-width: auto;
    max-width: none;
    width: 100%;
    display: flex;
    position: relative;
}

.new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--date,
.new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--depart {
    width: 25%;
}

.new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--time {
    width: 22%;
    margin-right: 15px;
}

.new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .submit button {
    margin-top: 0px;
    display: block !important;
    height: 42px;
}

.new-qtt-journey-check-form .qtt-form-date-select--container {
    margin-top: 0px;
}

.new-qtt-journey-check-form .component-qtt-form {
    padding-top: 0px !important;
    margin-top: 10px;
}

.new-qtt-journey-check-form .component-qtt-form .column {
    padding: 0px;
}

.new-qtt-journey-check-form .qtt-form-date-select--container .submit {
    position: absolute;
    right: 0px;
}

.new-qtt-journey-check-form .Qtt-erormsg {
    margin-top: 10px !important;
    margin-right: 0px;
}

.new-qtt-journey-check-form .qtt-form-date-select input,
.new-qtt-journey-check-form .qtt-form-date-select .fancy-select .trigger {
    font-size: 16px !important;
    font-weight: 400;
}

.new-qtt-journey-check-form .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 42px !important;
}

.Qtt-erormsg {
    padding: 0px;
    margin-top: -27px;
    font-size: 14px;
    margin-bottom: -8px;
    float: right;
    color: #fff;
    font-weight: 500;
    margin-right: 114px;
}

.placeholder-heading {
    color: #fff;
}

#journey-depart-popular-station {
    width: 46.5%;
}

.qtt-form-date-select--container {
    text-align: center;
}

.qtt-form-date-select--container .column {
    display: inline-block;
    text-align: center !important;
}

.qtt-form-date-select--container .column .validation {
    text-align: left !important;
}

.qtt-form-date-select--container .column .trigger {
    text-align: left !important;
}

.plan-my-journey-check-form a {
    color: white !important;
    font-weight: 700;
    text-decoration-line: none;
}

.new-qtt-station-dept-arrive .submit button {
    margin-top: 0px;
    width: 100%;
}

.new-qtt-station-dept-arrive {
    border-left: 1px #666 solid;
}

ul#journey-liveTrainTime-popular-station {
    width: 100%;
}

#journey-arrival-popular-station {
    width: 46.3%;
}
.station-switch__icon {
    cursor: pointer
}

#depart-popular-station {
    width: 93.7%;
}

#arrival-popular-station {
    width: 93.2%;
}

@media screen and (min-width:1025px) {
    .departure-station.station-input ul#journey-depart-popular-station {
        top: 86px;
    }
}

@media (min-width: 48em) {
    .component-jumbotron .component-journey-check-form {
        margin: 0 auto;
    }
}

@media (min-width: 48em) and (max-width: 64em) {
    .component-journey-check-form .qtt-form-stations {
        margin: 0;
    }
}

@media (max-width: 21.25em) {
    .component-journey-check-form .qtt-form-stations {
        margin: 0;
    }
}

@media (min-width: 64.0625em) {
    .component-journey-check-form .qtt-form-stations .departure-station {
        padding-right: 26px;
    }

    .component-journey-check-form .qtt-form-stations .station-switch {
        display: block;
    }

    .component-journey-check-form .qtt-form-date-select {
        min-width: 470px;
        max-width: 500px;
        width: auto;
        margin: auto;
        display: inline-block;
    }

    .qtt-form-date-select--container {
        margin-top: 15px;
        margin-bottom: 30px;
    }

    .qtt-form-date-select--container .qtt-form-date-select {
        float: left;
    }

    .qtt-form-date-select--container .qtt-form-date-select+div {
        float: left;
    }

    .qtt-form-date-select--container .qtt-form-date-select+div button {
        margin: 0 0 0 15px;
        float: left;
        height: 42px;
        line-height: 15px;
        font-size: 16px;
    }
}

@media (max-width: 64em) {
    .component-journey-check-form {
        max-width: 700px;
    }

    .qtt-form-date-select--container .column {
        display: block;
        text-align: left;
    }

    .hasQTTwithImage .qtt-form-date-select--container .column.submit {
        width: 100%;
        float: left;
    }
}

@media (max-width: 1199px) {
    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--time {
        width: 20%;
    }

    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .submit button {
        min-width: 170px;
    }
}

@media (max-width: 1024px) {

    .component-journey-check-form .qtt-form-stations {
        margin: 0 70px;
    }

    .component-jumbotron .component-journey-check-form h4 {
        padding: 10px 0 2px;
    }
    .component-journey-check-form.new-qtt-journey-check-form .qtt-form-stations,
    .new-qtt-journey-check-form .qtt-form-stations {
        margin: 0px !important;
    }

    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select {
        display: block;
        margin: 0px;
    }

    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--date,
    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--depart,
    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--time,
    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .submit button {
        width: 100%;
        margin: 10px 0;
    }

    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .submit {
        clear: both;
        float: left;
        width: 100%;
    }

    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--depart {
        padding: 0px;
        padding-right: 5px;
    }

    .new-qtt-journey-check-form .station-switch,
    .new-qtt-journey-check-form .qtt-form-stations .station-switch {
        display: flex !important;
        right: 0;
        top: 85px;
        background: #0092cc;
        width: 45px;
        height: 45px;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
    }

    .new-qtt-journey-check-form .station-switch .station-switch__icon,
    .new-qtt-journey-check-form .qtt-form-stations .station-switch .station-switch__icon{
        padding-top: 0;
    }

    .new-qtt-journey-check-form .switch-group {
        position: relative;
        width: 100%;
    }

    .new-qtt-journey-check-form .qtt-form-date-select--container .submit {
        position: relative;
    }

    .new-qtt-journey-check-form .Qtt-erormsg {
        margin-left: 0px !important;
        width: 100%;
        margin-bottom: 10px !important;
    }

    .new-qtt-journey-check-form .trigger {
        max-width: 100% !important;
    }

    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--depart,
    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--time {
        width: 50%;
    }

    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .qtt-form--time {
        padding-left: 5px;
    }

    .new-qtt-journey-check-form .component-qtt-form.new-qtt-station-dept-arrive {
        padding-top: 15px !important;
    }

    .new-qtt-journey-check-form .qtt-form-stations .arrival-station .placeholder-heading,
    .new-qtt-journey-check-form .qtt-form-stations .departure-station .placeholder-heading {
        display: none;
    }



    .new-qtt-journey-check-form .qtt-form-stations .arrival-station {
        padding-top: 10px;
    }



    .new-qtt-journey-check-form .station-switch .station-switch__icon {
        padding-top: 5px;
    }

    .new-qtt-journey-check-form .station-switch .station-switch__icon::before {
        font-size: 25px;
    }

    .component-jumbotron .new-qtt-journey-check-form .switch-group {
        width: 100%;
        display: inline-block;
    }

    .component-jumbotron .new-qtt-journey-check-form .station-switch {
        width: 45px;
        height: 45px;
        top: 43px;
    }

    .Qtt-erormsg {
        float: left !important;
        font-weight: 500;
        margin-left: 74px !important;
        margin-top: -19px;
    }

    #journey-depart-popular-station {
        width: 100% !important;
    }

    .new-qtt-station-dept-arrive {
        border-left: 0px;
        border-top: 1px #666 solid;
        margin-top: 0px !important;
        padding-top: 10px !important;
        opacity: 0.99
    }

    .new-qtt-station-dept-arrive .submit button {
        margin-left: 0px !important
    }

    #journey-arrival-popular-station {
        width: 100% !important;
    }

    #depart-popular-station,
    #arrival-popular-station {
        width: 100% !important;
    }
} 
@media screen and (max-width: 896px) {

    .component-journey-check-form .component-qtt-form .qtt-form-stations .station-switch {
        top: 43px;
    }
}

@media (max-width: 768px) {
    .Qtt-erormsg {
        padding: 0px;
        margin-top: -27px;
        font-size: 14px;
        margin-bottom: -8px;
        float: right;
        color: #fff;
        font-weight: 500;
        margin-right: 114px;
    }

    #journey-depart-popular-station {
        width: 100% !important;
    }

    #journey-arrival-popular-station {
        width: 100% !important;
    }

    #depart-popular-station,
    #arrival-popular-station {
        width: 100% !important;
    }
}
@media (max-width: 767px) {
    .new-qtt-journey-check-form .new-qtt-column .qtt-form-date-select .submit button {
        margin-left: 0px !important
    }

    .new-qtt-journey-check-form .component-qtt-form {
        margin-bottom: 0px !important
    }

    .new-qtt-station-dept-arrive .submit button {
        margin-top: 0px !important;
    }
}

@media (max-width:480px) {
    div.component-journey-check-form div.fancy-select div.trigger {
        padding-left: 11px;
        font-size: 14px !important;
        width: 100%;
        height: 42px;
        cursor: pointer;
        background: #fff;
        color: #061B2B;
        text-align: left;
        white-space: nowrap;
        text-overflow: ellipsis;
        padding-right: 23px;
        max-width: 98%;
        overflow: hidden;
    }

    .component-journey-check-form .qtt-form-stations {
        margin: 0 20px !important;
    }

    .component-journey-check-form .qtt-form-date-select {
        width: 86%;
        float: left;
        margin-bottom: 0px;
    }

    .new-qtt-journey-check-form .station-switch {
        right: -10px;
    }

    .Qtt-erormsg {
        padding: 0px;
        margin: -20px 4px 0 24px !important;
    }

    #journey-depart-popular-station {
        width: 100% !important;
    }

    #journey-arrival-popular-station {
        width: 100% !important;
    }

    #depart-popular-station,
    #arrival-popular-station {
        width: 100% !important;
    }
}

@media (max-width: 340px) {

    div.component-journey-check-form div.fancy-select div.trigger:after {
        display: block !important;
        content: '\e900';
        font-family: 'icons', sans-serif;
    }
}