.itinerary-train {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: repeat(auto-fit, auto);
}

.itinerary-train:not(:last-child) {
    grid-template-areas:
        "dep-time  dep-station"
        "train     train"
        "arr-time  arrdep-station"
        "dep2-time arrdep-station";
}

.itinerary-train:last-child {
    grid-template-areas:
        "train     train"
        "arr-time  arr-station";
}

.itinerary-train:only-child {
    grid-template-areas:
        "dep-time  dep-station"
        "train     train"
        "arr-time  arr-station";
}

.itinerary-train .departure.time {
    grid-area: dep-time;
}

.itinerary-train .next-departure.time {
    grid-area: dep2-time;
}

.itinerary-train .departure.station {
    grid-area: dep-station;
}

.itinerary-train .train {
    grid-area: train;
}

.itinerary-train .arrival.time {
    grid-area: arr-time;
}

.itinerary-train:not(:last-child) .arrival.station {
    grid-area: arrdep-station;
    align-self: center;
}

.itinerary-train .arrival.station {
    grid-area: arr-station;
}

.itinerary-train .time {
    margin-left: 2px;
    margin-right: 2px;
}