@import url("https://fonts.googleapis.com/css2?family=Istok+Web&display=swap");

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    src: url("https://fonts.gstatic.com/s/materialicons/v48/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2") format('woff2');
}

@font-face {
    font-family: 'transportsymbolsregular';
    src: url('/styles/fonts/transportsymbols-regular-webfont.woff2') format('woff2'),
    url('/styles/fonts/transportsymbols-regular-webfont.woff') format('woff');
}


@font-face {
    font-family: 'Johnston100-Medium';
    src: url("/styles/fonts/Johnston100-Medium.woff2") format("woff2")
}

@font-face {
    font-family: 'wales_sans_bodymedium';
    src: url('/styles/fonts/wales-sans-body-medium-web-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Johnston100-Regular';
    src: url("/styles/fonts/Johnston100-Regular.woff2") format("woff2")
}

/* latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4mxK.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: Nunito;
    src: url("/fes/dashboardFrontend/fonts/Nunito-Light.woff2") format("woff2");
    font-weight: 300;
}

@font-face {
    font-family: Nunito;
    src: url("/fes/dashboardFrontend/fonts/Nunito-Regular.woff2") format("woff2");
    font-weight: 400;
}

@font-face {
    font-family: Nunito;
    src: url("/fes/dashboardFrontend/fonts/Nunito-SemiBold.woff2") format("woff2");
    font-weight: 600;
}

@font-face {
    font-family: Nunito;
    src: url("/fes/dashboardFrontend/fonts/Nunito-Bold.woff2") format("woff2");
    font-weight: 700;
}

@font-face {
    font-family: Nunito;
    src: url("/fes/dashboardFrontend/fonts/Nunito-ExtraBold.woff2") format("woff2");
    font-weight: 800;
}

@font-face {
    font-family: 'lubalin_graphregular';
    src: url('/styles/fonts/lubalin_graph_regular-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}


/* latin */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 400;
    src: url("https://fonts.gstatic.com/s/raleway/v18/1Ptug8zYS_SKggPNyC0ITw.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 600;
    src: url("https://fonts.gstatic.com/s/raleway/v18/1Ptug8zYS_SKggPNyC0ITw.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 700;
    src: url("https://fonts.gstatic.com/s/raleway/v18/1Ptug8zYS_SKggPNyC0ITw.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/*

No new line at end of file

*/
@-webkit-keyframes stagger {
    from {
        stroke-dasharray: 30;
    }
    50% {
        stroke-dasharray: 15;
    }
    to {
        stroke-dasharray: 80;
    }
}

@keyframes stagger {
    from {
        stroke-dasharray: 30;
    }
    50% {
        stroke-dasharray: 15;
    }
    to {
        stroke-dasharray: 80;
    }
}

@-webkit-keyframes bumpUpBig {
    50% {
        -webkit-transform: translate(0, -10px);
        transform: translate(0, -10px);
    }
}

@keyframes bumpUpBig {
    50% {
        -webkit-transform: translate(0, -10px);
        transform: translate(0, -10px);
    }
}

@keyframes fly {
    to {
        transform: translate(120px, -30px);
        -webkit-transform: translate(120px, -30px);
    }
}

.animation_airport_1 {
    animation: fly 0.4s ease-in-out;
    -webkit-animation: fly 0.4s ease-in-out;
}

.animation_journey_1 {
    -webkit-animation: stagger 0.8s ease-in-out;
    animation: stagger 0.8s ease-in-out;
}

.animation_journey_2 {
    -webkit-animation: bumpUpBig 0.5s ease-in-out;
    animation: bumpUpBig 0.5s ease-in-out;
}

.animation_journey_3 {
    -webkit-animation: bumpUpBig 0.8s ease-in-out;
    animation: bumpUpBig 0.8s ease-in-out;
}

/* compensation */

.animation_compensation_1 {
    transform-origin: center center;
    animation: bumpUpBig 1.3s ease;
    -webkit-animation: bumpUpBig 1.3s ease;
}

@keyframes throw {
    75% {
        transform: rotate(20deg);
    }
    to {
        transform: rotate(0deg);
    }
}

.animation_compensation_2 {
    animation: throw 0.8s ease;
    -webkit-animation: throw 0.8s ease;
    transform-origin: center left;
}

#compensation-red-alert {
    opacity: 0;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}

.compensation-red-alert-active {
    opacity: 1 !important;
}

/* events */
.animation_events_1 {
    -webkit-animation: rotate 0.8s ease;
    animation: rotate 0.8s ease;
    transform-origin: 50%;
    fill: #ff5722;
    stroke: #ff5722;
}

.animation_events_2 {
    -webkit-animation: bloat 0.5s ease;
    animation: bloat 0.5s ease;
    transform-origin: 50%;
}

/* offers */
@-webkit-keyframes bumpUp {
    50% {
        -webkit-transform: translate(0, 5px);
        transform: translate(0, 5px);
    }
}

@keyframes bumpUp {
    50% {
        -webkit-transform: translate(0, 5px);
        transform: translate(0, 5px);
    }
}

@-webkit-keyframes bumpDown {
    50% {
        -webkit-transform: translate(0, -5px);
        transform: translate(0, -5px);
    }
}

@keyframes bumpDown {
    50% {
        -webkit-transform: translate(0, -5px);
        transform: translate(0, -5px);
    }
}

@-webkit-keyframes rotate {
    50% {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }
}

@keyframes rotate {
    50% {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }
}

.animation_offers_1, .animation_offersmenu_1 {
    -webkit-animation: bumpDown 1.3s ease;
    animation: bumpDown 1.3s ease;
}

.animation_offers_2, .animation_offersmenu_2 {
    -webkit-animation: bumpUp 1.3s ease;
    animation: bumpUp 1.3s ease;
}

.animation_offers_3, .animation_offersmenu_3 {
    -webkit-animation: rotate 1.3s ease;
    animation: rotate 1.3s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

/* alterations */
.animation_alterations_1 {
    animation: throw 0.8s ease;
    -webkit-animation: throw 0.8s ease;
    transform-origin: center center;
}

.animation_alterations_2 {
    -webkit-animation: rotate 1.3s ease;
    animation: rotate 1.3s ease;
    transform-origin: center center;
}
/* pass */
@-webkit-keyframes bloat {
    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }
}

@keyframes bloat {
    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }
}

@-webkit-keyframes bloatAlt {
    50% {
        -webkit-transform: translate(20px, 0);
        transform: translate(20px, 0);
    }
}

@keyframes bloatAlt {
    50% {
        -webkit-transform: translate(20px, 0);
        transform: translate(20px, 0);
    }
}

.animation_communications_1,
.animation_communicationsAlt_1 {
    -webkit-animation: bloat 1.3s ease;
    animation: bloat 1.3s ease;
    -webkit-transform-origin: 0 70%;
    transform-origin: 0 70%;
}

.animation_communications_2 {
    -webkit-animation: bloatAlt 1.3s ease;
    animation: bloatAlt 1.3s ease;
    -webkit-transform-origin: 20% 50%;
    transform-origin: 20% 50%;
}

.animation_communicationsAlt_2 {
    -webkit-animation: rotateCog 1.3s linear;
    animation: rotateCog 1.3s linear;
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform-box: fill-box;
    transform-box: fill-box;
}

@-webkit-keyframes rotateCog {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes rotateCog {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes wobble {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.animation_wash_1 {
    -webkit-animation: trickle 0.5s ease-in-out;
    animation: trickle 0.5s ease-in-out;
}

.animation_wash_2 {
    -webkit-animation: trickle 0.8s ease-in-out;
    animation: trickle 0.8s ease-in-out;
}

.animation_wash_3 {
    -webkit-animation: trickle 1.3s ease-in-out;
    animation: trickle 1.3s ease-in-out;
}

.animation_wash_4 {
    -webkit-animation: trickle 1.3s ease-in-out;
    animation: trickle 1.3s ease-in-out;
}

/* stations */
@-webkit-keyframes smallCloud {
    50% {
        -webkit-transform: translate(-5px, 3px);
        transform: translate(-5px, 3px);
    }
}

@keyframes smallCloud {
    50% {
        -webkit-transform: translate(-5px, 3px);
        transform: translate(-5px, 3px);
    }
}

@-webkit-keyframes stationCloud {
    50% {
        -webkit-transform: translate(0px, 3px);
        transform: translate(0px, 3px);
    }
}

@keyframes stationCloud {
    50% {
        -webkit-transform: translate(0px, 3px);
        transform: translate(0px, 3px);
    }
}

.animation_station_1 {
    opacity: 1 !important;
    -webkit-animation: stationCloud 0.8s ease;
    animation: stationCloud 0.8s ease;
}

.animation_station_2 {
    opacity: 1 !important;
    -webkit-animation: stationCloud 1.3s ease;
    animation: stationCloud 1.3s ease;
}

.journey_sub_menu .icon_lner, .station_sub_menu .icon_lner{
    width:70%;
    height: 70%;
    max-width: 40px;
}
.lner-icons{
    fill: #ce132e;
    stroke-width: 0;
}

#icon_industrialaction {
    padding: 5px;
}

#icon_station_1,
#icon_station_2 {
    opacity: 0;
    -webkit-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out;
}

/* weather rain */
@-webkit-keyframes raining {
    to {
        -webkit-transform: translate(-5px, 5px);
        transform: translate(-5px, 5px);
    }
}

@keyframes wobble {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

#icon_weather_sub_1 {
    fill: #fff !important;
}

#icon_weather_sub_2 {
    fill: #FFF !important;
}

#icon_weather_sub_3 {
    fill: none;
    stroke: none;
    transition: all 0.3s ease;
}

.animation_weather_sub_1 {
    -webkit-animation: smallCloud .8s ease;
    animation: smallCloud .8s ease;
}

.animation_weather_sub_2 {
    -webkit-animation: smallCloud 1.3s ease;
    animation: smallCloud 1.3s ease;
}

.animation_weather_sub_3 {
    stroke: gold !important;
    fill: gold !important;
}

/* lock padlock */
@-webkit-keyframes moveKey {
    to {
        -webkit-transform: translate(0, -13px);
    }
}

.animation_national_rail_1 {
    -webkit-animation: wobble 0.8s ease;
    animation: wobble 0.8s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    stroke: red;
    fill: red;
    stroke-width: 2px;
}

@-webkit-keyframes rollIn {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes rollIn {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.animation_dish_1,
.animation_cutlery_1,
.animation_food_1{
    -webkit-animation: rollIn 0.5s ease;
    animation: rollIn 0.5s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_dish_2,
.animation_cutlery_2,
.animation_cutlery_3{
    -webkit-animation: rollIn 0.8s ease;
    animation: rollIn 0.8s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_map_1 {
    -webkit-animation: bumpDown 0.5s ease;
    animation: bumpDown 0.5s ease;
    fill: red;
    stroke: red;
}

.animation_pin_1 {
    -webkit-animation: bumpDown 0.5s ease;
    animation: bumpDown 0.5s ease;
}

@-webkit-keyframes shrink {
    50% {
        -webkit-transform: scaleX(0.7);
        transform: scaleX(0.7);
    }
}

@keyframes shrink {
    50% {
        -webkit-transform: scaleX(0.7);
        transform: scaleX(0.7);
    }
}

@-webkit-keyframes shrinkMove {
    50% {
        transform: translateX(-8px);
    }
}

@keyframes shrinkMove {
    50% {
        transform: translateX(-8px);
    }
}

.animation_map_2 {
    -webkit-animation: shrink 0.5s ease;
    animation: shrink 0.5s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    fill: #ffe4c4;
}

.animation_map_3 {
    -webkit-animation: shrink 0.5s ease;
    animation: shrink 0.5s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    fill: #ffe4c4;
}

/* safe travel */
@-webkit-keyframes trickle {
    90% {
        -webkit-transform: translate(0, 40px);
        transform: translate(0, 40px);
    }
    100% {
        -webkit-transform: unset;
        transform: unset;
    }
}

@keyframes trickle {
    90% {
        -webkit-transform: translate(0, 40px);
        transform: translate(0, 40px);
    }
    100% {
        -webkit-transform: unset;
        transform: unset;
    }
}

/*#icon_rentals {*/
/*    height: unset;*/
/*    width: 70%;*/
/*    max-width: var(--sub-menu);*/
/*}*/

.animation_rentals_1 {
    -webkit-animation: shrinkMove 0.5s ease;
    animation: shrinkMove 0.5s ease;
    -webkit-transform-origin: 50%;
    -ms-transform-origin: 50%;
    transform-origin: 50%;
    transition: all 0.5s ease;
    stroke: red;
}

.animation_rentals_2 {
    -webkit-animation: shrink 0.6s ease;
    animation: shrink 0.6s ease;
    -webkit-transform-origin: 50%;
    -ms-transform-origin: 50%;
    transform-origin: 50%;
    stroke: red;
}

.animation_rentals_3 {
    -webkit-animation: shrink 0.8s ease;
    animation: shrink 0.8s ease;
    -webkit-transform-origin: 50%;
    -ms-transform-origin: 50%;
    transform-origin: 50%;
    stroke: red;
}

.animation_wash_1 {
    -webkit-animation: trickle 0.5s ease-in-out;
    animation: trickle 0.5s ease-in-out;
}

.animation_wash_2 {
    -webkit-animation: trickle 0.8s ease-in-out;
    animation: trickle 0.8s ease-in-out;
}

.animation_wash_3 {
    -webkit-animation: trickle 1.3s ease-in-out;
    animation: trickle 1.3s ease-in-out;
}

.animation_wash_4 {
    -webkit-animation: trickle 1.3s ease-in-out;
    animation: trickle 1.3s ease-in-out;
}

/* stations */
@-webkit-keyframes smallCloud {
    50% {
        -webkit-transform: translate(-5px, 3px);
        transform: translate(-5px, 3px);
    }
}

@keyframes smallCloud {
    50% {
        -webkit-transform: translate(-5px, 3px);
        transform: translate(-5px, 3px);
    }
}

@-webkit-keyframes stationCloud {
    50% {
        -webkit-transform: translate(0px, 3px);
        transform: translate(0px, 3px);
    }
}

@keyframes stationCloud {
    50% {
        -webkit-transform: translate(0px, 3px);
        transform: translate(0px, 3px);
    }
}

.animation_station_1 {
    opacity: 1 !important;
    -webkit-animation: stationCloud 0.8s ease;
    animation: stationCloud 0.8s ease;
}

.animation_station_2 {
    opacity: 1 !important;
    -webkit-animation: stationCloud 1.3s ease;
    animation: stationCloud 1.3s ease;
}

#icon_station_1,
#icon_station_2 {
    opacity: 0;
    -webkit-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out;
}

.animation_taxi_1 {
    -webkit-animation: wobble 0.8s ease;
    animation: wobble 0.8s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_feedback_beta_1,
.animation_feedback_trial_1 {
    stroke-dasharray: 2000;
    animation: writeUp 3s reverse;
}

.animation_feedback_beta_2,
.animation_feedback_trial_2 {
    stroke-dasharray: 2000;
    animation: writeUp 3s reverse;
}

.animation_feedback_beta_3,
.animation_feedback_trial_3 {
    animation: slideInUp 0.8s ease;
}

#icon_faqs {
    overflow: hidden;
}

.animation_faqs_1,
.animation_faqs_2 {
    animation: slideInUp 0.8s ease;
}

@keyframes writeUp {
    0% {
        stroke-dashoffset: 0;
    }
    100% {
        stroke-dashoffset: 2000;
    }
}

/* weather rain */
@-webkit-keyframes raining {
    to {
        -webkit-transform: translate(-5px, 5px);
        transform: translate(-5px, 5px);
    }
}

@keyframes raining {
    to {
        -webkit-transform: translate(-5px, 5px);
        transform: translate(-5px, 5px);
    }
}

.weather_rain {
    -webkit-animation: raining linear infinite 1s;
    animation: raining linear infinite 1s;
}

.weather_rain:nth-of-type(even) {
    -webkit-animation: raining linear infinite 0.8s;
    animation: raining linear infinite 0.8s;
}

/* sub menu icons */
.animation_magnifying_glass_1 {
    fill: #c1c1fa;
    stroke: none;
    -webkit-animation: bloat 1.3s ease;
    animation: bloat 1.3s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_magnifying_glass_2 {
    stroke: white;
}

.animation_magnifying_glass_3 {
    fill: #e6d295;
    stroke: #e6d295;
    -webkit-animation: bloat 1.3s ease;
    animation: bloat 1.3s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_journey_glass_1 {
    fill: #c1c1fa;
    stroke: none;
    -webkit-animation: bloat 1.3s ease;
    animation: bloat 1.3s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_journey_glass_2 {
    stroke: white;
}

.animation_journey_glass_3 {
    fill: #e6d295;
    stroke: #e6d295;
    -webkit-animation: bloat 1.3s ease;
    animation: bloat 1.3s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_tram_1 {
    fill: #78ddcc;
    stroke: #78ddcc;
    -webkit-animation: bumpUpBig 0.5s ease-in-out;
    animation: bumpUpBig 0.5s ease-in-out;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_tram_2,
.animation_tram_3 {
    stroke: white;
    fill: none;
    -webkit-animation: wobble 0.8s ease;
    animation: wobble 0.8s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_tram_4,
.animation_tram_5 {
    stroke-width: 4px;
    fill: none;
    stroke: white;
    -webkit-animation: bumpUpBig 0.5s ease-in-out;
    animation: bumpUpBig 0.5s ease-in-out;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_tram_6,
.animation_tram_7 {
    stroke: #78ddcc;
    stroke-width: 4px;
    fill: none;
}

.animation_tram_8 {
    fill: none;
    stroke: #78ddcc;
    stroke-width: 4px;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_dlr_1 {
    stroke: #78ddcc;
    fill: #78ddcc;
    -webkit-animation: rollIn 0.5s ease;
    animation: rollIn 0.5s ease;
}

.animation_dlr_2 {
    fill: #fff;
    stroke: #fff;
    -webkit-animation: rollIn 0.5s ease;
    animation: rollIn 0.5s ease;
}

.animation_dlr_3 {
    fill: #5e70f7 !important;
    -webkit-animation: rollIn 0.8s ease;
    animation: rollIn 0.8s ease;
    stroke: #5e70f7 !important;
}

.animation_rainbow_1 {
    fill: none;
    stroke-width: 4px;
    stroke: red;
    -webkit-animation: stagger 0.8s ease-in-out;
    animation: stagger 0.8s ease-in-out;
}

.animation_rainbow_2 {
    fill: none;
    stroke-width: 4px;
    stroke: blue;
    -webkit-animation: stagger 0.3s ease-in-out;
    animation: stagger 0.3s ease-in-out;
}

.animation_rainbow_3 {
    fill: none;
    stroke-width: 4px;
    stroke: yellow;
    -webkit-animation: stagger 0.5s ease-in-out;
    animation: stagger 0.5s ease-in-out;
}

.animation_rainbow_4,
.animation_rainbow_5 {
    fill: #d2d2f8;
    stroke-width: 4px;
    stroke: #d2d2f8;
}

@keyframes bumpRight {
    50% {
        transform: translate(-5px, 0);
    }
}

.animation_busstation_1 {
    animation: bumpRight 0.7s ease;
}

.animation_busstation_2 {
    animation: bumpRight 0.9s ease;

}

.animation_busstation_3 {
    animation: bumpRight 1s ease;
}

#icon_live_1 {
    fill: #dd4b4b;
    stroke: none;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_live_1 {
    -webkit-animation: bumpUpBig 1s ease infinite;
    animation: bumpUpBig 1s ease infinite;
}

#icon_live_2 {
    fill: #f8c449;
    stroke: none;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_live_2 {
    -webkit-animation: bumpUpBig 1s ease infinite;
    animation: bumpUpBig 1s ease infinite;
}
.animation_login_1 {
    fill: #c2bfe1;
    stroke: #c2bfe1;
    -webkit-animation: rollIn 0.8s ease;
    animation: rollIn 0.8s ease;
}
.animation_info_1 {
    fill: #c2bfe1;
    stroke: #c2bfe1;
    -webkit-animation: rollIn 0.8s ease;
    animation: rollIn 0.8s ease;
}

.animation_info_2 {
    fill: white;
    stroke: none;
    -webkit-animation: bumpUpBig 0.8s ease-in-out;
    animation: bumpUpBig 0.8s ease-in-out;
}

.animation_info_3 {
    fill: white;
    stroke: none;
    -webkit-animation: bumpUpBig 0.5s ease-in-out;
    animation: bumpUpBig 0.5s ease-in-out;
}

.animation_journeyInfo_1 {
    fill: #c2bfe1;
    stroke: #c2bfe1;
    -webkit-animation: rollIn 0.8s ease;
    animation: rollIn 0.8s ease;
}

.animation_journeyInfo_2 {
    fill: white;
    stroke: none;
    -webkit-animation: bumpUpBig 0.8s ease-in-out;
    animation: bumpUpBig 0.8s ease-in-out;
}

.animation_journeyInfo_3 {
    fill: white;
    stroke: none;
    -webkit-animation: bumpUpBig 0.5s ease-in-out;
    animation: bumpUpBig 0.5s ease-in-out;
}

.animation_tube_1 {
    fill: #dd4b4b;
    stroke: #dd4b4b;
    -webkit-animation: rollIn 0.5s ease;
    animation: rollIn 0.5s ease;
}

.animation_tube_2 {
    fill: #fff;
    stroke: #fff;
    -webkit-animation: rollIn 0.5s ease;
    animation: rollIn 0.5s ease;
}

.animation_tube_3 {
    fill: #5e70f7 !important;
    stroke: #5e70f7 !important;
    -webkit-animation: rollIn 0.8s ease;
    animation: rollIn 0.8s ease;
}

/* river tfl transport */
.animation_river_1 {
    fill: none;
    stroke-width: 5px;
    stroke: #78ddcc;
    -webkit-animation: bumpUp 0.5s ease;
    animation: bumpUp 0.5s ease;
}

.animation_river_3 {
    stroke-width: 3px;
    stroke: #78ddcc;
    fill: #78ddcc;
    -webkit-animation: bumpUp 1s ease;
    animation: bumpUp 1s ease;
}

.animation_river_2 {
    stroke-width: 2px;
    stroke: #78ddcc !important;
    fill: #fff;
    -webkit-animation: bumpUp 0.8s ease;
    animation: bumpUp 0.8s ease;
}

.animation_river_4 {
    fill: #0099CB;
    stroke: #0099CB;
    -webkit-animation: rollIn 0.5s ease;
    animation: rollIn 0.5s ease;
}

.animation_river_5 {
    fill: #fff;
    stroke: #fff;
    -webkit-animation: rollIn 0.5s ease;
    animation: rollIn 0.5s ease;
}

.animation_river_6 {
    fill: #0A259B !important;
    stroke: #0A259B !important;
    -webkit-animation: rollIn 0.8s ease;
    animation: rollIn 0.8s ease;
}

.animation_walk_1 {
    fill: #70b2d0;
    stroke: none;
    -webkit-animation: bloat 0.5s ease;
    animation: bloat 0.5s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_super_pin_1 {
    -webkit-animation: wobble 0.8s ease-in-out;
    animation: wobble 0.8s ease-in-out;
    stroke: none;
}

.animation_super_pin_2 {
    fill: #dd4b4b;
    stroke: none;
}

.animation_pin_1 {
    -webkit-animation: wobble 0.8s ease-in-out;
    animation: wobble 0.8s ease-in-out;
    stroke: none;
}

.animation_pin_2 {
    fill: #dd4b4b;
    stroke: none;
}

#icon_weather_sub_2 {
    fill: #FFF !important;
}

#icon_weather_sub_3 {
    fill: none;
    stroke: none;
    transition: all 0.3s ease;
}

.animation_weather_sub_1 {
    -webkit-animation: smallCloud .8s ease;
    animation: smallCloud .8s ease;
    fill: #fff;
}

.animation_weather_sub_2 {
    -webkit-animation: smallCloud 1.3s ease;
    animation: smallCloud 1.3s ease;
}

.animation_weather_sub_3 {
    stroke: gold !important;
    fill: gold !important;
}

/* lock padlock */
@-webkit-keyframes moveKey {
    to {
        -webkit-transform: translate(0, -13px);
    }
}

@keyframes moveKey {
    to {
        -webkit-transform: translate(0, -13px);
        transform: translate(0, -13px);
    }
}

@-webkit-keyframes lock {
    to {
        -webkit-transform: translate(0, 7px);
    }
}

@keyframes lock {
    90% {
        -webkit-transform: translate(0, 7px);
        transform: translate(0, 7px);
    }
    to {
        -webkit-transform: translate(0, 0px);
        transform: translate(0, 0px);
    }
}

.element-animation {
    animation: animationFrames linear 4s;
    animation-iteration-count: 1;
    transform-origin: 50% 50%;
    -webkit-animation: animationFrames linear 4s;
    -webkit-animation-iteration-count: 1;
    -webkit-transform-origin: 50% 50%;
    -moz-animation: animationFrames linear 4s;
    -moz-animation-iteration-count: 1;
    -moz-transform-origin: 50% 50%;
    -o-animation: animationFrames linear 4s;
    -o-animation-iteration-count: 1;
    -o-transform-origin: 50% 50%;
}

.animation_privacy_1 {
    animation: lock 0.5s ease;
    animation-iteration-count: 1;
    transform-origin: 50%;
    -webkit-animation: lock 0.5s ease;
    -webkit-transform-origin: 50%;
    -webkit-animation-iteration-count: 1;
    -moz-animation: lock 0.5s ease;
    -moz-transform-origin: 50%;
    -moz-animation-iteration-count: 1;
}

.animation_privacy_2 {
    /* -webkit-animation: moveKey 0.8s ease;
  animation: moveKey 0.8s ease; */
    transform-origin: 50%;
    -webkit-transform-origin: 50%;
}

.animation_privacy_3 {
    -webkit-animation: bloat 0.8s ease;
    transform-origin: 50%;
    animation: bloat 0.8s ease;
    -webkit-transform-origin: 50%;
}

/* survey */
.animation_survey_1 {
    -webkit-animation: bloat 0.8s ease;
    transform-origin: 50%;
    animation: bloat 0.8s ease;
    -webkit-transform-origin: 50%;
}

.animation_survey_2 {
    -webkit-animation: stagger 0.8s ease;
    animation: stagger 0.8s ease;
}

.animation_survey_3 {
    -webkit-animation: stagger 1.3s ease;
    animation: stagger 1.3s ease;
}

.animation_survey_4 {
    -webkit-animation: stagger 0.5s ease;
    animation: stagger 0.5s ease;
}

.animation_survey_5 {
    -webkit-animation: stagger 1s ease;
    animation: stagger 0.8s ease;
}

@-webkit-keyframes rails {
    to {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
    }
}

@keyframes rails {
    to {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
    }
}

/* train */
.animation_train_3 {
    -webkit-animation: wobble 0.8s ease;
    animation: wobble 0.8s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_train_1 {
    -webkit-animation: rails 0.6s linear;
    animation: rails 0.6s linear;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_train_2 {
    -webkit-animation: stagger .8s linear;
    animation: stagger .8s linear;
}

/* fadeIn */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.toggle-content-icon,
.alterations-icon,
.feedback-terms-icon {
    position: absolute;
    width: 35px;
    height: 100%;
    right: 22px;
    top: 0;
    background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='white' stroke='black' stroke-width='2px' d='M33.79,73.82,55.9,52.61a3.65,3.65,0,0,0,0-5.27L33.77,26.18a10.14,10.14,0,0,1,2.47-11.6l33.6,31a5.83,5.83,0,0,1,0,8.55L36.27,85.42S33.79,85.33,33.79,73.82Z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    transform: rotate(90deg);
}
@keyframes card0 {
    50% {
        transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -ms-transform: scale(0.9);
        -moz-transform: scale(0.9);

    }
    90% {
        transform: scale(0.9) rotate3d(1, 0, 0, 0deg);
        -webkit-transform: scale(0.9) rotate3d(1, 0, 0, 0deg);
        -ms-transform: scale(0.9) rotate3d(1, 0, 0, 0deg);
        -moz-transform: scale(0.9) rotate3d(1, 0, 0, 0deg);
    }
    to {
        transform: translateZ(60px) rotate3d(1, 0, 0, 0deg) scale(1);
        -webkit-transform: translateZ(60px) rotate3d(1, 0, 0, 0deg) scale(1);
        -ms-transform: translateZ(60px) rotate3d(1, 0, 0, 0deg) scale(1);
        -moz-transform: translateZ(60px) rotate3d(1, 0, 0, 0deg) scale(1);
    }

}

@keyframes scaleCard {
    50% {
        width: 90%;
        margin-left: 5%;
        height: 90%;
    }
}

@keyframes card1 {
    50% {
        transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -ms-transform: scale(0.9);
        -moz-transform: scale(0.9);

    }
    90% {
        transform: scale(0.9) rotate3d(1, 0, 0, -90deg);
        -webkit-transform: scale(0.9) rotate3d(1, 0, 0, -90deg);
        -ms-transform: scale(0.9) rotate3d(1, 0, 0, -90deg);
        -moz-transform: scale(0.9) rotate3d(1, 0, 0, -90deg);
    }
    to {
        transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -90deg);
        -webkit-transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -90deg);
        -ms-transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -90deg);
        -moz-transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -90deg);
    }
}

@keyframes card2 {
    50% {
        transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -ms-transform: scale(0.9);
        -moz-transform: scale(0.9);
    }
    90% {
        transform: scale(0.9) rotate3d(1, 0, 0, -180deg);
        -webkit-transform: scale(0.9) rotate3d(1, 0, 0, -180deg);
        -ms-transform: scale(0.9) rotate3d(1, 0, 0, -180deg);
        -moz-transform: scale(0.9) rotate3d(1, 0, 0, -180deg);
    }
    to {
        transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -180deg);
        -webkit-transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -180deg);
        -ms-transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -180deg);
        -moz-transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -180deg);
    }
}

@keyframes card3 {
    50% {
        transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -ms-transform: scale(0.9);
        -moz-transform: scale(0.9);
    }
    90% {
        transform: scale(0.9) rotate3d(1, 0, 0, -270deg);
        -webkit-transform: scale(0.9) rotate3d(1, 0, 0, -270deg);
        -ms-transform: scale(0.9) rotate3d(1, 0, 0, -270deg);
        -moz-transform: scale(0.9) rotate3d(1, 0, 0, -270deg);
    }
    to {
        transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -270deg);
        -webkit-transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -270deg);
        -ms-transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -270deg);
        -moz-transform: translateZ(60px) scale(1) rotate3d(1, 0, 0, -270deg);
    }
}

.card_rotate-0 {
    /*transform:rotate3d(1, 0, 0, 0deg);*/
    /*-webkit-transform:rotate3d(1, 0, 0, 0deg);*/
    /*-ms-transform:rotate3d(1, 0, 0, 0deg);*/
    /*-moz-transform:rotate3d(1, 0, 0, 0deg);*/
    /*transition: all 0.8s ease;*/
    left:0vw;
    /*transform: unset;*/
    /*transform: translateZ(0px);*/
}

.card_rotate-1 {
    /*transform: rotate3d(1, 0, 0, -90deg);*/
    /*-webkit-transform: rotate3d(1, 0, 0, -90deg);*/
    /*-ms-transform: rotate3d(1, 0, 0, -90deg);*/
    /*-moz-transform: rotate3d(1, 0, 0, -90deg);*/
    left:-100vw;
    /*transition: all 0.8s ease;*/
}

.card_rotate-2 {
    /*transform: rotate3d(1, 0, 0, -180deg);*/
    /*-webkit-transform: rotate3d(1, 0, 0, -180deg);*/
    /*-ms-transform: rotate3d(1, 0, 0, -180deg);*/
    /*-moz-transform: rotate3d(1, 0, 0, -180deg);*/
    left:-200vw;
    /*transition: all 0.8s ease;*/
}

.card_rotate-3 {
    /*transform: rotate3d(1, 0, 0, -270deg);*/
    /*-webkit-transform: rotate3d(1, 0, 0, -270deg);*/
    /*-ms-transform: rotate3d(1, 0, 0, -270deg);*/
    /*-moz-transform: rotate3d(1, 0, 0, -270deg);*/
    left:-300vw;
    /*transition: all 0.8s ease;*/
}
.card_rotate-4 {
    left:-400vw;
}
.card_rotate-5 {
    left:-500vw;
}
.card_rotate-6 {
    left:-600vw;
}
@media screen and (min-width:1100px) {
    .card_rotate-0 {
        left: 0%;
    }

    .card_rotate-1 {
        left: -100%;
    }

    .card_rotate-2 {
        left: -200%;
    }

    .card_rotate-3 {
        left: -300%;
    }

    .card_rotate-4 {
        left: -400%;
    }

    .card_rotate-5 {
        left: -500%;
    }

    .card_rotate-6 {
        left: -600%;
    }
}
@media screen and (min-width:1200px) {
    .card_rotate-1 {
        left:calc(-1 * 1200px);
    }
    .card_rotate-2 {
        left:calc(-2 * 1200px);
    }
    .card_rotate-3 {
        left:calc(-3 * 1200px);
    }
    .card_rotate-4 {
        left:calc(-4 * 1200px);
    }
    .card_rotate-5 {
        left:calc(-5 * 1200px);
    }
    .card_rotate-6 {
        left:calc(-6 * 1200px);
    }
}
@-webkit-keyframes ticker-tape-scrolling {
    0% {
        left: 0
    }
    50% {
        left: 0;
    }
    100% {
        left: -75%
    }
}

@keyframes ticker-tape-scrolling {
    0% {
        left: 0
    }
    50% {
        left: 0;
    }
    100% {
        left: -75%
    }
}

/* logo.css */
.logo_northern {
    fill: var(--northern);
}

.logo_gwr {
    fill: var(--gwr);
}

.logo_lner {
    fill: var(--lner);
}
.logo_northern {
    fill: var(--northern);
}

.logo_gwr {
    fill: var(--gwr);
}

.logo_lner {
    fill: var(--lner);
}
/*icons navigation*/
/*.hugeiconSub {*/
/*    filter: drop-shadow(0px 0px .5px #484848);*/
/*    -webkit-filter: drop-shadow(0px 0px .5px #484848);*/
/*}*/
.TOCGR .hugeiconSub {
    filter: none;
    -webkit-filter: none;
}

.hideMePlease {
    display: none !important;
    visibility: hidden !important;
    /*background-color: indianred;*/
    /*border-color: orange;*/
}
@-webkit-keyframes fadeForPanel {
    0% {
        opacity: 1;
    }
    25% {
        opacity: 1;
    }
    75% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@keyframes fadeForPanel {
    0% {
        opacity: 1;
    }
    25% {
        opacity: 1;
    }
    75% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes slideInUp {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInUp {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
@-webkit-keyframes slideOutDown {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        -webkit-transform: translate3d(0, 110%, 0);
        transform: translate3d(0, 110%, 0);
    }
}
@keyframes slideOutDown {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        -webkit-transform: translate3d(0, 110%, 0);
        transform: translate3d(0, 110%, 0);
    }
}
@-webkit-keyframes slideInLeft {
    from {
        -webkit-transform: translate3d(-100%, 0,  0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
@keyframes slideInLeft {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
@-webkit-keyframes slideOutLeft {
    from {
        -webkit-transform: translate3d(0%, 0, 0);
        transform: translate3d(0%, 0, 0);
    }
    to {
        -webkit-transform: translate3d(-110%, 0, 0);
        transform: translate3d(-110%, 0, 0);
    }
}
@keyframes slideOutLeft {
    from {
        -webkit-transform: translate3d(0%, 0, 0);
        transform: translate3d(0%, 0, 0);
    }
    to {
        -webkit-transform: translate3d(-110%, 0, 0);
        transform: translate3d(-110%, 0, 0);
    }
}
.icon_svg {
    overflow: visible;
    max-width: 250px;
}
.cls-1,
.solid-fill {
    stroke: #000;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.cls-1 {
    fill: none;
    stroke-width: 3px;
}
.solid-fill {
    fill: #fff !important;
}
.no-fill {
    fill: none;
}
.cls-2 {
    fill: var(--gc);
}
.TOCGR .cls-2 {
    fill:var(--lner);
}

#icon_footways .cls-1,
#icon_footways_breadcrumb .cls-1
{
    fill: #ff7376;
}
#icon_footways .cls-1, .cls-2,
#icon_footways_breadcrumb .cls-1, .cls-2
{
    stroke-width: 0px;
}

#icon_footways .cls-2,
#icon_footways_breadcrumb .cls-2
{
    fill: #ff7276;
}
@media screen and (min-width:1100px) {
    .TOCGR .cls-2 {
        fill:#FFF;
    }
}

/*
#icon_journey, #icon_communications, #icon_map,#icon_dish {
  stroke:#fd0000 !important;
} */
.cross {
    fill: none;
    stroke: red;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 3px;
}

.tick {
    fill: none;
    stroke: #00ad00;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 3px;
}

/* survey icon styling (header) */
.surveyDefault {
    stroke: #FFF !important;
}

#surveyDefault:hover {
    cursor: pointer;
}

.checkbox {
    fill: none;
    stroke-width: 2px;
    stroke: #FFF;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.surveyDefault_circle_big {
    display: block;
    /* fill:var(--colorTheme); */
}

.surveyDefault_circle_small {
    display: block;
    /* fill:var(--colorTheme); */
}

.surveyDefault_circle_big {
    display: none;
}

.icon_survey_status {
    fill: red;
    stroke: none;
    display: none;
}

#surveyDefault {
    max-width: 60%;
    filter: drop-shadow(0 0 3px #000);
    -webkit-filter: drop-shadow(0 0 3px #000);
}
.TOCGR #surveyDefault {
    filter: none;
    -webkit-filter: none;
}

@media only screen and (min-width: 768px) {
    .surveyDefault_circle_small {
        display: block;
    }

    .surveyDefault_circle_big {
        display: none;
    }
}
#icon_send {
    height: 60px;
}

@keyframes flyPlane {
    to {
        transform: translate(155px, -155px);
        -webkit-transform: translate(155px, -155px);
    }
}

.send-animation {
    animation: flyPlane 1.3s ease;
}


.main_item_icons {
    padding: var(--template-padding) 0 0 0;
    width: 100%;
    display: grid;
    grid-template-areas: "subs send";

    grid-template-columns: auto -webkit-min-content;
    grid-template-columns: auto min-content;
    /* justify-content:flex-end; */
}

.main_item_icons svg {
    grid-row: 1;
    grid-column: 2;
    justify-self: flex-end;
    grid-area: send;
    /* height:55px; */
}

.main_item_icons-sub {
    grid-row: 1;
    grid-column: 1;
    display: -webkit-box;
    display: flex;
    width: auto;
    flex-wrap: wrap;
    grid-area: subs;
}

.main_item_icons-sub svg {
    width: 50px;
    margin: calc(var(--template-padding) / 2);
}

.main_item_icons-sub svg:hover {
    cursor: pointer;
}
.TOCSW .app footer #moreFooter ul #footerButtonfeedback #aforfooterButtonfeedback svg #icon_feedback_trial_2 path {
    fill: var(--sw);
}

.TOCGC .app footer #moreFooter ul #footerButtonfeedback #aforfooterButtonfeedback svg .icon_group path:last-child {
    fill: var(--gc);
}

.TOCES .app footer #moreFooter ul #footerButtonfeedback #aforfooterButtonfeedback svg .icon_group path:last-child {
    fill: var(--es);
}

.TOCRT .app footer #moreFooter ul #footerButtonfeedback #aforfooterButtonfeedback svg .icon_group path:last-child {
    fill: var(--nr);
}

TOCGC .app header .header_seat .icon_svg .surveyDefault_circle_small, .TOCGC .app header .header_seat .icon_svg .surveyDefault_circle_big {
    /* fill:var(--gc) !important; */
    fill: var(--gc) !important;
}

.TOCSW .app header .header_seat .icon_svg .surveyDefault_circle_small, .TOCSW .app header .header_seat .icon_svg .surveyDefault_circle_big {
    /* fill:var(--gc) !important; */
    fill: var(--sw) !important;
}

.TOCES .app header .header_seat .icon_svg .surveyDefault_circle_small, .TOCES .app header .header_seat .icon_svg .surveyDefault_circle_big {
    /* fill:var(--gc) !important; */
    fill: var(--es) !important;
}

.TOCGC .app header .header_weather .icon_svg .geolocation path:nth-of-type(3) {
    fill: var(--gc) !important;
}

.TOCES .app header .header_seat .icon_svg .surveyDefault_circle_small, .TOCES .app header .header_seat .icon_svg .surveyDefault_circle_big {
    fill: var(--es) !important;
}

.TOCES .app header .header_weather .icon_svg .geolocation path:nth-of-type(3) {
    fill: var(--es) !important;
}
.TOCNT .app header .header_seat .icon_svg .surveyDefault_circle_small, .TOCNT .app header .header_seat .icon_svg .surveyDefault_circle_big {
    fill: var(--northern) !important;
}
.TOCNT .app header .header_weather .icon_svg .geolocation path:nth-of-type(3) {
    fill: var(--northern) !important;
}
.TOCRT .app header .header_seat .icon_svg .surveyDefault_circle_small, .TOCRT .app header .header_seat .icon_svg .surveyDefault_circle_big {
    fill: var(--nr) !important;
}

.TOCRT .app header .header_weather .icon_svg .geolocation path:nth-of-type(3) {
    fill: var(--nr) !important;
}
.TOCSS .app header .header_seat .icon_svg .surveyDefault_circle_small, .TOCSS .app header .header_seat .icon_svg .surveyDefault_circle_big {
    fill: var(--northern) !important;
}

.TOCSS .app header .header_weather .icon_svg .geolocation path:nth-of-type(3) {
    fill: var(--northern) !important;
}
.TOCGR .app header .header_seat .icon_svg .surveyDefault_circle_small,
.TOCGR .app header .header_seat .icon_svg .surveyDefault_circle_big {
    fill: var(--lner) !important;
}

.TOCGR .app header .header_weather .icon_svg .geolocation path:nth-of-type(3) {
    fill: var(--lner) !important;
}
.TOCHT .app header .header_seat .icon_svg .surveyDefault_circle_small,
.TOCHT .app header .header_seat .icon_svg .surveyDefault_circle_big {
    fill: var(--ht) !important;
}

.TOCHT .app header .header_weather .icon_svg .geolocation path:nth-of-type(3) {
    fill: var(--ht) !important;
}
.TOCNT .app header .header_seat .icon_svg .surveyDefault_circle_small,
.TOCNT .app header .header_seat .icon_svg .surveyDefault_circle_big {
    fill: var(--northern) !important;
}

.TOCNT .app header .header_weather .icon_svg .geolocation path:nth-of-type(3) {
    fill: var(--northern) !important;
}
#surveyDefault .foodDefault {
    display: none;
}
.TOCGC .app header .header_seat #surveyDefault .surveyDefault {
    display: none;
}

.TOCGC .app header .header_seat #surveyDefault .foodDefault {
    display: block;
    stroke: var(--gc-secondary);
}
@media screen and (min-width: 768px) {
    .TOCGC .app header .header_seat #surveyDefault .foodDefault path:nth-of-type(1) {
        fill: var(--gc);
    }
}


.TOCGC .app header .header_seat #surveyDefault .icon_survey_status {
    display: none !important;
}
.animation_activate_1 {
    animation: bumpDown 0.3s ease;
    -webkit-animation: bumpDown 0.3s ease;
    transform-origin: 50%;
}

.animation_activate_2 {
    animation: bumpUpBig 0.2s ease;
    -webkit-animation: bumpUpBig 0.2s ease;
    transform-origin: 50%;
}

.animation_activate_3 {
    animation: bumpUpBig 0.3s ease;
    -webkit-animation: bumpUpBig 0.3s ease;
    transform-origin: 50%;
}
.hide-gradient {
    opacity: 0 !important;
    visibility: hidden;
}
#icon_activate_sched_1 {
    opacity: 0;
}

.animation_activate_sched_1 {
    opacity: 1;
}
@keyframes activateUnit {
    20% {
        transform: scale(1.2);
    }
    40% {
        transform: scale(0.9);
    }
    60% {
        transform: scale(1.1);
    }
    80% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1.2);
    }
}
#icon_bus1,
#icon_bus3,
#icon_bus4,
#icon_bus2,
#icon_bus5,
#icon_bus6,
#icon_bus7 {
    height: 100%;
    position: absolute;
}

#icon_super_pin_2 {
    fill: red;
}

.icon_customJourney {
    /*display:none;*/
    text-align: center;
    font-size: 1.8rem;
    line-height: 2;
}
.hugeNoticonSubv2 {
    display: none !important;
}

/*.hugeIconIsPickedv2 {*/
/*    border: 1px black solid !important;*/
/*}*/
.animation_plan_1 {
    -webkit-animation: bumpUp 0.8s ease;
    animation: bumpUp 0.8s ease;
}

.animation_plan_2 {
    -webkit-animation: slideInUp 0.8s ease;
    animation: slideInUp 0.8s ease;
}
.animation_industrialaction_1,
.animation_industrialaction_2 {
    animation: industrialaction1 0.8s ease;
    transform-origin: center;
}

.animation_industrialaction_3 {
    animation: industrialaction2 0.8s ease;
    transform-origin: center;
}


@keyframes industrialaction1 {
    0% {
        transform: scale(0.9);
    }
    50% {
        transform: scale(1.15);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes industrialaction2 {
    0% {
        transform: scale(0.9);
    }
    50% {
        transform: scale(1.30);
    }

    100% {
        transform: scale(1);
    }
}

.animation_athletics_1,
.animation_paraathletics_1 {
    animation: trackRun 1.3s ease;
    transform-origin: center;
}

@keyframes trackRun {
    30% {
        transform: rotate(-30deg)
    }
    60% {
        transform: translate3d(125%, 0, 0) rotate(0deg)
    }
    100% {
        transform: translate3d(125%, 0, 0) rotate(0deg)
    }
}

.animation_badminton_1 {
    animation: spinOffRight 1.3s linear;
    transform-origin: center;
}

@keyframes spinOffRight {

    30% {
        transform: translate3d(0%, 0%, 0);
    }
    45% {
        transform: translate3d(10%, -20%, 0) rotateZ(-40deg);
    }
    65% {
        transform: translate3d(10%, 10%, 0) rotateZ(-60deg);
    }
    90% {
        transform: translate3d(200%, 20%, 0) rotateZ(200deg);
    }
    100% {
        transform: translate3d(200%, 20%, 0) rotateZ(200deg);
    }
}

.animation_basketball_1 {
    animation: commonwealthBasketball .8s linear;
    transform-origin: center;
    transform-box: fill-box;
}

@keyframes commonwealthBasketball {
    0% {
        transform: translate(0, -100px);
    }
    20% {
        transform: translate(-30px, -10px) rotateZ(-150deg);
    }
    40% {
        transform: translate(-35px, 70px) rotateZ(-300deg);
    }
    60% {
        transform: translate(-40px, 90px) rotateZ(-300deg);
    }
    100% {
        transform: translate(-40px, 90px) rotateZ(-300deg);
    }
}

.animation_bowls_1 {
    animation: rotate 1.3s linear;
    transform-origin: center;
    transform-box: fill-box;
}

@keyframes rotate {
    0% {
        transform: translate3d(-40%, 0, 0) rotateZ(0deg);
    }
    100% {
        transform: translate3d(0%, 0, 0) rotateZ(359deg);
    }
}

.animation_boxing_1 {
    animation: punchLeft 1.3s;
    transform-origin: center;
}

@keyframes punchLeft {
    0% {
        transform: translate3d(0, 0, 0);
    }
    30% {
        transform: translate3d(-10%, 10%, 0);
    }
    45% {
        transform: translate3d(12%, 0, 0);
    }
    80% {
        transform: translate3d(0, 0, 0);
    }
}

.animation_cricket_1 {
    animation: wicketHitRight 1.3s;
    transform-origin: center;
}

@keyframes wicketHitRight {
    20% {
        transform: translate3d(0, -10%, 0) rotateZ(-130deg);
    }
    30% {
        transform: translate3d(10%, -10%, 0) rotateZ(-130deg);
    }
    40% {
        transform: translate3d(0, 0, 0) rotateZ(-10deg);
    }
}

.animation_cricket_2 {
    animation: cricketBowl 1.3s;
    transform-origin: center;
}

@keyframes cricketBowl {
    3% {
        transform: translate3d(0, -10%, 0);
    }
    90% {
        transform: translate3d(150%, 170%, 0);
    }
    100% {
        transform: translate3d(200%, 200%, 0);
    }
}


.animation_trackcycling_1 {
    animation: cycling 1.3s;
}

.animation_mountainbiking_1 {
    animation: cycling 1.3s;
}

.animation_timetrial_1 {
    animation: cycling 1.3s;
}

.animation_roadcycling_1 {
    animation: cycling 1.3s;
}

@keyframes cycling {
    0% {
        transform: translateX(-60%);
    }
    20% {
        transform: translateX(-60%);
    }
    50% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(0%);
    }
}

.animation_diving_1 {
    animation: dive 1.3s;
    transform-origin: center;
    transform-box: fill-box;
}
@keyframes dive {
    0% {
        transform: translate3d(0%, -50%, 0) rotate(-85deg);
    }
    50% {
        transform: translate3d(0%, 300%, 0) rotate(-85deg);
    }
    100% {
        transform: translate3d(0%, 300%, 0) rotate(-85deg);
    }
}

@keyframes wave {
    0% {
        transform: translate3d(0, 0, 0);
    }
    50% {
        transform: translate3d(5%, -5%, 0);
    }
    100% {
        transform: translate3d(0, 0, 0);
    }
}

.animation_gymnasticsArtistic_1 {
    animation: commonwealthGymnasticsArt 1.3s ease;
    transform-origin: center;
    transform-box: fill-box;
}

@keyframes commonwealthGymnasticsArt {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(90deg);
    }
    60% {
        transform: rotate(90deg);
    }
    100% {
        transform: rotate(0deg);
    }
}

.animation_gymnasticsRhythmic_1 {
    animation: Rhythmic .8s linear;
    transform-origin: center;
    transform-box: fill-box;
}

@keyframes Rhythmic {
    0% {
        transform: translate(0px, 0%);
    }
    20% {
        transform: translate(-40%, 0%) rotateZ(-180deg);
    }
    60% {
        transform: translate(20%, 0%) rotateZ(-360deg);
    }
    100% {
        transform: translate(20%, 0%) rotateZ(-360deg);
    }
}

.animation_hockey_2 {
    animation: hockeyStick 1.3s;
    transform-origin: center;
}

@keyframes hockeyStick {
    20% {
        transform: translate3d(0px, 0px, 0);
    }
    30% {
        transform: translate3d(15px, 5px, 0);
    }
}

.animation_hockey_1 {
    animation: hockeyBall 1.3s;
    transform-origin: center;
}

@keyframes hockeyBall {
    30% {
        transform: translate3d(0, 0, 0);
    }
    80% {
        transform: translate3d(150px, 100px, 0);
    }
    100% {
        transform: translate3d(150px, 100px, 0);
    }
}

.animation_judo_1 {
    animation: judoThrow .8s linear;
    transform-origin: center;
    transform-box: fill-box;
}

@keyframes judoThrow {
    0% {
        transform: scale(1)
    }
    60% {
        transform: scale(0.5)
    }
    100% {
        transform: scale(1)
    }
}

.animation_netball_1 {
    animation: netball 0.8s ease;
    transform-origin: center;
}

@keyframes netball {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(0%, 10%, 0) rotateZ(15deg);
    }
}

.animation_powerlifting_1 {
    animation: powerlifting 0.8s ease;
    transform-origin: center;
}

@keyframes powerlifting {
    1% {
        transform: translate3d(0, 20%, 0);
    }
    70% {
        transform: translate3d(0, -15%, 0);
    }
    90% {
        transform: translate3d(0, 0, 0);
    }
}

.animation_autumn-rugby_1 {
    animation: animation_rugby 1.3s linear;
    transform-origin: center;
    transform-box: fill-box;
}

@keyframes animation_rugby {
    40% {
        transform: translate3d(0, -10%, 0) rotateZ(-180deg);
    }
    60% {
        transform: translate3d(0, -20%, 0) rotateZ(-360deg);
    }
    80% {
        transform: translate3d(0, 0, 0) rotateZ(-360deg);
    }
    100% {
        transform: translate3d(0, 0, 0) rotateZ(-360deg);
    }
}

.animation_squash_1 {
    animation: squashCourt 1.3s;
    transform-origin: center;
}

@keyframes squashCourt {
    0% {
        transform: translate3d(-20%, 30%, 0);
    }
    30% {
        transform: translate3d(-50%, 0, 0);
    }
    100% {
        transform: translate3d(5%, 10%, 0);
    }
}

#icon_squash {
    padding: 10%;
}

.animation_swimming_1 {
    animation: swimming1 1.3s ease;
    transform-origin: center;
}

@keyframes swimming1 {
    0% {
        transform: translate3d(0, 0, 0);
    }
    30% {
        transform: translate3d(0, -5%, 0);
    }
    80% {
        transform: translate3d(0, 8%, 0);
    }
    100% {
        transform: translate3d(0, 0, 0);
    }
}
.animation_swimming_2 {
    animation: swimming2 1.3s ease;
    transform-origin: center;
}

@keyframes swimming2 {
    0% {
        transform: translate3d(0, 0, 0);
    }
    50% {
        transform: translate3d(0, -3%, 0);
    }
    100% {
        transform: translate3d(0, 0, 0);
    }
}

.animation_tableTennis_1 {
    animation: tableTennisBat 1.3s;
    transform-origin: center;
}

.animation_tableTennis_2 {
    animation: tableTennisBall 1.3s;
    transform-origin: center;
}

@keyframes tableTennisBat {
    0% {
        transform: translate3d(0, 0, 0);
    }
    30% {
        transform: translate3d(-40%, -5%, 0);
    }
    60% {
        transform: translate3d(30%, 40%, 0);
    }
    100% {
        transform: translate3d(0, 0, 0);
    }
}


@keyframes tableTennisBall {
    0% {
        transform: translate3d(200%, 0, 0);
    }
    40% {
        transform: translate3d(-15%, -10%, 0);
    }
    60% {
        transform: translate3d(200%, -15%, 0);
    }
    100% {
        transform: translate3d(200%, -15%, 0);
    }
}

.animation_triathalon_1 {
    animation: triathalon 1.3s;
}

@keyframes triathalon {
    0% {
        transform: translateX(-30%);
    }
    20% {
        transform: translateX(-30%);
    }
    50% {
        transform: translateX(0%);
    }
}

.animation_volleyball_1,
.animation_football_1{
    animation: volleyball .8s linear;
    transform-origin: center;
    transform-box: fill-box;
}

@keyframes volleyball {
    0% {
        transform: translate(0px, 0%);
    }
    20% {
        transform: translate(0px, -40%) rotateZ(-150deg);
    }
    60% {
        transform: translate(0px, 0%) rotateZ(-360deg);
    }
    100% {
        transform: translate(0px, 0%) rotateZ(-360deg);
    }
}

.animation_weightlifting_1 {
    animation: commonwealthLifting 0.8s ease;
    transform-origin: center;
}

@keyframes commonwealthLifting {
    0% {
        transform: translate3d(0, 100%, 0) rotate(45deg);
    }
    70% {
        transform: translate3d(0, -15%, 0) rotate(45deg);
    }
    90% {
        transform: translate3d(0, 0, 0);
    }
}

.animation_wheelchairBasketball_6 {
    animation: commonwealthBasketball 0.8s ease;
    transform-origin: center;
}

.animation_wrestling_1,
.animation_wrestling_2,
.animation_wrestling_3,
.animation_wrestling_4,
.animation_wrestling_5 {
    animation: commonwealthWrestling 1.3s linear;
    transform-origin: center;
}

@keyframes commonwealthWrestling {
    20% {
        transform: rotateZ(0deg) translate3d(5%, 0, 0);
    }
    40% {
        transform: rotateZ(-20deg) translate3d(5%, 0, 0);
    }
    60% {
        transform: rotateZ(-20deg) translate3d(-15%, 20%, 0);
    }
}

.event-schedule-title-venue-popin {
    animation: visiblePopin 2.2s;
}

@keyframes visiblePopin {
    0% {
        transform: translateX(-200%);
    }
    10% {
        transform: translateX(-200%);
    }
    20% {
        transform: translateX(0%);
    }
    50% {
        transform: translateX(0%);
    }
    70% {
        transform: translateX(0%);
    }
    90% {
        transform: translateX(-200%);
    }
    100% {
        transform: translateX(-200%);
    }

}

@keyframes addPopin {
    0% {
        transform: translateX(-300%);
    }
    10% {
        transform: translateX(-300%);
    }
    100% {
        transform: translateX(0%);
    }
}
@keyframes addBreadcrumbPopin {
    0% {
        transform: translateY(110%);
    }
    10% {
        transform: translateY(110%);
    }
    80% {
        transform: translateY(-10%);
    }
    100% {
        transform: translateY(0%);
    }
}
@keyframes addBreadcrumbPopinFirst {
    0% {
        transform: translateY(100%);
    }
    10% {
        transform: translateY(100%);
    }
    80% {
        transform: translateY(-20%);
    }
    100% {
        transform: translateY(0%);
    }
}

@keyframes removePopin {
    0% {
        transform: translateX(0%);
    }
    90% {
        transform: translateX(-500%);
    }
    100% {
        transform: translateX(-500%);
    }
}
@keyframes scaleTablet {
    0% {
        transform: scale(3);
    }
    100% {
        transform: translate3d(0, -9.5vh, 0) scale(1);
    }
}

@-webkit-keyframes scaleTablet {
    0% {
        transform: scale(3);
    }
    100% {
        transform: translate3d(0, -9.5vh, 0) scale(1);
    }
}

@keyframes scaleMob {
    0% {
        transform: scale(3);
    }
    100% {
        transform: translate3d(0, -9.5vh, 0) scale(0.9);
    }
}

@-webkit-keyframes scaleMob {
    0% {
        transform: scale(3);
    }
    100% {
        transform: translate3d(0, -9.5vh, 0) scale(0.9);
    }
}

@-webkit-keyframes scaleDesktop {
    0% {
        transform: scale(3);
    }
    100% {
        transform: translate3d(8.5em, -9.5vh, 0) scale(0.8);
    }
}

@keyframes scaleDesktop {
    0% {
        transform: scale(3);
    }
    100% {
        transform: translate3d(8.5em, -9.5vh, 0) scale(0.8);
    }
}
@keyframes fadeOutUp {
    0% {
        opacity: 1;
    }
    80% {
        opacity: 0.7;
        transform: translate3d(0, calc(-50vh + 70px), 0) scale(0.5);
    }
    100% {
        opacity: 0;
        transform: translate3d(0, calc(-50vh + 70px), 0) scale(0.5);
    }
}

@keyframes fadeOutUpDesktop {
    0% {
        opacity: 1;
    }
    80% {
        opacity: 0.7;
        transform: translate3d(120px, calc(-50vh + 70px), 0) scale(0.5);
    }
    100% {
        opacity: 0;
        transform: translate3d(120px, calc(-50vh + 70px), 0) scale(0.5);
    }
}
@keyframes scatterEffect {
    from {
        stroke-dasharray: 20;
    }
    to {
        stroke-dasharray: unset;
        transform: scale(0.2);
    }
}

@keyframes scatterEffectCircle {
    from {
        stroke-dasharray: 20;
        transform: scale(1);
    }
    50% {
        transform: scale(0.8);
    }
    to {
        stroke-dasharray: 1;
        transform: scale(1);
    }

}
@keyframes moveFooter {
    60% {
        transform: translate3d(0, 200%, 0);
    }
    100% {
        transform: translate3d(0, 200%, 0);

    }
}

@-webkit-keyframes moveFooter {
    60% {
        transform: translate3d(0, 200%, 0);
    }
    100% {
        transform: translate3d(0, 200%, 0);

    }
}

@keyframes returnFooter {
    0% {
        transform: translate3d(0, 200%, 0);
    }
    60% {
        transform: translate3d(0, 0%, 0);
    }
    100% {
        transform: translate3d(0, 0%, 0);

    }
}

@-webkit-keyframes returnFooter {
    0% {
        transform: translate3d(0, 200%, 0);
    }
    60% {
        transform: translate3d(0, 0%, 0);
    }
    100% {
        transform: translate3d(0, 0%, 0);

    }
}
@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(0);
    }
}

@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(24px, 0);
    }
}
.animation_bus_1 {
    fill: #dd4b4b;
    stroke: none;
    -webkit-animation: bloat 0.5s ease;
    animation: bloat 0.5s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

.animation_bus_2 {
    fill: #f8c449;
    stroke: none;
    -webkit-animation: wobble 0.8s ease;
    animation: wobble 0.8s ease;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
}

@keyframes moveTopUp {
    0% {
        transform: translateY(40px);
    }
    100% {
        transform: translateY(0);
    }
}
@-webkit-keyframes moveTopUp {
    0% {
        transform: translateY(10px);
        width: 20px;
        height: 20px;
    }
    100% {
        transform: translateY(0);
        width: 20px;
        height: 20px;
    }
}
@keyframes moveTopLeft {
    0% {
        transform: translateX(30px) translateY(40px);
    }
    100% {
        transform: translateX(0%) translateY(0%);
    }
}
@-webkit-keyframes moveTopLeft {
    0% {
        transform: translateX(0px) translateY(5px);
        width: 20px;
        height: 20px;
    }
    100% {
        transform: translateX(0%) translateY(0%);
        width: 20px;
        height: 20px;
    }
}
@keyframes moveTopRight{
    0% {
        transform: translateX(-30px) translateY(40px);
    }
    100% {
        transform: translateX(0%) translateY(0%);
    }
}
@-webkit-keyframes moveTopRight {
    0% {
        transform: translateX(0px) translateY(5px);
        width: 20px;
        height: 20px;
    }
    100% {
        transform: translateX(0%) translateY(0%);
        width: 20px;
        height: 20px;
    }
}
.moving-element-1 {
    animation: moveTopLeft .8s ease;
}

.moving-element-2 {
    animation: moveTopUp .8s ease;
}
.moving-element-3 {
    animation: moveTopRight .8s ease;
}
.nr_assistance_container {
    padding: var(--template-padding);
}

.assistance_img {
    width: 100%;
    max-width: 800px;
}

.nr_assistant_link {
    display: flex;
    flex-direction: row;
    column-gap: 5px;
    margin: var(--template-padding) 0;

}

.nr_assistant_link > p {
    text-decoration: underline;
    color: black;
}

.nr_assistance_content {
    margin: var(--template-padding) 0;
    /*display: flex;*/
    column-gap: 5px;
    display: grid;
    grid-template-columns: 0.90fr 0.10fr;
    grid-template-rows: 0.5fr;
    align-items: center;
}

.nr_assistance_container li {
    margin: var(--template-padding) 0;
    display: flex;
    column-gap: 5px;
    font-weight: 600;
    font-size: 14px;
}
.main_item_container {
    grid-row: 2;
    grid-column: 1;
    grid-area: content;
}

@media screen and (max-width: 350px) {
    .main_item_container {
        text-align: center;
    }
}

.main_item {
    display: grid;
    place-items: center;
    grid-template-columns: 15% 30% auto 15%;
    padding: var(--template-padding);
    grid-template-areas: "departure station route platform"
                         ". location location ."
                        ". stations stations .";
}
.main_item_stationInfomation {
    display: flex;
    flex-wrap: wrap;
    grid-area: stations;
    text-align: left;
    margin-right: auto;
    flex-direction: column;
    border-radius: 12px;
    padding: 0.5rem;
    width: 100%;
    background: white;
    cursor: pointer;
    margin-top: 10px;

}

.main_item_stationInfomation > * {
    pointer-events: none;
}

.main_item_location {
    grid-area: location;
    width: 100%;
    padding: 0 var(--padding);
    text-align: left;
}

.main_item_stationInfomation_single-trip {
    cursor: default;
}

.main_item_stationInfomation-closed {
    display: none;
}

.main_item_stationInfomation_selector {
    display: flex;
    flex-direction: row;
    gap: 10px;
    justify-content: space-between;
}

.main_item_stationInfomation_svg {
    transition: all .3s ease;
    transform: rotate(90deg);
    height: 20px;
}

.main_item_stationInfomation_svg-open {
    transform: rotate(270deg);
}

.TOCGW > .app > .singlefullitem > #panelNationalrail > div > .main_item_container > .main_item > .main_item_stationInfomation,
.TOCGW > .app > .singlefullitem > #panelOsi > div > .main_item_container > .main_item > .main_item_stationInfomation {
    border: solid 2px var(--gwr);
}

.TOCAW > .app > .singlefullitem > #panelNationalrail > div > .main_item_container > .main_item > .main_item_stationInfomation,
.TOCAW > .app > .singlefullitem > #panelOsi > div > .main_item_container > .main_item > .main_item_stationInfomation {
    border: solid 2px var(--tfw);
}

.TOCSW > .app > .singlefullitem > #panelNationalrail > div > .main_item_container > .main_item > .main_item_stationInfomation,
.TOCSW > .app > .singlefullitem > #panelOsi > div > .main_item_container > .main_item > .main_item_stationInfomation {
    border: solid 2px var(--sw);
}

.TOCNT > .app > .singlefullitem > #panelNationalrail > div > .main_item_container > .main_item > .main_item_stationInfomation,
.TOCNT > .app > .singlefullitem > #panelOsi > div > .main_item_container > .main_item > .main_item_stationInfomation {
    border: solid 2px var(--northern);
}

.TOCGC > .app > .singlefullitem > #panelNationalrail > div > .main_item_container > .main_item > .main_item_stationInfomation,
.TOCGC > .app > .singlefullitem > #panelOsi > div > .main_item_container > .main_item > .main_item_stationInfomation {
    border: solid 2px var(--gc);
}

.TOCRT > .app > .singlefullitem > #panelNationalrail > div > .main_item_container > .main_item > .main_item_stationInfomation,
.TOCRT > .app > .singlefullitem > #panelOsi > div > .main_item_container > .main_item > .main_item_stationInfomation {
    border: solid 2px var(--nr);
}

.TOCZY > .app > .singlefullitem > #panelNationalrail > div > .main_item_container > .main_item > .main_item_stationInfomation,
.TOCZY > .app > .singlefullitem > #panelOsi > div > .main_item_container > .main_item > .main_item_stationInfomation {
    border: solid 2px var(--zy);
}

.TOCGR > .app > .singlefullitem > #panelNationalrail > div > .main_item_container > .main_item > .main_item_stationInfomation,
.TOCGR > .app > .singlefullitem > #panelOsi > div > .main_item_container > .main_item > .main_item_stationInfomation {
    border: solid 2px var(--lner);
}

.TOCGR > .app > .singlefullitem > #panelNationalrail > div > .main_item_container > .main_item > .main_item_stationInfomation-cancelled,
.TOCGR > .app > .singlefullitem > #panelOsi > div > .main_item_container > .main_item > .main_item_stationInfomation-cancelled {
    border: solid 2px black;
}
.main_item:nth-of-type(even) {
    background-color: rgba(224, 224, 224, 0.6);
}

.main_item_departure {
    grid-row: 1;
    grid-column: 1;
    grid-area: departure;
}

.main_item_station {
    grid-row: 1;
    grid-column: 2;
    grid-area: station;
}

.main_item_station-click {
    cursor: pointer;
}

.main_item_line {
    grid-row: 1;
    grid-column: 3;
    grid-area: route;
    padding: 3px;
}

.main_item_platform {
    grid-row: 1;
    grid-column: 4;
    grid-area: platform;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    text-align: center;
}

.main_item_departure {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: center;
    justify-content: center;
}

.main_item_departure p:nth-of-type(2) {
    justify-self: flex-end;
}

.main_item_departure p,
.main_item_station p,
.main_item_line p,
.main_item_platform p {
    word-wrap: break-word;
    padding: var(--padding) 0;
    font-size: 1rem;
}

@media screen and (min-width: 350px) {
    .main_item_departure p,
    .main_item_station p,
    .main_item_line p,
    .main_item_platform p {
        font-size: 1.2rem;
    }
}

.main_item_platform p {
    display: flex;
    align-items: center;
    flex-direction: column;
}

@media screen and (min-width: 768px) {
    .main_item_platform p {
        flex-direction: row;
    }
}

.main_item_departure,
.main_item_station,
.main_item_line,
.main_item_platform {
    width: 100%;
    align-self: center;
    position: relative;
}

@media only screen and (min-width: 1100px) {
    .main_item_line {
        width: 70%;
    }

    .main_item {
        text-align: center;
    }
}

.main_item_station p {
    padding: 0 var(--padding);
}

.main_item_line p {
    text-align: center;
    border-radius: 3px;
}

.main_item_departure s {
    color: red;
}
#panelNationalrail .main_item {

    grid-template-columns: 15% 37% 32% 16%;
}
/* panelBuses styling */
#panelBuses .main_item_container .main_item_station,
#panelBuses .main_item_container .main_item_platform {
    font-weight: 600;
}

#panelBuses .main_item_container .main_item_departure,
#panelBuses .main_item_container .main_item_station,
#panelBuses .main_item_container .main_item_line,
#panelBuses .main_item_container .main_item_platform {
    word-wrap: break-word;
    padding: 0 var(--padding);
    font-size: 1.2rem;
}

#panelBuses .main_item_container .main_item_departure {
    font-size: 1rem;
    display: block;
}

#panelBuses .main_item_container .main_item_departure p,
#panelBuses .main_item_container .main_item_station p,
#panelBuses .main_item_container .main_item_line p,
#panelBuses .main_item_container .main_item_platform p {
    padding: 0;
}

#panelRiver .main_item_departure {
    display: inline;
    font-size: 12px;
}

#panelRiver /*multilingual*/
{
    font-size: 12px;
}
/*live buses activation button*/
.icon_activate-button {
    background: none;
    border: none;
    padding: 0;
}
.icon_activate {
    height: 35px;
}
.bus-table-controller-text {
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 1.8;
    padding-left: 8px;
}

.bus-table-controller-container {
    padding: var(--template-padding);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row-reverse;
}
.closed {
    display: none;
}

.stationCheckClosed {
    opacity: 0;
    visibility: hidden;
    line-height: 0;
    height: 0;
    width: 0;
}

.stationCheckOpen {
    transition: all .3s ease;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    word-break: break-word;
}
.TOCGR .app .singlefullitem #panelNationalrail div .main_item_container .main_item .main_item_stationInfomation .main_item_stationInfomation_content{
    flex-direction: column
}
.track-button {
    background: none;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
}
.track-button:hover {
    cursor: pointer;
}

.track-svg,
.cancelled-track-svg {
    width: 25px;
}

.track-svg:hover {
    cursor: pointer;
}

.cancelled-track-svg:hover {
    cursor: default;
}

.TOCGW .app .singlefullitem #panelNationalrail .track-svg path,
.TOCGW .app .singlefullitem #panelOsi .track-svg path,
.TOCGW .app .singlefullitem #panelRiver .track-svg path,
.TOCGW .app .singlefullitem #panelTram .track-svg path,
.TOCGW .app .singlefullitem #panelDlr .track-svg path,
.TOCGW .app .singlefullitem #panelBuses .track-svg path,
.TOCGW .app .singlefullitem #panelTube .track-svg path {
    fill: var(--gwr);
}

.TOCAW .app .singlefullitem #panelNationalrail .track-svg path,
.TOCAW .app .singlefullitem #panelOsi .track-svg path,
.TOCAW .app .singlefullitem #panelRiver .track-svg path,
.TOCAW .app .singlefullitem #panelTram .track-svg path,
.TOCAW .app .singlefullitem #panelDlr .track-svg path,
.TOCAW .app .singlefullitem #panelBuses .track-svg path,
.TOCAW .app .singlefullitem #panelTube .track-svg path {
    fill: var(--tfw);
}

.TOCNT .app .singlefullitem #panelNationalrail .track-svg path,
.TOCNT .app .singlefullitem #panelOsi .track-svg path,
.TOCNT .app .singlefullitem #panelRiver .track-svg path,
.TOCNT .app .singlefullitem #panelTram .track-svg path,
.TOCNT .app .singlefullitem #panelDlr .track-svg path,
.TOCNT .app .singlefullitem #panelBuses .track-svg path,
.TOCNT .app .singlefullitem #panelTube .track-svg path {
    fill: var(--northern);
}

.TOCGC .app .singlefullitem #panelNationalrail .track-svg path,
.TOCGC .app .singlefullitem #panelOsi .track-svg path,
.TOCGC .app .singlefullitem #panelRiver .track-svg path,
.TOCGC .app .singlefullitem #panelTram .track-svg path,
.TOCGC .app .singlefullitem #panelDlr .track-svg path,
.TOCGC .app .singlefullitem #panelBuses .track-svg path,
.TOCGC .app .singlefullitem #panelTube .track-svg path {
    fill: var(--gc);
}

.TOCSW .app .singlefullitem #panelNationalrail .track-svg path,
.TOCSW .app .singlefullitem #panelOsi .track-svg path,
.TOCSW .app .singlefullitem #panelRiver .track-svg path,
.TOCSW .app .singlefullitem #panelTram .track-svg path,
.TOCSW .app .singlefullitem #panelDlr .track-svg path,
.TOCSW .app .singlefullitem #panelBuses .track-svg path,
.TOCSW .app .singlefullitem #panelTube .track-svg path {
    fill: var(--sw);
}

.TOCES .app .singlefullitem #panelNationalrail .track-svg path,
.TOCES .app .singlefullitem #panelOsi .track-svg path,
.TOCES .app .singlefullitem #panelRiver .track-svg path,
.TOCES .app .singlefullitem #panelTram .track-svg path,
.TOCES .app .singlefullitem #panelDlr .track-svg path,
.TOCES .app .singlefullitem #panelBuses .track-svg path,
.TOCES .app .singlefullitem #panelTube .track-svg path {
    fill: var(--es);
}

.TOCRT .app .singlefullitem #panelNationalrail .track-svg path,
.TOCRT .app .singlefullitem #panelOsi .track-svg path,
.TOCRT .app .singlefullitem #panelRiver .track-svg path,
.TOCRT .app .singlefullitem #panelTram .track-svg path,
.TOCRT .app .singlefullitem #panelDlr .track-svg path,
.TOCRT .app .singlefullitem #panelBuses .track-svg path,
.TOCRT .app .singlefullitem #panelTube .track-svg path {
    fill: var(--nr);
}

.TOCZY .app .singlefullitem #panelNationalrail .track-svg path,
.TOCZY .app .singlefullitem #panelOsi .track-svg path,
.TOCZY .app .singlefullitem #panelRiver .track-svg path,
.TOCZY .app .singlefullitem #panelTram .track-svg path,
.TOCZY .app .singlefullitem #panelDlr .track-svg path,
.TOCZY .app .singlefullitem #panelBuses .track-svg path,
.TOCZY .app .singlefullitem #panelTube .track-svg path {
    fill: var(--zy);
}

.TOCGR .app .singlefullitem #panelNationalrail .track-svg path,
.TOCGR .app .singlefullitem #panelOsi .track-svg path,
.TOCGR .app .singlefullitem #panelRiver .track-svg path,
.TOCGR .app .singlefullitem #panelTram .track-svg path,
.TOCGR .app .singlefullitem #panelDlr .track-svg path,
.TOCGR .app .singlefullitem #panelBuses .track-svg path,
.TOCGR .app .singlefullitem #panelTube .track-svg path {
    fill: var(--lner);
}
.departures-cancelled {
    display: none;
    color: red;
}

.departures-cancelled-break {
    display: none;
}
#panelNationalrail .departures-cancelled,
#panelNationalrail .departures-cancelled-break,
#panelOsi .departures-cancelled,
#panelOsi .departures-cancelled-break,
#panelTube .departures-cancelled,
#panelTube .departures-cancelled-break,
#panelTram .departures-cancelled,
#panelTram .departures-cancelled-break,
#panelRiver .departures-cancelled,
#panelRiver .departures-cancelled-break,
#panelBuses .departures-cancelled,
#panelBuses .departures-cancelled-break,
#panelDlr .departures-cancelled,
#panelDlr .departures-cancelled-break {
    display: unset;
}
.app #panelTube div .main_item_container .main_item .main_item_station p .icon_capacity {
    display: none;
}
.live-buses-container .main_item .main_item_platform::before {
    display: none;
}
.TOCGW .app .singlefullitem #panelNationalrail .track-svg .departures-svg-cancelled,
.TOCGW .app .singlefullitem #panelOsi .track-svg .departures-svg-cancelled,
.TOCGW .app .singlefullitem #panelTube .track-svg .departures-svg-cancelled,
.TOCGW .app .singlefullitem #panelTram .track-svg .departures-svg-cancelled,
.TOCGW .app .singlefullitem #panelRiver .track-svg .departures-svg-cancelled,
.TOCGW .app .singlefullitem #panelDlr .track-svg .departures-svg-cancelled,
.TOCGW .app .singlefullitem #panelBuses .track-svg .departures-svg-cancelled,
.TOCNT .app .singlefullitem #panelNationalrail .track-svg .departures-svg-cancelled,
.TOCNT .app .singlefullitem #panelOsi .track-svg .departures-svg-cancelled,
.TOCNT .app .singlefullitem #panelTube .track-svg .departures-svg-cancelled,
.TOCNT .app .singlefullitem #panelTram .track-svg .departures-svg-cancelled,
.TOCNT .app .singlefullitem #panelRiver .track-svg .departures-svg-cancelled,
.TOCNT .app .singlefullitem #panelDlr .track-svg .departures-svg-cancelled,
.TOCNT .app .singlefullitem #panelBuses .track-svg .departures-svg-cancelled,
.TOCGC .app .singlefullitem #panelNationalrail .track-svg .departures-svg-cancelled,
.TOCGC .app .singlefullitem #panelOsi .track-svg .departures-svg-cancelled,
.TOCGC .app .singlefullitem #panelTube .track-svg .departures-svg-cancelled,
.TOCGC .app .singlefullitem #panelTram .track-svg .departures-svg-cancelled,
.TOCGC .app .singlefullitem #panelRiver .track-svg .departures-svg-cancelled,
.TOCGC .app .singlefullitem #panelDlr .track-svg .departures-svg-cancelled,
.TOCGC .app .singlefullitem #panelBuses .track-svg .departures-svg-cancelled,
.TOCSW .app .singlefullitem #panelNationalrail .track-svg .departures-svg-cancelled,
.TOCSW .app .singlefullitem #panelOsi .track-svg .departures-svg-cancelled,
.TOCSW .app .singlefullitem #panelTube .track-svg .departures-svg-cancelled,
.TOCSW .app .singlefullitem #panelTram .track-svg .departures-svg-cancelled,
.TOCSW .app .singlefullitem #panelRiver .track-svg .departures-svg-cancelled,
.TOCSW .app .singlefullitem #panelDlr .track-svg .departures-svg-cancelled,
.TOCSW .app .singlefullitem #panelBuses .track-svg .departures-svg-cancelled,
.TOCRT .app .singlefullitem #panelNationalrail .track-svg .departures-svg-cancelled,
.TOCRT .app .singlefullitem #panelOsi .track-svg .departures-svg-cancelled,
.TOCRT .app .singlefullitem #panelTube .track-svg .departures-svg-cancelled,
.TOCRT .app .singlefullitem #panelTram .track-svg .departures-svg-cancelled,
.TOCRT .app .singlefullitem #panelRiver .track-svg .departures-svg-cancelled,
.TOCRT .app .singlefullitem #panelDlr .track-svg .departures-svg-cancelled,
.TOCRT .app .singlefullitem #panelBuses .track-svg .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelNationalrail .track-svg .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelOsi .track-svg .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelTube .track-svg .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelTram .track-svg .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelRiver .track-svg .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelDlr .track-svg .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelBuses .track-svg .departures-svg-cancelled,
.TOCAW .app .singlefullitem #panelNationalrail .track-svg .departures-svg-cancelled,
.TOCAW .app .singlefullitem #panelOsi .track-svg .departures-svg-cancelled,
.TOCAW .app .singlefullitem #panelTube .track-svg .departures-svg-cancelled,
.TOCAW .app .singlefullitem #panelTram .track-svg .departures-svg-cancelled,
.TOCAW .app .singlefullitem #panelRiver .track-svg .departures-svg-cancelled,
.TOCAW .app .singlefullitem #panelDlr .track-svg .departures-svg-cancelled,
.TOCAW .app .singlefullitem #panelBuses .track-svg .departures-svg-cancelled,
.TOCES .app .singlefullitem #panelNationalrail .track-svg .departures-svg-cancelled,
.TOCES .app .singlefullitem #panelOsi .track-svg .departures-svg-cancelled,
.TOCES .app .singlefullitem #panelTube .track-svg .departures-svg-cancelled,
.TOCES .app .singlefullitem #panelTram .track-svg .departures-svg-cancelled,
.TOCES .app .singlefullitem #panelRiver .track-svg .departures-svg-cancelled,
.TOCES .app .singlefullitem #panelDlr .track-svg .departures-svg-cancelled,
.TOCES .app .singlefullitem #panelBuses .track-svg .departures-svg-cancelled,
.TOCZY .app .singlefullitem #panelNationalrail .track-svg .departures-svg-cancelled,
.TOCZY .app .singlefullitem #panelOsi .track-svg .departures-svg-cancelled,
.TOCZY .app .singlefullitem #panelTube .track-svg .departures-svg-cancelled,
.TOCZY .app .singlefullitem #panelTram .track-svg .departures-svg-cancelled,
.TOCZY .app .singlefullitem #panelRiver .track-svg .departures-svg-cancelled,
.TOCZY .app .singlefullitem #panelDlr .track-svg .departures-svg-cancelled,
.TOCZY .app .singlefullitem #panelBuses .track-svg .departures-svg-cancelled{
    fill: red;
}
.TOCGR .app .singlefullitem #panelNationalrail .track-button .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelOsi .track-button .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelTube .track-button .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelBuses .track-button .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelTram .track-button .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelDlr .track-button .departures-svg-cancelled,
.TOCGR .app .singlefullitem #panelRiver .track-button .departures-svg-cancelled {
    fill: red;
}
.departures-guidance {
    background-color: #fafad2;
    /*display: flex;*/
}

.departures-guidance p {
    margin: 0;
    font-weight: 500;
    font-size: 13px;
    padding: 10px;
    text-align: center;
}

/*journey page*/
.TOCGC .trainMakerStyle svg circle {
    fill: #f08300;
}
.tflLineName {
    width: 30vw;
    max-width: 210px;
    display: table;
    text-align: center;
    white-space: pre-wrap
}
.trainMakerStyle {
    z-index: 3;
    position: absolute;
    -webkit-transition: top 0.8s ease-in-out;
    -o-transition: top 0.8s ease-in-out;
    transition: top 0.8s ease-in-out;
    display: none;
    width: 50px;
    height: 50px;
}

@media only screen and (max-width: 1100px) {
    .trainMakerStyle {
        /*max-width: 500px;*/
        /*margin-left: 312px;*/
        left: 38px !important;
        padding-top: 18px;
    }
}

@media only screen and (min-width: 1100px) {
    .trainMakerStyle {
        left: 46px !important;
        padding-top: 21px;
    }
}
.journey-calling-point-container {
    /* display:flex;
    flex-wrap: nowrap;
    padding: 0 var(--template-padding);
    display:grid;
    grid-template-columns: min-content min-content auto; */
    list-style-type: none;
}

.journey-calling-point-inner {
    display: flex;
    flex-wrap: nowrap;
    /* align-items:flex-start; */
    padding: var(--template-padding) 0;
    margin: 0 var(--template-padding);
    display: grid;
    grid-template-columns: min-content min-content auto;
    border-bottom: 1px #d4cbcb solid;
}

.journey-calling-point-container:last-of-type .journey-calling-point-inner {
    border-bottom: none;
}

.journey-calling-point-info {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
    width: 25px;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    transform-origin: center center;
    -webkit-transform-origin: center center;
}

.journey-calling-point-info {
    cursor: pointer;
}

.journey-calling-point-station-svg {
    position: relative;
    margin-top: 3px;
    z-index: 1;
}

.journey-calling-point-station-svg svg {
    /*filter: drop-shadow(0px 2px 2px #878080);*/
}
.TOCGR .journey-calling-point-station-svg svg {
    filter:none;
}

.journey-line-background {
    height: calc(100% + 3px + var(--template-padding));
    width: 10px;
    left: 20px;
    position: absolute;
    box-shadow: 0 0 4px #878080;
    /* top:0; */
    top: 20px;
    /*top: 19px;*/
    z-index: -1;
}
.TOCGR .journey-line-background {
    box-shadow:none;
    -webkit-box-shadow:none;
}

@media screen and (min-width: 1100px) {
    .journey-line-background {
        height: calc(100% + 8px + var(--template-padding));
        top: 19px;
    }
}

.journey-calling-point-container:last-of-type .journey-calling-point-station-svg .journey-line-background {
    opacity: 0;
}

.journey-calling-point-details {
    display: grid;
    grid-template-columns:2fr 1fr 1fr min-content;
    grid-template-rows:min-content min-content auto;
    grid-template-areas:"station station station time"
			"status status status ."
            "stationinfo stationinfo stationinfo stationinfo"
			"ehc ehc ehc ehc";
    row-gap: 5px;
    column-gap: 3px;
    align-items: start;
    flex-grow: 1;
}

@media only screen and (min-width: 767px) {
    .journey-calling-point-details {
        grid-template-areas:
        "station ehc ehc time"
        "status ehc ehc ."
        "stationinfo ehc ehc ."
        "stationinfo ehc ehc .";
        grid-template-columns: 2fr 1fr 2fr min-content;
    }
}

.journey-calling-point-status {
    padding: 3px 0;
}

.journey-calling-point-station-name {
    grid-area: station;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.journey-calling-point-station-name:hover {
    cursor: pointer;
}

.journey-calling-point-station-name-bold {
    font-size: 1.6rem;
    font-weight: 600;
}

.journey-calling-point-station-arrival {
    grid-area: time;
    height: 15px;
    font-size: 1.8rem;
    font-weight: 600;
}

.journey-calling-point-station-arrival s {
    font-size: 1.8rem;
    font-weight: 600;
}

.journey-calling-point-station-arrival span {
    font-size: 1.8rem;
    font-weight: 600;
}

.journey-calling-point-station-info {
    grid-area: status;
}

.journey-calling-point-enhanced-info {
    /* display: none; */
    grid-area: ehc;
    max-width: 400px;
}

.journey-calling-point-enhanced-display {
    display: block;
    /* padding-bottom: 8px; */
}

@media only screen and (min-width: 767px) {
    .journey-calling-point-enhanced-info {
        display: block;
    }

    .journey-calling-point-enhanced-display {
        padding-bottom: 0;
    }
}

.journey-top-container {
    display: inline-flex;
    flex-wrap: wrap;
    padding: 0 var(--template-padding);
    justify-content: space-between;
    width: 100%;
    align-items: center;
    display: none;
}

.journey-close-journey {
    display: flex;
    align-items: center;

}

.journey-close-journey span {
    margin-right: 8px;
}

.rtiv2-close-journey {
    width: 25px;
}
.journey-share-container {
    display: none;
}

.journey-next-stop {
    width: 100%;
    font-size: 1.1rem;
    font-weight: 600;
    padding-top: 7px;
    padding-bottom: 8px;
}

.journey-calling-point-dropdown {
    display: none;
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.journey-calling-point-dropdown:hover {
    cursor: pointer;
}

.journey-calling-point-dropdown li {
    font-size: 1.2rem;
    font-weight: 500;
    padding: 3px 2px;
    border-radius: 3px;
    padding-left: 8px;
    margin-top: 8px;
    display: flex;
    align-items: center;
}

.journey-cp-icon {
    height: 20px;
    margin-right: 8px;
}

.journey-select-form-display {
    display: block;
    border-radius: 3px;
    border: 1px var(--gwr) solid;
    border-top: none;
    margin-top: -40px;
    padding-top: 40px;
    box-shadow: 0 1px 3px #878080;
    padding-bottom: 5px;
}
.TOCGR .journey-select-form-display {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.journey-calling-point-connections {
    display: none;
}

.journey-calling-point-select {
    font-size: 1.2rem;
    font-weight: 500;
    border: 1px var(--gwr) solid;
    padding: 3px 2px 3px 8px;
    border-radius: 3px;
    margin-top: 8px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 40px;
    box-shadow: 0 1px 3px #878080;
    position: relative;
}
.TOCGR .journey-calling-point-select {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.journey-calling-point-select:hover {
    cursor: pointer;
}

.journey-option-hide {
    display: none;
}

.journey-calling-point-connection-toc {
    display: flex;
    align-items: center;
    /* color: white; */
    margin-top: 13px;
    /* flex-wrap: wrap; */
    width: auto;
    max-width: unset;
}

.journey-calling-point-connection-toc div,
.display-single-bad-connection div {
    padding: 3px 3px;
}

.journey-calling-point-connection-toc-name {
    font-size: 1.2rem;
    font-weight: 600;
    border-radius: 3px;
    box-shadow: 0 1px 3px #878080;
    display: block;
}
.TOCGR .journey-calling-point-connection-toc-name {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.journey-calling-point-connection-status {
    font-size: 1rem;
    font-weight: 300;
}

.journey-calling-point-station-status {
    grid-area: status;
    border-bottom: 1px #d4cbcb dotted;
}

.journey-calling-point-station-status div {
    padding-bottom: 7px;
    font-weight: 300;
    align-items: center;
    display: flex;
    /* width:100%; */
}

.rtiv2-platform-icon {
    border-radius: 5px;
    min-height: 20px;
    min-width: 20px;
    display: flex;
    align-items: center;
    font-size: 1.1rem;
    background-color: black;
    color: white;
    margin-right: 8px;
    padding-bottom: unset !important;
    justify-content: center;
    flex-basis: fit-content;
    padding: 0 0.5em 0 0.5em;
}

.journey-calling-point-station-status .rtiv2-platform-text {
    padding-bottom: 0;
    display:block;
}
.journey-calling-point-station-status-HIDE {
    display: none;
}

.rtiv2-platform-container,
.divide-announcement {
    display: flex;
    align-items: center;
}

div.divide-announcement {
    width: 100%;
    display: grid;
    grid-template-columns: max-content auto max-content;
    align-items: center;
    max-width: fit-content;
    border: solid 2px;
    padding-bottom: 0px;
    border-radius: 12px;
    padding: 8px 0;
}

.divide-announcement-svg {
    width: 20px;
    margin-right: 8px;
    margin-left: 8px;
}

svg.rtiv2-time-svg {
    height: 20px;
    margin-right: 8px;
    filter: drop-shadow(0px 0px 0.5px #878080);
}
.TOCGR svg.rtiv2-time-svg {
    filter: none;
}

.rtiv2-chevron-down {
    height: 20px;
    margin-right: 8px;
    position: absolute;
    right: 0;
}

.journey-calling-point-preview-info {
    grid-area: stationinfo;
    width: 100%;
}

.journey-calling-point-preview-info-facilities,
.journey-calling-point-preview-info-addOn {
    width: 100%;
    display: grid;
    grid-template-columns: 25px auto max-content;
    align-items: center;
    max-width: fit-content;
}

.journey-calling-point-preview-info-facilities {
    border: solid 2px;
    border-radius: 12px;
    padding: 0.5rem;
}
.journey-calling-point-preview-info-facilities multilingual{
    pointer-events: none;
}
.station-information-div {
    margin-top: 10px !important;
}

.journey-calling-point-preview-info-facilities:hover {
    cursor: pointer;
}

.journey-calling-point-preview-info-addOn {
    margin-top: 5px;
    font-weight: 300;
}

.journey-calling-point-preview-info-addOn div {
    padding-right: 8px;
}

.journey-three-columns {
    display: none;
    /*grid-template-columns: max-content max-content auto max-content;*/
    /*position: relative;*/
}

.journey-four-columns {
    grid-template-columns: 25px min-content min-content auto;
}

/*.journey-calling-point-preview-info-facilities div {*/
/*    !*font-weight: 300;*!*/
/*    margin-right: 8px;*/
/*}*/

.journey-calling-point-preview-info-facilities {
    margin-top: 5px;
}

.journey-calling-point-preview-info-facilities:first-of-type {
    margin-top: 0;
}

.rtiv2-mini-icon {
    grid-area: unset;
    width: 20px;
    margin-right: 8px;
    filter: drop-shadow(0px 0px 0.5px #878080);
}
.TOCGR .rtiv2-mini-icon {
    filter: none;
}
@media screen and (min-width: 767px) {
    .journey-calling-point-connections,
    .journey-rtiv2-button {
        display: block;
    }

    .journey-calling-point-select {
        display: none;
    }

    .journey-select-form-display {
        display: none;
    }

    /* .journey-calling-point-details {
        grid-template-rows: min-content 30px auto auto;
    } */
}
.journey-calling-point-connections-displayAll {
    display: block;
}
@media screen and (min-width: 767px) {
    .journey-calling-point-connections-displayAll {
        display: block;
        margin-left: 15px;
    }
}

.connections-hover:hover {
    cursor: pointer;
}

@media screen and (min-width: 767px) {
    .connections-hover {
        display: none;
    }
}

.icon_customJourney g {
    transition: opacity 0.2s ease;
    -webkit-transition: opacity 0.2s ease;
}

.journey-selected-close-submenu {
    opacity: 0;
}

/* .journey-inner-icon-hide {
    opacity: 0;
} */

.journey-inner-icon-display {
    opacity: 1;
}

div.journey-v2-heading {
    position: sticky;
    padding-top: 8px;
    padding-left: var(--template-padding);
    padding-right: var(--template-padding);
    top: -1px;
    background: white;
    z-index: 2000;
    border-top: 1px #d4cbcb solid;

}

div.journey-v2-heading-notification{
    top: 51px;
}


div.journey-v2-heading h1 {
    /* padding: var(--template-padding);
    margin-top: 8px; */
    font-size: 1.6rem;
    display: inline;
    vertical-align: top;
}
/*div.journey-v2-heading h1 p {*/
/*    !* padding: var(--template-padding);*/
/*    margin-top: 8px; *!*/
/*    font-size: 1.6rem !important;*/
/*    font-weight: 700;*/
/*}*/

.journey-innerDiv-parent{
    display: inline-flex;
    border: 3px solid var(--nr);
    border-radius: 15px;
    background: white;
    height: 27px;
    text-align: -webkit-center;
    width: 27.1px;
    margin-right: 5px;
    align-items: center;
    justify-content: center;
}
.TOCGW .journey-innerDiv-parent{
    border: 3px solid var(--gwr);
}

.TOCSW .journey-innerDiv-parent{
    border: 3px solid var(--sw);
}

.TOCGC .journey-innerDiv-parent{
    border: 3px solid var(--gc);
}


.journey-innerDiv-cross{
    position: relative;
    height: 20px;
    width: 20px;
    border-radius: 40px;
    border: 1px solid white;
}

.journey-innerDiv-content{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 2px;
    background-color: white;
    transform: translate(-50%, -50%) rotate(45deg);
}

.journey-innerDiv-content-two{
    transform: translate(-50%, -50%) rotate(-45deg);
}


.journey-last-updated {
    margin-top: 8px;
    padding-bottom: 8px;
}

.journey-calling-point-container:first-of-type .journey-calling-point-inner {
    padding-top: 8px;
}

@media screen and (min-width: 1100px) {
    .journey-calling-point-connection-toc:first-of-type {
        margin-top: 0;
    }
}
.loading-page__container > svg {
    max-width: 200px;
}

.loading-page__container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100%;
    background-color: white;
    z-index: 1000;
    display: flex;
    flex-direction: column;
}

.use-local-station {
    display: none !important;
}
.journey-selected-close-submenu line {
    stroke-width: 3px;
    stroke: black;
    stroke-linecap: round;
}

#journey-selected-close-1 line,
#journey-selected-close-3 line,
#journey-selected-close-4 line,
#journey-selected-close-5 line,
#journey-selected-close-6 line {
    stroke: #fff;
}

.single-bad-connection {
    display: none;
}

.rtiv2-toggle-icon {
    filter: drop-shadow(0px 2px 1px grey);
    -webkit-filter: drop-shadow(0px 2px 1px grey);
    pointer-events: initial;
}

.rtiv2-toggle-icon > * {
    pointer-events: none;
}

.TOCGR .rtiv2-toggle-icon {
    filter: none;
    -webkit-filter: none;
}

.rtiv2-toggle-icon circle {
    transform-origin: center center;
    transition: all 0.5s ease;
}

.TOCGW .app #panelJourney .rtiv2-toggle-icon path {
    fill: var(--gwr);
}

.TOCGC .app #panelJourney .rtiv2-toggle-icon path {
    fill: var(--gc);
}

.TOCRT .app #panelJourney .rtiv2-toggle-icon path {
    fill: var(--nr);
}
.TOCZY .app #panelJourney .rtiv2-toggle-icon path {
    fill: var(--zy);
}

.TOCNT .app #panelJourney .rtiv2-toggle-icon path {
    fill: var(--northern);
}

.TOCSW .app #panelJourney .rtiv2-toggle-icon path {
    fill: var(--sw);
}

.TOCES .app #panelJourney .rtiv2-toggle-icon path {
    fill: var(--es);
}

.TOCAW .app #panelJourney .rtiv2-toggle-icon path {
    fill: var(--tfw);
}

.TOCGW .app #panelJourney .rtiv2-toggle-icon circle:first-of-type {
    stroke: var(--gwr);
}

.TOCGC .app #panelJourney .rtiv2-toggle-icon circle:first-of-type {
    stroke: var(--gc);
}

.TOCRT .app #panelJourney .rtiv2-toggle-icon circle:first-of-type {
    stroke: var(--nr);
}
.TOCZY .app #panelJourney .rtiv2-toggle-icon circle:first-of-type {
    stroke: var(--zy);
}

.TOCNT .app #panelJourney .rtiv2-toggle-icon circle:first-of-type {
    stroke: var(--northern);
}

.TOCSW .app #panelJourney .rtiv2-toggle-icon circle:first-of-type {
    stroke: var(--sw);
}

.TOCES .app #panelJourney .rtiv2-toggle-icon circle:first-of-type {
    stroke: var(--es);
}

.TOCAW .app #panelJourney .rtiv2-toggle-icon circle:first-of-type {
    stroke: var(--tfw);
}
@media screen and (min-width: 767px) {
    .single-bad-connection {
        display: flex;
    }

    .preview-connection-bad {
        display: none;
    }

    /* .rtiv2-toggle-icon {
        opacity: 0;
    } */
}

.journey-v2-connection-flip {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    filter: drop-shadow(0px -2px 1px grey);
    -webkit-filter: drop-shadow(0px -2px 1px grey);
}
.TOCGR.journey-v2-connection-flip {
    filter: none;
    -webkit-filter: none;
}
.journey-v2-connection-flip circle {
    animation: scatterEffectCircle 0.5s linear forwards;
}
.rtiv2-capacity-pie {
    height: 20px;
    width: 20px;
    border: 1px black solid;
    margin-right: 8px;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}
.cancelled-station-rtiv2 {
    color: red;
    text-decoration: line-through;
}

.rtiv2-display-none {
    display: none !important;
}
.rtiv2-bus-replacement-notice {
    padding: var(--template-padding);
    border-radius: 5px;
    background-color: #edd81f;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: calc(100% - calc(var(--template-padding) * 2));
    text-align: center;
    margin: auto;
    margin-bottom: 8px;
    font-size: 1.1rem;
}

.rtiv2-bus-hide {
    display: none;
}

.rtiv2-bus-replacement-last-updated {
    font-size: 1.1rem;
    text-align: center;
    border-radius: 5px;
    color: White;
    margin:auto;
    background: black;
    display: inline-block;
    align-items: center;
    justify-content: center;
    padding: 8px;
    width: 100%;
    position: sticky;
    padding-left: var(--template-padding);
    padding-right: var(--template-padding);
    top: 0;
    z-index: 2000;
    border-top: 1px #d4cbcb solid;
}


.rtiv2-bus-replacement-last-updated > div:first-child::first-letter {
    text-transform: uppercase;
}

.video-content-container{
    padding: 5px 5px;
    width: calc(100% - 40px);
}
.video-content-container-light{
    padding: 5px 5px;
}
.video-container-svg{
    height: 30px;
    width: 30px;
    align-self: center;
    margin-left: 5px;
    top: 10px;
    position: absolute;
}
.extra-content{
    position: relative;
    top: 25px;
    width: 83%;
    text-align: left;
    margin-bottom: 25px;
}
.lifts-and-escalators-details {
    padding: 8px 0;
    /* margin-left: 55px; */
    display: none;
    font-weight: 300;
}

.journey-details-show {
    display: block;
}

/*.lifts-and-escalators-vertical {*/
/*    position: absolute;*/
/*    margin-left: calc(50% + 10px);*/
/*    width: 2px;*/
/*    height: 50%;*/
/*    background-color: black;*/
/*}*/

/*.lifts-and-escalators-horizontal {*/
/*    position: absolute;*/
/*    top: calc(50% - 1px);*/
/*    height: 2px;*/
/*    width: 52%;*/
/*    margin-left: calc(50% + 10px);*/
/*    background-color: black;*/
/*}*/

/*.lifts-and-escalators-vertical::after {*/
/*    content: "";*/
/*    position: absolute;*/
/*    width: 52px;*/
/*    height: 20px;*/
/*    background: black;*/
/*    top: 0;*/
/*    left: -38px;*/
/*    top: -2px;*/
/*    height: 2px;*/
/*    border-radius: 3px;*/
/*}*/

/*.lifts-and-escalators-graphic {*/
/*    !* position: relative; *!*/
/*    width: 55px;*/
/*    position: absolute;*/
/*    !* height: 5px; *!*/
/*    height: 100%;*/
/*}*/

/*.lifts-and-escalators-string {*/
/*    margin-left: 55px;*/
/*    background: black;*/
/*    color: white;*/
/*    border-radius: 3px;*/
/*    padding: 8px;*/
/*    filter: drop-shadow(0px 2px 1px grey);*/
/*    -webkit-filter: drop-shadow(0px 2px 1px grey);*/
/*    -webkit-touch-callout: none; !* iOS Safari *!*/
/*    -webkit-user-select: none; !* Safari *!*/
/*    -khtml-user-select: none; !* Konqueror HTML *!*/
/*    -moz-user-select: none; !* Old versions of Firefox *!*/
/*    -ms-user-select: none; !* Internet Explorer/Edge *!*/
/*    user-select: none;*/
/*}*/
.TOCGR .lifts-and-escalators-string {
    filter: none;
    -webkit-filter: none;
}

/*.lifts-and-escalators-wrapper {*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    position: relative;*/
/*    margin-top: 4px;*/
/*}*/

/*.lifts-and-escalators-wrapper:first-of-type {*/
/*    margin-top: 0;*/
/*}*/

.le-graphic-hide {
    display: none;
}

.details-toggle-icon,
.national-status-toggle-icon{
    transform-origin: center center;
    width: 20px;
    align-self: start;
    transition: all 0.3s ease;
    align-self: center;
}

.details-toggle-icon{
    filter: drop-shadow(0px 2px 1px grey);
    -webkit-filter: drop-shadow(0px 2px 1px grey);
}
.TOCGR .details-toggle-icon{
    filter: none;
    -webkit-filter:none;
}
.details-toggle-icon:hover,
.national-status-toggle-icon:hover{
    cursor: pointer;
}

.details-toggle-icon-svg-hide,
.national-status-toggle-icon-hide{
    display: none;
}
.TOCGW .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-horizontal,
.TOCGW .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical {
    background-color: var(--gwr);
}

.TOCAW .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-horizontal,
.TOCAW .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical {
    background-color: var(--tfw);
}

.TOCGW .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical::after {
    background-color: var(--gwr);
}

.TOCAW .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical::after {
    background-color: var(--tfw);
}

.TOCGW .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-string {
    background: var(--gwr);
    color: #FFF;
}

.TOCAW .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-string {
    background: var(--tfw);
    color: #FFF;
}

.TOCGC .app .singlefullitem #panelJourney .lifts-and-escalators-horizontal,
.TOCGC .app .singlefullitem #panelJourney .lifts-and-escalators-vertical {
    background-color: var(--gc);
}

.TOCGC .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical::after {
    background-color: var(--gc);
}

.TOCGC .app .singlefullitem #panelJourney .lifts-and-escalators-string {
    background: var(--gc);
    color: var(--gc-secondary);
}

.TOCNT .app .singlefullitem #panelJourney .lifts-and-escalators-horizontal,
.TOCNT .app .singlefullitem #panelJourney .lifts-and-escalators-vertical {
    background-color: var(--northern);
}

.TOCNT .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical::after {
    background-color: var(--northern);
}

.TOCNT .app .singlefullitem #panelJourney .lifts-and-escalators-string {
    background: var(--northern);
    color: #FFF;
}

.TOCRT .app .singlefullitem #panelJourney .lifts-and-escalators-horizontal,
.TOCRT .app .singlefullitem #panelJourney .lifts-and-escalators-vertical {
    background-color: var(--nr);
}

.TOCRT .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical::after {
    background-color: var(--nr);
}

.TOCRT .app .singlefullitem #panelJourney .lifts-and-escalators-string {
    background: var(--nr);
    color: #FFF;
}

.TOCZY .app .singlefullitem #panelJourney .lifts-and-escalators-horizontal,
.TOCZY .app .singlefullitem #panelJourney .lifts-and-escalators-vertical {
    background-color: var(--zy);
}

.TOCZY .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical::after {
    background-color: var(--zy);
}

.TOCZY .app .singlefullitem #panelJourney .lifts-and-escalators-string {
    background: var(--zy);
    color: #FFF;
}

.TOCSW .app .singlefullitem #panelJourney .lifts-and-escalators-horizontal,
.TOCSW .app .singlefullitem #panelJourney .lifts-and-escalators-vertical {
    background-color: var(--sw);
}

.TOCSW .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical::after {
    background-color: var(--sw);
}

.TOCSW .app .singlefullitem #panelJourney .lifts-and-escalators-string {
    background: var(--sw);
    color: #FFF;
}

.TOCES .app .singlefullitem #panelJourney .lifts-and-escalators-horizontal,
.TOCES .app .singlefullitem #panelJourney .lifts-and-escalators-vertical {
    background-color: var(--es);
}

.TOCES .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical::after {
    background-color: var(--es);
}

.TOCES .app .singlefullitem #panelJourney .lifts-and-escalators-string {
    background: var(--es);
    color: #FFF;
}

.TOCGR .app .singlefullitem #panelJourney .panelForlineDiagram .classDebugLocation ul li div .lifts-and-escalators-vertical::after {
    background-color: var(--lner) !important;
}

.journey-calling-point-hide {
    display: none;
}

.journey-calling-point-details-succinct {
    grid-template-rows: min-content;
    grid-template-areas: "station station station time";
}

.journey-calling-point-station-svg-hide {
    width: 50px;
}

.journey-calling-point-station-svg-hide svg {
    height: 23px;
}


.TOCGR .app .singlefullitem #panelJourney .lifts-and-escalators-string,
.TOCGR .app .singlefullitem #panelJourney .lifts-and-escalators-horizontal,
.TOCGR .app .singlefullitem #panelJourney .lifts-and-escalators-vertical {
    background-color: var(--lner);
}
#plus-svg-connections {
    position: relative;
    top: -11px;
    right: -12px;
    justify-self: end;
}
.btn-journey-calling-point-mobile .journey-calling-point-connections-displayAll {
    grid-column: 1 / 4;
    grid-row: 2;
    padding-bottom: 15px;
    padding-left: 5px;
}

.display-single-bad-connection {
    display: flex;
    align-items: center;
    margin-top: 13px;
    width: auto;
    max-width: unset;
}

/* KEY STYLE */
.key-name {
    margin-top: -0.6em;
    margin-left: 20px;
    background-color: white;
    display: block;
    width: 80px;
    text-align: center;
    font-family: 'Nunito', sans-serif;
}
.key-grid {
    display: grid;
    grid-template-columns: 1fr 4fr 1fr 4fr;
    grid-auto-rows: minmax(30px, auto);
    grid-gap: 6px;
    margin: 10px;
    align-items: center;
    place-items: center;
}
.key-ml {
    justify-self: start;
}
.key-icon {
    width: 20px;
    height: auto;
}
.key-icon-sm {
    width: 30px;
    height: auto;
}
.key-ml p {
    font-family: 'Nunito', sans-serif;
    font-weight: 300;
    /*font-size: 12px;*/
}
.key-icon-svg {
    visibility: visible;
    min-width: 20px;
}
.key-icon-svg-sm {
    min-width: 30px;
}
.toc-borderColour-gr{
    border: 2px solid var(--lner);
    border-radius: 12px;
    width: 90%;
    height: auto;
    margin: 20px auto 25px auto;
}
.toc-borderColour-nt{
    border: 2px solid var(--northern);
    border-radius: 12px;
    width: 90%;
    height: auto;
    margin: 20px auto 25px auto;
}
.toc-borderColour-rt{
    border: 2px solid var(--nr);
    border-radius: 12px;
    width: 90%;
    height: auto;
    margin: 20px auto 25px auto;
}
.toc-borderColour-sw{
    border: 2px solid var(--sw);
    border-radius: 12px;
    width: 90%;
    height: auto;
    margin: 20px auto 25px auto;
}
.toc-borderColour-gc{
    border: 2px solid var(--gc);
    border-radius: 12px;
    width: 90%;
    height: auto;
    margin: 20px auto 25px auto;
}
.toc-borderColour-gw {
    border: 2px solid var(--gwr);
    border-radius: 12px;
    width: 90%;
    height: auto;
    margin: 20px auto 25px auto;
}

.toc-borderColour-zy {
    border: 2px solid var(--zy);
    border-radius: 12px;
    width: 90%;
    height: auto;
    margin: 20px auto 25px auto;
}
.toc-stroke-gr {
    stroke: var(--lner);
}
.toc-stroke-nt {
    stroke: var(--northern);
}
.toc-stroke-rt {
    stroke: var(--nr);
}
.toc-stroke-sw {
    stroke: var(--sw);
}
.toc-stroke-gc {
    stroke: var(--gc);
}
.toc-stroke-gw {
    stroke: var(--gwr);
}
div.panelForlineDiagram {
    margin: 0 auto;
    color: black;
    /*max-width: 1100px;*/
    vertical-align: top;
    background-color: white;
    font-family: lubalin_graphregular, serif;
    position: relative;
}

div.panelForlineDiagram table tr {
    background-color: lightblue;
}
div.panelForlineDiagram table {
    font-family: Johnston100, sans-serif;
}

div.panelForlineDiagram .time {
    display: inline-block;
    width: 3em;
    vertical-align: top;
}

div.panelForlineDiagram .info {
    color: #AEAFB4;
    font-size: 14pt;
    display: block;
    clear: both;
}

div.panelForlineDiagram .location {
    display: inline;
    font-size: 14pt;
    vertical-align: top;
}

div.panelForlineDiagram .keeptogether {
    display: inline-block;
    padding-left: 0.5em;
    vertical-align: top;
    white-space: pre-wrap;
    width: 50vw;
}

@media screen and (min-width: 360px) {
    div.panelForlineDiagram .keeptogether {
        width: 62vw;
    }
}


div.panelForlineDiagram .station {
    display: block;
    position: relative;
    margin-top: 1em;
    white-space: nowrap;
}

div.panelForlineDiagram .nameOfStation {
    float: left;
    margin-right: 0.5em;
}

div.panelForlineDiagram .stopimage {
    width: 40px;
    height: 40px;
    display: inline-block;
}

div.panelForlineDiagram .nrsymbol {
    width: 20px;
    height: 12px !important;
    margin-left: 0.5em;
    margin-right: 0.5em;
    margin-top: 3px;
    vertical-align: middle;
    display: -webkit-box;
    display: flex;
    background-size: contain;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2MiIgaGVpZ2h0PSIzOSI+CjxnIHN0cm9rZT0iI0VEMUMyNCIgZmlsbD0ibm9uZSI+CjxwYXRoIGQ9Ik0xLC04LjkgNDYsMTIuNCAxNiwyNi42IDYxLDQ3LjkiIHN0cm9rZS13aWR0aD0iNiIvPgo8cGF0aCBkPSJNMCwxMi40SDYybTAsMTQuMkgwIiBzdHJva2Utd2lkdGg9IjYuNCIvPgo8L2c+Cjwvc3ZnPg==");
    float: left;
}

div.panelForlineDiagram .eurostarsymbol {
    width: 61px;
    height: 20px !important;
    background-size: contain;
    /*background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAABjCAIAAACuZqovAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAABF6SURBVHja7Z13dBdVFsf9a4+7lrUsyopK2UhRWESlKCC9996EQOi9QxIUQgcjBqQFoyRSIj1BuhQFKYKAQOghIC0QSOi9mP3uznH2Ob+ZN+9N+ZX87px7DiGZ35v5vXc/r9x7331PZNNFF10+vZ5Q/vlL7vIkJCQ+EYKQhIQgJCEhCAlCEhKCkISEIKS6ICEhCElICEISEhKCUEyeL1C9bquB42K+2bxt794Dx06cOncp8+q9+w+U73Ln7r1z6ZdSDp/AX/uEf16sXBtqZhKC0Bl58/1W/YdNXrtxx63bd6QiEnbuPjQkalq+txtRe5MQhBalx6BosGczOOjK1Rux8UkvhtSgVichCOXw27P/qINxesfTzhQr9xE1PAlBaC4N2w51Fj/2qli/B7U9CUFoKE++UmHClLluh67XaNqXmp+EINQRjFGwanpnC0mT0AjSABKC8E8SPmrG/T88DV64tu06QBpAQhD+X5Z8t8n7+ykjRs8kJSAhCB0g8PiJMwuTN3w6dd7M+GUrv9927959wQ+m/Xb+qVcrkR6QBDuElheBGZevzJ6/smrj3poC3/qg9ajo2YKFtOj0MekBSVBD+NuZCxbwu5x5dcDHU17get5rtxggUtS8xWtJD0iCF0JrA+C3y9b/u7yQw/2Nks1MS0tNO0t6QBKkEFrA7+7d+536jpN6yuARU02L/ccbNUkVSIIOQgsEXsjILF+nm+yDin/Y1rTksrW6kCqQBBeEFgg8cvy3V4vVt/a4q9dv8gvH/gxSBZIggvDWrTuyBO74JcXOE/cdTOWXT3pAEkQQbt+VIksgdui66gLBJinSA5JggXBWQrIsgQ8ePMxduI6rEGK3FOkBSVBA2GvIZxaWgqE9Rtl/9MVLWUblY7cUKQFJUED4TqXQK9duyBIYPnKG/Ue/W7k9DYMkBKGV0NCEb1c58uhhY2ONHoFpKmkASVBAiNHGQhKK/CUaO/L0lMNpRk/xDDolIcmBEBYq3eLs+QxZCNt0jXLk6bEJSUaPQIQ3NT9JUECYkLhKlsAZs5c68mjORgrORPTJVz58Nl+VXAVr5ilav8A7TQqXaYmYm5JVw8rV7lqlYa+3K7TLVbAW6Q1JwEDYLGyYLIH7D6a+XLi2qwQqE9HWXYb3jYgZMyn+y2+Sk1Zt3rpzPzYlXhWzHt28dedo6umNW3bPWbhm/OQ5vYdOatwuHHwCYFIpEj+C8KnXKu3ae1gWwo+6OTARxb5eXx19DDiTV28GmaE9R5Wu1vHZfFWDRJMwX8DeTprk+xeEURO/ktXghUkbbD40b/GG+82C1Lx8nTqd/t3an5A+58O63XOkDr1XpUP01Hk4iYBW2v4FYamqYbdu35VS1tt37uFTdh5ar/Wg9AuXs/34evz48U879k2cMrdBmyG5An//VNMOkYuX/8n5VKZ6J4LKXyCcHLtQVkHtdKJ/zVMhcsxMxLhlB9SVciRt1jfJmLhi83EAKc1bZVvD+7r71yOar9Oq83Aiyl8g/OebdS9czJRSx19Tjj+X3+LyqWWnT3buOZQd4Bfi1Bclb+wXGeO3g8kzeau07T5y6YofHj1+7Pn+RKB/QQhNklVBGBgtPOj9mp2R6iI7x12///77L78emZWQ1KX/BITd+dzi0nXABBhdsLjVfdtr128RgX4Hoex+pcPHTqGXlXoEHAzJq7dkB8eFaTZ2VE77aklY7zFAwm2dwNwYS1ZYkjDonTdbY69evx1GYALJvyCs32awrJINjZouWHjIe00jx8S6bf+8cfM2Dh5FV4IHpV/MfPjokV8xCQsWrDtYdbfrPhIhBEXLtnm1aP2nX68s1Uw48CN3kToIRShTo5OC3JwFqzH83hY2p6FrwMqQEPJHCOPmLpdSKaQ8FPHOw70eN2f59Ru3nFJloIWF6NxFaz8Z92XXARMbtRuKTDMYBP6u59nDnkac+Fu5YS+sP3uHT4INCa7IdMl1r/tw3sXAdejoyW07DyAkSFfQrZw+e9F+Nf6wdU+l+j2JH3+E8OVCtTMuXZFqTrgTOQWig+/cb/z6H3c5oqapJ88mLv2+c//xghkTRdySjdoO9U8m3bvIGejXECIfoWyLhrynb50vWKr5iIlxx1JP29QYnK29fM0WHF5fomI7t2uzyPstYZRavWH7Yz37YQ64MJbS1hN/h3D5mp+kGnX2/BWehVSo1wOGQZxubUddMDFDYCdccJZztNmRp1+rVKflwCmzFiJJXM7AD2YwHNtKwPg7hCLprjVXreb92RJg6U5a9aMdXcnMuoYzYaAusuZW96RExdD+wyYjcs2bp745eC1Ytr5Gs36ESmBA2FF+Lqo69/tGxsDiZ0dXYI2Arr9WrIHf1jXsT807foyNWnDJBAR+8YkrK9TrTpAEEoRzF62RamPYUbH9Z/Rn8XbmbHAnYE6Ls18Cq97hWhg0/AuEyFg7D8fVCzkg0Z1RQuSAhBA8SDU25o2X/xd6b+3CPqmhI6f/692mOWAXAnY2zl+8DsZbYo8gtC5YNnhpZ9CZ9C++XFStSZ8c2R6wFSPLIxK0clLjOHihI8PJqth7nc+hjD4kvoTws+mJrqoLNkYhTLR1lxHP5K0cJG3zbN4q8GfWaz0Y4QGTpiciiGzPvqOZV67bqcaTp9ORRgC+WdiuXipEeTpyFoQr1211Cb8Nm3+B2QbpXqi1FHkxpAaiupuERgz85AvspsXSGhklUUua4BhEOGCVHj1tPhafyFcA/x5lx8nhEO4/5HA8JwpEApjS1Sk4mIQgFNpTW9Gmb129EPyFfa51Ww2itiEhCOW2nNnHb8W6rR37jKVDc0kIQml5t1J7LE4ss4eIfkw7fb51lYQk8CAsWq5Nr6GTYBKwvC/m590Hm4cNozYgIQjlICxSpiV2JKxYu/WejUjITVt2Y3se1T4JiSiEsIljvzwS9W39eb8j1pfEJd9T1ZOQmECIHUDwLGH7Jv+YW2vX5zO+paonIfkThOANY92QqGkIht6+60DW1euuhr8g5tPL3xNGV3QoXsiSREJiEUIvXx16jfHaN3y+QHWc1H3o6KlsgwMJJ48P2bgkj7joRGCXL6n+NSysqNDeyxKloyILKYKfPW9AOeoNHToUrVLrHVZs1olSCFu47jtYKBOC2iCuvA0hMgsh7Y/UR7yz8wgJYDD6pZ06p2aU0r1t05I8D9OeExdd/VP/OnJYQUGVVT+iC5XpW53Y+lLMuBApePCg+Kn5M/e/qFvgnrW5+/cpkivkA9kC8Sa6r7cs/nXPAtG5CHZ2ah+kCr+DE7+TFbyepoNTRbBu0enY7HcsQojUL8hA0XNwNA45wVAjewoSDhLzAn6azEtGyVF8AmGT5sVtQqgKUBRRNdAiUhrgwbuJFLhR+A3ZD6J+pGqblU160xCVbfZOdDTi/Qj/oeib+J0d21LKG+IHdcakNDR/8iIBIRIwY6t1aM/Rnt4FnKYkBSH24HsTv2zuydhqJe5dl9uoU1RFt4u1ACGri6YQ4mdWPBUFM2p+V+05WOHLqgVmeYyNIJZPoNFw6isIPXsEwcHQFEK2ToymCUoh6l+V+wf0LaJWlBCEiu7O+HopcEI8PnbNTItbHDl6Zvteo6s37Qvq4KXglIIc6VIQDh4xzXH8KjXoOTl2gSd+2CnLTxCmKiinjcUb0g0IdZeUKIGFx6iZcScLDD6CD3r26+iwNXhzwE5KeJ2FGequ0U6lt0qYlj9tWy7N++PR0E68g0ZwMwub5w0QI65QpiczeEnZtlM7JuW1dUdFTiHqf5Wno9oxIUc1ikJoE4CYmQukIATtDuLXtlvUuk079XOErdpcuHQL/sdFOlp/g9DzuVBi3XugN6yS8Zd8mkmd7ryU1XiRGhNcL1moQ9a0pn5BtoMQWd/yGwJfFnXCdna67+YJIX6DlwHMeAcvQRgxaoYUhGfOZThh9qzWO/xzzmHAgjlqAxdCiNpn6748C5UpgZ4fQV/u+RH2y2JMc6ontQOhOtTj5dn3F5mRmjaEMv1WOcS8SRBCAKzMOLwEYaN24TaTHUoJQueGT4jjZGTBmfJhfcYKlhbQEPJvY5eC4hY8dmboqcd2aHEDQpY60KKMPPzZoyyE7GAL8ZzMo25Z5WGLUr6XNyBEdiAL2Sxln5K/ROMeg6Ox44mf33rfwVQcGiFebEBDyFnQsgZYo8mq6RLLU481Wi7l0nADQtUko35HdkZq6mYQhFDwNh/vrH8kf3SRYNwMDg8K6z0WxzLjwBPTMpED6iXJJA6sSvFNo5adfi5ByNLiiRnbeYt4HVjB3JWzsmLfDb1A42bFfQUhWwNqNbJjo+mE2QKE9gMb3ILw4JGTFvyNPQZFGxVYqHQL/BVbpa5cE9qzjwGwaftIC28ubiI3aiRfQQjjG0cz2BJkxysWYM/Xw+xLN3LAjs/aGoTqe2JtzP6ev4SzAKFq38oS9kD6AEIMQdb8/mfPZ4A0GFEgKASHtwCnq9dvShViYQAMaAg1zndddwLrmZCtE/b1dJEAb1l6rkILYTd2IFS/o2bEY5e1/K5BBEKXlsHOQ1i2VlefhKFid1Xj0Ag7b+7/EHqGdLEWF6P1HmsXdQMJjL2AXxdFsMFxbTul6Oy0UzMRYNfD/EgG04bAL1XUs/TMxX4EIWSfywfoaq4LGZmOOP2dNcy4AaGRKCE+pt8rU34Gxeo3HwkoJUYhdg3JPld8gmoBQtUko+uXF5yRsg2BjkMTrcpON7Jkvo7PIMR80msExiYkFSrVwpHXDlwI+crKgmFnOiq+LwQ0amJNxDmUhZA1yeiandgZKccuJRhGh9vcGAOdh7BU1TCcyOmFIxOc3YThLISCKmtqbVMhhFprorfYGSBHxVlLvWwXbuez0Hj2DTeK1aoshKpJBpzrmrKxNBXx0IhACAOYf+WY4cuICXEuHpyw5xDOaXC8CnziJ2S1nO+F5zsAMdcy6qExLlkObWFXQRYqBN2KYE9huSOTiiDnTMhZCMEq29mxUwkHY4Nch/BveSoih5rj+CE4BgcGuVQF9iHUOBtF7lctKxrbugiEGheC0Y4HdsJmaqk3WhBKefmNlFvESyk1pdfEuIqIEdicdYGFrsQvIPxvPx0acffefceS4R9MxVIzd+E67vVDjkAoNX8TCbzmQ4jRj+2njbScXRcJ9uUo2Vqwm80QUykI2ah0QTHaVMFfnLOTDgfDg1yHEFK5Qc9jJ07bYe9y1rWv532HtDde2IAvu/nFtG/mtxb+xOqQkcLxIdR4zDHd0l1YarzqptM8zVZdOxUiG+clDiH7pUy/EWso0m0U0/dku1e+t8O/IFTiPCfNSHzw4KEUexmXr6zZsKPbwE9febOu1zJ8sPM60029nKwH7NCEwQS5W3RVjSWQo+WmEGoUyMj+wa4MITC7c3amsu+mbMPxBEAkMgY3sGs2kQFEHEJ1eBfx2pmaeU0hxCNYkmUDAH0JoSKlq3XsFxkzZ8HqlCOGR17u3HNoatxipH7yVSZ82YkNx3nt6blmPewaWwJ/b5EIhBpPhtGLsZNSpYNAd4OAT9aQyEbAcXxiKipKnBoKYbskJV+LJo2N4OghCCG7qV9kvcoPRrcQMZPpgr/eXQhZeSGkBna4f1CzM/IOvlGyWZ636j1XoJo/5LpyCkKlyXXd1rqZGvhtKQihhnwjNdKMh6YxAEZjnXgyCNlltiCE7LRfcL3KtojnLMZCAPdGG7YDH0Pot6KmWhHkx9QJAUXhFIUHiUxpBCEU91hA/0wDAJTkF/x5Zpawb0AqzFIQQnXCLB6Lx3fVsHTxu0X3PBYEoVsCpYcyqU4nNBv+Kz6TgbqLp/Fks7bwN9oocS1swihAhZ8xtRNf7eBOTDKNkMbv8QjZ/T4iEEqZZARdNSyEpi3ikseCICSxJWzeTvcCu2w+i7MplO0oRXof06xTBCEJSeAJQUhCQhCSkBCEBCEJCUFIQkIQUl2QkBCEJCQEIQkJCUFIQkIQkpCQeFn+A1NMkqKpFlvmAAAAAElFTkSuQmCC ");*/
    /*background-image: url('/fes/dashboardFrontend/svg_icons/icon_eurostar.svg');*/
}

@media (max-width: 300px) {
    div.panelForlineDiagram .eurostarsymbol {
        display: block;
        /* vertical-align: middle; */
    }
}

@media (min-width: 300px) {
    div.panelForlineDiagram .eurostarsymbol {
        display: inline-block;
        vertical-align: middle;
    }
}

div.panelForlineDiagram .aircraft {
    width: 20px;
    height: 20px !important;
    display: inline-block;
    background-size: contain;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8IS0tIENyZWF0b3I6IENvcmVsRFJBVyBIb21lICYgU3R1ZGVudCBYOCAtLT4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iMjEwbW0iIGhlaWdodD0iMjEwbW0iIHZlcnNpb249IjEuMSIgc2hhcGUtcmVuZGVyaW5nPSJnZW9tZXRyaWNQcmVjaXNpb24iIHRleHQtcmVuZGVyaW5nPSJnZW9tZXRyaWNQcmVjaXNpb24iIGltYWdlLXJlbmRlcmluZz0ib3B0aW1pemVRdWFsaXR5IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCINCnZpZXdCb3g9IjAgMCAyMTAwMCAyMTAwMCINCiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+DQogPGcgaWQ9IkxheWVyX3gwMDIwXzEiPg0KICA8bWV0YWRhdGEgaWQ9IkNvcmVsQ29ycElEXzBDb3JlbC1MYXllciIvPg0KICA8cGF0aCBmaWxsPSIjMkYzRDhBIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0xMDQ0MCA5MjhjNzU3LDAgMTAxMiwxMjQzIDEwMTIsMTk1Nmw2NiA1MDc2IDY5MjYgNTIyNmMyNDUsMTQ5IDExMDQsNzc2IDEyNjQsOTg1IDIzMSwyNTggMTc2LDc2MCAxNzYsMTA1NWwwIDUxNiAtNjc4NSAtMjcwOGMtMzIyLC04MSAtNjcwLC0xNzkgLTk3OSwtMTc5IC03ODUsMCAtNjc5LDk4NSAtNzE5LDE1MjJsOCAyNjc2IDIyOTAgMTY3OSAyMTQgMTM0MCAtMzEyOCAtODc0IC01NzAgMCAtMzEzNCA4NzQgMjE1IC0xMzQwIDIyNDkgLTE2NzkgOCAtMjY3NmMwLC01MjkgMTA5LC0xNTIyIC02NzMsLTE1MjIgLTMyOCwwIC02NzAsOTggLTk4NywxNzlsLTY3NzggMjcwOCAwIC01MTZjMCwtMjk1IC01NywtNzk3IDE4MiwtMTA1NSAxMzIsLTIwOSAxMDE0LC04MzYgMTIzMSwtOTg1bDY5NDEgLTUyMjYgNzYgLTUwNzZjMCwtNzEzIDIzMSwtMTk1NiA5ODcsLTE5NTZsLTkyIDB6Ii8+DQogPC9nPg0KPC9zdmc+DQo=");
}

div.panelForlineDiagram .red {
    color: red;
}

div.panelForlineDiagram .rtiv2-eurostarsymbol svg {
    width: 30vw;
    max-width: 210px;
    height: 31px !important;
    padding: 1px 3px;
}
div.panelForlineDiagram .rtiv2-eurostarsymbol {
    width: 30vw;
    max-width: 210px;
    height: 31px !important;
    margin-top: 13px;
    display: block;
    /* background-size: 210px 31px; */
    margin-left: 27px;
    border-radius: 3px;
    background-color: #00286A;
}

div.panelForlineDiagram .TOCLO {
    font-family: Johnston100-Medium, sans-serif;
    font-size: 14pt !important;
}

div.panelForlineDiagram .TOCXR {
    font-family: Johnston100-Medium, sans-serif;
    font-size: 14pt !important;
}

div.panelForlineDiagram .lastUpdatedMessage {
    color: #AEAFB4;
}

div.panelForlineDiagram .classDebugLocation {
    padding-top: 0;
}

div.panelForlineDiagram s {
    -webkit-text-decoration-color: red;
    text-decoration-color: red;
    color: black;
}

div.panelForlineDiagram ul.rainbowBoard li {
    display: -webkit-box;
    display: flex;
}

div.panelForlineDiagram table tr {
    background-color: lightblue;
}

div.panelForlineDiagram table {
    font-family: Johnston100, sans-serif;
}

div.panelForlineDiagram .time {
    display: inline-block;
    width: 4em;
    vertical-align: top;
}

div.panelForlineDiagram .info {
    color: #AEAFB4;
    font-size: 1rem;
    display: block;
}

div.panelForlineDiagram .location {
    display: inline;
    font-size: 14pt;
    vertical-align: top;
}
/*noinspection ALL*/
div.panelForlineDiagram .keeptogether {
    display: inline-block;
    padding-left: 1.5em;
    vertical-align: top;
}

div.panelForlineDiagram .station {
    display: block;
    position: relative;
    margin-top: 1em
}

/*noinspection ALL*/
div.panelForlineDiagram .stopimage {
    width: 40px;
    height: 40px;
    display: inline-block;
}
div.panelForlineDiagram .nrsymbol {
    width: 20px;
    height: 12px !important;
    margin-left: 0.5em;
    display: inline-block;
    background-size: contain;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2MiIgaGVpZ2h0PSIzOSI+CjxnIHN0cm9rZT0iI0VEMUMyNCIgZmlsbD0ibm9uZSI+CjxwYXRoIGQ9Ik0xLC04LjkgNDYsMTIuNCAxNiwyNi42IDYxLDQ3LjkiIHN0cm9rZS13aWR0aD0iNiIvPgo8cGF0aCBkPSJNMCwxMi40SDYybTAsMTQuMkgwIiBzdHJva2Utd2lkdGg9IjYuNCIvPgo8L2c+Cjwvc3ZnPg==');
}

div.panelForlineDiagram .whsmith-euston-thumbnail {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176.16 200.4'%3E%3Cg%3E%3Cpath fill='%23004184' d='M0 0h176.16v200.4H0z' /%3E%3Cpath fill='%23fff' d='M127.94 43h-2.08a4.29 4.29 0 0 1-2.23-1.55c0-.18 0-.36-.08-.55a2.6 2.6 0 0 0 0-.39c-.08-4.31-.21-8.63-.22-12.94 0-4.49.09-9 .15-13.47l.09-.54A3.56 3.56 0 0 1 127 12h.53c.4 0 .75-.16.65-.6 0-.21-.37-.4-.61-.51a1.75 1.75 0 0 0-.65 0H114.5c-.43 0-.87 0-1.36.07 0 .38.06.67.08.81l4.35.77.55.79a.17.17 0 0 0 0 .23 25.09 25.09 0 0 1 .35 2.86c.07 2.76 0 5.52.07 8.28 0 .53-.12.95-.7 1.1h-16.2a5 5 0 0 1-.26-1.11v-9.66a2.8 2.8 0 0 1 3-3h1.86v-1.09c-.42 0-.76-.07-1.11-.07H84.86a2.21 2.21 0 0 0-.78.06c-.12 0-.13.33-.19.51v.26c.06.1.12.27.19.28a3.75 3.75 0 0 1 3 2.09v2.41c-.47 1.78-1.08 3.52-1.56 5.36-.44 1.59-.8 3.2-1.24 4.8-.51 1.85-1.06 3.7-1.6 5.55-.43 1.44-.88 2.87-1.39 4.53a5.65 5.65 0 0 1-.73-.87 6.1 6.1 0 0 1-.23-.89c-.65-1.73-1.34-3.45-2-5.19-.44-1.26-.83-2.55-1.33-3.77-.9-2.45-1.82-4.9-2.72-7.36-.34-.79-.68-1.59-1-2.39v-.27l-.5-1.31v-.28l-.51-1.25v-.34a16.36 16.36 0 0 0-.56-1.67c-.06-.13-.44-.11-.68-.16s-.8-.34-.87.34l-.47 1.25c0 .18-.07.36-.11.54L69 14.35l-.09.54c-.16.35-.32.7-.49 1l-.06.53c-.14.35-.28.71-.41 1.06l-.11.53c-.37 1-.78 2-1.12 3-.44 1.36-.81 2.75-1.25 4.11-.69 2.16-1.41 4.31-2.13 6.46-.56 1.68-1.13 3.36-1.75 5.21-.4-.78-.68-1.34-1-1.91l-.06-.48-.53-1.46a4 4 0 0 0-.09-.78c-.48-1.49-1-3-1.46-4.45-.72-2.33-1.4-4.68-2.1-7-.58-1.93-1.16-3.85-1.73-5.78a1.81 1.81 0 0 1 1.5-2.51c.59-.14 1.17-.34 1.79-.53V11H45.74v.88a1.8 1.8 0 0 0 .37.15 4.21 4.21 0 0 1 3.64 3.14c.64 2.09 1.36 4.15 2 6.24s1.15 4.1 1.78 6.14 1.38 4.11 2 6.18c.84 2.72 1.64 5.45 2.45 8.17a10.18 10.18 0 0 0 .58 1.87c.23.41.24 1.11.94 1.14.47 0 .93-.58 1.06-1.33a3 3 0 0 0 0-.52 1 1 0 0 0 .47-1.11l.06-.47c.35-1 .69-2 1-3l.06-.42c.2-.43.45-.84.61-1.28.28-.83.5-1.68.76-2.51.68-2.11 1.35-4.21 2-6.31.45-1.4 1-2.78 1.39-4.19s.81-2.74 1.21-4.11c0-.16 0-.32.05-.48.35-.33.54-1.11 1.24-.42 0 .12 0 .24.07.37.15.4.31.8.47 1.2 0 .13.05.26.08.39l.48 1.13.1.47.42.85c0 .16.06.32.08.47.16.37.31.74.47 1.1a2 2 0 0 0 0-.49 2 2 0 0 1 0 .49c0 .16 0 .33.08.49.15.35.31.7.47 1.06a1.8 1.8 0 0 0 0 .52q1.33 3.8 2.71 7.57C76 37 77 39.61 77.93 42.22a22.71 22.71 0 0 0 .91 2.15c.33.66.7.7 1.22.16a2 2 0 0 0 .4-.77c.27-.92.48-1.86.75-2.78.51-1.77 1.05-3.52 1.57-5.29.6-2.06 1.17-4.12 1.78-6.18.45-1.54 1-3.06 1.43-4.6.53-1.75 1.05-3.5 1.54-5.26.25-.88.42-1.78.62-2.67a.16.16 0 0 0 0-.22c.4-.82.85-1.61 1.18-2.46.76-2 3.47-2.6 5-2.16a2.45 2.45 0 0 1 1.92 1.93c.07.33.21.66.31 1a4.66 4.66 0 0 0-.08.64v21.13c0 .83 0 1.67.07 2.5a3.39 3.39 0 0 0-.21.61 3.22 3.22 0 0 1-2.16 3h-2.63c0 .42 0 .7.08 1.07h2.44l11.59-.02c.47.11.8 0 .77-.56s-.41-.46-.76-.42h-2l-1.12-.51-1-1.64V29.03c0-.52.09-1 .13-1.57h16.7a6.1 6.1 0 0 1 .32 1.36c0 4.22.24 8.45-.43 12.64a.17.17 0 0 0 0 .21l-1.9 1.35h-2.32c-.4-.06-.78-.11-.77.49s.36.58.78.5h13.79a.62.62 0 0 0 .24-.1c.28-.3.36-.59-.15-.91Zm-26-.59.53.52Z' /%3E%3Cpath fill='%23eff3f7' d='M49 145.7h3.76c1.63 5 3.08 9.91 4.79 14.71 3.6 10.06 10.17 17.8 19.95 22a30 30 0 0 0 21.82 1.06c6-2 11.12-5.15 14.33-10.41 6.95-11.4 4.38-23.17-6.58-31.27-4.66-3.44-10.13-5.89-15.43-8.36C82 128.89 72 125.22 63.35 118.7a34.32 34.32 0 0 1-12.67-19c-3.24-11.55-.41-21.14 7.19-29.56a28.13 28.13 0 0 1 21.36-9.62c4.91 0 9.76-.33 14.72 1.36a42.06 42.06 0 0 1 15.15 9.42 6.06 6.06 0 0 1 1 1.69c4.24-2.55 4.64-6.51 6.06-10.17h3.52v32.4l-3.26.36c-1.53-3.6-3-7.21-4.59-10.73-3.49-7.55-8.7-13.52-16.33-17.12-7.89-3.73-16-4.28-23.82-.25C61.16 72.87 58 86.76 67.24 97.14c4.6 5.15 10.55 8.32 16.64 11.25 9.66 4.65 19.49 9 28.92 14 10.66 5.71 16.71 14.83 17.45 27.1a59.73 59.73 0 0 1 0 8.46c-1 12.87-7.65 21.66-19.17 27.42-9.21 4.6-18.89 4.83-28.5 3.41a35.66 35.66 0 0 1-18.73-8.85c-1.81-1.65-3.69-3.22-6-5.27-1 1.76-1.92 3.22-2.64 4.78s-1.17 3.46-2 5a3 3 0 0 1-2.21 1.49 3.59 3.59 0 0 1-2.2-1.63 4.39 4.39 0 0 1-.47-2.39q0-16.69.08-33.39a15.48 15.48 0 0 1 .59-2.82Z' /%3E%3C/g%3E%3C/svg%3E");
    width: 20px;
    height: 20px !important;
    background-repeat: no-repeat;
    background-size: auto;
}

/*noinspection ALL*/
div.panelForlineDiagram .aircraft {
    width: 20px;
    height: 20px !important;
    display: inline-block;
    background-size: contain;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8IS0tIENyZWF0b3I6IENvcmVsRFJBVyBIb21lICYgU3R1ZGVudCBYOCAtLT4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iMjEwbW0iIGhlaWdodD0iMjEwbW0iIHZlcnNpb249IjEuMSIgc2hhcGUtcmVuZGVyaW5nPSJnZW9tZXRyaWNQcmVjaXNpb24iIHRleHQtcmVuZGVyaW5nPSJnZW9tZXRyaWNQcmVjaXNpb24iIGltYWdlLXJlbmRlcmluZz0ib3B0aW1pemVRdWFsaXR5IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCINCnZpZXdCb3g9IjAgMCAyMTAwMCAyMTAwMCINCiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+DQogPGcgaWQ9IkxheWVyX3gwMDIwXzEiPg0KICA8bWV0YWRhdGEgaWQ9IkNvcmVsQ29ycElEXzBDb3JlbC1MYXllciIvPg0KICA8cGF0aCBmaWxsPSIjMkYzRDhBIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGQ9Ik0xMDQ0MCA5MjhjNzU3LDAgMTAxMiwxMjQzIDEwMTIsMTk1Nmw2NiA1MDc2IDY5MjYgNTIyNmMyNDUsMTQ5IDExMDQsNzc2IDEyNjQsOTg1IDIzMSwyNTggMTc2LDc2MCAxNzYsMTA1NWwwIDUxNiAtNjc4NSAtMjcwOGMtMzIyLC04MSAtNjcwLC0xNzkgLTk3OSwtMTc5IC03ODUsMCAtNjc5LDk4NSAtNzE5LDE1MjJsOCAyNjc2IDIyOTAgMTY3OSAyMTQgMTM0MCAtMzEyOCAtODc0IC01NzAgMCAtMzEzNCA4NzQgMjE1IC0xMzQwIDIyNDkgLTE2NzkgOCAtMjY3NmMwLC01MjkgMTA5LC0xNTIyIC02NzMsLTE1MjIgLTMyOCwwIC02NzAsOTggLTk4NywxNzlsLTY3NzggMjcwOCAwIC01MTZjMCwtMjk1IC01NywtNzk3IDE4MiwtMTA1NSAxMzIsLTIwOSAxMDE0LC04MzYgMTIzMSwtOTg1bDY5NDEgLTUyMjYgNzYgLTUwNzZjMCwtNzEzIDIzMSwtMTk1NiA5ODcsLTE5NTZsLTkyIDB6Ii8+DQogPC9nPg0KPC9zdmc+DQo=');
}

div.panelForlineDiagram .red {
    color: red;
}

#headingone {
    display: none;
}
div.panelForlineDiagram .lastUpdatedMessage {
    color: #AEAFB4;
}


div.panelForlineDiagram .classDebugLocation {
    padding-top: 0px;
}

div.panelForlineDiagram ul.rainbowBoard li {
    display: -webkit-box;
    display: flex;
}

/*British Sign Language display*/
.show-bsl {
    border: thick solid #F5D73D;
    margin: 0.6rem;
    border-radius: 10px;
    /*padding: 5px;*/
}
.show-bsl-journey {
    border: thick solid #F5D73D;
    margin: 0.6rem;
    border-radius: 10px;
    padding: 5px;
    display: flex;
    align-items: center;
}
.show-bsl:hover,
.show-bsl-journey:hover {
    background-color: rgba(245, 215, 61, 0.3);
}
#bsl-logo-btn svg {
    height: 35px;
    background-color: white;
    border-radius: 50%;
    cursor: pointer;
}
#bsl-logo-btn {
    position: fixed;
    right: 102px;
    margin-top: 5px;
    z-index: 100;
}
.bsl-svg-for-div {
    display: flex;
    flex-wrap: wrap;
    grid-area: stations;
    text-align: left;
    margin-left: -34%;
    margin-right: auto;
    flex-direction: column;
    border-radius: 50%;
    padding: 0.4rem;
    width: 22%;
    background: white;
    cursor: pointer;
    margin-top: -7%;
    pointer-events: initial;
}

.bsl-svg-for-div > * {
    pointer-events: none;
}
.bsl-svg-for-div-journey {
    border-radius: 50%;
    background: white;
    cursor: pointer;
    padding: 0.5rem;
    width: 50px;
    min-width: 50px;
    height: auto;
    margin-right: 10px;
    margin-left: -21px;
    pointer-events: initial;
}
.bsl-svg-for-div-journey > * {
    pointer-events: none;
}

@media screen and (min-width: 768px) and (max-width: 1099px) {
    #bsl-logo-btn {
        position: fixed;
        right: 103px;
        margin-top: 5px;
        z-index: 100;
    }
    .bsl-svg-for-div {
        margin-left: -26%;
        margin-top: -1%;
        width: 10%;
    }
    .bsl-svg-for-div-journey {
        margin-left: -3%;
    }
}
@media screen and (min-width: 320px) and (max-width: 444px) {
    .bsl-svg-for-div {
        margin-left: -33%;
        margin-top: -7%;
        width: 21%;
    }
}
@media screen and (min-width: 445px) and (max-width: 767px) {
    .bsl-svg-for-div {
        margin-left: -27%;
        margin-top: -2%;
        width: 13%;
    }
}

#bsl-video {
    position: fixed;
    background-color: white;
    transition: width 1s, height 1s, top 1s, left 1s, transform 1s;
    z-index: 100;
}

.bsl-video-default {
    width: 320px;
    height: 240px;
    left: 10%;
    top: 53%;
}

.bsl-video-playing {
    width: 320px;
    height: 240px;
    left: 10%;
    top: 53%;
}
.bsl-video-paused,
.bsl-video-ended {
    width: 125px;
    height: 81px;
    left: 65%;
    top: 57%;
    /*transform: translate(-50%, 25%);*/
}
@media screen and (min-width: 1100px) {
    #bsl-logo-btn {
        position: absolute;
        right: 133px;
    }
    .bsl-svg-for-div {
        margin-left: -27%;
        width: 10%;
    }
    .bsl-video-default,
    .bsl-video-playing {
        width: 600px;
        height: 350px;
        left: 28%;
        top: 31%;
    }
    .bsl-video-paused,
    .bsl-video-ended {
        width: 252px;
        height: 157px;
        left: 77%;
        top: 48%;
    }
}
@media screen and (min-width: 767px) and (max-width: 1099px) {
    .bsl-video-default,
    .bsl-video-playing {
        width: 320px;
        height: 240px;
        left: 31%;
        top: 42%;
    }
    .bsl-video-paused,
    .bsl-video-ended {
        width: 216px;
        height: 132px;
        left: 72%;
        top: 42%;

    }
}

.main_item_stationInfomation > .bsl-svg-for-div {
    margin-left: -7%;
    margin-right: auto;
    /* flex-direction: column; */
    border-radius: 50%;
    padding: 0.4rem;
    width: 8%;
    background: white;
    cursor: pointer;
    margin-top: -3%;
    margin-bottom: -1%;
}

@media screen and (min-width: 320px) and (max-width: 444px) {
    .main_item_stationInfomation > .bsl-svg-for-div {
        margin-left: -10%;
        margin-right: auto;
        /* flex-direction: column; */
        border-radius: 50%;
        padding: 0.4rem;
        width: 17%;
        background: white;
        cursor: pointer;
        margin-top: -3%;
        margin-bottom: -1%;
    }
}
#bsl-video {
    position: fixed;
    background-color: white;
    transition: width 1s, height 1s, top 1s, left 1s, transform 1s;
    z-index: 100;
    border: 0.5px solid black;
}

.bsl-video-default {
    width: 320px;
    height: 240px;
    left: 10%;
    top: 53%;
}

.bsl-video-playing {
    width: 320px;
    height: 240px;
    left: 10%;
    top: 53%;
}

.bsl-video-paused,
.bsl-video-ended {
    width: 125px;
    height: 81px;
    left: 65%;
    top: 57%;
}

@media screen and (max-width: 375px) {
    .bsl-video-default {
        width: 280px;
        height: 240px;
        left: 10px;
        top: 53%;
        right: 10px;
        margin: auto auto;
    }
    .bsl-video-paused, .bsl-video-ended {
        width: 125px;
        height: 81px;
        left: 60%;
        top: 57%;
    }
}

@media screen and (min-width: 1100px) {
    #bsl-logo-btn {
        position: absolute;
        right: 133px;
    }
    .bsl-svg-for-div {
        margin-left: -27%;
        width: 10%;
    }
    .bsl-video-default,
    .bsl-video-playing {
        width: 600px;
        height: 350px;
        left: 28%;
        top: 31%;
    }
    .bsl-video-paused,
    .bsl-video-ended {
        width: 252px;
        height: 157px;
        left: 77%;
        top: 48%;
    }
}

@media screen and (min-width: 767px) and (max-width: 1099px) {
    .bsl-video-default,
    .bsl-video-playing {
        width: 320px;
        height: 240px;
        left: 31%;
        top: 42%;
    }
    .bsl-video-paused,
    .bsl-video-ended {
        width: 216px;
        height: 132px;
        left: 72%;
        top: 42%;
    }
}

.bsl-close-button {
    width: 21px;
    height: 21px;
    cursor: pointer;
    z-index: 101;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(217, 217, 217, 0.7);
    border-radius: 50%;
    position: fixed;
}

.bsl-close-button svg {
    display: block;
    width: 16px;
    height: 16px;
    fill: white;
}
@keyframes pulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2);
        border: solid;
        border-color: white;
    }
}

.pulsing {
    animation: pulse 1.5s infinite;
}
.bsl-btn-selected {
    border: solid;
    border-color: white;
}
.next-station-journey-header {
    margin-top: 5px;
    margin-bottom: 5px;
}
#parentVideoContainer{
    height: 45px;
}
#videoContainer{
    width: 100%;
    min-height: 35px;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.tickerTape{
    /*right: -5%;*/
    /*position: absolute;*/
    /*display: block;*/
    /*width: 120%;*/
    /*background: white;*/
    /*color: #111;*/
    /*z-index: 2;*/
    /*box-sizing: border-box;*/
    /*padding: 1rem 0.25rem;*/
    /*font-family: veranda, sans-serif;*/
    /*overflow: hidden;*/
    /*height: 3rem;*/
    /*font-weight: bold;*/
    right: -5%;
    width: 120%;
    background: white;
    color: #111;
    z-index: 2;
    box-sizing: border-box;
    padding: 1rem 0.25rem;
    font-family: veranda, sans-serif;
    overflow: hidden;
    min-height: 35px;
    font-weight: bold;
    display: flex;
    height: 100%;
}

.tickerTape > span{
    position: absolute;
    /*right: -105%;*/
    /*animation: slideItTablet 20s linear infinite;*/
    white-space: nowrap;
}

@media screen and (min-width: 1100px) {
    #videoContainer, .tickerTape{
        min-height: 45px;
    }
    #parentVideoContainer{
        height: 55px;
    }
}/*weather content*/
.main_weather svg:first-of-type {
    width: 30%;
    padding: var(--template-padding);
}

.main_weather p {
    padding: 0 var(--template-padding);
    text-align: center;
}

#main_weather_description {
    margin: 0 0 var(--template-padding) 0;
    font-size: 1.3rem;
}
.main_item_weather {
    display: grid;
    grid-template-areas:"type res";
    grid-template-columns: 1fr 1fr;
    width: 100%;
    grid-template-rows: -webkit-min-content;
    grid-template-rows: min-content;
    place-items: center;
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    padding: var(--template-padding);
    text-align: center;
}

.main_item_weather p:first-of-type,
.main_item_weather p:first-of-type /*multilingual*/
{
    grid-column: 1;
    grid-row: 1;
    grid-area: type;
}

.main_item_weather p:last-of-type,
.main_item_weather p:last-of-type /*multilingual*/
{
    grid-row: 1;
    grid-column: 2;
    grid-area: res;
}

.main_item_weather p /*multilingual*/
{
    font-size: 1.2rem;
}

.main_item_weather:nth-of-type(even) {
    background: rgba(224, 224, 224, 0.6);
}

.main_weather_controls {
    position: relative;
    width: 100%;
    padding: 0 var(--template-padding);
    display: none;
    /* height:1.3rem; */
}
.main_weather_controls_list {
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    width: 100%;
    overflow-x: scroll;
    padding: var(--template-padding) 0;
    scrollbar-width: none;
}

.main_weather_controls_list::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 0;
    height: 0;
    display: none;
}
.main_weather_controls_list_inner {
    width: 100%;
    padding: 0;
    margin: 0;
}

.main_weather_controls_list_inner li {
    list-style-type: none;
    width: 100%;
    display: inline-block;
    padding: 0 var(--template-padding);
}

.main_weather_controls ul li:last-child {
    padding-right: 25%;
}

.main_weather_controls ul {
    scrollbar-width: none;
}

.main_weather_controls ul::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 0;
    height: 0;
    display: none;
}

#main_weather_controls_arrow {
    width: 15%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
}
.main_weather_controls_list div {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    /* padding: calc(var(--template-padding) / 2) var(--template-padding); */
    border-radius: 3px;
    /* -webkit-box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%);
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%); */
    color: #000;
    background: none;
    width: 30%;
    cursor: pointer;
    margin: 0 var(--template-padding);
    text-align: center;
    /* font-size: 1.3rem; */
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR .main_weather_controls_list div {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.main_weather_controls_list div:first-child {
    margin-left: 0;
}

@media only screen and (min-width: 1100px) {
    .main_weather {
        justify-content: center;
        flex-direction: row;
    }

    .main_weather svg:first-of-type {
        width: 20%;
    }

    #main_weather_description {
        text-align: left;
        width: 50%;
    }
}
.weather-active {
    display: unset !important;
}

.active {
    fill: orange !important;
    stroke: orange;
    -webkit-filter: drop-shadow(2px 4px 6px black);
    filter: drop-shadow(2px 4px 6px black);
    /* animation: activateUnit 1s ease; */
    /* transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -webkit-transform-origin:center center;
    transform-origin: center center;
    transform-box: fill-box;
    animation-duration: 1s;
    animation-name: activateUnit;
    animation-iteration-count:initial;
    animation-timing-function: ease; */
}
.TOCGR .active {
    filter:none;
    -webkit-filter:none;
}

/*events submodule*/

.events_container {
    grid-area: content;
    padding: var(--template-padding);
}

.events_container_placeholder {
    grid-area: content;
    padding: var(--template-padding);
    height: calc(100% - var(--sub-menu));
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.events-placeholder-circle {
    height: 200px;
    width: 200px;
    border-radius: 50%;
    border: 1px black solid;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: auto;
    background-color: var(--colorTheme);
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR .events-placeholder-circle {
    box-shadow:none;
    -webkit-box-shadow:none;
}

@media screen and (min-width: 768px) {
    .events-placeholder-circle {
        height: 300px;
        width: 300px;
    }
}

.events-placeholder-circle p {
    font-size: 1.3rem;
    text-align: center;
    padding: var(--template-padding);
    font-weight: 700;
    color: #FFF;
}

.events-placeholder-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.event {
    display: grid;
    /*grid-template-areas:*/
    /*    "image image image image image"*/
    /*    "name name name name station"*/
    /*    "venue venue venue venue venue"*/
    /*    "address address address address address"*/
    /*    "date date date date date"*/
    /*    "website website website website website"*/
    /*    "tags tags tags tags tags";*/
    grid-template-areas:
        "image image image image image"
        "name name name name name"
        "date date date date date"
        "description description description description description"
        "town town town town town"
        "ticket ticket ticket ticket ticket"
        "buy buy buy buy buy"
        "website website website website website";
    grid-template-columns: minmax(22.27%, 1.5fr) 1fr 1fr 1fr 1fr;
    /* grid-auto-rows: min-content; */
    grid-auto-rows: min-content;
    grid-column-gap: 10px;
    row-gap: 8px;
    /* height: auto; */
    /* min-height: 100px; */
    /*     max-height: 150px; */
    margin-bottom: var(--template-padding);
    background-color: #FFF;
    color: #000;
    padding: 0 var(--template-padding);
    padding-bottom:13px;
    position: relative;
    border-radius: 5px;
    border:1px grey solid;
}
.event_ticket {
    grid-area:ticket;
    font-size:1.5rem;
}
.event-lner {
    grid-template-areas:
        "image image image image image"
        "name name name name name"
        "date date date date date"
        "description description description description description"
        "town town town town town"
        "ticket ticket ticket ticket ticket"
        "buy buy buy buy buy"
        "website website website website website";
    background:#FFF;
    border:1px grey solid;
    color:#000;
    filter:unset;
    -webkit-filter:unset;
}
.event-no-img{
    grid-template-areas:
        "name name name name name"
        "date date date date date"
        "description description description description description"
        "town town town town town"
        "ticket ticket ticket ticket ticket"
        "buy buy buy buy buy"
        "website website website website website";
}
/*.event_description {*/
/*    text-overflow: ellipsis;*/
/*    height: 23px;*/
/*    overflow: hidden;*/
/*    !*white-space: nowrap;*!*/
/*    width:100%;*/
/*    grid-area: description;*/
/*    font-size:1.5rem;*/
/*}*/
.event_description {
    width:100%;
    height: 80px;
    position: relative;
    overflow: hidden;
    transition: max-height 1.5s;
    grid-area: description;
    font-size:1.5rem;
}
.event_description::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0px;
    width: 100%;
    height: 50px;
    margin-top: 20px;
    background: linear-gradient(to bottom, transparent, white);
}
@media only screen and (min-width:768px) {
    .event_description {
        height: 68px;
    }
}
.event-lner .event_ticket {
    color:var(--lner);
}
.event_buy {
    display:none;
    padding:8px;
    border: 2px grey solid;
    border-radius:5px;
    font-weight:600;
    font-size:1.5rem;
    grid-area:buy;
    color:#000;
    text-align:center;
}
.event-lner .event_buy {
    color:var(--lner);
    border:2px var(--lner) solid;
}
@media only screen and (min-width:768px) {
    .event_buy {
        max-width: 250px;
    }
}

.event_address,
.event_email,
.event_tags,
.event_venue {
    display:none;
}

.event_town,
.event_buy {
    display:block;
}
.event_town {
    font-size:1.5rem;
    grid-area:town;
    font-weight:600;
}

.event_description-active {
    height:unset;
    padding-bottom: 20px;
    white-space:unset;
}
.event_description.event_description-active::before {
    background: none;
}

.event_img {
    grid-area: image;
    /* height: 100%; */
    border-radius: 5px 5px 0 0;
    width: calc(100% + calc(var(--template-padding) * 2));
    /* height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content; */
    max-height: 200px;
    margin-left: calc(var(--template-padding) * -1);
    object-fit: cover;
    object-position: center;
    /* contain: size; */
}

.event_img_big {
    display: none;
    grid-area: image;
    width: 100%;
    border-radius: 5px 0 0 5px;
    object-fit: cover;
    object-position: center;
}
.event_img_default {
    width: 100%;
    border-radius: 5px 5px 0 0;
}

.event p {
    margin: 0;
}

.event h1,
.event h2 {
    margin: 0;
    padding: 0;
}

.event_heading {
    grid-area: name;
    padding-top: 8px !important;
    /* color: #ff5722; */
}

.event_venue {
    grid-area: venue;
    /* color: #ff5722; */
    padding: 0;
}

.event_station {
    grid-area: station;
    text-align: right;
    padding-top: 10px;
    /* width: 100%; */
}

.event_tags {
    grid-area: tags;
    justify-self: start;
    padding-bottom: 10px;
}

.event_date span,
.event_station span {
    font-size: 1.4rem;
    /* overflow: visible; */
}

.event_date {
    align-self: flex-end;
    grid-area: date;
    /* padding-bottom: 10px; */
    font-size: 1.5rem;
}
/*.event-lner .event_date {*/
/*    color:var(--lner);*/
/*}*/
.event-lner .event_heading {
    color:var(--lner);
}

.event_address {
    grid-area: address;
    font-size: 1.4rem;
    font-weight: 700;
}

.event_website {
    grid-area: website;
    width: 100%;
    text-decoration: none;
    color:#000;
    font-size:1.5rem;
}

.event_name, .event_town, .event_content, .event_email {
    display: none;
}

/* @media only screen and (min-width: 321px) {
    .event_tags {
        white-space: nowrap;
    }
} */
.event_alternate {
    display: grid;
    grid-template-areas:
    "image name name name station"
    "image venue venue venue venue"
    "image date date tags tags";
    grid-template-columns: minmax(22.27%, 1.5fr) 1fr 1fr 1fr 1fr;
    /* grid-auto-rows: min-content; */
    /* grid-template-rows: min-content min-content min-content; */
    grid-column-gap: 10px;
    height: auto;
    /* max-height: 150px; */
    /* margin-bottom: var(--template-padding); */
    /*     background-color:var(--northern); */
    color: #000;
    padding-right: var(--template-padding);
    position: relative;
    margin-bottom: calc(var(--template-padding) * 2);
}

.event_alternate:before {
    content: "";
    position: absolute;
    /*     width: calc(85% - 30px - var(--template-padding)); */
    /* width:calc(100% - calc(var(--template-padding) * 2) - 40px); */
    width: calc(72.7272727273% + 1px + var(--template-padding));
    right: 0;
    height: 110%;
    top: -5%;
    border: 3px var(--northern) solid;
    /* border-left-width: 5px; */
}

.event_alternate img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.event_alternate_img {
    grid-area: image;
    width: 100%;
    height: 100%;
    contain: size;
}

.event_alternate h1,
.event_alternate h2 {
    margin: 0;
    padding: 0;
}
.event_alternate_name {
    grid-area: name;
}

.event_alternate_venue {
    grid-area: venue;
}

.event_alternate_station {
    grid-area: station;
    text-align: right;
    /* width: 100%; */
}

.event_alternate_tags {
    grid-area: tags;
    align-self: flex-end;
    justify-self: flex-end;
    text-align: right;
}

.event_alternate_date span,
.event_alternate_station span {
    font-size: 1.2rem;
    /* overflow: visible; */
}

.event_alternate_date {
    align-self: flex-end;
    grid-area: date;
}

@media only screen and (min-width: 768px) {
    .event {
        display: grid;
        /*grid-template-areas:*/
        /*"image name name venue venue"*/
        /*"image address address address address"*/
        /*"image date date tags tags"*/
        /*"image website website website website";*/
        grid-template-areas:
        "image name name name name"
        "image name name name name"
        "image date date date date"
        "image description description description description"
        "image town town town town"
        "image ticket ticket ticket ticket"
        "image buy buy buy buy"
        "image website website website website";
        grid-template-columns: 150px 1fr 1fr 1fr 1fr;
        /* grid-auto-rows: min-content; */
        grid-template-rows: 1fr;
        grid-column-gap: 10px;
        height: auto;
        /* min-height: 150px; */
        /* max-height: 150px; */
        margin-bottom: var(--template-padding);
        padding: unset;
        padding-right: var(--template-padding);
        position: relative;
    }


    .event-lner {
        grid-template-areas:
        "image name name name name"
        "image name name name name"
        "image date date date date"
        "image description description description description"
        "image town town town town"
        "image ticket ticket ticket ticket"
        "image buy buy buy buy"
        "image website website website website";
        color:#000;
        background:#FFF;
        box-shadow:none;
        border:1px grey solid;
        filter:unset;
        -webkit-filter:unset;
    }

    .event-no-img{
        grid-template-areas:
        "name name name name name"
        "date date date date date"
        "description description description description description"
        "town town town town town"
        "ticket ticket ticket ticket ticket"
        "buy buy buy buy buy"
        "website website website website website";
        justify-items: center;
        text-align: center;
    }

    .event_venue {
        padding-top: 8px !important;
        justify-self: end;
    }

    .event_tags {
        font-size: 1.2rem;
        justify-self: end;
        padding-bottom: 0;
    }

    .event_img {
        width: 100%;
        margin-left: unset;
        border-radius: 5px 0 5px 0px;
        height: 100%;
    }

    .event_alternate {
        grid-template-columns: 150px 1fr 1fr 1fr 1fr;
        min-height: 100px;
        margin-bottom: calc(var(--template-padding) * 3);
    }

    .event_alternate:before {
        width: calc(100% - 150px - var(--template-padding) + 10px);
        height: 120%;
        top: -10%;
    }
}


.event-schedule-round {
    clip-path: polygon(0 0, 100% 0%, calc(100% - 2.5rem) 100%, 0% 100%);
    margin-left: 1rem;
    padding-left: 1rem;
    width: 150px;
    background: #004d71;
    color: white;
    height: 25px;
}

@media screen and (min-width: 768px) {
    .event-schedule-round {
        width: 220px;
    }
}
.event-schedule-row,
.event-schedule-row-round {
    position: relative;
    align-self: start;
    margin: 10px 0;
    /* margin: 0 10px; */
}

.event-schedule-row-round {
    margin-top: 43px;
}

/*upcoming events*/
.event-schedule-button-popin {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    pointer-events: none;
}
.event-schedule-button-popin > button {
    width: 120px;
    height: 22px;
    margin: 2px 0;
    -webkit-appearance: none;
    border: none;
    background: none;
    cursor: pointer;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    border-radius: 21px;
    background: var(--colorTheme);
    color: white;
    max-width: 400px;
    font-weight: 700;
    pointer-events: all;
}
.TOCGR .event-schedule-button-popin > button {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.TOCGW > .app >
.singlefullitem > #panelUpcomingevents >
#upcoming-events-list > .upcoming-events-container >
.upcoming-events-events > .upcoming-events-popin >
.event-schedule-button-popin > button {
    background-color: var(--gwr);
}

.TOCRT > .app >
.singlefullitem > #panelUpcomingevents >
#upcoming-events-list > .upcoming-events-container >
.upcoming-events-events > .upcoming-events-popin >
.event-schedule-button-popin > button {
    background-color: var(--nr-secondary);
}
.TOCRT > .app >
.singlefullitem > #panelUpcomingevents >
#upcoming-events-list > .upcoming-events-container >
.upcoming-events-events > .upcoming-events-popin {
    border: var(--nr-secondary) 3px solid;
}

.TOCGW > .app >
.singlefullitem > #panelUpcomingevents >
#upcoming-events-list > .upcoming-events-container >
.upcoming-events-events > .upcoming-events-popin {
    border: var(--gwr) 3px solid;
}
.upcoming-events-header-container {
    position: sticky;
    top: 0;
    background: white;
    z-index: 1;
    display: grid;
    -webkit-box-shadow: 0 2px 2px 0 #333;
    box-shadow: 0 2px 2px 0 #333;
    padding: calc(var(--template-padding) / 2) var(--template-padding);
}
.TOCGR .upcoming-events-header-container {
    box-shadow:none;
    -webkit-box-shadow:none;
}


@media only screen and (min-width: 500px) {
    .upcoming-events-header-container {
        grid-template-columns: 1fr 2fr;
    }
}
.dropdown-container {
    display: grid;
    grid-template-columns: 6fr 1fr;
    max-width: 400px;
    min-width: 300px;
    height: 40px;
    align-items: center;
    justify-items: start;
    position: relative;
    border-radius: 20px;
    border: 1px solid black;
    cursor: pointer;
    transition: all .1s ease;
}

.dropdown-border {
    border-radius: 20px 20px 0 0;
    border-bottom: 1px solid transparent;
    max-height: 300px;
    top: 0;
}


.dropdown-menu,
.dropdown-menu > svg {
    height: 20px;
    padding: 0 5px;
}

.dropdown-path {
    fill: white;
    stroke: black;
    stroke-width: 25px;
    transition: all .3s ease;
}

.dropdown-border > .dropdown-menu > svg > path {
    fill: silver;
}

.dropdown-menu {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: flex-start;
    width: 100%;
    position: absolute;
    top: 10px;
}
.dropdown-container .dropdown-container-button {
    font-weight: bold;
    font-size: 22px;
    cursor: pointer;
    display: flex;
    right: initial;
    position: absolute;
    height: 100%;
    align-items: center;
    top: revert;
    width: 100%;
    justify-content: flex-end;
    transition: all .3s ease;
    visibility: hidden;
    opacity: 0;
    width: 5px;
    right: 10px;
}

.dropdown-items {
    width: calc(100% + 2px);
    left: -1px;
    top: 37px;
    padding-bottom: 0.8rem;
    position: absolute;
    background-color: white;
    min-width: 160px;
    overflow: auto;
    z-index: 1;
    max-height: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    margin: 0;
    border: 1px solid black;
    border-top: 0;
    visibility: hidden;
    opacity: 0;
    transition: all .1s ease;
}

.dropdown-items > div {
    padding: var(--template-padding) 0 0 var(--template-padding);
}

.dropdown-container .dropdown-selector-visible {
    visibility: visible;
    opacity: 1;
    max-height: 300px;
    border-radius: 0 0 20px 20px;
}
.upcoming-events-two,
.upcoming-events-one {
    display: grid;
    padding: 15px;
    min-height: 280px;
    grid-template-columns: 115px 30px 115px;
    grid-template-rows: 2fr 1fr 1fr;
    grid-row-gap: 10px;
    justify-items: center;
    grid-template-areas:
"svg svg svg"
"info info info"
"date date date";
}

.upcoming-events-two {
    grid-template-areas:
        "home line away"
        "info info info"
        "date date date";
}

.upcoming-events-events {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.upcoming-events-popin {
    background-color: #FFF;
    height: 265px;
    display: none;
    padding: 0 var(--template-padding);
    border: var(--colorTheme) 3px solid;
    max-width: 300px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    animation: addPopin .3s forwards;
    width: 280px;
    text-align: center;
    border-radius: 5px;
}
.addPopin{
    animation: addBreadcrumbPopin .3s ease forwards;
}
.addPopinFirst{
    animation: addBreadcrumbPopinFirst .3s ease forwards;
}

.upcoming-events-popin-add {
    display: flex;
}

.upcoming-events-popin-remove {
    animation: removePopin 1s forwards;
}
.dropdown-closebtn {
    font-weight: bold;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
    position: absolute;
    right: 10px;
    top: 5px;
}
#icon_autumn-rugby,
#icon_bowls,
#icon_gymnasticsArtistic,
#icon_volleyball,
#icon_wrestling {
    overflow: visible;
}

/*google maps*/
.gm-style .gm-style-iw-d div {
    font-family: Nunito;
    font-size: 1.4rem;
    line-height: 1.5;
    font-weight: 400;
}

.gm-style .gm-style-iw-c {
    box-shadow: 0 1px 3px 1px #e2e2e2;
}
.TOC .gm-style .gm-style-iw-c {
    box-shadow:none;
    -webkit-box-shadow:none;
}
.bike_map_pin {
    width: 25px;
}

.bike_tile {
    display: grid;
    grid-template-columns:minmax(60px, min-content) auto min-content;
    grid-auto-rows: min-content;
    grid-template-areas:
                        "icon title toggle"
                        "symbol p p"
                        "symbol link link";
    width: 100%;
    /* place-items: center; */
    align-items: center;
    grid-gap: 8px;
    padding: var(--template-padding);
}

.bike_tile:nth-of-type(odd) {
    background-color: #eee;
}

.bike_tile_icon {
    place-self: start;
    grid-area: icon;
    justify-self: center;
    width: 60px;
}
.bike_tile_icon_infowindow {
    display: flex;
    margin: auto;
    width: 60px;
}

.rental_tile_icon_symbol {
    grid-area: symbol;
    place-self: start;
    width: 60px;
    display: none;
    justify-self: center;
}

.rental_tile_icon_symbol_infowindow {
    width: 60px;
}

.bike_tile_toggle {
    grid-area: toggle;
    place-self: end;
    width: 30px;
    transform-origin: center center;
    -webkit-transform-origin: center center;
    -moz-transform-origin: center center;
    place-self: center;
    transition: 0.3s ease;
    -webkit-transition: 0.3s ease;
}

.bike_tile_togger:hover {
    cursor: pointer;
}

.bike_tile_toggle_rotate {
    transform: rotateX(180deg);
    -webkit-transform: rotateX(180deg);
    -moz-transform: rotateX(180deg);
}

.bike_tile_title {
    grid-area: title;
    font-size: 1.3rem;
}

.bike_tile_content {
    grid-area: p;
    display: none;
    /* height:50px; */
}

.bike_tile_content div {
    font-size: 1.3rem;
    line-height: 2;
}

.rental_tile_anchor {
    color: black;
    text-decoration: none;
    grid-area: link;
    display: none;
    max-width: 400px;
}

.bike_tile_content_display {
    display: block;
}

.rental_tile_button {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    border-radius: 5px;
    color: #000;
    background: #FFF;
    cursor: pointer;
    font-size: 1.3rem;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 5rem;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    margin: var(--template-padding) 0;
    width: 80%;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR .rental_tile_button {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.rental_tile_button div {
    font-size: 1.4rem;
    font-weight: 700;
}

.scooter-icon {
    width: 50px;
}
.google-maps-filter-button {
    background-color: #fff;
    /* border:2px solid #fff; */
    border-radius: 3px;
    /* box-shadow: 0 2px 6px rgba(0,0,0,.3); */
    cursor: pointer;
    margin: 8px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 40px;
    font-size: 1rem;
    height: 40px;
    box-shadow: rgb(0 0 0 / 30%) 0 1px 4px -1px;
    border: 4px transparent;
    box-sizing: border-box;
}
.TOCGR .google-maps-filter-button {
    box-shadow:none;
    -webkit-box-shadow:none;
}
.google-maps-filters-container {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
}

.google-maps-filters-company-container {
    flex-direction: column;
}

.rental-filter-button {
    width: 100%;
}

.rental-filter-button path,
.rental-filter-button line {
    stroke-width: 2px;
}
.platform-ferry {
    width: 30px;
}

.platform-ferry path {
    stroke-width: 2px;
}

.TOCGC .app .singlefullitem #panelMap .google-maps-filters-container .google-maps-filter-button-active {
    /* background-color:var(--gc); */
    border: 4px var(--gc) solid;
    border-top: none;
    border-left: none;
    border-right: none;
}

.TOCRT .app .singlefullitem #panelMap .google-maps-filters-container .google-maps-filter-button-active {
    border: 4px var(--nr) solid;
    border-top: none;
    border-left: none;
    border-right: none;
}

.TOCNT .app .singlefullitem #panelMap .google-maps-filters-container .google-maps-filter-button-active {
    /* background-color:#8e5eeb; */
    border: 4px #8e5eeb solid;
    border-top: none;
    border-left: none;
    border-right: none;
}

.TOCGW .app .singlefullitem #panelMap .google-maps-filters-container .google-maps-filter-button-active {
    /* background-color:#6dcb99; */
    border: 4px #6dcb99 solid;
    border-top: none;
    border-left: none;
    border-right: none;
}
.TOCSW .app .singlefullitem #panelMap .google-maps-filters-container .google-maps-filter-button-active {
    /* background-color:#0092cb; */
    border: 4px #0092cb solid;
    border-top: none;
    border-left: none;
    border-right: none;
}

.TOCAW .app .singlefullitem #panelMap .google-maps-filters-container .google-maps-filter-button-active {
    /* background-color:#0092cb; */
    border: 4px var(--tfw) solid;
    border-top: none;
    border-left: none;
    border-right: none;
}

.TOCES .app .singlefullitem #panelMap .google-maps-filters-container .google-maps-filter-button-active {
    /* background-color:#0092cb; */
    border: 4px var(--es) solid;
    border-top: none;
    border-left: none;
    border-right: none;
}

.TOCGR .app .singlefullitem #panelMap .google-maps-filters-container .google-maps-filter-button-active {
    /* background-color:#0092cb; */
    border: 4px var(--lner) solid;
    border-top: none;
    border-left: none;
    border-right: none;
}

/*national status*/

.main_rainbow {
    grid-area: content;
    width: 100%;
}
.main_rainbow div ul {
    margin: 0;
    padding: 0 var(--template-padding);
    list-style-type: none;
}

.main_rainbow div ul li {
    width: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    align-items: center;
    border-radius: 3px;
    margin: var(--template-padding) 0;
}

.main_rainbow div ul .main_item_rainbow-div{
    display: flex;flex-direction: column;
}

.main_rainbow div ul .main_item_rainbow-div .main_item_rainbow-div-status{
    display: grid;grid-template-areas: "rail rail svg svg";grid-template-columns: 1fr 1fr 1fr 1fr;width: 100%;align-items: center;
}

.main_item_rainbow-div-text-icon{
    grid-area: svg;
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 5px;
}

.main_rainbow div ul li p {
    width: 50%;
    text-align: center;
    margin: 0;
}
.main_rainbow div ul .main_item_rainbow-div-text-icon p{
    width: 120px;
}

@media screen and (min-width: 1100px) {
    .main_rainbow div ul .main_item_rainbow-div-text-icon p{
        width: 175px;
    }
}

.main_rainbow_heading {
    font-size: 1.5rem;
    margin: 0;
    padding: var(--template-padding);
    position: -webkit-sticky;
    position: sticky;
    top: -1px;
    -webkit-box-shadow: 0 2px 2px 0 #333;
    box-shadow: 0 2px 2px 0 #333;
    background-color: #FFF;
    z-index: 1;
}

.main_rainbow_key {
    border-radius: 3px;
    padding: var(--template-padding);
}
.main_rainbow div ul li .national-status-text {

    width:100%;
    line-height: 0;
    opacity: 0;
    visibility: hidden;
}

.main_rainbow div ul li .national-status-text-open {
    line-height: 1;
    padding: var(--template-padding) 0;
    margin-top:10px;
    opacity: 1;
    visibility: visible;
    transition: all .1s ease;
}
.woolwich-ferry {
    background-color: #f7931d;
    color: black
}

.thames-river-services {
    background-color: rgb(42, 46, 152);
    color: white
}

.city-cruises {
    background: #ec3717;
    color: white;
}

.rb1 {
    background-color: #2d3039;
    color: white;
}

.rb2 {
    background-color: #0072bc;
    color: white
}

.rb4 {
    background-color: rgb(97, 194, 157);
    color: black
}

.rb6 {
    background-color: rgb(223, 100, 176);
    color: white
}

.rb6c {
    background-color: rgb(223, 100, 176);
    color: white
}

/*window seater*/
.window-seater-journey{
    border: solid 2px green; grid-auto-flow: column;grid-template-columns: min-content;
}
.window-seater-journey-div{
    max-width: 300px;
    display: none;
    padding-bottom: 0px;
    padding-left: 0px;
    width: 100%;
    margin: 0px;
    grid-column: 1 / 4;
    grid-row: 2;
}
.window-seater-audio-container{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}
.window-seater-audio-input,
.window-seater-audio-button{
    cursor: pointer;
    height: 35px;
    border-radius: 10px;
    width: 60%;
    max-width: 300px;
    font-weight: bold;
}
.window-seater-audio-input{
    color: white;
    background-color: var(--gc);
    border: none;
}
.window-seater-audio-button{
    border: 1px solid var(--gc);
    background-color: white;
    font-size: var(--text-input);
}
.window-seater-transcript-none{
    display: none;
}
.window-seater-other-container,
.window-seater-audio-stories-container,
.window-seater-journey-container{
    padding: 15px 10px;
    background: beige;
    margin: 5px;gap: 5px;
    transition: .3s all ease;
    display: flex;
    flex-direction: column;
}
.window-seater-other-container-upcoming{
    border-radius: 15px 15px 0 0;
}
.window-seater-journey-container{
    background: white;
}
.window-seater-audio-stories-container{
    border-radius: 20px 20px 0 0;
}
.window-seater-other-container-grid{
    display: grid;
    grid-template-areas:'img header''img text';
    grid-auto-columns: 1fr 2fr;
    gap: 5px;
}
.window-seater-other-container-img{
    width: 100%;border-radius: 5px;max-height: 200px;max-width: fit-content;margin: auto;
}
.window-seater-other-container-text{
    display: flex;flex-direction: column;justify-content: center;
}
.window-seater-other-container-header{
    padding: 0;margin: 0;
}
#window-seater-other-header{
    border-radius: 15px;
}
.window-seater-other-header{
    padding: 15px 10px;
    background: beige;
    margin: 5px;
    width: -webkit-fill-available;
    /*border-radius: 20px 20px 0 0;*/
}
.window-seater-audio-stories-text,
.window-seater-audio-stories-header{
    margin: 0;
    padding: 0;
}
.window-seater-audio-control{
    display: flex;
    margin: 20px 0;
    width: 250px;
    gap: 10px;
    align-items: center;
}
.window-seater-content-img{
    transition: .3s all ease;
    max-height: 300px;
    height: fit-content;
    width: -moz-available;
    width: -webkit-fill-available;
    max-width: fit-content;
    margin: auto;
}
.window-seater-other-container-end {
    margin-bottom: 50px;
    border-radius: 0 0 15px 15px;
}
.window-seater-content{
    border-top: 2px solid white;border-radius: 20px 20px 0 0;position: relative;padding: 10px 10px;z-index: 1;background: white;margin: -20px 0 0;
}
div#window-seater{
    max-width: 700px;
    margin: auto auto;
    display: flex;
    flex-direction: column;
}
.window-seater-journey-image{
    width: auto;
    border-radius: 5px;
    max-height: 100px;
    max-width: fit-content;
    margin: auto;
}
@media screen and (min-width: 768px) {
    .window-seater-content-img{
        margin: 20px auto;
        border-radius: 20px;
    }
}
.window-seater-slider[type=range] {
    -webkit-appearance: none;
    width: 100%;
    height: 15px;
    border-radius: 5px;
    background: #d3d3d3;
    outline: none;
    opacity: 0.9;
    -webkit-transition: .2s;
    transition: opacity .2s;
}
.window-seater-slider[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: var(--gc);
    cursor: pointer;
}
.window-seater-slider[type=range]::-moz-range-thumb {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: var(--gc);
    cursor: pointer;
}.selected-feedback-icon {
    animation: bloat 0.8s ease;
    -webkit-filter: drop-shadow(0px 0px 5px rgb(255 0 0));
}
.TOCGR .selected-feedback-icon {
    -webkit-filter: none;
    filter:none;
}
.feedback-multi-step-container, .feedback-multi-step-survey-container {
    height: 100%;
}
.feedback-outer-wrapper, .feedback-survey-outer-wrapper {
    position: relative;
    height: 90%;
    width: 100vw;
    overflow-x: hidden;
    transition: all 0.2s ease-in-out;
}

.feedback-compensation-outer-wrapper,
.feedback-survey-outer-wrapper {
    height: 100%;
}

.feedback-wrapper, .feedback-survey-wrapper, .feedback-container-wrapper {
    height: 100%;
    width: 700vw;
    position: relative;
    overflow-x: hidden;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
}

.feedback-container-wrapper {
    width: unset;
    display: flex;
    flex-direction: column;
}

@media screen and (min-width: 750px) {
    .feedback-outer-wrapper {
        height: 65%;
    }

    .feedback-compensation-outer-wrapper,
    .feedback-survey-outer-wrapper {
        height: 100%;
    }
}

@media screen and (min-width: 1100px) {
    .feedback-outer-wrapper, .feedback-survey-outer-wrapper {
        width: 80vw;
    }

    .feedback-wrapper {
        width: calc(100% * 7);
    }

    .feedback-outer-wrapper, .feedback-survey-outer-wrapper {
        width: 100%;
    }
}

.feedback-step, .feedback-step-survey, .feedback-question {
    height: 80%;
    grid-template-rows: 40% 22% 10%;
    align-items: center;
    width: calc(100% / 7);
    position: relative;
    display: inline-grid;
    padding: var(--template-padding);
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
}

.feedback-input {
    display: flex;
    flex-direction: row;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: space-around;
}


.feedback-survey-emoji-state,
.feedback-emoji-state {
    fill: none;
    stroke: #fff;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 6px;
}

.feedback-survey-emoji-circle-fill,
.feedback-emoji-circle-fill {
    fill: #f07e26;
}
.TOCGR .feedback-survey-emoji-circle-fill,
.TOCGR .feedback-emoji-circle-fill {
    fill:#ce132e;
}
.TOCSW > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-slider-svg
> .feedback-emoji-face > .feedback-emoji-circle-fill {
    fill: var(--sw)
}

.TOCES > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-slider-svg
> .feedback-emoji-face > .feedback-emoji-circle-fill {
    fill: var(--es)
}

.TOCGW > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-slider-svg
> .feedback-emoji-face > .feedback-emoji-circle-fill {
    fill: var(--gwr-secondary)
}

.feedback-survey-emoji-eyes,
.feedback-emoji-eyes {
    fill: #fff;
}

.feedback-survey-emoji-item,
.feedback-emoji-item {
    transition: 0.2s ease-in-out;
}

.feedback-survey-emoji-item-hidden,
.feedback-emoji-item-hidden {
    visibility: hidden;
    opacity: 0;
}

.feedback-survey-face,
.feedback-slider-svg {
    width: 75px;
    margin: 40px;
}

.feedback-survey-satisfaction,
.feedback-slider-response {
    margin-top: 3rem;
}

.icon_survey-form-send,
.feedback-form-send {
    height: 10rem;
    top: 17rem;
    width: 100vw;
    fill: none;
    stroke: var(--gc);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 5px;
    position: absolute;
    pointer-events: initial;
}
.feedback-form-send > * {
    pointer-events: none;
}
.icon_survey-form-send:hover,
.feedback-form-send:hover {
    cursor:pointer;
}

.TOCSW > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form-container > .feedback-form-send {
    stroke: var(--sw)
}

.TOCES > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form-container > .feedback-form-send {
    stroke: var(--es)
}

.TOCGW > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form-container > .feedback-form-send {
    stroke: var(--gwr-secondary)
}

.TOCAW > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form-container > .feedback-form-send {
    stroke: var(--tfw)
}
.TOCGR > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form-container > .feedback-form-send {
    stroke: var(--lner)
}
.TOCGR .feedback-form-send {
    stroke:var(--lner);
}

.feedback-form-send {
    top: 0;
    position: relative;
    width: 100%;
}

#feedback-search-input {
    height: fit-content;
    width: 100%;
    position: relative;
    background: white;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;
    padding: 50px 0px 0px;
}


@media screen and (min-width: 1100px) {
    .icon_survey-form-send {
        width: 100%;
        top: 12rem;
    }
}

.icon_survey-form-send-email,
.feedback-form-send-email {
    display: none;
}
.feedback-form-send-label {
    font-size:1.5rem;
    font-weight:600;
}
.lner-send-link {
    font-size:1.3rem;
}
.email-build {
    display: block;
    stroke: var(--gc);
    stroke-width: 3px;
    stroke-dasharray: 3000;
    animation-name: emailBuild;
    animation-duration: 1.5s;
}

.TOCSW > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form-container > .feedback-form-send
> .email-build {
    stroke: var(--sw);
}

.TOCES > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form-container > .feedback-form-send
> .email-build {
    stroke: var(--es);
}

.TOCGW > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form-container > .feedback-form-send
> .email-build {
    stroke: var(--gwr-secondary);
}

.TOCAW > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form-container > .feedback-form-send
> .email-build {
    stroke: var(--tfw);
}

.send-item-succeed {
    /*display: block;*/
    animation-name: sendItemSucceed;
    animation-duration: 3s;
}

.send-item-failure {
    animation: sendItemFail 2s ease;
}

@keyframes emailBuild {
    0% {
        stroke-dashoffset: -2000;
    }
    50% {
        stroke-dashoffset: -2000;
    }
}

@keyframes sendItemSucceed {
    0% {
        left: 0;
    }
    50% {
        left: -20px;
    }
    80% {
        left: calc(100% - 100px)
    }
}

@keyframes sendItemFail {
    0%, 7% {
        transform: rotateZ(0);
    }
    15% {
        transform: rotateZ(-20deg);
    }
    20% {
        transform: rotateZ(15deg);
    }
    25% {
        transform: rotateZ(-15deg);
    }
    30% {
        transform: rotateZ(11deg);
    }
    35% {
        transform: rotateZ(-9deg);
    }
    40%, 100% {
        transform: rotateZ(0);
    }
}


@media screen and (min-width: 400px) {
    .feedback-step, .feedback-step-survey {
        height: 90%;
    }
}

.feedback-multi-step-6 {
    grid-template-rows: 20% 30% min-content;
}

@media screen and (min-width: 1100px) {
    /* allow overflow through height of page for text-area multi-step */
    .feedback-multi-step-6 {
        overflow-y: visible;
    }

    .feedback-wrapper {
        overflow-y: visible;
    }

    .feedback-outer-wrapper, .feedback-survey-outer-wrapper {
        overflow-y: visible;
    }
}

.feedback-multi-step-input-text-area,
.feedback-input-text-area {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    flex-direction: column;
    min-height: 100px;
}

.feedback-multi-step-input-text-area-counter {
    justify-self: flex-start;
    font-size: 1.3rem;
    color: red;
    transition: all 0.2s ease;
    margin-top: var(--template-padding);
    padding: 0 var(--template-padding);
    display: none;
}

.feedback-multi-step-input-text-area-counter-visible {
    display: block;
}

.feedback-multi-step-input-text-area-counter-legit {
    color: #000;
}

.feedback-multi-step-input-text-area textarea,
.feedback-input-text-area textarea {
    width: 100%;
    height: 100%;
    resize: none;
    overflow: auto;
    max-width: 750px;
    font-size: var(--text-input);
    transition: all 0.2s ease;
    border: 1px black solid;
    border-radius: 5px;
    margin-top: 10px;
    padding: 5px;
    height: 200px;
}

.feedback-question .feedback-question-container h4 /*multilingual*/
{
    text-align: center;
}

.feedback-error-messaging {
    padding: var(--template-padding);
    color: red;
    font-size: 1.3rem;
    font-weight: 600;
    display: none;
}

.feedback-error-messaging-active {
    display: block;
}

.multi-step-submit {
    place-self: center;
    min-width: 70px;
    max-width: 100px;
    background: none;
    bordeR: none;
    margin: 0;
}

.feedback-multi-step-6-submit {
    place-self: center;
    background: none;
    bordeR: none;
    -webkit-tap-highlight-color: transparent;
    padding-bottom: 50px;
}

.feedback-multi-step-question {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

.feedback-multi-step-labels,
.feedback-labels {
    display: flex;
    width: 100%;
    flex-direction: row;
    justify-content: space-between;
    align-self: start;
    max-width: 750px;
    margin: auto;
}

.feedback-multi-step-labels span,
.feedback-labels span {
    font-size: 1.3rem;
    font-weight: 700;
}

.feedback-multi-step-labels span:first-of-type,
.feedback-labels span:first-of-type {
    margin-left: var(--template-padding);
}

.feedback-multi-step-labels span:last-of-type,
.feedback-labels span:last-of-type {
    margin-right: var(--template-padding);
}

.feedback-ease,
.feedback-useful {
    display: none;
}

.feedback-form-container {
    height: 10rem;
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.feedback-multi-step-form-survey-response,
.feedback-multi-step-form-response,
.feedback-form-response {
    border: 1px solid var(--gc);
    display: block;
    border-radius: 15px;
    padding: 10px;
    transition: 1s;
    margin-bottom: 20px;
}

.TOCSW > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form > .feedback-input
> .feedback-form-response {
    border: 1px solid var(--sw);
}

.TOCES > .app > .singlefullitem > #panelFeedback
> .feedback-container > .feedback-container-wrapper
> .feedback-question > .feedback-question-container
> .feedback-form > .feedback-input
> .feedback-form-response {
    border: 1px solid var(--es);
}
.TOCGR .feedback-form-response {
    border:1px solid var(--lner);
}

.feedback-form-response {
    width: 215px;
    min-height: 75px;
    margin-bottom: 0;
}


.feedback-multi-step-input-slider,
.feedback-input-slider {
    width: 100%;
    position: relative;
    margin: auto;
    max-width: 750px;
}

.feedback-multi-step-input-slider input,
.feedback-input-slider input {
    width: 100%;
}

.feedback-multi-step-input-slider input[type=range],
.feedback-input-slider input[type=range] {
    width: 100%;
    margin: 11.3px 0;
    background-color: transparent;
    -webkit-appearance: none;
}

.feedback-multi-step-input-slider input[type=range]:focus,
.feedback-input-slider input[type=range]:focus {
    outline: none;
}

.feedback-multi-step-input-slider input[type=range]::-webkit-slider-runnable-track,
.feedback-input-slider input[type=range]::-webkit-slider-runnable-track {
    background: #000;
    border: 0.2px solid #010101;
    border-radius: 10px;
    width: 100%;
    height: 8px;
    cursor: pointer;
}

.feedback-multi-step-input-slider input[type=range]::-webkit-slider-thumb,
.feedback-input-slider input[type=range]::-webkit-slider-thumb {
    margin-top: -14px;
    width: 34px;
    height: 34px;
    background: var(--nr);
    border: none;
    border-radius: 35px;
    cursor: pointer;
    -webkit-appearance: none;
}

.feedback-multi-step-input-slider input[type=range]:focus::-webkit-slider-runnable-track,
.feedback-input-slider input[type=range]:focus::-webkit-slider-runnable-track {
    background: #000;
}

.feedback-multi-step-input-slider input[type=range]::-moz-range-track,
.feedback-input-slider input[type=range]::-moz-range-track {
    background: #000;
    border: none;
    border-radius: 10px;
    width: 100%;
    height: 8px;
    cursor: pointer;
}

.feedback-multi-step-input-slider input[type=range]::-moz-range-thumb,
.feedback-input-slider input[type=range]::-moz-range-thumb {
    width: 34px;
    height: 34px;
    background: var(--nr);
    border: 1.8px solid #00001e;
    border-radius: 35px;
    cursor: pointer;
}
.TOCGR .feedback-multi-step-input-slider input[type=range]::-moz-range-thumb,
.TOCGR .feedback-input-slider input[type=range]::-moz-range-thumb {
    background: var(--lner);
}
.TOCSW .feedback-multi-step-input-slider input[type=range]::-moz-range-thumb,
.TOCSW .feedback-input-slider input[type=range]::-moz-range-thumb {
    background: var(--sw);
}
.TOCRT .feedback-multi-step-input-slider input[type=range]::-moz-range-thumb,
.TOCRT .feedback-input-slider input[type=range]::-moz-range-thumb {
    background: var(--nr);
}


.feedback-multi-step-input-slider input[type=range]::-ms-track,
.feedback-input-slider input[type=range]::-ms-track {
    background: transparent;
    border-color: transparent;
    border-width: 12.2px 0;
    border: none;
    color: transparent;
    width: 100%;
    height: 8px;
    cursor: pointer;
}

.feedback-multi-step-input-slider input[type=range]::-ms-fill-lower,
.feedback-input-slider input[type=range]::-ms-fill-lower {
    background: #000;
    border: 0.2px solid #010101;
    border: none;
    border-radius: 2.6px;
}

.feedback-multi-step-input-slider input[type=range]::-ms-fill-upper,
.feedback-input-slider input[type=range]::-ms-fill-upper {
    background: #000;
    border: 0.2px solid #010101;
    border: none;
    border-radius: 2.6px;
}

.feedback-multi-step-input-slider input[type=range]::-ms-thumb,
.feedback-input-slider input[type=range]::-ms-thumb {
    width: 34px;
    height: 34px;
    background: var(--nr);
    border: 1.8px solid #00001e;
    border-radius: 35px;
    cursor: pointer;
    margin-top: 0;
    /*Needed to keep the Edge thumb centred*/
}

.feedback-multi-step-input-slider input[type=range]:focus::-ms-fill-lower,
.feedback-input-slider input[type=range]:focus::-ms-fill-lower {
    background: #000;
}

.feedback-multi-step-input-slider input[type=range]:focus::-ms-fill-upper,
.feedback-input-slider input[type=range]:focus::-ms-fill-upper {
    background: #000;
}

.TOCSW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-container-wrapper >
.feedback-question > .feedback-form >
.feedback-multi-step-input-slider >
input[type=range]::-webkit-slider-thumb,
.TOCSW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-container-wrapper >
.feedback-question > .feedback-form >
.feedback-input-slider >
input[type=range]::-webkit-slider-thumb {
    background: var(--sw);
}

.TOCES > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-container-wrapper >
.feedback-question > .feedback-form >
.feedback-multi-step-input-slider >
input[type=range]::-webkit-slider-thumb,
.TOCES > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-container-wrapper >
.feedback-question > .feedback-form >
.feedback-input-slider >
input[type=range]::-webkit-slider-thumb {
    background: var(--es);
}

.TOCGW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-container-wrapper >
.feedback-question > .feedback-form >
.feedback-multi-step-input-slider >
input[type=range]::-webkit-slider-thumb,
.TOCGW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-container-wrapper >
.feedback-question > .feedback-form >
.feedback-input-slider >
input[type=range]::-webkit-slider-thumb {
    background: var(--gwr-secondary);
}

.TOCAW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-container-wrapper >
.feedback-question > .feedback-form >
.feedback-multi-step-input-slider >
input[type=range]::-webkit-slider-thumb,
.TOCAW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-container-wrapper >
.feedback-question > .feedback-form >
.feedback-input-slider >
input[type=range]::-webkit-slider-thumb {
    background: var(--tfw);
}

.TOCGR > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-container-wrapper >
.feedback-question > .feedback-form >
.feedback-multi-step-input-slider >
input[type=range]::-webkit-slider-thumb,
.TOCGR > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-container-wrapper >
.feedback-question > .feedback-form >
.feedback-input-slider >
input[type=range]::-webkit-slider-thumb {
    background: var(--lner);
}
.TOCGR .feedback-input-slider > input[type=range]::-webkit-slider-thumb {
    background:var(--lner);
}
.feedback-multi-step-input-button {
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin: unset;
    width: 100%;
}

.feedback-multi-step-input-button button {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    border-radius: 5px;
    color: #000;
    background: none;
    cursor: pointer;
    font-size: 1.3rem;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 5rem;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 45%;
    -webkit-tap-highlight-color: transparent;
    max-width: 300px;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR .feedback-multi-step-input-button button {
    box-shadow:none;
    -webkit-box-shadow:none;
}

#feedback-multi-step-input-button-4 > button > /*multilingual*/,
#feedback-multi-step-input-button-5 > button > /*multilingual*/
{
    pointer-events: none;
}

/* @media screen and (min-width:1100px) {
    .feedback-multi-step-input-button button {
        margin-right: 100px;
    }
} */
.feedback-underlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    pointer-events: none;
    display: none;
}

.feedback-breakpoint {
    height: 60%;
    border: 3px black solid;
    border-radius: 2px;
}

.feedback-button-container, .feedback-button-survey-container, .feedback-buttons-container {
    position: fixed;
    bottom: calc(55px + var(--footer-height));
    right: 0;
    width: 100%;
    max-width: 750px;
    height: 89px;
    transition: all 0.2s ease-in-out;
    display: flex;
    align-items: center;
    padding: 0 var(--template-padding);
    justify-content: space-between;
    margin: auto;
    flex-direction: row-reverse;
    transition: all 0.2s ease;
    pointer-events: none;
}

.feedback-forward-button, .feedback-backward-button, .feedback-forward-survey-button, .feedback-backward-survey-button, .feedback-button-forward, .feedback-button-backward {
    width: 89px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    -webkit-tap-highlight-color: transparent;
    justify-content: center;
}

.feedback-forward-button:hover, .feedback-backward-button:hover, .feedback-forward-survey-button:hover, .feedback-backward-survey-button:hover, .feedback-button-forward:hover, .feedback-button-backward:hover {
    cursor: pointer;
}

.feedback-forward-button svg:hover, .feedback-backward-button svg:hover, .feedback-forward-survey-button svg:hover, .feedback-backward-survey-button svg:hover, .feedback-button-forward svg:hover, .feedback-button-backward svg:hover {
    cursor: pointer;
}

@media screen and (min-width: 750px) {
    .feedback-button-container {
        bottom: unset;
        position: unset;
        right: unset;
        padding: unset;
    }

    .feedback-button-compensation-container, .feedback-button-survey-container, .feedback-buttons-container {
        position: fixed;
        bottom: var(--footer-height);
        right: 0;
        padding: 0 var(--template-padding);
    }
}


.feedback-button-survey-container,
.feedback-buttons-container {
    left: 0;
}

.feedback-backward-button {
    right: unset;
    left: 0;
}

@media screen and (min-width: 1100px) {
    .feedback-backward-button {
        left: 20vw;
    }

    .feedback-form-response {
        width: 250px;
    }
}

.feedback-hide-button {
    opacity: 1;
    visibility: hidden;
}

.survey-hide-button {
    opacity: 1;
    visibility: hidden;
    display: none;
}

.feedback-button,
.survey-button {
    width: 100%;
    padding: 0;
    margin: 0;
    background: none;
    border: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    -webkit-tap-highlight-color: transparent;
    pointer-events: auto;
}

.feedback-button:hover,
.survey-button:hover {
    cursor: pointer;
}

.feedback-button svg, .survey-button svg {
    width: 50%;
    pointer-events: none;
    max-height: 50px;
    -webkit-tap-highlight-color: transparent;
}

.feedback-button-circle, .survey-button-circle {
    display: none;
    fill: var(--gc);
    stroke: white;
    stroke-width: 2px;
}

.TOCSW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-buttons-container >
.feedback-buttons > .feedback-button > svg >
.feedback-button-circle {
    fill: var(--sw);
}
.TOCGR > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-buttons-container >
.feedback-buttons > .feedback-button > svg >
.feedback-button-circle {
    fill: var(--lner);
}
.TOCGR .feedback-button .feedback-button-circle,
.podcast-episode-arrow-container > .arrow-container-arrows > svg > circle{
    fill:var(--lner);
}
.first-class-arrow-container > .arrow-container-arrows > svg > circle{
    fill:var(--lner);
    display: none;
}
.podcast-episode-arrow-container > .arrow-container-arrows > svg > circle{
   display: none;
}

.TOCES > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-buttons-container >
.feedback-buttons > .feedback-button > svg >
.feedback-button-circle {
    fill: var(--es);
}

.TOCES > .app > .singlefullitem > #panelFeedback >
.feedback-multi-step-container > .feedback-button-container >
.feedback-forward-button > .feedback-button > svg >
.feedback-button-circle,
.TOCES > .app > .singlefullitem > #panelFeedback >
.feedback-multi-step-container > .feedback-button-container >
.feedback-backward-button > .feedback-button > svg >
.feedback-button-circle {
    fill: var(--es);
}

.TOCGW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-buttons-container >
.feedback-buttons > .feedback-button > svg >
.feedback-button-circle {
    fill: var(--gwr-secondary);
}

.TOCAW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-buttons-container >
.feedback-buttons > .feedback-button > svg >
.feedback-button-circle {
    fill: var(--tfw);
}

.TOCSW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-buttons-container >
.feedback-buttons > .feedback-button > svg > path {
    fill: var(--sw);
}

.TOCES > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-buttons-container >
.feedback-buttons > .feedback-button > svg > path {
    fill: var(--es);
}

.TOCGW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-buttons-container >
.feedback-buttons > .feedback-button > svg > path {
    fill: var(--gwr-secondary);
}
@media screen and (min-width: 1100px) {
    .TOCGW > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-buttons-container > .feedback-buttons > .feedback-button > svg > path,
    .TOCSW > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-buttons-container > .feedback-buttons > .feedback-button > svg > path,
    .TOCRT > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-buttons-container > .feedback-buttons > .feedback-button > svg > path,
    .TOCGC > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-buttons-container > .feedback-buttons > .feedback-button > svg > path {
        fill: #ffffff;
    }
}

.TOCAW > .app > .singlefullitem > #panelFeedback >
.feedback-container > .feedback-buttons-container >
.feedback-buttons > .feedback-button > svg > path {
    fill: var(--tfw);
}

@media screen and (min-width: 1100px) {
    .feedback-button, .survey-button {
        height: 100%;
        width: unset;
        margin: unset;
    }

    .feedback-button svg, .survey-button svg,
    .podcast-episode-arrow-container > .arrow-container-arrows > svg {
        width: unset;
        height: 100%;
        overflow: visible;
    }
    .first-class-arrow-container > .arrow-container-arrows > svg {
        width: unset;
        height: 100%;
        overflow: visible;
        user-select: none;
    }
    .podcast-episode-arrow-container > .arrow-container-arrows > svg > circle{
        display: unset;
    }
    .first-class-arrow-container > .arrow-container-arrows > svg > circle{
        display: unset;
    }
    .feedback-button-circle, .survey-button-circle {
        display: unset;

    }
}
.feedback-button-circle {
    display: none;
    fill: var(--gc);
}

@media screen and (min-width: 1100px) {
    .feedback-button, .survey-button {
        height: 100%;
        width: unset;
        margin: unset;
    }

    .feedback-button svg.survey-button svg {
        width: unset;
        height: 100%;
        overflow: visible;
    }

    .feedback-button-circle, .survey-button-circle {
        display: unset;

    }
}

.feedback-alert-container, .feedback-survey-alert-container, .feedback-container-alert {
    display: none;
    position: absolute;
    width: 100%;
    background: white;
    top: 0;
    z-index: 9;
}

.feedback-container-alert {
    height: 100%;
    position: relative;
    margin: 25px 0 0 0;
}

@media screen and (min-width: 1200px) {
    .feedback-container-alert {
        margin: 100px 0 0 0;
    }
}

.feedback-alert-container {
    height: 90%;
}

.feedback-success, .feedback-error, .feedback-survey-success, .feedback-survey-error {
    display: none;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 0 var(--template-padding);
}

.feedback-survey-success, .feedback-survey-error {
    flex-direction: column;
}

.feedback-multi-step-error,
.feedback-send-error {
    padding: 1em;
    opacity: 0;
    text-align: center;
    transition: .2s ease;
    visibility: hidden;
}

.feedback-multi-step-error-message,
.feedback-send-error-message {
    opacity: 1;
    visibility: visible;
}

.feedback-survey-complete,
.feedback-complete {
    position: relative;
    /*height: 70vh;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.feedback-success span, .feedback-error span, .feedback-survey-success span, .feedback-survey-error span,
.feedback-survey-complete span, .feedback-complete span {
    font-weight: 700;
    font-size: 1.3rem;
    text-align: center;
}

.feedback-multi-step-submit-title {
    font-size: 1.3rem;
    font-weight: 600;
    pointer-events: none;
}

.feedback-alert-show {
    display: flex;
}

.feedback-stage-0 {
    margin-left: 0;
}

.feedback-stage-1 {
    margin-left: -100vw;
}

.feedback-stage-2 {
    margin-left: -200vw;
}

.feedback-stage-3 {
    margin-left: -300vw;
}

.feedback-stage-4 {
    margin-left: -400vw;
}

.feedback-stage-5 {
    margin-left: -500vw;
}

.feedback-stage-6 {
    margin-left: -600vw;
}

.feedback-stage-7 {
    margin-left: -700vw;
}

.feedback-stage-8 {
    margin-left: -800vw;
}

.feedback-stage-9 {
    margin-left: -900vw;
}

.feedback-stage-10 {
    margin-left: -1000vw;
}

.feedback-stage-11 {
    margin-left: -1100vw;
}

.feedback-stage-12 {
    margin-left: -1200vw;
}

.feedback-stage-13 {
    margin-left: -1300vw;
}

.feedback-stage-14 {
    margin-left: -1400vw;
}

.feedback-stage-15 {
    margin-left: -1500vw;
}

.feedback-stage-16 {
    margin-left: -1600vw;
}

.feedback-stage-17 {
    margin-left: -1700vw;
}

@media screen and (min-width: 1100px) {
    .feedback-stage-0 {
        margin-left: 0;
    }

    .feedback-stage-1 {
        margin-left: -80vw;
    }

    .feedback-stage-2 {
        margin-left: -160vw;
    }

    .feedback-stage-3 {
        margin-left: -240vw;
    }

    .feedback-stage-4 {
        margin-left: -320vw;
    }

    .feedback-stage-5 {
        margin-left: -400vw;
    }

    .feedback-stage-6 {
        margin-left: -480vw;
    }

    .feedback-stage-7 {
        margin-left: -560vw;
    }

    .feedback-stage-8 {
        margin-left: -640vw;
    }

    .feedback-stage-9 {
        margin-left: -720vw;
    }

    .feedback-stage-10 {
        margin-left: -800vw;
    }

    .feedback-stage-11 {
        margin-left: -880vw;
    }

    .feedback-stage-12 {
        margin-left: -960vw;
    }

    .feedback-stage-13 {
        margin-left: -1040vw;
    }

    .feedback-stage-14 {
        margin-left: -1120vw;
    }

    .feedback-stage-15 {
        margin-left: -1200vw;
    }

    .feedback-stage-16 {
        margin-left: -1280vw;
    }

    .feedback-stage-17 {
        margin-left: -1360vw;
    }
}

@media screen and (min-width: 1200px) {
    .feedback-stage-0 {
        margin-left: 0;
    }

    .feedback-stage-1 {
        margin-left: -100%;
    }

    .feedback-stage-2 {
        margin-left: -200%;
    }

    .feedback-stage-3 {
        margin-left: -300%;
    }

    .feedback-stage-4 {
        margin-left: -400%;
    }

    .feedback-stage-5 {
        margin-left: -500%;;
    }

    .feedback-stage-6 {
        margin-left: -600%;
    }

    .feedback-stage-7 {
        margin-left: -700%;
    }

    .feedback-stage-8 {
        margin-left: -800%;
    }

    .feedback-stage-9 {
        margin-left: -900%;
    }

    .feedback-stage-10 {
        margin-left: -1000%;
    }

    .feedback-stage-11 {
        margin-left: -1100%;
    }

    .feedback-stage-12 {
        margin-left: -1200%;
    }

    .feedback-stage-13 {
        margin-left: -1300%;
    }

    .feedback-stage-14 {
        margin-left: -1400%;
    }

    .feedback-stage-15 {
        margin-left: -1500%;
    }

    .feedback-stage-16 {
        margin-left: -1600%;
    }

    .feedback-stage-17 {
        margin-left: -1700%;
    }
}

/* compensation overrides */
.feedback-multi-step-question {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

/*
.feedback-multi-step-compensation-container {
    height:unset;
} */

.feedback-step-compensation,
.feedback-step-survey,
.feedback-question {
    height: 100%;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    padding-top: 0;
    margin-top: 0;
    grid-template-rows: unset;
}

.feedback-question {
    margin: 25px 0;
    width: 100%;
}

.TOCGC .app .singlefullitem #panelFeedback .feedback-container
.feedback-container-wrapper .feedback-question .dropdown-container,
.TOCGC .app .singlefullitem #panelFeedback .feedback-container
.feedback-container-wrapper .feedback-question .dropdown-container .dropdown-items{
    border: 1px solid var(--gc);
}
.TOCGC .app .singlefullitem #panelFeedback .feedback-container
.feedback-container-wrapper .feedback-question .dropdown-border .dropdown-menu svg path{
    fill: var(--gc);

}
.TOCGC .app .singlefullitem #panelFeedback .feedback-container
.feedback-container-wrapper .feedback-question .dropdown-container .dropdown-items{
    border-top: 0;
}

@media screen and (min-width: 1100px) {
    .feedback-question {
        margin: 100px 0 0 0;
    }
}

.feedback-question-hide,
.weather-button-hide{
    display: none;
}

.feedback-multi-step-form,
.feedback-form {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 550px;
}

.feedback-multi-step-form label,
.feedback-form label {
    font-weight: 600;
    font-size: 1.5rem;
    line-height: 2;
    margin-top: var(--template-padding);
    min-width: 200px;
}

.feedback-compensation-wrapper {
    width: 900vw;
}

.feedback-survey-wrapper {
    width: 1000vw;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
}

.feedback-compensation-wrapper .feedback-step {
    width: calc(100% / 9);
}

.feedback-step-survey {
    width: calc(100% / 10);
}

.feedback-compensation-outer-wrapper,
.feedback-survey-outer-wrapper {
    height: 100%;
}

.feedback-multi-step-survey-questions,
.feedback-multi-step-questions,
.feedback-question-container {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    max-width: 550px;
}

.feedback-dropdown-container {
    height:435px;
}

.feedback-multi-step-survey-questions > h2,
.feedback-multi-step-questions > h2,
.feedback-question-container > h2 {
    text-align: center;
}

.feedback-multi-step-survey-questions > h3,
.feedback-multi-step-questions > h3,
.feedback-survey-complete > h3,
.feedback-complete > h3,
.feedback-survey-success > h3,
.feedback-question-container > h3 {
    text-align: center;
    padding-top: 15px;
}

.feedback-response {
    text-align: center;
    width: 100%;
}

.feedback-response > textarea {
    width: 100%;
    max-width: 550px;
}

.feedback-response-negative-hide {
    display: none;
    visibility: hidden;
    opacity: 0;
}

.feedback-response-negative-show {
    display: unset;
    visibility: visible;
    opacity: 1;
}

.feedback-multi-step-input-labels {
    display: flex;
    width: 100%;
    flex-direction: row;
    justify-content: center;
    gap: 10px;
}

#feedback-multi-step-form-survey-0, #feedback-multi-step-form-survey-1 {
    padding-top: 1rem;
}

.feedback-multi-step-form-survey-questions {
    padding-bottom: 5rem;
}

@media screen and (min-width: 1100px) {
    .feedback-compensation-wrapper {
        width: calc(100% * 9);
        height: unset;
    }

    .feedback-survey-wrapper {
        width: calc(100% * 10);
        height: unset;
    }

    .feedback-survey-wrapper,
    .feedback-survey-alert-container {
        padding-top: 2vh;
    }

    .feedback-compensation-outer-wrapper,
    .feedback-survey-outer-wrapper {
        height: 100%;
    }
}

.feedback-compensation-wrapper {
    padding-bottom: 100px;
}

.feedback-multi-step-compensation-heading {
    margin-top: var(--template-padding);
}


.feedback-multi-step-input-text-compensation, .feedback-multi-step-input-text-survey {
    width: 100%;
    padding: var(--template-padding);
    margin: 0;
    font-size: 1.3rem;
    border-radius: 5px;
    outline: none;
    border: 1px black solid;
}

.form-input-invalid {
    border: 1px red solid;
}

.feedback-multi-step-person-item, .feedback-multi-step-person-item-survey {
    margin-top: var(--template-padding);
    display: none;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.feedback-multi-step-person-item-active {
    display: flex;
}

.feedback-step-error,
.feedback-error {
    display: none;
    padding: var(--template-padding);
    margin: 0;
    font-size: 1.3rem;
    line-height: 2;
    color: red;
    font-weight: 600;
}

.feedback-step-error-active,
.feedback-error-active {
    display: block;
}

.feedback-hide-panel {
    opacity: 1;
    visibility: hidden;
    display: none;
}

#feedback-multi-step-form-compensation-7-submit, #feedback-multi-step-form-survey-9-submit {
    margin-top: calc(var(--template-padding) * 2);
    line-height: 2;
    background: none;
}

#feedback-multi-step-form-survey-6 > textarea,
#feedback-multi-step-form-survey-3-free,
#feedback-multi-step-form-survey-8-free {
    margin: 1rem;
    width: 100%;
    /*height: 100%;*/
    resize: none;
    overflow: auto;
    max-width: 750px;
    font-size: var(--text-input);
    transition: all 0.2s ease;
    border: 1px black solid;
    border-radius: 5px;
}

#feedback-multi-step-form-survey-3-free,
#feedback-multi-step-form-survey-8-free {
    margin: 1rem 0;
    width: 75%;
    height: 150px;
}

/* .compensation-required:after {
    content:" *";
    color: red;
} */
select[required], input[required] {
    background-image: radial-gradient(red 15%, transparent 16%);
    background-size: 2rem 2rem;
    background-position: top right;
    background-repeat: no-repeat;
}

.feedback-button-compensation-container {
    pointer-events: none;
}

.feedback-upload-instructions {
    margin-top: var(--template-padding);
    font-size: 1.3rem;
    line-height: 2;
}

.feedback-upload-instructions-list {
    list-style-type: none;
    padding: 0;
}

.feedback-upload-instructions-list li {
    font-size: 1.3rem;
    font-weight: 600;
}

.feedback-hide-absolute {
    display: none;
}

.feedback-compensation-side-message {
    font-size: 1.3rem;
    line-height: 2;
    margin-top: var(--template-padding);
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
}

.feedback-compensation-side-message a {
    text-decoration: none;
    color: #000;
    font-size: 1.3rem;
    font-weight: 600;
}

.compensation-intro {
    line-height: 2;
    max-width: 550px;
    margin: auto;
}

@media screen and (min-width: 1100px) {
    .feedback-button-compensation-container,
    .feedback-button-survey-container,
    .feedback-buttons-container {
        position: fixed;
        bottom: calc(50vh - var(--header-height));
        width: 80vw;
        max-width: unset;
        padding: 0 var(--template-padding);
    }

    .feedback-button-compensation-container,
    .feedback-button-survey-container,
    .feedback-buttons-container {
        /*left: 240px;*/
        right: 0;
        bottom: calc(25vh - var(--header-height));
        max-width: 850px;
    }
}

#feedback-page-tracker {
    display: none;
}

#feedback-notice {
    text-align: center;
    margin: 5%;
}

.survey-response-highlighted,
.feedback-response-highlighted {
    background-color: var(--gc);
}


.TOCSW > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-container-wrapper > .feedback-question >
.feedback-question-container > .feedback-form > .feedback-input > .feedback-response-highlighted {
    background-color: var(--sw);
}

.TOCES > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-container-wrapper > .feedback-question >
.feedback-question-container > .feedback-form > .feedback-input > .feedback-response-highlighted {
    background-color: var(--es);
}

.TOCGW > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-container-wrapper > .feedback-question >
.feedback-question-container > .feedback-form > .feedback-input > .feedback-response-highlighted {
    background-color: var(--gwr-secondary);
}

.TOCAW > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-container-wrapper > .feedback-question >
.feedback-question-container > .feedback-form > .feedback-input > .feedback-response-highlighted {
    background-color: var(--tfw);
}
.TOCGR > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-container-wrapper > .feedback-question >
.feedback-question-container > .feedback-form > .feedback-input > .feedback-response-highlighted {
    background-color: var(--lner);
    color:#FFF;
}
.TOCGR .feedback-response-highlighted {
    background-color:var(--lner);
    color:#FFF;
}

.TOCGW > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-container-wrapper > .feedback-question >
.feedback-question-container > .feedback-form > .feedback-input > .feedback-form-response {
    border: 1px solid var(--gwr-secondary);
}
.TOCGR > .app > .singlefullitem > #panelFeedback > .feedback-container > .feedback-container-wrapper > .feedback-question >
.feedback-question-container > .feedback-form > .feedback-input > .feedback-form-response {
    border: 1px solid var(--lner);
}

.feedback-page-number-current {
    display: flex;
    height: 40px;
    width: 65px;
    border: 1px solid var(--gc);
    background-color: var(--gc);
    align-items: center;
    justify-content: center;
    border-radius: 0 0 0 10px;
}

.feedback-iframe {
    height: 100%;
    width: 100%;
}
.feedback-complete-form {
    margin-bottom: 50px;
}
.btn-survey-lner {
    padding: 4px;
    width: 60%;
    margin-top: 15px;
    max-width: 400px;
    font-weight: 700;
    border: none;
    border-radius: 25px;
    font-size: 1.3rem;
    cursor: pointer;
    -webkit-font-smoothing: antialiased;
    height: 5rem;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}
.TOCGR .btn-survey-lner {
    box-shadow:none;
}

/*tell us*/

.tell-us-v2-top-section {
    transition: all 0.3s ease;
}

.tell-us-v2-introduction {
    font-size: 1.3rem;
    line-height: 1.5;
    padding: var(--template-padding);
}

.tell-us-v2-buttons-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.tell-us-v2-buttons-container button {
    margin-top: calc(var(--template-padding) * 2);
    padding: 8px 21px;
    width: 75%;
    font-size: 1.4rem;
    border-radius: 5px;
    line-height: 2;
    border: none;
    box-shadow: 0 0 5px #a19797;
}
.TOCGR .tell-us-v2-buttons-container button {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.TOCGW .app .singlefullitem #panelTellus .tell-us-v2-buttons-container button {
    background: var(--gwr);
    color: #fff;
}

.TOCAW .app .singlefullitem #panelTellus .tell-us-v2-buttons-container button {
    background: var(--tfw);
    color: #fff;
}

.TOCSW .app .singlefullitem #panelTellus .tell-us-v2-buttons-container button {
    background: var(--sw);
    color: #fff;
}

.TOCES .app .singlefullitem #panelTellus .tell-us-v2-buttons-container button {
    background: var(--es);
    color: #fff;
}

.TOCNT .app .singlefullitem #panelTellus .tell-us-v2-buttons-container button {
    background: var(--northern);
    color: #fff;
}

.TOCRT .app .singlefullitem #panelTellus .tell-us-v2-buttons-container button {
    background: var(--nr);
    color: #fff;
}

.TOCGC .app .singlefullitem #panelTellus .tell-us-v2-buttons-container button {
    background: var(--nr);
    color: #000;
}

.tell-us-v2-buttons-container button:first-of-type {
    margin-top: var(--template-padding);
}

#iframeContent{
    width: 100%;
    height: 100vh;
    top: 0;
    position: fixed;
    border:none;
    max-width: 1198px;
    background: white;
}

.TOCGR #iframeContent{
    width: 100%;
    height: calc(100% - 155px);
    position: fixed;
    border:none;
    max-width: 960px;
}

.autocomplete-tell-us {
    display: flex;
    justify-content: center;
    width: 90%;
    margin-left: 5%;
    flex-direction: column;
    align-items: center;
    margin-top: var(--template-padding);
    margin-bottom: calc(var(--template-padding) * 2);
}

.tell-us-v2-search-station {
    height: 3rem;
    border-radius: 5px;
    font-size: var(--text-input);
    /* width: 90%; */
    padding-left: 1rem;
    width: 100%;
    border: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    -webkit-appearance: none;
}
.TOCGR .tell-us-v2-search-station {
    box-shadow:none;
    -webkit-box-shadow:none;
}
.autcomplete-tell-us-button {
    width: 80%;
    margin-left: 10%;
    height: 3rem;
    margin-top: var(--template-padding);
    border-radius: 5px;
    font-size: var(--text-input);
    padding-left: 1rem;
    border: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    -webkit-appearance: none;
}
.TOCGR .autocomplete-tell-us-button {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.tell-us-v2-form,
.feedback-complete-form {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.tell-us-v2-input,
.feedback-complete-input {
    width: 90%;
    margin-top: calc(var(--template-padding) * 2);
    line-height: 2;
    padding: 5px 3px;
    background: none;
    border: 1px #aba4a4 solid;
    box-shadow: 0 0 3px #aba4a4;
    color: #000;
}
.TOCGR .tell-us-v2-input,
.TOCGR .feedback-complete-input {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.tell-us-v2-form .tell-us-v2-input:first-of-type,
.feedback-complete-form .feedback-complete-input:first-of-type {
    margin-top: var(--template-padding);
}

.tell-us-v2-textarea {
    margin-top: calc(var(--template-padding) * 2);
    width: 90%;
    line-height: 2;
    padding: 5px 3px;
    background: none;
    border: 1px #aba4a4 solid;
    color: #000;
    box-shadow: 0 0 3px #aba4a4;
    min-height: 150px;
}
.TOCGR .tell-us-v2-textarea {
    box-shadow:none;
    -webkit-box-shadow:none;
}

#tell-us-v2-textarea {
    background-repeat: no-repeat;
    background-size: 30px;
    background-position-y: 5px;
    background-position-x: 5px;
    transition: all 0.3s ease;
    padding-left: 38px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' data-name='Layer 2' viewBox='0 0 100 100'%3E%3Cpath d='M69.67 19.27h10.24a4.37 4.37 0 0 1 4.63 4l.13 66.6A4.37 4.37 0 0 1 80.05 94l-57.62.08a4.37 4.37 0 0 1-4.64-4l-.13-66.6a4.38 4.38 0 0 1 4.62-4.07h10.24' style='fill:none;stroke:%23000;stroke-linecap:round;stroke-linejoin:round;stroke-width:4px'/%3E%3Cpath d='M69.73 12.37H59.61S58.84 5.93 51 5.94h.34c-7.87 0-8.61 6.47-8.61 6.47H32.61v11.83l37.14-.06ZM42.36 38.26H73.3M42.36 76.11H73.3M42.36 63.49H73.3M42.36 50.88H73.3' style='fill:none;stroke:%23000;stroke-linecap:round;stroke-linejoin:round;stroke-width:4px'/%3E%3Cpath d='M26.6 48.11h6.32v5.54H26.6zM26.6 61.37h6.32v5.54H26.6zM26.6 73.34h6.32v5.54H26.6zM26.6 35.49h6.32v5.54H26.6z' style='fill:none;stroke:%23000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px'/%3E%3C/svg%3E");
}

#tell-us-v2-input-name,
#feedback-complete-input-name {
    background-repeat: no-repeat;
    background-size: 30px;
    background-position-y: center;
    background-position-x: 5px;
    padding-left: 38px;
    transition: all 0.3s ease;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' data-name='Layer 2' viewBox='0 0 100 100'%3E%3Cpath d='M51.05 58.37c-39.18 0-36.79 16.27-36.79 16.27a12.78 12.78 0 0 0 12.79 12.79H75A12.82 12.82 0 0 0 87.83 74.6s2.39-16.23-36.78-16.23Z' style='fill:none;stroke:%231d1d1b;stroke-linecap:round;stroke-linejoin:round;stroke-width:5px'/%3E%3Ccircle cx='51.05' cy='29.58' r='20.17' style='fill:none;stroke:%231d1d1b;stroke-linecap:round;stroke-linejoin:round;stroke-width:5px'/%3E%3C/svg%3E");
}

#tell-us-v2-input-email,
#feedback-complete-input-email {
    background-repeat: no-repeat;
    background-size: 30px;
    background-position-x: 5px;
    background-position-y: center;
    padding-left: 38px;
    transition: all 0.3s ease;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' data-name='Layer 2' viewBox='0 0 100 100'%3E%3Cpath d='M5.82 41.72v-8.28c0-5.34 4.06-9.67 9.06-9.67h70.24c5 0 9.06 4.33 9.06 9.67V67.3c0 5.34-4.06 9.67-9.06 9.67H14.88c-5 0-9.06-4.33-9.06-9.67V57.12M50 56.28 14.85 34.64M85.15 34.65 50 56.28M22.98 66.1l16.27-16.28M60.69 50.43 78.1 65.49' style='fill:none;stroke:%23000;stroke-linecap:round;stroke-linejoin:round;stroke-width:5px'/%3E%3C/svg%3E");
}

.tell-us-v2-feedback-container {
    padding-bottom: calc(var(--template-padding) * 2);
}

.active-tell-us-input {
    background-size: 18px !important;
    background-position-x: 5px !important;
    background-position-x: 5px !important;
    padding-left: 26px !important;
}

.active-tell-us-input-textarea {
    background-position-y: 11px !important;
}

.tell-us-v2-dropdown-options-container {
    display: none;
}

.tell-us-v2-toggle-active {
    display: block;
}

.tell-us-v2-dropdown-topics-select {
    display: flex;
    align-items: center;
    font-size: 1.3rem;
    margin-top: calc(var(--template-padding) * 2);
    line-height: 2;
    /* border-radius:3px; */
    border: 1px #aba4a4 solid;
    box-shadow: 0 0 3px #aba4a4;
    padding: calc(var(--template-padding) / 2);
    padding-left: 7px;
}
.TOCGR .tell-us-v2-dropdown-topics-select {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.tell-us-v2-dropdown-topics-select svg {
    width: 25px;
    margin-right: 8px;
    transform-origin: center center;
    -webkit-transform: center center;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}

.tell-us-v2-dropdown-topics-select:hover {
    cursor: pointer;
}

.tell-us-v2-dropdown-topics-container {
    width: 90%;
}

.tell-us-v2-dropdown-options-container {
    border-right: 1px #aba4a4 solid;
    border-left: 1px #aba4a4 solid;
    border-bottom: 1px #aba4a4 solid;
}

.tell-us-v2-dropdown-topics-container div {
    font-size: 1.3rem;
    color: grey;
    flex-grow: 1;
}

.tell-us-v2-dropdown-option {
    padding: var(--template-padding);
    line-height: 2;
    border-bottom: 1px #aba4a4 solid;
    display: flex;
    align-items: center;
}

.tell-us-v2-dropdown-option:hover {
    cursor: pointer;
}

.tell-us-v2-dropdown-option svg {
    width: 30px;
    margin-right: 8px;
}

.tell-us-v2-dropdown-option:last-of-type {
    border-bottom: none;
}

.tell-us-v2-send,
.feedback-complete-send {
    margin-top: var(--template-padding);
    min-width: 200px;
    padding: var(--template-padding);
    font-size: 1.3rem;
    border-radius: 3px;
    box-shadow: 0 0 3px #aba4a4;
    border: none;
}
.TOCGR .tell-us-v2-send,
.TOCGR .feedback-complete-send {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.tell-us-v2-send:hover,
.feedback-complete-send:hover {
    cursor: pointer;
}

.TOCGW .app .singlefullitem #panelTellus .tell-us-v2-send {
    background: var(--gwr);
    color: #fff;
}

.TOCAW .app .singlefullitem #panelTellus .tell-us-v2-send {
    background: var(--tfw);
    color: #fff;
}

.TOCSW .app .singlefullitem #panelTellus .tell-us-v2-send,
.TOCSW .app .singlefullitem #panelFeedback #feedback-container
#feedback-container-alert #feedback-success span form .feedback-complete-send,
.TOCSW .app .singlefullitem #panelFeedback #feedback-container
#feedback-container-wrapper #feedback-question-1 .feedback-complete form .feedback-complete-send {
    background: var(--sw);
    color: #fff;
}

.TOCES .app .singlefullitem #panelTellus .tell-us-v2-send,
.TOCES .app .singlefullitem #panelFeedback #feedback-container
#feedback-container-alert #feedback-success span form .feedback-complete-send,
.TOCES .app .singlefullitem #panelFeedback #feedback-container
#feedback-container-wrapper #feedback-question-1 .feedback-complete form .feedback-complete-send {
    background: var(--es);
    color: #fff;
}

.TOCRT .app .singlefullitem #panelTellus .tell-us-v2-send {
    background: var(--nr);
    color: #fff;
}

.TOCNT .app .singlefullitem #panelTellus .tell-us-v2-send {
    background: var(--northern);
    color: #fff;
}

.TOCGC .app .singlefullitem #panelTellus .tell-us-v2-send {
    background: var(--gc);
    color: #000;
}

.TOCAW .app .singlefullitem #panelTellus .tell-us-v2-send {
    background: var(--tfw);
    color: #fff;
}

.tell-us-v2-status-message,
.feedback-complete-status-message {
    margin-top: var(--template-padding);
    font-size: 1.3rem;
    color: var(--gwr);
    /* color: #fff; */
    text-align: center;
    line-height: 2;
    text-decoration: none;
    width: 90%;
}

.tell-us-v2-back-menu-chevron,
.offers-return-back-menu-chevron,
.feedback-return-back-menu-chevron {
    width: 30px;
    margin-right: 8px;
    transform-origin: center center;
    -webkit-transform: center center;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);

}

.tell-us-v2-notice {
    color: var(--gwr);
    font-size: 1.5rem;
    line-height: 2;
    text-align: center;
    transition: all 0.3s ease;
}

.tell-us-v2-notice-gone {
    opacity: 0;
}

.tell-us-v2-hide {
    display: none !important;
}

.tell-us-v2-chevron-rotate,
.national-status-chevron-rotate{
    transform: rotate(180deg);
}

.tell-us-v2-return-to-menu,
.offers-return,
.feedback-return-to-menu {
    padding: var(--template-padding);
    border-bottom: 1px grey solid;
    font-size: 1.3rem;
    position: sticky;
    display: flex;
    align-items: center;
    top: 0;
    background-color: #FFF;
}
.feedback-return-to-menu {
    border-bottom: none;
    position: relative;
}
.tell-us-v2-return-to-menu {
    z-index: 21;
}
.tell-us-v2-from,
.tell-us-v2-to {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    border-radius: 5px;
    color: #000;
    background: none;
    cursor: pointer;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 3rem;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 90%;
    margin-left: 5%;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    font-size: var(--text-input);
    padding-left: 1rem;
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    margin-top: var(--template-padding);
}
.TOCGR .tell-us-v2-to,
.TOCGR. tell-us-v2-from {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.tell-us-v2-to {
    margin-top: calc(var(--template-padding) * 2);
    margin-bottom: calc(var(--template-padding) * 1);
}

.tell-us-v2-bad-form,
.feedback-complete-bad-form {
    border: 1px red solid;
}

#tell-us-v2-fromfinder-autocomplete-list,
#tell-us-v2-tofinder-autocomplete-list {
    width: 90%;
    margin-left: 5%;
}

.tell-us-v2-send-success,
.tell-us-v2-send-error,
.feedback-complete-send-success,
.feedback-complete-send-error {
    width: 50px;
}

#tell-us-v2-to,
#tell-us-v2-from,
#tell-us-v2-search-station {
    border-radius: 2px;
    border: 1px #aba4a4 solid;
    box-shadow: 0 0 3px #aba4a4;
    width: 90%;
}
.TOCGR #tell-us-v2-to,
.TOCGR #tell-us-v2-from,
.TOCGR #tell-us-v2-search-station {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.tell-us-v2-buttons-container .tell-us-v2-button-choice:last-of-type {
    margin-bottom: var(--template-padding);
}

.tell-us-v2-date-time {
    margin-left: 5%;
    margin-top: var(--template-padding);
    margin-bottom: var(--template-padding);
}

.tell-us-v2-terms,
.tell-us-v2-terms a,
.feedback-complete-terms {
    font-size: 1.3rem;
    line-height: 2;
    padding: var(--template-padding);
    text-align: center;
}

.tell-us-v2-terms:hover,
.feedback-complete-terms:hover {
    cursor: pointer;
}

.tell-us-v2-terms a {
    font-size: 1.3rem;
    line-height: 2;
}
.tell-us-v2-multiple-stations {
    padding: var(--template-padding);
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding-top: calc(var(--template-padding) / 2);
}

.tell-us-v2-station-option {
    padding: var(--template-padding);
    font-size: 1.3rem;
    border-radius: 3px;
    border: none;
    min-width: 150px;
    box-shadow: 0 0 3px #aba4a4;
}
.TOCGR .tell-us-v2-station-option {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.TOCGW .app .singlefullitem #panelTellus .tell-us-v2-station-option {
    background: var(--gwr);
    color: #fff;
}

.TOCAW .app .singlefullitem #panelTellus .tell-us-v2-station-option {
    background: var(--tfw);
    color: #fff;
}

.TOCSW .app .singlefullitem #panelTellus .tell-us-v2-station-option {
    background: var(--sw);
    color: #fff;
}

.TOCES .app .singlefullitem #panelTellus .tell-us-v2-station-option {
    background: var(--es);
    color: #fff;
}

.TOCRT .app .singlefullitem #panelTellus .tell-us-v2-station-option {
    background: var(--nr);
    color: #fff;
}

.TOCNT .app .singlefullitem #panelTellus .tell-us-v2-station-option {
    background: var(--northern);
    color: #fff;
}

.TOCGC .app .singlefullitem #panelTellus .tell-us-v2-station-option {
    background: var(--gc);
    color: #000;
}
.tell-us-option-hide {
    display: none;
}
.tell-us-v2-chevron-rotate {
    filter: drop-shadow(0px -2px 1px grey);
    -webkit-filter: drop-shadow(0px -2px 1px grey);
}
.TOCGR .tell-us-v2-chevron-rotate {
    filter: none;
    -webkit-filter: none;
}
.exhaustive .station-result-list {
    width: 90%;
}
.exhaustive-tell-us div form {
    display: flex;
    justify-content: center;
    position: relative;
}

.exhaustive-tell-us div form button {
    margin-right: 0;
    left: 5.5%;
}
.tell-us-v2-introduction strong {
    font-size: 1.3rem;
}header {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    grid-row: 1;
    grid-column: 1;
    -ms-grid-column-span: 5;
    grid-area: header;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 25% 50% 25%;
    grid-template-columns:25% 50% 25%;
    -ms-grid-rows: -webkit-min-content;
    grid-template-rows: -webkit-min-content;
    -ms-grid-rows: min-content;
    grid-template-rows: min-content;
    row-gap: var(--header-gap);
    grid-template-areas:
        "weather logo seat";
    background-color: white;
    height: var(--header-height);
    padding-top: 1rem;
    transition: all 0.2s ease;
    opacity: 1;
    visibility: visible;
}

.header-hide {
    opacity: 0;
    display: none;
    visibility: hidden;
}

.header_weather, .header_logo, .header_seat {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-item-align: center;
    align-self: center;
    justify-self: center;
    /* max-height: calc(var(--header-height) - var(--header-gap) - 25px); */
}

.header_weather svg, .header_logo svg, .header_seat svg {
    /* height: var(--header-height);
    max-width: 80%; */
    width: 100%;
}

.header_weather svg {
    filter: drop-shadow(3px 2px 2px rgba(0, 0, 0, 0.4));
    -webkit-filter: drop-shadow(3px 2px 2px rgba(0, 0, 0, 0.4));
}
.TOCGR .header_weather svg {
    filter:none;
    -webkit-filter:none;
}

.header_weather_info {
    -ms-grid-row: 3;
    grid-row: 3;
    grid-column: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
    grid-area: weather-info;
    -ms-grid-row-align: center;
    align-self: center;
    padding: 0 0 0 var(--template-padding);
    display: none;
}

.header_weather p, .header_logo p, .header_seat p {
    margin: 5px 0 0 0;
}

.header_logo {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
    grid-row: 1;
    grid-column: 2;
    grid-area: logo;
}

#back-end-weather {
    display: none;
}

#back-end-stop {
    display: none;
}

.header_seat h2 {
    width: 100%;
    text-align: center;
    font-size: 1rem;
    padding-left: var(--template-padding);
}

/* psuedo flag stuff for mobile */
.header_seat {
    position: relative;
}

.header_seat:hover {
    cursor: pointer;
}

@media only screen and (min-width: 1100px) {
    .header_seat h2 {
        font-size: 1.3rem;
    }
}
.header-cube-config {
    display: none;
}

.header-cube-header {
    grid-area: header;
    background-color: white;
    transition: all 0.2s ease;
    opacity: 1;
    position: relative;
    overflow:hidden;
    visibility: visible;
    width: 100vw;
    /*perspective-origin: 50% 50%;*/
    /* override previously set properties */
    /* -ms-grid-row: unset;
    -ms-grid-column: unset;
    grid-row: unset;
    grid-column: unset; */
    -ms-grid-column-span: unset;
    display: unset;
    -ms-grid-columns: unset;
    grid-template-columns:unset;
    -ms-grid-rows: unset;
    grid-template-rows: unset;
    -ms-grid-rows: unset;
    grid-template-rows: unset;
    row-gap: unset;
    grid-template-areas:unset;
    background-color: unset;
    padding-top: unset;
    opacity: unset;
    visibility: unset;
    transition: 1000ms;
}

@media screen and (min-width: 1100px) {
    .header-cube-header {
        width:100%;
        height: calc(1rem + var(--header-height) + var(--header-gap));
    }
}

.header_inner {
    position: absolute;
    /*width: 700vw;*/
    height: 100%;
    display:inline-flex;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    /*transform-style: preserve-3d;*/
    /*-webkit-transform-style: preserve-3d;*/
}
@media screen and (min-width:1100px) {
    .header_inner {
        width:800%;
    }
}

.header-cube-default {
    display: -ms-inline-grid;
    display: inline-grid;
    /*transform: rotateX(0deg) translateZ(60px);*/
    /*-webkit-transform: rotateX(0deg) translateZ(60px);*/
    /*-moz-transform: rotateX(0deg) translateZ(60px);*/
    /*-ms-transform: rotateX(0deg) translateZ(60px);*/
    -ms-grid-columns: 1fr 3fr 1fr;
    grid-template-columns:1fr 3fr 1fr;
    row-gap: 8px;
    grid-template-areas:
    "weather logo seat";
    background-color: white;
    transition: all 0.2s ease;
    opacity: 1;
    visibility: visible;
}

.header_second {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: Center;
    padding: 2px 5px;
    background-color: white;
    transition: all 0.2s ease;
    opacity: 1;
    visibility: visible;
    height: 100%;
}

.header-cube-1 {
    /* background: red; */
    /*transform: rotateX(90deg) translateZ(60px);*/
    display:block;
}

.header-cube-2 {
    /*transform: translateZ(100px) rotateX(-180deg);*/
    /* background: green; */
    /*transform: translateZ(-60px) rotateX(180deg);*/
    display:block;
}

.header-cube-3 {
    display:block;
    /*transform: rotateX(270deg) translateZ(60px);*/
    /* background: blue; */
    /*transform-origin: bottom center;*/
}

.strike-container-text,
.promotion-text {
    font-weight: 700;
    font-size: 50px;
    display: block;
    text-align: center;
}

multilingual.promotion-text {
    font-size: 20px!important;
}

.strike-container-text-top,
.strike-container-text-middle {
    color: #000;
    font-size: 85px;
    word-break: break-word;
}

.promotion-text {
    font-weight: 500;
}

.strike-container-text-top,
.promotion-text {
    color: #fff;
}

.strike-container-text-bottom {
    color: #fd501f;
    font-size: 45px;
}

.network-rail-anchor,
.plan-events-anchor,
.promotions-anchor,
.industrialaction-anchor,
.windowseater-anchor,
.luggage-anchor{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.industrialaction-anchor,
.windowseater-anchor {
    height: 100%;
    background-color: #f9dc5c;
    flex-direction: row;
    gap: 10px;
    padding: 5px;
    display: grid;
    grid-template-areas: "svg bannercontent";
    min-height: 90px;
    border-radius: 3px;
}

.windowseater-anchor {
    background-color:#0B6A02;
}
.industrialaction-anchor > svg,
.windowseater-anchor > svg {
    height: auto;
    grid-area: svg;
    max-height: 40px;
    width: 100%;
    max-width: 50px;
}
.windowseater-anchor > svg{
    background: white;
    border-radius: 5px;
}
@media screen and (min-width: 375px) {
        .industrialaction-anchor > svg,
        .windowseater-anchor > svg {
            max-height: 50px;
        }
    }

.industrialaction-anchor > div,
.windowseater-anchor > div {
    height: 100%;
    color: white;
    display: flex;
    flex-direction: column;
    align-items: center;
    grid-area: bannercontent;
    justify-content: center;
}

.industrialaction-anchor > div > p,
.windowseater-anchor > div > p {
    height: auto;
    color: black;
    text-align: center;
}

.windowseater-anchor > div > p{
    max-width: 400px;
    color: white;
}

.windowseater-anchor > div > p,
.windowseater-anchor > div > button {
    font-size: 14px;
}
.industrialaction-anchor > div > p,
.industrialaction-anchor > div > button {
    font-size: 15px;
}

@media screen and (min-width: 475px) {
    .industrialaction-anchor > div > p ,
    .industrialaction-anchor > div > button ,
    .windowseater-anchor > div > p > ,
    .windowseater-anchor > div > button >
    {
        font-size: 1.5rem;
    }

    .industrialaction-anchor > div,
    .windowseater-anchor > div{
        gap: 5px;
    }
}

.industrialaction-anchor > div > button {
    border: 3px solid black;
    border-radius: 15px;
    cursor: pointer;
    padding: 0px 10px;
    background: #403F4C;
    color: white;
}

.promotions-anchor {
    background-color: #0d1c2b;
    height: 100%;
}

.luggage-anchor {
    background-color: rgb(0, 145, 203);
    height: 100%;
}

.TOCRT .app .header-cube-header .header-offer-popup .promotions-anchor {
    background-color: white;
}
@media only screen and (min-width: 768px) {
    .TOCRT .app .header-cube-header .header-offer-popup .promotions-anchor {
        background-color: #6EC7B2;
    }
}
.network-rail-mobile-delay-notice,
.strike-banner-mobile,
.promotion-banner-mobile {
    /*height: 100%;*/
    /*max-height: var(--header-height);*/
}

.network-rail-ipad-delay-notice,
.strike-banner-tablet,
.promotion-banner-tablet {
    display: none;
    max-height: 70px;
}

.network-rail-desktop-delay-notice,
.strike-banner-desktop,
.promotion-banner-desktop {
    display: none;
    max-height: 95px;
}

.multiple-promotions-banner-desktop{
    height: 0;
    width: 0;
    max-height: 110px;
}

@media screen and (min-width: 700px) {
    .network-rail-mobile-delay-notice,
    .strike-banner-mobile,
    .promotion-banner-mobile {
        display: none;
    }

    .multiple-promotions-banner-mobile{
        display: block;
        height: 0;
        width:0;
    }

    .network-rail-ipad-delay-notice,
    .strike-banner-tablet,
    .promotion-banner-tablet {
        display: block;
        position: absolute;
        top: 0;
        max-height: 85px;
    }
}

@media screen and (min-width: 1100px) {
    .network-rail-ipad-delay-notice,
    .strike-banner-tablet,
    .promotion-banner-tablet {
        display: none;
    }

    .multiple-promotions-banner-tablet{
        display: block;
        height: 0;
        width: 0;
    }

    .network-rail-desktop-delay-notice,
    .strike-banner-desktop,
    .promotion-banner-desktop {
        display: block;
    }
    .multiple-promotions-banner-desktop{
        width: 100%;
        height: 100%;
        top: 0;
        position: absolute;
    }
}

.header-cube-default, .header_second {
    /*position: absolute;*/
    position:relative;
    width: 100vw;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.header-cube-iframe {
    width:100%;
    height:var(--header-height);
}

@media screen and (min-width:1100px) {
    .header-cube-default, .header_second, .header-cube-iframe {
        /*width:100%;*/
        max-width:1200px;
    }
}

.header_alert {
    display: inline-flex;
}

.header_alert_active {
    display: inline-flex;
}
.TOCGW .app .above-header-slot-container .language-toggle-container,
.TOCNT .app .above-header-slot-container .language-toggle-container,
.TOCGC .app .above-header-slot-container .language-toggle-container,
.TOCRT .app .above-header-slot-container .language-toggle-container,
.TOCES .app .above-header-slot-container .language-toggle-container,
.TOCSW .app .above-header-slot-container .language-toggle-container,
.TOCAW .app .above-header-slot-container .language-toggle-container ,
.TOCGR .app .above-header-slot-container .language-toggle-container{
    /* height: var(--lang-height); */
    overflow-x: scroll;
    width: 155px;
    height: 100%;
    /* bordeR: 1px black solid;
    border-radius: 30px; */
    text-align: center;
    display: flex;
    position: relative;
    flex-direction: row-reverse;
    /* flex-direction: column; */
    /* align-items: center; */
    z-index: 55;
    /* justify-content: center; */
    margin-top: 0;
    margin-right: 20px;
    align-self: start;
    padding: 0 5px;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    /* -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%); */
}

.TOCGW .app .above-header-slot-container .language-toggle-container-no-scroll,
.TOCNT .app .above-header-slot-container .language-toggle-container-no-scroll,
.TOCGC .app .above-header-slot-container .language-toggle-container-no-scroll,
.TOCRT .app .above-header-slot-container .language-toggle-container-no-scroll,
.TOCSW .app .above-header-slot-container .language-toggle-container-no-scroll,
.TOCES .app .above-header-slot-container .language-toggle-container-no-scroll,
.TOCAW .app .above-header-slot-container .language-toggle-container-no-scroll,
.TOCGR .app .above-header-slot-container .language-toggle-container-no-scroll {
    width: 100%;
}

.TOCGW .app .above-header-slot-container .language-toggle-container-scroll,
.TOCNT .app .above-header-slot-container .language-toggle-container-scroll,
.TOCGC .app .above-header-slot-container .language-toggle-container-scroll,
.TOCRT .app .above-header-slot-container .language-toggle-container-scroll,
.TOCSW .app .above-header-slot-container .language-toggle-container-scroll,
.TOCES .app .above-header-slot-container .language-toggle-container-scroll,
.TOCAW .app .above-header-slot-container .language-toggle-container-scroll,
.TOCGR .app .above-header-slot-container .language-toggle-container-scroll{
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent 100%);
}

.arrow-language,
#arrow-language-right.arrow-language-remove,
#arrow-language-left.arrow-language-remove {
    display: none;
}

.TOCGW .app .above-header-slot-container .arrow-language,
.TOCRT .app .above-header-slot-container .arrow-language,
.TOCSW .app .above-header-slot-container .arrow-language,
.TOCES .app .above-header-slot-container .arrow-language,
.TOCAW .app .above-header-slot-container .arrow-language,
.TOCGR .app .above-header-slot-container .arrow-language{
    display: flex;
}

/*.TOCGW .app .above-header-slot-container.hidden,*/
/*.TOCRT .app .above-header-slot-container.hidden,*/
/*.TOCSW .app .above-header-slot-container.hidden,*/
/*.TOCES .app .above-header-slot-container.hidden,*/
/*.TOCAW .app .above-header-slot-container.hidden,*/
.TOCGR.homepage-display .app .above-header-slot-container.hidden{
    display: none;
}

.language-toggle-container::-webkit-scrollbar {
    display: none;
}

.language-toggle-dropdown {
    display: none;
}

.TOCGW .app .above-header-slot-container .language-toggle-dropdown,
.TOCRT .app .above-header-slot-container .language-toggle-dropdown,
.TOCES .app .above-header-slot-container .language-toggle-dropdown,
.TOCSW .app .above-header-slot-container .language-toggle-dropdown,
.TOCAW .app .above-header-slot-container .language-toggle-dropdown{
    /* position: absolute; */
    display: flex;
    opacity: 1;
    visibility: visible;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    align-items: center;
    /* left: 100px; */
    flex-direction: row;
    height: 100%;
    overflow-x: visible;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none;
    /* margin-right: 8px; */
    /* width: calc(100vw - 100px); */
}

@media screen and (min-width: 1100px) {
    .TOCGW .app .above-header-slot-container .language-toggle-dropdown,
    .TOCRT .app .above-header-slot-container .language-toggle-dropdown,
    .TOCES .app .above-header-slot-container .language-toggle-dropdown,
    .TOCSW .app .above-header-slot-container .language-toggle-dropdown,
    .TOCAW .app .above-header-slot-container .language-toggle-dropdown{
        overflow-x: unset;
    }
}

.language-toggle-dropdown::-webkit-scrollbar,
.language-toggle-dropdown::-ms-scrollbar,
.language-toggle-display::-webkit-scrollbar,
.language-toggle-display::-ms-scrollbar {
    display: none;
}

.language-toggle-dropdown:hover {
    cursor: pointer;
}

.language-toggle-dropdown div {
    padding: 0 var(--template-padding);
    display: flex;
    height: 100%;
    border: 1px black solid;
    flex-direction: column;
    align-items: center;
    justify-content: Center;
    margin-left: 8px;
    height: 30px;
    width: 30px;
    border-radius: 30px;
    background-color: white;
    /* -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%); */
}

.language-toggle-selection {
    display: flex;
    align-items: center;
    /* width: 100%; */
    height: var(--lang-height);
    width: var(--lang-height);
    /* max-width: 100px; */
    border: 1px black solid;
    align-self: start;
    border-radius: var(--lang-height);
    /* -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%); */

    /* DAS-949 */
    background-color: #f65656;
    display: none;
}

.language-toggle-selection:hover {
    cursor: pointer;
}

.language-toggle-selection div {
    padding-left: 8px;
    padding-right: 8px;
    font-size: 12px;
}

.language-toggle-svg {
    /* width: 30px; */
    height: 85%;
    margin-left: 8px;
}

.language-toggle-svg {
    display: none;
}

.language-toggle-svg circle,
.language-toggle-svg path {
    fill: none;
    stroke: #000;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 3px;
}

.language-toggle-display {
    opacity: 1;
    visibility: visible;
    fill: var(--gwr);
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none;
}

.above-header-slot-container {
    grid-column-start: 2;
    grid-column-end: auto;
    grid-row-start: 1;
    grid-row-end: 2;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100vw;
    padding: 3px 0;
    /* border-radius: 0 0 8px 8px; */
    grid-area: lang;
    height: var(--lang-height);
    z-index: 1;
    background: white;
    transition: 1000ms;
}

.TOCGR.homepage-display .above-header-slot-container {
    height: var(--header-height);
}

.above-header-date {
    margin-left: 8px;
    margin-top: 3px;
    white-space: nowrap;
}

.above-header-date-hide {
    display: none;
}


.language-toggle-dropdown > .active-lang-selection {
    background-color: var(--gwr);
    color: #FFF;
}
.main_header div h1 /*multilingual*/,
.main_header div h2 /*multilingual*/
{
    font-size: 1.5rem;
    margin: 0;
}
/*.main_header {*/
/*    !*display: -webkit-box;*!*/
/*    !*display: flex;*!*/
/*    -webkit-box-align: center;*/
/*    align-items: center;*/
/*    height: auto;*/
/*    !* border-bottom: 1px black solid; *!*/
/*    position: -webkit-sticky;*/
/*    position: sticky;*/
/*    top: 0;*/
/*    background: #fff;*/
/*    padding: 5px 0;*/
/*    z-index: 50;*/
/*    -webkit-box-shadow: 0 2px 2px 0 #333;*/
/*    box-shadow: 0 2px 2px 0 #333;*/
/*    flex-wrap: wrap;*/
/*    scrollbar-width: none;*/
/*}*/

@media screen and (min-width: 1100px) {
    .above-header-slot-container {
        width: unset;
        /* border-bottom:1px black solid; */
    }
}
.TOCGW .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCGW .app .above-header-slot-container .share-container .share-svg-top-header line,
.TOCAW .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCAW .app .above-header-slot-container .share-container .share-svg-top-header line {
    stroke: #FFF;
    fill: #FFF;
}

.TOCGW .app .above-header-slot-container .language-toggle-dropdown div {
    background-color: var(--gwr);
    border: #FFF 1px solid;
    color: #FFF;
}

.TOCGW .app .above-header-slot-container .language-toggle-dropdown > .active-lang-selection {
    background-color: #FFF;
    color: var(--gwr);
}

.TOCAW .app .above-header-slot-container .language-toggle-dropdown div {
    background-color: var(--tfw);
    border: #FFF 1px solid;
    color: #FFF;
}

.TOCAW .app .above-header-slot-container .language-toggle-dropdown > .active-lang-selection {
    background-color: #FFF;
    color: var(--tfw);
}
.TOCSW .app .above-header-slot-container .language-toggle-dropdown div {
    background-color: var(--sw);
    border: #FFF 1px solid;
    color: #FFF;
}

.TOCSW .app .above-header-slot-container .language-toggle-dropdown > .active-lang-selection {
    background-color: #FFF;
    color: var(--sw);
}
.TOCRT .app .above-header-slot-container .language-toggle-dropdown div {
    background-color: var(--nr);
    border: #FFF 1px solid;
    color: #FFF;
}

.TOCES .app .above-header-slot-container .language-toggle-dropdown div {
    background-color: var(--es);
    border: #FFF 1px solid;
    color: #FFF;
}

.TOCRT .app .above-header-slot-container .language-toggle-dropdown > .active-lang-selection {
    background-color: #FFF;
    color: var(--nr);
}

.TOCES .app .above-header-slot-container .language-toggle-dropdown > .active-lang-selection {
    background-color: #FFF;
    color: var(--es);
}
.TOCGC .app .above-header-slot-container .language-toggle-dropdown div {
    background-color: var(--gc);
    border: #FFF 1px solid;
    color: #FFF;
}

.TOCGC .app .above-header-slot-container .language-toggle-dropdown > .active-lang-selection {
    background-color: #FFF;
    color: var(--gc);
}


.TOCGR.homepage-display .app .above-header-slot-container {
    background-color: #FFFFFF;
}


.TOCGR.homepage-display .app .above-header-slot-container .share-container .share-svg-top-header > * {
    fill: var(--lner-red);
    stroke: var(--lner-red);
}

.header-hide {
    opacity: 0;
    display: none;
    visibility: hidden;
}

.header_weather, .header_logo, .header_seat {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    align-self: center;
    justify-self: center;
    /* max-height: calc(var(--header-height) - var(--header-gap) - 25px); */
    max-height: 75px;
}

.header_weather {
    grid-area: weather;

    /* order: 1;
    width: 25%; */
}

.header_logo {
    grid-area: logo;
    padding: 5px;
    /*
        order: 2;
        width: 50%; */
}

.header_weather svg, .header_logo svg, .header_seat svg {
    height: var(--header-height);
    max-width: 80%;
}

.header_weather svg {
    filter: drop-shadow(3px 2px 2px rgba(0, 0, 0, 0.4));
    -webkit-filter: drop-shadow(3px 2px 2px rgba(0, 0, 0, 0.4));
}
.TOCGR .header_weather svg {
    filter:none;
    -webkit-filter:none;
}
.header_weather_info {
    grid-row: 3;
    grid-column: 1;
    grid-area: weather-info;
    align-self: center;
    padding: 0 0 0 var(--template-padding);

    /* width: 100%;
    order: 4; */
}

@media screen and (min-width: 768px) {
    .header_weather_info {
        text-align: left;
    }

    /* .header_first, .header_second {
        padding-top:1rem;
    } */
}

.header_weather p, .header_logo p, .header_seat p {
    margin: 5px 0 0 0;
}

.header_logo {
    grid-row: 1;
    grid-column: 2;
    grid-area: logo;
}

#back-end-weather {
    display: none;
}

#back-end-stop {
    display: none;
}

.header_seat h2 {
    width: 100%;
    text-align: center;
    font-size: 1rem;
    padding-left: var(--template-padding);
}

/* psuedo flag stuff for mobile */
.header_seat {
    position: relative;
    grid-area: seat;
    padding: 5px;
    /* width:100%;
  height:100%; */
    /* background:var(--colorTheme);
  color:#FFF; */
}
.header_seat:hover {
    cursor: pointer;
}

@media only screen and (min-width: 1100px) {

    .header_seat h2 {
        font-size: 1.3rem;
    }
}

#plan-events_banner {
    overflow: visible;
    width: 100%;
    max-width: 600px;
}

.plan-events_banner-path {
    fill: #fff;
}
.geolocation:hover {
    cursor: pointer;
}
#geolocationStrikeThrough {
    opacity: 1;
    -webkit-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}
.header-offer-popup-wrapper, .offer-popup-wrapper {
    width: 92%;
    max-width: 450px;
    border: 1px black solid;
    margin: auto;
    border-radius: 5px;
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    -webkit-appearance: none;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px var(--template-padding);
}
.TOCGR .header-offer-popup-wrapper, .TOCGR .offer-popup-wrapper {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.header-offer-popup, .offer-popup {
    width: 100%;
    max-width: 1100px;
    height: 100%;
    position: fixed;
    bottom: calc(var(--footer-height) + var(--sub-menu) + 13px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3 ease;
    -webkit-transition: all 0.3s ease;
}

.header-offer-popup {
    position: relative;
    bottom: unset;
    max-width: unset;
    opacity: 1;
    visibility: visible;
    margin-top: 2px;
    align-content: center;
}

.header-offer-popup-wrapper {
    width: 95%;
    height: calc(var(--header-height) - var(--template-padding));
    max-width: 750px;
}
.alteration-popup-svg {
    height: 50px;
}

.header-offer-popup-message, .offer-popup-message {
    align-self: Center;
    font-size: 1.3rem;
    font-weight: 700;
    width: 100%;
}

.header-offer-popup-message:hover, .offer-popup-message:hover {
    cursor: pointer;
}

.header-offer-popup-message a, .offer-popup-message a {
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: 700;
    color: #000;
    padding: 0;
    margin: 0;
}

@media screen and (max-width: 768px) {
    .header-offer-popup-message a, .offer-popup-message a {
        font-size: 0.9rem;
    }
}

@media screen and (min-width: 1100px) {
    .offer-popup-wrapper {
        margin-left: var(--template-padding);
        max-width: 550px;
    }

    .offer-popup {
        bottom: calc(var(--template-padding) + var(--sub-menu));
    }
}

.header-offer-popup-close, .offer-popup-close {
    place-self: center;
    stroke: #000;
    stroke-width: 13px;
    width: 25px;
}

.header-offer-popup-close:hover, .offer-popup-close:hover {
    cursor: pointer;
}

.header-offer-popup-active, .offer-popup-active {
    opacity: 1;
    visibility: visible;
    z-index: 6000;
}

.header-offer-anchors, .offer_anchors {
    font-size: 1.4rem;
}
.TOCAW .app header .header_seat {
    display: none;
}

.TOCZY .app header .header_seat {
    fill: var(--zy);
}

.TOCGW .app header .header_seat .icon_svg .surveyDefault_circle_big,
.TOCGW .app header .header_seat .icon_svg .surveyDefault_circle_small {
    fill: var(--gwr);
}

.language-toggle-container {
    display: none;
    -webkit-mask-image: linear-gradient(270deg, #000 95%, transparent);
}
.gc-banner-christmas {
    background-color: #333132;
    width: 100%;
    height: 100%;
    min-height: 65px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;
}

.gc-feedback-banner-container,
.sw-feedback-banner-container,
.gw-offers-banner-container,
.lner-perks-banner-container,
.coronation-banner-container,
.sw-careers-banner-container,
.gc-food-banner{
    background-color: var(--gc);
    width: 100%;
    height: 100%;
    min-height: 65px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;
}

.sw-feedback-banner-container {
    background-color: var(--sw);
}

.gw-offers-banner-container,
.lner-perks-banner-container,
.coronation-banner-container,
.sw-careers-banner-container,
.gc-food-banner{
    background-color: var(--gwr);
    display: grid;
    grid-template-areas: "text button";
    justify-content: center;
}
.gw-careers-banner-container,
.sw-careers-banner-container,
.gc-food-banner{
    grid-template-areas: "svg text text";
    gap: 3px;
    background-color: var(--gc-secondary);
}

.sw-careers-banner-container{
    background-color:  #0d1c2b;;
}

.lner-perks-banner-container {
    background: var(--lner);
    justify-items: center;
}

.coronation-banner-container {
    background-color: var(--nr);
}

.gc-feedback-anchor,
.sw-feedback-anchor,
.gw-offers-anchor,
.sw-offers-anchor,
.lner-perks-anchor,
.coronation-anchor {
    height: 100%;
    width: 100%;
    align-content: center;
}

.sw-offers-anchor > svg {
    max-height: 85px;
    margin: auto auto;
    width: 100%;
}

.lner-perks-anchor{
    cursor: pointer;
}

.gc-feedback-banner-container p,
.sw-feedback-banner-container p,
.gw-offers-banner-container p,
.lner-perks-banner-container p,
.coronation-banner-container p,
.gw-careers-banner-container span,
.sw-careers-banner-container span,
.gc-food-banner p{
    color: #FFF;
}

.sw-feedback-banner-container p,
.gw-offers-banner-container p,
.lner-perks-banner-container p,
.coronation-banner-container p,
.gw-careers-banner-container span,
.sw-careers-banner-container span,
.gc-food-banner p{
    text-align: center;
}

.gw-offers-banner-container p,
.lner-perks-banner-container p,
.coronation-banner-container p,
.gw-careers-banner-container span,
.sw-careers-banner-container span,
.gc-food-banner p {
    padding: 2px;
}

.sw-feedback-banner-container p /*multilingual*/,
.gw-offers-banner-container p /*multilingual*/,
.lner-perks-banner-container p,
.coronation-banner-container p,
.gw-careers-banner-container span,
.sw-careers-banner-container span,
.gc-food-banner p/*multilingual*/
{
    font-size: 15px;
}

.gw-careers-banner-container svg,
.sw-careers-banner-container svg,
.gc-food-banner svg{
    width: 100%;
    max-width: 150px;
    min-width: 30px;
    padding: 0 5px;
}

.gc-food-banner svg{
    max-width: 65px;
}
.sw-careers-banner-container svg{
    max-height: 40px;
}

.gc-food-banner-container{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.gc-food-banner-container h3{
    color: white;
}

.gc-food-banner-container p:last-of-type{
    color: var(--gc);
}

.sw-feedback-banner-top,
.gw-offers-banner-top,
.lner-perks-banner-text,
.coronation-banner-top,
.sw-careers-banner-text{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}

.gw-offers-banner-top,
.lner-perks-banner-text,
.coronation-banner-top,
.sw-careers-banner-text{
    grid-area: text;
    max-width: 350px;
}

.gw-careers-banner-text,
.sw-careers-banner-text{
    display: inline-block;
    max-width: 400px;
    padding: 0 3px;
}

.gw-careers-banner-text span:last-child,
.sw-careers-banner-text span:last-child{
    background: green;
    border-radius: 20px;
    padding: 1px 7px;
    white-space: nowrap;
}

.sw-careers-banner-text span:last-child{
    background: var(--sw);
}

.gc-feedback-banner-bottom,
.sw-feedback-banner-bottom,
.gw-offers-banner-bottom,
.coronation-banner-bottom {
    background: #000;
    border-radius: 30px;
    color: #FFF;
    padding: 3px calc(var(--template-padding) * 2);
    display: flex;
    align-items: center;
}

.coronation-banner-bottom {
    background: unset;
}

.sw-feedback-banner-bottom,
.gw-offers-banner-bottom,
.coronation-banner-bottom {
    justify-content: center;
    line-height: 12px;
    width: 90%;
    max-width: 450px;
}

.gw-offers-banner-bottom,
.coronation-banner-bottom {
    grid-area: button;
}

.lner-perks-banner-svg {
    width: 100%;
    max-height: 60px;
    max-width: 60px;
    padding: 5px;
    background: white;
    border-radius: 16px;
    border: 0px solid white;
    margin-right: 5px;
}

.lner-perks-eat-banner-svg{
    width: 100%;
    max-height: 50px;
}
@media screen and (max-width: 365px) {
    .lner-perks-eat-banner-svg{
        width: 100%;
        max-height: 29px;
    }
}

@media screen and (min-width: 415px) {
    .sw-feedback-banner-bottom,
    .gw-offers-banner-bottom,
    .coronation-banner-bottom {
        width: 100%;
        line-height: revert;
    }
}

.gc-feedback-banner-svg,
.sw-feedback-banner-svg {
    height: 25px;
    margin-right: 8px;
}

.sw-feedback-banner-svg {
    grid-area: svg;
    margin: 0;
}

.sw-feedback-banner-svg > path {
    fill: white;
}



@media screen and (min-width: 1100px) {
    .gw-offers-banner-container p /*multilingual*/,
    .coronation-banner-container p,
    .gw-careers-banner-container span,
    .sw-careers-banner-container span,
    .lner-perks-banner-container p,
    .gc-food-banner p /*multilingual*/
    {
        font-size: 20px;
        word-wrap: break-word;
    }
    /*.sw-careers-banner-container{*/
    /*    height: 95px;*/
    /*}*/
    .sw-offers-anchor > svg {
        max-height: 110px;
    }
    .gc-food-banner svg{
        max-width: 80px;
    }
}
.share-container {
    display: flex;
    height: 100%;
    align-items: center;
    padding: 0 1px;
}

.TOCGR.homepage-display .share-container {
    height: var(--lner-lang-height);
}

.share-container:hover {
    cursor: pointer;
}

.share-container span {
    font-size: 1.3rem;
    font-weight: 600;
    margin-left: 8px;
    color: #FFF;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                     supported by Chrome, Edge, Opera and Firefox */
}

.share-svg-top-header {
    height: 80%;
}

.TOCGR .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCGR .app .above-header-slot-container .share-container .share-svg-top-header line {
    stroke: #FFF;
    fill: #FFF;
}

.TOCGR.homepage-display .share-svg-top-header {
    height: 70%;
    margin-left: 20px;
}

.TOCSW .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCSW .app .above-header-slot-container .share-container .share-svg-top-header line {
    stroke: #FFF;
}

.TOCSW .app .above-header-slot-container .share-container .share-svg-top-header circle {
    stroke: #FFF;
    fill: #FFF;
}

.TOCRT .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCRT .app .above-header-slot-container .share-container .share-svg-top-header line,
.TOCES .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCES .app .above-header-slot-container .share-container .share-svg-top-header line,
.TOCZY .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCZY .app .above-header-slot-container .share-container .share-svg-top-header line {
    stroke: #FFF;
}

.TOCRT .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCES .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCZY .app .above-header-slot-container .share-container .share-svg-top-header circle{
    stroke: #FFF;
    fill: #FFF;
}



.TOCGC .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCGC .app .above-header-slot-container .share-container .share-svg-top-header line {
    stroke: var(--gc-secondary);
}

.TOCGC .app .above-header-slot-container .share-container .share-svg-top-header circle {
    stroke: var(--gc-secondary);
    fill: var(--gc-secondary);
}

.TOCGC .app .above-header-slot-container .share-container span,
.TOCGC .app .above-header-slot-container .language-toggle-dropdown div {
    color: var(--gc-secondary);
}
.TOCGC .app header .header_seat .icon_svg .surveyDefault_circle_small,
.TOCGC .app header .header_seat .icon_svg .surveyDefault_circle_big {
    fill: var(--gc) !important;
}



.TOCNT .app .above-header-slot-container .share-container .share-svg-top-header circle,
.TOCNT .app .above-header-slot-container .share-container .share-svg-top-header line {
    stroke: #FFF;
}

.TOCNT .app .above-header-slot-container .share-container .share-svg-top-header circle {
    stroke: #FFF;
    fill: #FFF;
}

.TOCNT .app .above-header-slot-container .share-container span,
.TOCNT .app .above-header-slot-container .language-toggle-dropdown div {
    color: #FFF;
}

.TOCGR.homepage-display .app .above-header-slot-container .share-container span {
    color: var(--lner-red);
}

.TOCNT .app .above-header-slot-container .language-toggle-dropdown div {
    background-color: var(--northern);
    border: #FFF 1px solid;
    color: #FFF;
}

.TOCNT .app .above-header-slot-container .language-toggle-dropdown > .active-lang-selection {
    background-color: #FFF;
    color: var(--northern);
}
.TOCGC .app .above-header-slot-container {
    background-color: var(--gc);
}

.TOCNT .app .above-header-slot-container {
    background-color: var(--northern);
}

.TOCRT .app .above-header-slot-container {
    background-color: var(--nr);
}

.TOCES .app .above-header-slot-container {
    background-color: var(--es);
}

.TOCGW .app .above-header-slot-container {
    background-color: var(--gwr);
}

.TOCAW .app .above-header-slot-container {
    background-color: var(--tfw);
}

.TOCSW .app .above-header-slot-container {
    background-color: var(--sw);
}

.TOCAW .app .above-header-slot-container {
    background-color: var(--tfw);
}

/*.TOCGR .app .above-header-slot-container {*/
/*    background-color: var(--lner);*/
/*}*/

.TOCZY .app .above-header-slot-container{
    background-color: var(--zy);
}

.share-svg-top-header circle {
    stroke-width: 4px;
}

.share-svg-top-header line {
    stroke-width: 8px;
}
.collapse-header {
    height: 0;
    min-height: 0;
    * {
        visibility: hidden;
    }
}

.football-content{
    max-height: 70px;
}

.header_foodDrink > svg{
    max-height: 40px;
}

@media screen and (min-width: 1200px) {
    .football-content{
        max-height: 90px;
    }
    .header_foodDrink > svg{
        max-height: 60px;
    }
}



.sw-info-banner-container {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: fit-content;
    height: 100%;
    width: 100%;
    background-color: var(--sw);
    padding: 5px 10px;
    margin-top: 2px;


    & .sw-info-banner-text {
        align-self: center;
        justify-self: center;
        text-align: center;

        & > span {
            text-wrap: wrap;
            text-align: center;
            color: white;
            font-weight: bold;
            font-size: 13px;

        }
    }


}

    @media screen and (min-width: 1200px) {
        .sw-info-banner-container {
            & .sw-info-banner-text {
                & > span {
                    font-size: 14px;

                }
            }
        }}
#whooshStations {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    padding: 0 var(--template-padding);
}
#whooshStations button {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    border-radius: 5px;
    color: #000;
    background: none;
    cursor: pointer;
    font-size: 1.3rem;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 5rem;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 80%;
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.buttonforlocation,
#whooshStations .buttonforlocation {
    width: 35px;
    height: 40px;
    z-index: 1;
    position: absolute;
    background: none;
    box-shadow: none;
    margin-right: 265px;
    border: none;
    cursor: pointer;
    padding: 0 8px;
}
/*.TOCGR .butterforlocation,*/
/*.TOCGR #whooshStations .buttonforlocation {*/
/*    -webkit-box-shadow:none;*/
/*    box-shadow:none;*/
/*}*/
.TOCGR .buttonforlocation {
    display: none;
}

#whooshStations form {
    margin-top: var(--template-padding);
    display: flex;
    justify-content: center;
    position: relative;
}
#whooshStations .search-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-inline: .75em;
    margin-block: 2em;
    width: 100%;
    max-width: 450px;
    border-radius: 5px;
    form {
        width: 100%;
        display: block;
    }
    .exhaustive {
        display: grid;
        width: inherit;
        & > input {
            width: inherit;
            transition: 300ms;
        }
        & > input:focus {
            outline: orange 3px solid;
            outline-offset: 4px;
            transform: scale(1.05);
            padding: 0 2.75em;
        }
        .station-result-list {
            width: inherit;
            position: absolute;
            top: 3rem;
            z-index: 5;
            color: black;
        }
        .search-cross {
            right: 0;
            color: darkslategray;
            font-size: 1.5em;
            background: white;
            height: 100%;
            width: 2em;
            align-items: center;
            border-radius: 5px;
        }
    }
    .buttonforlocation {
        margin: unset;
        left: 0;
        z-index: 6;
        padding: 0;
        svg {
            width: 1.5em;
        }
    }
    form + button.panelPickerButton {
        width: 15%;
        margin-inline-start: 10px;
        height: 3rem;
        border-radius: 5px;
        &:not(:disabled):active {
            animation: press 300ms forwards;
        }
        .icon_svg {
            height: 1.75em;
            width: 2.25em;
        }
    }
}
.TOCGR #whooshStations .search-wrapper .exhaustive input:focus {
    padding: 0 1.5em;
}
.search-wrapper .panelPickerButton {
    display: grid;
    place-content: center;
}
@keyframes press {
    0% {
        transform: scale(1);
        filter: unset;
    }
    50% {
        transform: scale(0.9);
        filter: drop-shadow(0 3px 2px);
    }
    100% {
        transform: scale(1);
        filter: unset;
    }
}


#whooshStations form .planner-form-location,
.planner-form > .planner-form-location {
    height: 3em;
    margin: 0 calc(var(--template-padding) / 3);
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
}

#whooshStations form + button {
    background: var(--colorTheme);
    border-radius: 21px;
    color: #fff;
    max-width: 400px;
    font-weight: 700;
}

#whooshStations li {
    list-style-type: none;
    width: 80%;
}

#whooshStations li::before {
    display: none;
}

#whooshStations li button {
    list-style-type: none;
    border-radius: 5px;
    margin: 1rem 0;
    color: black;
    text-align: center;
    background: none;
    -webkit-animation: none;
    animation: none;
    width: 100%;
}

@media screen and (min-width: 1100px) {
    #whooshStations .buttonforlocation,
    .buttonforlocation {
        height: 50px;
    }
}
#getAlreadyUsingButtons {
    width: 80%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
}

#getAlreadyUsingButtons ul {
    width: 100%;
    padding: 0;
    margin: 0;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    margin-bottom: 30px;
}

#getAlreadyUsingButtons ul li {
    max-width: 400px;
    display: flex;
    width: calc(100% + 30px);
    margin-left: 15px;
}

#getAlreadyUsingButtons ul button {
    width: 100%;
    margin: var(--template-padding) 0;
    max-width: 400px;
}
/*.TOCGC .app .singlefullitem #panelPicker #whooshStations form + button {*/
/*    background: var(--gc) !important;*/
/*    color: #000;*/
/*    background:var(--gc-secondary) !important; */
/*}*/
/*.TOCSW .app .singlefullitem #panelPicker #whooshStations form + button {*/
/*    background: var(--sw) ;*/
/*    color: #fff;*/
/*}*/
/*.TOCES .app .singlefullitem #panelPicker #whooshStations form + button {*/
/*    background: var(--es) !important;*/
/*}*/
/*.TOCNT .app .singlefullitem #panelPicker #whooshStations form + button {*/
/*    background: var(--northern) !important;*/
/*}*/
/*.TOCRT .app .singlefullitem #panelPicker #whooshStations form + button {*/
/*    background: var(--nr) !important;*/
/*}*/
/*.TOCSS .app .singlefullitem #panelPicker #whooshStations form + button {*/
/*    background: var(--northern) !important;*/
/*}*/
/*.TOCGR .app .singlefullitem #panelPicker #whooshStations form + button {*/
/*    background: var(--lner) !important;*/
/*}*/

/*.TOCAW .app .singlefullitem #panelPicker #whooshStations form + button {*/
/*    background: var(--tfw) !important;*/
/*}*/
/*.TOCHT .app .singlefullitem #panelPicker #whooshStations form + button {*/
/*    background: var(--ht) !important;*/
/*}*/
/*.TOCNT .app .singlefullitem #panelPicker #whooshStations form + button {*/
/*    background: var(--northern) !important;*/
/*}*/
/*.TOCGW .app #panelPicker #whooshStations form + button {*/
/*    background: var(--gwr);*/
/*}*/
.app .singlefullitem #panelPicker #whooshStations form + button.panelPickerButton:disabled {
    cursor: unset;
    fill: #fff;
    color: #fff;
    background: gray !important;
}
#panelBuses button {
    background: none;
    border: none;
}
#panelBuses button:hover {
    cursor: pointer;
}

.closeButtonStation {
    stroke: #fff;
    stroke-width: 13px;
    width: 15px;
    height: 15px;
    align-self: center;
    right: -10px !important;
    overflow: visible;
    filter: drop-shadow(1px 2px 3px rgba(0, 0, 0, 0.5));
    -webkit-filter: drop-shadow(1px 2px 3px rgba(0, 0, 0, 0.5));
    pointer-events: initial;
}

.closeButtonStation > * {
    pointer-events: none;
}
.TOCGR .closeButtonStation {
    filter:none;
    -webkit-filter:none;
}

.TOCGC .app .singlefullitem .closeButtonStation circle {
    fill: var(--gc);
}

.TOCNT .app .singlefullitem .closeButtonStation circle {
    fill: var(--northern);
}

.TOCGW .app .singlefullitem .closeButtonStation circle {
    fill: var(--gwr);
}

.TOCAW .app .singlefullitem .closeButtonStation circle {
    fill: var(--tfw);
}

.TOCSW .app .singlefullitem .closeButtonStation circle {
    fill: var(--sw);
}
.TOCZY .app .singlefullitem .closeButtonStation circle {
    fill: var(--zy);
}

.TOCRT .app .singlefullitem .closeButtonStation circle {
    fill: var(--nr);
}

.TOCGR .app .singlefullitem .closeButtonStation circle {
    fill: var(--lner);
}

.TOCES .app .singlefullitem .closeButtonStation circle {
    fill: var(--es);
}

/*journey picker*/
.journey-finder-container {
    height: 100%;
}

.journey-finder-wrapper {
    display: flex;
    flex-direction: column;
    /*height: 100%;*/
    width: 80%;
    margin: auto;
    align-items: center;
}

.journey-finder-wrapper form {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: calc(var(--template-padding) * 2) 0 var(--template-padding) 0;
    position: relative;
}

.journey-finder-wrapper form:nth-of-type(2) {
    margin-top: 0;
}

.jf-input-from, .jf-input-to {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    border-radius: 5px;
    /*    -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); */
    color: #000;
    background: none;
    cursor: pointer;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 3rem;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 100%;
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    font-size: var(--text-input);
    padding-left: 1rem;

    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}
.TOCGR .jf-input-from, .TOCGR .jf-input-to {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.TOCGR .submit-btn,
.TOCGR .app .singlefullitem .jf-input-submit {
    background: var(--lner);
}

.TOCAW .app .singlefullitem .jf-input-submit {
    background: var(--tfw);
}

.submit-btn,
.jf-input-submit {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    background: none;
    cursor: pointer;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 5rem;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 80%;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    background: var(--colorTheme);
    border-radius: 21px;
    color: #fff;
    max-width: 400px;
    font-weight: 700;
    margin: var(--template-padding) auto;
    font-size: 1.3rem;
    display: block !important;
}
.TOCGR .submit-btn,
.TOCGR .jf-input-submit {
    box-shadow:none;
    -webkit-box-shadow:none;
}
.TOCES .app .singlefullitem #panelPlan .panelHalf .jf-input-submit {
    background: var(--es);
}

.jf-input-to {
    margin-top: calc(var(--template-padding) * 2);
}

.jf-local-station {
    display: none;
}
.possible-journeys-container {
    width: 100%;
}

.possible-journey {
    display: grid;
    grid-template-columns:55px auto 34px;
    grid-auto-rows: min-content;
    column-gap: 8px;
    padding: 21px var(--template-padding);
    grid-template-areas:
            "stations stations ."
            "stations stations ."
            "stations stations svg";
    margin: var(--template-padding) auto 0 auto;
}
.possible-journey-time {
    grid-area: time;
    font-size: 1.2rem;
    font-weight: 600;
    place-self: start;
}

.possible-journey-station {
    grid-area: stations;
}

.possible-sub-station {
    display: grid;
    column-gap: 8px;
    height: 50px;
    grid-template-columns:40px 25px auto;
    grid-template-areas:"time sub-svg sub-name";
    align-items: center;
}

.possible-sub-station-time {
    grid-area: time;
    font-size: 1.2rem;
    font-weight: 700;
}

.possible-sub-station-name {
    grid-area: sub-name;
    font-size: 1.3rem;
    align-self: center;
    justify-self: start;
}

.possible-sub-stations-hide {
    display: none;
}

.possible-sub-stations-display {
    display: block;
}

.possible-sub-station-svg {
    grid-area: sub-svg;
    position: relative;
    height: 100%;
    display: flex;
}

.possible-sub-station-svg::after {
    content: "";
    position: absolute;
    width: 5px;
    left: calc(50% - 2.5px);
    height: 100%;
    background-color: #000;
}

.possible-journey-station .possible-sub-station:first-of-type .possible-sub-station-svg::after {
    content: "";
    position: absolute;
    bottom: 0;
    height: 25%;
    width: 5px;
    left: calc(50% - 2.5px);
    background-color: #000;
}

.possible-journey-station .possible-sub-station:last-of-type .possible-sub-station-svg::after {
    content: "";
    position: absolute;
    top: 0;
    height: 25%;
    width: 5px;
    left: calc(50% - 2.5px);
    background-color: #000;
}

.possible-journey-station .possible-sub-stations-all .possible-sub-station .calling-point-svg::after {
    content: "";
    position: absolute;
    width: 5px;
    left: calc(50% - 2.5px);
    height: 100%;
    background-color: #000;
}

.possible-journey-svg svg line {
    transform-origin: center center;
    -webkit-transform-origin: center center;
    transition: 0.3s ease;
    -webkit-transition: 0.3s ease;
}

.possible-journey-svg-circle {
    fill: white;
    stroke: var(--colorTheme);
    stroke-width: 12px;
}

.possible-journey-svg svg {
    width: 100%;
    overflow: visible;
}

.possible-journey-svg svg:hover {
    cursor: pointer;
}

.possible-journey-svg-close {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.possible-journey-svg {
    grid-area: svg;
    place-self: center;
    margin-right: 8px;
}


.journey-finder-close-button {
    width: 50px;
    overflow: visible;
    filter: drop-shadow(0px 0px 3px #000);
    -webkit-filter: drop-shadow(0px 0px 3px #000);
}
.TOCGR .journey-finder-close-button {
    filter:none;
    -webkit-filter:none;
}

.journey-finder-close-button:hover {
    cursor: pointer;
}
.journey-finder-close-parent {
    float: right;
    background: none;
    fill: none;
    border: none;
    margin: 0 0 13px 0;
    position: fixed;
    bottom: calc(var(--footer-height) + var(--sub-menu));
    right: 13px;
    width: 36px;
}

.journey-finder-close-parent svg {
    width: 100%;
    overflow: visible;
}

.journey-finder-close-parent svg line {
    transform-origin: center center;
    -webkit-transform-origin: center center;
    transition: 0.3s ease;
    -webkit-transition: 0.3s ease;
}

@media screen and (min-width: 500px) {
    .journey-finder-close-parent {
        right: 17%;
        width: 40px;
        margin-bottom: 21px;
    }
}

@media screen and (min-width: 768px) {
    .journey-finder-close-parent {
        right: calc(50% - 20px);
    }
}

@media screen and (min-width: 1100px) {
    .journey-finder-close-parent {
        right: calc(40% - 20px);
        bottom: var(--sub-menu);
    }
}
.journey-picker-error {
    width: 80%;
    margin: var(--template-padding) auto;
    text-align: center;
    font-size: 1.3rem;
    font-weight: 600;
    color: red;
    display: none;
}

.journey-picker-error-active {
    display: block;
}

.possible-journey-svg-colour-2 {
    fill: #F69602;
}

.possible-journey-svg-colour-3 {
    fill: #3B8990;
}

.possible-journey-svg-colour-4 {
    fill: #410D7C;
}

.possible-journey-svg-colour-5 {
    fill: #DC143C;
}

.possible-journey-svg-colour-6 {
    fill: #2A338F;
}

.possible-journey-svg-colour-7 {
    fill: #2A338F;
}
.introduction-container {
    /* padding: var(--template-padding) 0; */
    margin-top: var(--template-padding);
    font-size: 1.4rem;
    padding-bottom: 0;
}

.introduction-container p {
    font-size: 1.3rem;
    line-height: 2;
    text-align: center;
}


.exhaustive {
    margin-bottom: var(--template-padding);
    /* min-width: 388px; */
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 100%;
    width: 100%;
}

.exhaustive input {
    height: 3rem;
    border-radius: 5px;
    font-size: var(--text-input);
    padding-left: 3rem;
    border: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    -webkit-appearance: none;
    /*width: 300px;*/
    width: 100%;
}
.transportsymbols {
    font-family: 'transportsymbolsregular';
    font-size: 19.5px;
    letter-spacing: 4px;
}

.TOCGR .app .transportsymbols {
    display: none;
}
.exhaustive input:focus {
    border: 1px none solid;
    outline-color: transparent;
    outline-style: none;
}
.TOCGR .exhaustive input {
    padding: 0 1.5rem;
}

.exhaustive #jfFromresult,
.exhaustive #jfToresult,
.exhaustive #feedbackSearchresult,
.exhaustive #myInput1result,
.exhaustive #ppFromresult,
.exhaustive #ppToresult,
.exhaustive #breadcrumb-search-inputresult {
    width: 300px;
    background: white;
}
.exhaustive #breadcrumb-search-inputresult {
    width: 100%;
}

.breadcrumb-search-container{
    position: sticky;
    top: 115px;
    display: flex;
    width: 100%;
    max-width: 500px;
    margin: auto;
    z-index: inherit;
    pointer-events: auto;
}
.breadcrumb-search-text{
    position: absolute;
    padding: 5px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
#breadcrumb-search-form > .exhaustive{
    margin: 0;
}
.search-cross,
#breadcrumb-search-cross{
    font-weight: bold;
    font-size: 22px;
    cursor: pointer;
    display: flex;
    position: absolute;
    height: fit-content;
    align-items: flex-start;
    top: 0px;
    right: 5px;
    justify-content: center;
}

.breadcrumb-search{
    position: sticky;
    width: 80%;
    font-weight: bold;
    top: 130px;
    white-space: pre-wrap;
    z-index: inherit;
    margin: auto;
    background: white;
    cursor: pointer;
    min-width: 250px;
    border-radius: 5px;
}

.breadcrumb-order{
    right: 5px;
    width: 40px;
    min-width: 40px;
    align-items: center;
    justify-content: center;
    margin: unset;
    display: grid;
    grid-template-areas:
        "arrow letter-a"
        "arrow letter-z";
    border: none;
    max-height: 40px;
    align-content: center;
    z-index: auto;
}

#breadcrumb-order-svg{
    height: 30px;
    width: 30px;
}
.breadcrumb-order-svg-hide{
    display: none;
}

#breadcrumb-order-svg_default{
    fill:#000;
    stroke-width:7.17276
}

#breadcrumb-order-svg_up,
#breadcrumb-order-svg_down{
    fill:#000;
    stroke-width:6.58479;
}

#breadcrumb-order-svg_a,
#breadcrumb-order-svg_z{
    stroke: #000;
    stroke-width: 1.56405;
}

.TOCGW > .app > footer > nav > div >  .breadcrumb-search{
    border: 2px solid var(--gwr);
}
.TOCGC > .app > footer > nav > div >  .breadcrumb-search{
    border: 2px solid var(--gc);
}
.TOCRT > .app > footer > nav > div >   .breadcrumb-search{
    border: 2px solid var(--nr);
}
.TOCNT > .app > footer > nav > div >   .breadcrumb-search{
    border: 2px solid var(--northern);
}
.TOCGR > .app > footer > nav >  div >   .breadcrumb-search{
    border: 2px solid var(--lner);
}
.TOCAW > .app > footer > nav >  div >  .breadcrumb-search{
    border: 2px solid var(--tfw);
}
.TOCSW > .app > footer > nav >  div >   .breadcrumb-search{
    border: 2px solid var(--sw);
}
.TOCZY > .app > footer > nav >  div >   .breadcrumb-search{
    border: 2px solid var(--zy);
}
@media screen and (min-width: 1100px) {
    .breadcrumb-search{
        width: 430px;
        min-width: 430px;
    }
    .breadcrumb-order{
        width: 49px;
        min-width: 49px;
        max-height: 49px;
    }
    .exhaustive #breadcrumb-search-inputresult{
        width: 425px;
        min-width: 425px;
    }
    #breadcrumb-search-cross{
        top: 5px;
    }
}

#breadcrumb-search-input,
#breadcrumb-search-inputresult > #breadcrumb-search-input-exhaustive-list{
    box-shadow: none;
    text-overflow: ellipsis;
    padding: 0 2rem 0 3rem;
}
.breadcrumb-search-element{
    transition: all 0.8s ease;
    pointer-events: auto;
    opacity: 1;
    visibility: visible;
}

.search-hide,
.breadcrumb-search-hide{
    transition: none;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
}

.exhaustive-items {
    width: 100%;
    padding: 0 var(--template-padding);
    max-height: 200px;
    overflow-y: scroll;
    margin-top: 0;
    padding-top: 6px;
    border-radius: 0 0 8px 8px;
    border-top: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
/*.TOCGR .exhaustive-items{*/
/*    box-shadow:none;*/
/*    -webkit-box-shadow:none;*/
/*}*/

.exhaustive-items div {
    font-size: 1.3rem;
    margin: 13px 0;
}

.exhaustive-items div strong {
    font-size: 1.3rem;
}

.exhaustive-items div:hover {
    cursor: pointer;
}
.exhaustive label {
    display: none;
}

.searchType-container{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 25px;
    flex-wrap: wrap;
}
input.radio-selection[type="radio"]{
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    margin: 0;
    border: 0.15em solid black;
    border-radius: 50%;
    transform: translateY(-0.075em);
    display: grid;
    place-content: center;
    -webkit-appearance: none;
}
input.radio-selection[type="radio"]::before {
    content: "";
    width: 18px;
    height: 18px;
    border-radius: 50%;
    transform: scale(0);
    transition: 120ms transform ease-in-out;
}
.TOCGW input.radio-selection[type="radio"]::before {
    box-shadow: inset 1em 1em var(--gwr);
}
.TOCGR input.radio-selection[type="radio"]::before {
    box-shadow: inset 1em 1em var(--lner);
}
.TOCSW input.radio-selection[type="radio"]::before {
    box-shadow: inset 1em 1em var(--sw);
}
.TOCZY input.radio-selection[type="radio"]::before {
    box-shadow: inset 1em 1em var(--zy);
}
.TOCGC input.radio-selection[type="radio"]::before {
    box-shadow: inset 1em 1em var(--gc);
}
.TOCRT input.radio-selection[type="radio"]::before {
    box-shadow: inset 1em 1em var(--nr);
}
input.radio-selection[type="radio"]:checked::before {
    transform: scale(1);
}
:where(form.loading) {
    .buttonforlocation {
        cursor: unset;
    }
    .buttonforlocation > svg {
        transform: scale(1);
        animation: pulse-blue 2s infinite;
    }
}
@keyframes pulse-blue {
    0% {
        transform: scale(0.5);
    }
    70% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(0.5);
    }
}

.panelPickerButton .hide {
    transition: 1000ms;
}
#whooshStations .toc-colour-rt-invert{
    fill: var(--nr);
    background: #fff;
    color: var(--nr);
}
#whooshStations .toc-colour-gr-invert{
    fill: var(--lner);
    background: #fff;
    color: var(--lner);
}
#whooshStations .toc-colour-nt-invert{
    fill: var(--northern);
    background: #fff;
    color: var(--northern);
}
#whooshStations .toc-colour-rt-invert{
    fill: var(--nr);
    background: #fff;
    color: var(--nr);
}
#whooshStations .toc-colour-sw-invert{
    fill: var(--sw);
    background: #fff;
    color: var(--sw);
}
#whooshStations .toc-colour-gc-invert{
    fill: var(--gc);
    background: black;
    color: var(--gc);
}
#whooshStations .toc-colour-gw-invert{
    fill: var(--gwr);
    background: #fff;
    color: var(--gwr);
}
#whooshStations .toc-colour-zy-invert{
    fill: var(--zy);
    background: #fff;
    color: var(--zy);
}
.search-wrapper .hide,
.hide {
    display:none;
}

.exhaustive-active-rt {
    background: #f9f9f9;
    border: 0px solid var(--nr);
    border-left-width: 2px;
    border-right-width: 2px;
    color: black;
    padding: 5px;
    border-radius: 5px;
    webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.exhaustive-active-gc {
    background: #f9f9f9;
    border: 0px solid var(--gc);
    border-left-width: 2px;
    border-right-width: 2px;
    color: black;
    padding: 5px;
    border-radius: 5px;
    webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.exhaustive-active-gw {
    background: #f9f9f9;
    border: 0px solid var(--gwr);
    border-left-width: 2px;
    border-right-width: 2px;
    color: black;
    padding: 5px;
    border-radius: 5px;
    webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.exhaustive-active-sw {
    background: #f9f9f9;
    border: 0px solid var(--sw);
    border-left-width: 2px;
    border-right-width: 2px;
    color: black;
    padding: 5px;
    border-radius: 5px;
    webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.exhaustive-active-nt {
    background: #f9f9f9;
    border: 0px solid var(--northern);
    border-left-width: 2px;
    border-right-width: 2px;
    color: black;
    padding: 5px;
    border-radius: 5px;
    webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.exhaustive-active-gr {
    background: #f9f9f9;
    border: 0px solid var(--lner);
    border-left-width: 2px;
    border-right-width: 2px;
    color: black;
    padding: 5px;
    border-radius: 5px;
    webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048),
    0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072),
    0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}

* {
    font-family: Nunito, sans-serif;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 12px;
}









h1 {
    font-size: 1.5rem;
    margin: 0;
}

h2 {
    font-size: 1.5rem;
    margin: 0;
}

h3 {
    font-size: 1.3rem;
    margin: 0;
}

a:visited {
    border: none;
}

a:active {
    border: none;
}


svg {
    pointer-events: none;
}

#overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.80);
    z-index: 2;
    cursor: pointer;
}

#overlayOverlay {
    display: none;
    visibility: hidden;
    background-color: rgba(255, 255, 255, 0.80);
    width: 600px;
    height: 80%;
    /*top: 25px;*/
    /*left: 25px;*/
    /*position: relative;*/
    /*border: 6px solid #b7007c;*/
    /*border-radius: 4px;*/
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.18), 0 4px 8px rgba(0, 0, 0, 0.36);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.18), 0 4px 8px rgba(0, 0, 0, 0.36);
    padding: 4px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: black;
    /*background: #666666;*/
    opacity: .8;
    z-index: 10000;
    font-family: Roboto, sans-serif;
    overflow: hidden;
}
#overlayOverlay s {
    color: red;
    text-decoration: line-through
}
.TOCGR #overlayOverlay {
    -webkit-box-shadow:none;
    box-shadow:none;
}
body, html {
    height: 100%;
    /*margin: 0;*/
    font-family: Arial, sans-serif;
}

body {
    margin: 0 auto;
    /*display: -webkit-box;*/
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    scrollbar-width: none;
    min-height: 100%;
    background-image: none;
    max-width: 1200px;
    position: relative;
    /*font-family: 'Johnston100-Regular', sans-serif;*/
}
html {
    overflow: -moz-scrollbars-none;
    scroll-behavior: smooth;
}

a {
    text-decoration: none;
    font-size: inherit;
}

p {
    margin: 0;
    font-weight: 600;
    font-size: 14px;
}
@media only screen and (min-width: 1100px) {
    * {
        font-size: 15px;
    }

    p {
        font-size: 1.2rem;
    }
}
input, select, textarea {
    font-size: var(--text-input);
}

@media only screen and (min-width: 1200px) {
    body {
        border-right: 1px solid black;
        border-left: 1px solid black;
        -webkit-box-shadow: 0 2px 2px 0 #333;
        box-shadow: 0 2px 2px 0 #333;
    }
    .TOCGR body {
        border-right: 1px solid black;
        border-left: 1px solid black;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}

footer nav {
    width: 100%;
    position: absolute;
    scrollbar-width: none;
}
footer nav::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 0;
    display: none;
    height: 0;
}

.moreFooter > ul > li > a > svg,
.station_sub_menu svg,
.offers_sub_menu svg{
    max-height: 60px;
    max-width: 75px;
}
.menu-footer .moreFooter > ul{
    top: 15px;
    padding: 10px;
    transition: all 0.3s ease;
}

@media screen and (min-width: 1100px) {
    .menu-footer .moreFooter > ul{
        grid-template-columns: repeat( auto-fit, minmax(150px, 1fr) );
    }
}

footer nav::-webkit-scrollbar {
    display: none;
    -webkit-appearance: none;
    width: 0;
    height: 0;
}

footer nav ul::-webkit-scrollbar {
    display: none;
    -webkit-appearance: none;
    width: 0;
    height: 0;
}

footer nav ul li {
    list-style-type: none;
    scroll-snap-align: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    display: inline-block;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    min-width: 23%;
    overflow-y: hidden;
    border-radius: 5px;
    padding: 5px 10px;
    height: 95%;
    border: 1px transparent solid;
    transition: all .3s ease;
}

/*footer nav ul li:last-of-type {*/
/*    margin-right: 10%;*/
/*}*/

footer nav ul li a {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

/*@media only screen and (min-width: 1100px) {*/
/*    footer nav ul li a {*/
/*        justify-content: center;*/
/*    }*/
/*}*/

footer nav ul li svg {
    height: 70%;
}

footer nav:first-of-type {
    z-index: 90;
    background-color: #FFF;
}

footer nav div img {
    height: 70%;
}

footer nav ul li p {
    text-align: center;
    font-size: 1rem;
    white-space: break-spaces;
    color: black;
}
footer nav ul li p /*multilingual*/
{
    text-align: center;
    font-size: 1.2rem;
    word-break: break-word;
    hyphens: auto;
}
#footerButtonstations,
#footerButtonoffers{
    display: none;
}

.footer_icon_active,
.hugeiconSub {
    border: 1px black solid;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR .footer_icon_active {
    -webkit-box-shadow:none;
    box-shadow:none;
}

.footer_icon_active a svg {
    filter: drop-shadow(1px, 1 p)
}
.TOCGR .footer_icon_active a svg {
    filter: none;
}
.TOCHR .footer_icon_active a svg {
    filter:none;
}

.TOCGR .app footer nav ul li {
    border: none !important;
    box-shadow: none;
}
#arrow-language-left {
    position: absolute;
    top: 0;
    height: 100%;
    z-index: 10;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    right: 170px;
    left: unset;
    width: 25px;
}

#arrow-language-right {
    position: absolute;
    right: 0;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    top: 0;
    height: 100%;
    z-index: 11;
    width: 25px;
}

#arrow-right {
    display: -webkit-box;
    display: flex;
}


#arrow-language-right,
#arrow-language-left {
    transition: all 0.3s ease;
}

/*#arrow-right svg {*/
/*    height: 60%;*/
/*    opacity: 0.6;*/
/*}*/

#arrow-right:hover,
#arrow-language-right:hover {
    cursor: pointer;
}
#arrow-menu {
    grid-area: menu;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
    transform-origin: center center;
    -webkit-transform-origin: center center;
    pointer-events: auto;
    position: absolute;
    display: flex;
    border: none;
    background: none;
}
#arrow-left {
    grid-area: left;
    position: sticky;
    margin-left: var(--template-padding);
    pointer-events: auto;
    top: 55px;
    width: fit-content;
    z-index: inherit;
}
#arrow-menu svg {
    height: 45px;
    border: 2px solid #0092cc;
    border-radius: 20px;
    background-color: white;
}
.TOCGR .app footer .footer-container  #arrow-menu svg,
.TOCGR .app footer .moreFooter   #arrow-left svg,
.TOCGR > .app > footer > .moreFooter > .breadcrumb-menu > div > a,
.TOCGR > .app > footer > #journeySubNav > .journey_sub_menu > li{
    border: 2px solid var(--lner);
}
.TOCGR > .app > footer > .moreFooter > #breadcrumb-menu > #breadcrumb-menu-roundel > svg > g > .pulse_1,
.TOCGR  > .app > footer > .moreFooter > .breadcrumb-menu > a > svg{
    stroke: var(--lner);
}
.TOCAW .app footer .footer-container  #arrow-menu svg,
.TOCAW .app footer .moreFooter   #arrow-left svg,
.TOCAW > .app > footer > .moreFooter > .breadcrumb-menu > div > a,
.TOCAW > .app > footer > #journeySubNav > .journey_sub_menu > li{
    border: 2px solid var(--tfw);
}
.TOCAW > .app > footer > .moreFooter > #breadcrumb-menu > #breadcrumb-menu-roundel > svg > g > .pulse_1,
.TOCAW  > .app > footer > .moreFooter > .breadcrumb-menu > a > svg{
    stroke: var(--tfw);
}
.TOCGC .app footer .footer-container  #arrow-menu svg,
.TOCGC .app footer .moreFooter   #arrow-left svg,
.TOCGC > .app > footer > .moreFooter > .breadcrumb-menu > div > a,
.TOCGC > .app > footer > #journeySubNav > .journey_sub_menu > li{
    border: 2px solid var(--gc);
}
.TOCGC > .app > footer > .moreFooter > #breadcrumb-menu > #breadcrumb-menu-roundel > svg > g > .pulse_1,
.TOCGC >  .app >  footer >  .moreFooter >   .breadcrumb-menu >  div >  svg{
    stroke: var(--gc);
}
.TOCZY .app footer .footer-container  #arrow-menu svg,
.TOCZY .app footer .moreFooter   #arrow-left svg,
.TOCZY > .app > footer > .moreFooter > .breadcrumb-menu > div > a,
.TOCZY > .app > footer > #journeySubNav > .journey_sub_menu > li{
    border: 2px solid var(--zy);
}
.TOCZY > .app > footer > .moreFooter > #breadcrumb-menu > #breadcrumb-menu-roundel > svg > g > .pulse_1,
.TOCZY >  .app >  footer >  .moreFooter >   .breadcrumb-menu >  div >  svg{
    stroke: var(--zy);
}
.TOCRT .app footer .footer-container  #arrow-menu svg,
.TOCRT .app footer .moreFooter   #arrow-left svg,
.TOCRT > .app > footer > .moreFooter > .breadcrumb-menu > div > a,
.TOCRT > .app > footer > #journeySubNav > .journey_sub_menu > li{
    border: 2px solid var(--nr);
}
.TOCRT > .app > footer > .moreFooter > #breadcrumb-menu > #breadcrumb-menu-roundel > svg > g > .pulse_1,
.TOCRT >  .app >  footer >  .moreFooter  >  .breadcrumb-menu >  div  > svg{
    stroke: var(--nr);
}
.TOCNT .app footer .footer-container  #arrow-menu svg,
.TOCNT .app footer .moreFooter  #arrow-left svg,
.TOCNT > .app > footer > .moreFooter > .breadcrumb-menu > div > a,
.TOCNT > .app > footer > #journeySubNav > .journey_sub_menu > li {
    border: 2px solid var(--northern);
}
.TOCNT > .app > footer > .moreFooter > #breadcrumb-menu > #breadcrumb-menu-roundel > svg > g > .pulse_1,
.TOCNT >  .app >  footer >  .moreFooter  >  .breadcrumb-menu >  div  > svg{
    stroke: var(--northern);
}
.TOCGW .app footer .footer-container  #arrow-menu svg,
.TOCGW .app footer .moreFooter  #arrow-left svg,
.TOCGW  > .app > footer > .moreFooter > .breadcrumb-menu > div > a,
.TOCGW > .app > footer > #journeySubNav > .journey_sub_menu > li{
    border: 2px solid var(--gwr);
}
.TOCGW > .app > footer > .moreFooter > #breadcrumb-menu > #breadcrumb-menu-roundel > svg > g > .pulse_1,
.TOCGW >  .app >  footer >  .moreFooter  >  .breadcrumb-menu >  div  > svg{
    stroke: var(--gwr);
}
.TOCSW .app footer .footer-container  #arrow-menu svg,
.TOCSW .app footer .moreFooter  #arrow-left svg,
.TOCSW  > .app > footer > .moreFooter > .breadcrumb-menu > div > a,
.TOCSW > .app > footer > #journeySubNav > .journey_sub_menu > li{
    border: 2px solid var(--sw);
}
.TOCSW > .app > footer > .moreFooter > #breadcrumb-menu > #breadcrumb-menu-roundel > svg > g > .pulse_1,
.TOCSW >  .app >  footer >  .moreFooter  >  .breadcrumb-menu >  div  > svg{
    stroke: var(--sw);
}

#arrow-left svg {
    height: 45px;
    border: 2px solid #0092cc;
    border-radius: 20px;
    background-color: white;
}
#arrow-menu:hover {
    cursor: pointer;
}

#arrow-left:hover,
#arrow-language-left:hover {
    cursor: pointer;
}

.arrow-language-hide {
    opacity: 0;
    visibility: hidden;
}

@media only screen and (min-width: 675px) {
    footer nav ul li a p {
        font-size: 1.3rem;
        /*white-space: break-spaces;*/
        word-break: auto-phrase;
    }
}
:root {
    --max-width: 1100px;
    --grid-gap: 8px;
    --padding: 5px;
    --header-gap: 10px;
    --template-padding: 13px;
    --text-input: 16px;
    /* footer needs a pixel height // firefox doesnt like the vh value when sub menu is appended*/
    --footer-height: 30px;
    --header-height: 90px;
    --journey-headings: "departure departure station";
    --inactive-journey-grid: .75fr minmax(50px, auto) 5fr;
    --active-journey-grid: .75fr minmax(50px, auto) 5fr;
    --journey-grid-areas: "departure infographic station";
    --sub-menu: calc(calc(var(--footer-height) / 10) * 7);
    /* --panel: calc(100vh - calc(var(--footer-height) + 0.5rem + var(--header-height))); */
    /*--panel: calc(100vh - var(--header-height) - var(--footer-height));*/
    --panel: calc(100% - 30px);
    /* --panel-sub-menu-active: calc(100vh - calc(var(--footer-height) + 0.5rem + var(--sub-menu) + var(--header-height))); */
    /*--panel-sub-menu-active: calc(100vh - var(--footer-height) - var(--sub-menu) - var(--header-height));*/
    --panel-no-footer: calc(var(--panel-sub-menu-active) + var(--footer-height));
    --panel-sub-menu-active: calc(100vh - var(--header-height) - var(--lang-height));
    --colorTheme: var(--northern);
    --gwr: #0a493e;
    --gwr-secondary: #6ccb99;
    --lner: #ce132e;
    --northern: #262262;
    --gc: #ef7d17;
    --gc-secondary: #323132;
    --great-northern: #43165c;
    --nr: #F07E26;
    --nr-secondary: #004D71;
    --tfw: #ae1c0f;
    --es: #005172;
    --es-secondary: #ABD0D9;
    --sw: #0092cc;
    --ht: #e50071;
    --inner-panel: calc(100% - var(--sub-menu) - .5rem);
    --zy: #144e63;
    --lang-height: 40px;


    --panel: calc(100vh - var(--header-height) - var(--lang-height) - var(--footer-height));
    --panel-sub-menu-active: calc(100vh - var(--footer-height) - var(--sub-menu) - var(--header-height) - var(--lang-height));
}


.app {
    max-height: 100%;
    height: 100%;
    min-height: 100%;
    max-width: var(--max-width);
    /* height:calc(100vh - calc(var(--footer-height) + var(--sub-menu))); */
    overflow: visible;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr; /* Three columns, one three times as wide as the others */
    grid-template-rows:-webkit-min-content auto var(--footer-height);
    grid-template-rows:min-content auto var(--footer-height);
    /* grid-template-rows: minmax(auto, calc(var(--header-height) + var(--header-gap))) auto var(--footer-height); */
    background: #FFF;
    /* grid-template-rows:minmax(auto, calc(var(--header-height) + var(--header-gap))) auto minmax(auto, var(--footer-height)); */
    /* grid-row-gap:var(--grid-gap); Three rows, two with explicit widths */
    grid-template-areas:
      "header header header header header"
      "main main main main main";
    overflow-y: hidden;

    /* DAS-949 overrides */
    /*grid-template-rows:-webkit-min-content -webkit-min-content auto var(--footer-height);*/
    /*grid-template-rows: min-content min-content auto var(--footer-height);*/
    grid-template-rows:-webkit-min-content -webkit-min-content auto;
    grid-template-rows: min-content min-content auto;
    grid-template-areas:
    "lang lang lang lang lang"
    "header header header header header"
    "main main main main main";
}
@media only screen and (min-width: 375px) {
    :root {
        --header-height: 90px;
        --footer-height: 30px;
    }
}

/*@media only screen and (min-width: 768px) {*/
/*    :root {*/
/*        --footer-height: 90px;*/
/*    }*/
/*}*/

@media only screen and (min-width: 1100px) {
    .app {
        grid-template-rows:-webkit-max-content auto auto;
        grid-template-rows:max-content auto auto;
        /* border-right:1px black solid;
      border-left: 1px black solid; */
        /* DAS-949 overrides */
        grid-template-rows: min-content min-content auto auto;
    }

    :root {
        --template-padding: 21px;
    }
    h2 {
        font-size: 1.3rem;
    }
}


div.TOCAW {
    font-family: 'wales_sans_bodymedium', sans-serif;
}
div.TOCGC {
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
}

div.TOCLO {
    font-family: 'Johnston100-Regular', sans-serif;
    font-weight: 500;
}

div.TOCLT {
    font-family: 'Johnston100-Regular', sans-serif;
    font-weight: 500;
}

div.TOCXR {
    font-family: 'Johnston100-Regular', sans-serif;
    font-weight: 500;
}
DIV.TOCSR {
    font-family: Arial, sans-serif;
}

DIV.TOCNT {
    font-family: 'Istok Web', sans-serif;
}

DIV.TOCSS {
    font-family: 'Istok Web', sans-serif;
}

DIV.TOCSW,
DIV.TOCSN,
DIV.TOCLE,
DIV.TOCGW,
DIV.TOCLM,
DIV.TOCTL,
DIV.TOCME,
DIV.TOCEM,
DIV.TOCXC,
DIV.TOCVT,
DIV.TOCTP,
DIV.TOCGN,
DIV.TOCCH,
DIV.TOCGR,
DIV.TOCCC,
DIV.TOCTW,
DIV.TOCHX,
DIV.TOCIL,
DIV.TOCSJ,
DIV.TOCES,
DIV.TOCHT,
DIV.TOCWR,
DIV.TOCZZ,
DIV.TOCCS
{
    font-family: Arial, sans-serif;
}

DIV.TOCSE .carbonbox {
    font-size: 19px;
}
.main_header {
    grid-row: 1;
    grid-column: 1;
    grid-area: heading;
    /* padding: var(--template-padding); */
    padding: calc(var(--template-padding) / 2) var(--template-padding);
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 50;
    -webkit-box-shadow: 0 2px 2px 0 #333;
    box-shadow: 0 2px 2px 0 #333;
    flex-wrap: wrap;
    scrollbar-width: none;
}

.main_header::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 0;
    display: none;
    height: 0;
}
.main_header div:first-of-type h1::before {
    display: none;
}

.main_header div:first-of-type {
    /* white-space:nowrap; */
    padding: 0 6px 0 0;
}

.main_header p {
    text-align: left;
    font-size: 1.2rem;
    line-height: 1.8;
}


div.panelForlineDiagram .nameOfStation {
    display: inline;
    font-size: 1.3rem;
    width: 60%;
}

div.panelForlineDiagram .lastUpdatedMessage {
    margin-left: var(--template-padding);
}

@media only screen and (min-width: 768px) {
    div.panelForlineDiagram .nameOfStation {
        width: unset;
    }
}

/* journey media query overrides for desktop */
@media only screen and (min-width: 1100px) {
    div.panelForlineDiagram .nameOfStation {
        width: unset;
    }

    div.panelForlineDiagram .keeptogether {
        width: unset;
        max-width: 790px;
    }

    ul#MarkerTarget {
        max-width: 500px;
        margin-left: 300px;
    }

    div.panelForlineDiagram .lastUpdatedMessage {
        max-width: 500px;
        margin-left: 300px;
    }

    .singlefullitem {
        /*min-height: calc(100vh - var(--header-height) - var(--footer-height) - 1rem);*/
        min-height: 100%;
    }
}
div.panelForlineDiagram .planfromhere {
    width: 20px;
    height: 20px !important;
    margin-left: 0.5em;
    margin-right: 0.5em;
    margin-top: 3px;
    vertical-align: middle;
    display: -webkit-box;
    display: flex;
    background-size: contain;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAMAAAC6V+0/AAABC1BMVEUAAACdnZ2dnZ12dnaUlJRJSUmZmZlOTk4+Pj5DQ0MzMzMAAAACAgImJiYsLCwpKSkrKyszMzMtLS0/Pz9NTU1iYmJbW1thYWFlZWVubm6AgICWlpaYmJiXl5eDg4NPT0/////w/u7+/v/z/vH+//7Pz8+e+o6qqqqxsbG7u7u8/LK9/LK+/LTD/LrG/L3HlOJmZmbT09PV/c/WserXserYtOvb/dXcu+3ev+7fwe7h/tzi4uLj/t/ky/HkzPHmzvLn0PLr2vXt3fbu/uv3//aY+oj6//n9+/7+/f+dnZ2d+o3//v+enp77//r8+v7OoebOzs7Po+b0/vLIyMjv/u3w4vfw4/d0dHTJmeOHBbwQAAAAIHRSTlMABgcMDhMVHikwNz09Skp7gIemvM3k5eXl7vDy8vj7/GrKkOAAAACnSURBVHhefcvVDsJAFEXR4u7uh7a4u7u7y/9/CQUywITAfrpZOZf5l0onpJfQaI4JXZSfJDK6IRSyqN9mcGVzjyIBq4ygHdHZo2XjoCXoABdMAd3OCSHNGwfhIdhapUUhMMY9CpvJBNhdpkDhKs0Dk/WEQvDl7/f6KI/p5lqkEHt8L4fHOBb93pnC4JwDWy21P9CJV9sXmvwe7zOfTcGQ5OSQiplf3QDwBB6/PW7LAQAAAABJRU5ErkJggg==');
    float: left;
}
.menu-footer {
    position: fixed;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    /*align-items: center;*/
    height: var(--footer-height);
    width: 100vw;
    bottom: 0;
    left: 0;
    background-color: white;
    /*border-top: 1px black solid;*/
    z-index: 100;
    /*-webkit-box-shadow: 0 3px 8px 0 #333;*/
    /*box-shadow: 0 3px 8px 0 #333;*/
    /*transition: all 0.2s ease;*/
    /* padding:5px 0 8px 0; */
}
header, main, footer {
    width: 100%;
}

footer nav ul li:last-of-type {
    margin-right: 0;
}
footer nav ul {
    overflow-y: hidden;
    top: 0;
    left: 0;
    scroll-snap-type: x proximity;
    height: 100%;
    -webkit-box-align: center;
    align-items: center;
    margin: 0;
    position: relative;
    overflow-x: scroll;
    white-space: nowrap;
    padding: 0;
    width: 100%;
    scrollbar-width: none;
}
.moreFooter{
    max-height: 100%;
    height: 100%;
    -webkit-box-align: center;
    align-items: center;
    margin: 0;
    overflow-x: scroll;
    white-space: nowrap;
    padding: 0;
    width: 100%;
    transition: all .3s ease;
    scrollbar-width: none;
}
main {
    grid-area: main;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: var(--grid-gap);
    grid-template-rows: -webkit-min-content auto;
    grid-template-rows: min-content auto;
    overflow-y: scroll;
    grid-template-areas:
    "heading heading heading heading"
    "content content content content";
}
.TOCGR > .app > footer > nav > .station_sub_nav_right,
.TOCGR > .app > footer > nav > .buses_sub_nav_right,
.TOCGR > .app > footer > nav > .offers_sub_nav_right,
.TOCGR > .app > footer > nav > .journey_sub_nav_right {
     /*height: 45px;*/
    /*top: 10px;*/
    /*opacity: 0.6;*/
    background-color: #FFFFFF;
    width: 80px;
    right: 0;
    padding-left: 20px;
}
.lds-roller_container {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: var(--panel);
}
.lds-roller_container,
.lds-roller_container-food{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: var(--panel);
}
.lds-roller_container-food{
    position: absolute;
    top: 40px;
    background: white;
    z-index: 1;
    height: 100%;
}

.lds-roller {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}

.lds-roller div {
    -webkit-animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    -webkit-transform-origin: 40px 40px;
    transform-origin: 40px 40px;
}

.lds-roller div:after {
    content: " ";
    display: block;
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: black;
    margin: -4px 0 0 -4px;
}

.lds-roller div:nth-child(1) {
    -webkit-animation-delay: -0.036s;
    animation-delay: -0.036s;
}

.lds-roller div:nth-child(1):after {
    top: 63px;
    left: 63px;
}

.lds-roller div:nth-child(2) {
    -webkit-animation-delay: -0.072s;
    animation-delay: -0.072s;
}

.lds-roller div:nth-child(2):after {
    top: 68px;
    left: 56px;
}

.lds-roller div:nth-child(3) {
    -webkit-animation-delay: -0.108s;
    animation-delay: -0.108s;
}

.lds-roller div:nth-child(3):after {
    top: 71px;
    left: 48px;
}

.lds-roller div:nth-child(4) {
    -webkit-animation-delay: -0.144s;
    animation-delay: -0.144s;
}

.lds-roller div:nth-child(4):after {
    top: 72px;
    left: 40px;
}

.lds-roller div:nth-child(5) {
    -webkit-animation-delay: -0.18s;
    animation-delay: -0.18s;
}

.lds-roller div:nth-child(5):after {
    top: 71px;
    left: 32px;
}

.lds-roller div:nth-child(6) {
    -webkit-animation-delay: -0.216s;
    animation-delay: -0.216s;
}

.lds-roller div:nth-child(6):after {
    top: 68px;
    left: 24px;
}

.lds-roller div:nth-child(7) {
    -webkit-animation-delay: -0.252s;
    animation-delay: -0.252s;
}

.lds-roller div:nth-child(7):after {
    top: 63px;
    left: 17px;
}

.lds-roller div:nth-child(8) {
    -webkit-animation-delay: -0.288s;
    animation-delay: -0.288s;
}

.lds-roller div:nth-child(8):after {
    top: 56px;
    left: 12px;
}

@-webkit-keyframes lds-roller {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes lds-roller {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.index_default_container {
    width: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    grid-area: content;
    padding: var(--template-padding);
    height: 100%;
    padding-top: 0;
}

.index_default_container svg {
    width: 75px;
}

.default_item_pointer {
    pointer-events: initial;
}

.default_item_pointer > * {
    pointer-events: none;
}

.default_item_pointer g,
.default_item_pointer-lner{
    animation: bumpUpBig 1.3s infinite ease;
    -webkit-animation: bumpUpBig 1.3s infinite ease;
}

.default_item_pointer-lner{
    pointer-events: initial;
}

.default_item_pointer-lner > *{
    pointer-events: none;
}

.default_item {
    /* padding:var(--template-padding); */
    padding: 0 var(--template-padding);
    display: grid;
    grid-auto-rows: 1fr 1fr 1fr;
    place-items: center;
    justify-items: center;
}

.default_item:last-of-type {
    /*height: calc(var(--panel) / 2);*/
    padding-bottom: 70px;
}

.TOCGR > .app > .singlefullitem > #panelFoodanddrink > .index_default_container > .default_item:last-of-type {
    height: 100%;
}
#panelFoodanddrink{
    padding-bottom:60px;
}
.default_item svg:first-of-type {
    width: 125px;
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.4));
    -webkit-filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.4));
}
.TOCGR .default_item svg:first-of-type {
    filter:none;
    -webkit-filter:none;
}

.default_item svg:nth-of-type(2) {
    filter: drop-shadow(3px -2px 1px rgba(0, 0, 0, 0.4));
    -webkit-filter: drop-shadow(3px -2px 1px rgba(0, 0, 0, 0.4));
}
.TOCGR .default_item svg:nth-of-type(2) {
    filter: none;
    -webkit-filter: none;
}

.default_item p {
    margin-right: 13px;
    text-align: center;
    font-size: 1.4rem;
    line-height: 2;
    font-weight: 300;
}

.default_item p /*multilingual*/
{
    margin-right: 13px;
    text-align: center;
    font-size: 1.4rem;
    line-height: 2;
    font-weight: 300;
}

.deafult_item:first-of-type {
    margin-top: var(--template-padding);
}

@media only screen and (min-width: 440px) {
    .default_item {
        width: 80%;
    }
}

@media only screen and (min-width: 1100px) {
    .index_default_container svg {
        display: none;
    }

    .default_item svg {
        display: block;
    }

    .default_item:last-of-type {
        height: auto;
    }

    .index_default_container {
        /* height: var(--panel); */
        height: auto;
        justify-content: center;
        padding: 0 var(--template-padding);
    }

    .default_item {
        height: auto;
        grid-template-columns: min-content auto;
    }

    .default_item_pointer,
    .default_item_pointer-lner{
        display: none !important;
    }

    .default_item p {
        text-align: left;
        place-self: Start;
        align-self: center;
    }
}

.default_item_pointer:hover,
.default_item_pointer-lner:hover{
    cursor: pointer;
}

#panelTram div .main_item {

    grid-template-columns: 20% 30% 30% auto;
}

#panelBuses div .main_item {

    grid-template-columns: 25% 33% 20% auto;
}

#panelBuses div .main_item .main_item_departure /*multilingual*/
{
    font-size: 1rem;
}

#panelBuses div .main_item .main_item_platform p {
    /* align-self:start; */
    padding-left: 0.5rem;
    /*width: 100%;*/
    text-align: center;
}

#panelBuses div .main_item .main_item_platform {
    text-align: center;
    max-width: 150px;
    align-items: center;
    word-break: break-word;
}

#panelBuses div .main_item .main_item_platform::before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg id='icon_pin' class='icon_svg' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E %3Ctitle%3EBus stop location on the map%3C/title%3E %3Cg class='icon_group cls-1'%3E%3Cpath fill='%23dd4b4b' d='M29.27,45.18,50,86.37,70.73,45.18S80.43,17.35,50,13.63C19.57,17.35,29.27,45.18,29.27,45.18Z' /%3E%3Ccircle fill='white' cx='50' cy='35.28' r='9.56' /%3E%3C/g%3E%3C/svg%3E");
    position: absolute;
    background-repeat: no-repeat;
    background-position: center;
    bottom: 0;
    height: 100%;
    right: -12px;
    width: 30px;
    max-height: 20px;
}

#panelBuses div .main_item:first-of-type .main_item_platform::before {
    display: none;
}

@media only screen and (min-width: 1100px) {
    #panelBuses div .main_item .main_item_platform::before {
        right: -20px;
        max-height: 24px;
    }
}

#panelBuses div .main_item .main_item_no_platform::before {
    content: none;
}


#panelBuses div .main_item .main_item_platform p:empty {
    display: none;
}
#panelStations {
    width: 4px !important;
    height: 4px !important;
}

/* panel.css */
.panelSizer {
    width: 100%;
    background-color: white;
    overflow-y: scroll;
    transition: height 0.2s ease;
    height: 100%;
    padding-bottom: 100px;
    position: relative;
    -webkit-animation: fadeIn 0.3s ease;
    animation: fadeIn 0.3s ease;
    z-index: 1;
}
@media screen and (max-width:1100px)  {
    .TOCGR .singlefullitem-padding-increase .panelSizer {
        padding-bottom: 150px;
    }
}
@media screen and (max-width:768px)  {
    .TOCGR .singlefullitem-padding-increase .panelSizer {
        padding-bottom: 130px;
    }
}
.TOCGR .singlefullitem-padding-increase #panelHomepage{
    padding-bottom: 100px;
}
section {
    grid-column: 2;
    grid-column-start: 2;
    grid-column-end: 6;
}

.singlefullitem {
    grid-area: main;
    z-index: 1;
    height: 100%;
    position: relative;
    min-height:100%;
}
.TOCRT .app .singlefullitem #panelOffersmenu,
.TOCRT .app .singlefullitem #panelFreenowoffer,
.TOCRT .app .singlefullitem #panelOffers,
.TOCRT .app .singlefullitem #panelWhsmithoffer,
.TOCRT .app .singlefullitem #panelUppercrustoffer {
    height: var(--panel-sub-menu-active);
}
/*#panelMap{*/
/*    height: calc(100% - 110px);*/
/*}*/
#panelSuper::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 0;
    height: 0;
    display: none;
}

#panelStations {
    /*background-color: #f0f4c3;*/
    height: var(--panel-sub-menu-active);
    display: none !important;
    visibility: hidden !important;
}
#panelJourney {
    transition: all 0.3s ease;
    /*height: calc(100% - var(--sub-menu));*/
}

.buses_sub_nav{
    position: absolute;
    border-top: 1px black solid;
    border-bottom: 1px black solid;
    width: 100%;
    height: var(--sub-menu);
    overflow-x: scroll;
    left: 0;
    list-style-type: none;
    display: none;
    white-space: nowrap;
    margin: 0;
    top: 0;
    padding: 0;
    background-color: #fff;
    z-index: 85;
    -webkit-box-shadow: 0 -5px 4px -5px #333;
    box-shadow: 0 -5px 4px -5px #333;
}
.TOCGR .journey_sub_nav,.TOCGR .station_sub_nav,.TOCGR .buses_sub_nav,.TOCGR .offers_sub_nav {
    box-shadow:none;
    -webkit-box-shadow:none;
}
.journey_sub_nav{
    display: none;
    position: fixed;
    bottom: 35px;
    height: auto;
    width: 55px;
    background-color: transparent;
    padding: 0;
    top: 30px;
    left: unset;
    right: 5px;
}

.buses_sub_menu{
    width: 100%;
    height: 100%;
    overflow-x: scroll;
    list-style-type: none;
    white-space: nowrap;
    display: -webkit-inline-box;
    display: inline-flex;
    position: absolute;
    background-color: #fff;
    scrollbar-width: none;
    padding: 0;
    margin: 0;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 0;
    pointer-events: auto;
}

.mapping-container {
    height: calc(100vh + 5rem - var(--header-height));
    width: 100%;
}

.footways-container {
    height: calc(100vh - var(--header-height));
    width: 100%;
}
.mapping-container > iframe {
    height: 100%;
    width: inherit;
    transform: translateY(-1.5rem) scale(0.9);
}

.mapping-map,
.footways-map {
    border: none;
}

@media (orientation: landscape) {
    .mapping-container {
        height: calc(800px - var(--header-height));
    }
}

footer .moreFooter ul{
    padding: 10px;
    top: 0;
    padding-bottom: 120px;
    height: auto;
    display: grid;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 10px;
    flex-wrap: wrap;
    grid-template-columns: repeat( auto-fit, minmax(105px, 1fr) );
}
.menu-hide{
    visibility: hidden;
    opacity: 0;
}

@media screen and (min-width: 1100px) {
    #arrow-left{
        margin-left:30%;
    }
}
.pulse {
    animation: pulse-animation 1.3s forwards;
}
@keyframes pulse-animation {
    0% {
        opacity: 1;
        box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
    }
    100% {
        opacity: .5;
        box-shadow: 0 0 0 20px rgba(0, 0, 0, 0);
    }
}
.pulse_animation_1,
.pulse_animation_2,
.pulse_animation_3{
    animation: pulse-animation-1 .8s forwards;
    transform-origin: center;
    transform-box: fill-box;
    transition: all ease .3s;
}
.pulse_animation_2 {
    animation: pulse-animation-2 .8s forwards;
}
.pulse_animation_3 {
    animation: pulse-animation-3 .8s forwards;
}
@keyframes pulse-animation-1 {
    0% {
        opacity: 0;
        transform: scale(1);
    }
    60% {
        opacity: .25;
        transform: scale(1.2);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes pulse-animation-2 {
    0% {
        opacity: 0;
        transform: scale(1);
    }
    50% {
        opacity: .25;
        transform: scale(1.2);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes pulse-animation-3 {
    0% {
        opacity: 0;
        transform: scale(1);
    }
    40% {
        opacity: .25;
        transform: scale(1.2);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}


.breadcrumb-menu > div > a {
    position: relative;
    color: black;
    text-decoration: none;
    transition: 0.5s ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    border: 2px solid var(--sw);
    height: 50px;
}
#breadcrumb-menu-roundel {
    position: relative;
    margin: 0 2px;
    align-items: center;
    overflow-y: visible;
    padding: 0;
    border: none;
    transition: all 0.5s ease;
    pointer-events: auto;
    border-radius: 20px;
    height: 45px;
    width: 45px;
    display: flex;
    justify-content: center;
    background: transparent;
    cursor: pointer;
}
#breadcrumb-menu-roundel > svg {
    overflow: visible;
    height: 45px;
    width: 45px;
}
#breadcrumb-menu-crs > a > h4 {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 5px;
}
#breadcrumb-menu-crs{
    width: 80px;
}
.moreFooter .breadcrumb-menu #breadcrumb-menu-crs.breadcrumb-highlighted,
.moreFooter .breadcrumb-menu .breadcrumb-highlighted{
    width: 200px;
}
.breadcrumb-menu .breadcrumb-shrink,
#breadcrumb-menu-crs.breadcrumb-shrink{
    width: 60px;
}
.breadcrumb-menu div a svg{
    max-height: 35px;
    max-width: 40px;
    transition: .3s all ease;
}
.breadcrumb-menu div {
    margin: 0 2px;
    display: flex;
    list-style-type: none;
    position: relative;
    flex-direction: column-reverse;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    min-width: 0;
    overflow-y: visible;
    border-radius: 0;
    padding: 0;
    border: none;
    transition: all 0.5s ease;
    pointer-events: auto;
    height: fit-content;
    width: 60px;
}
#breadcrumb-menu-main > a ,
#breadcrumb-menu-sub > a,
#breadcrumb-menu-crs > a,
#breadcrumb-menu-offers > a {
    grid-template-columns: 1fr;
    display: grid;
    justify-items: center;
    align-items: center;
    justify-content: center;
    width: 100%;
    transition: .1s all ease;
    margin:  1px 0;
    padding: 5px;
    border-radius: 5px;
}
#breadcrumb-menu-crs > #breadcrumb-menu-sub-crs-content{
    justify-items: unset;
}
#breadcrumb-menu-sub > .hide-breadcrumb-content ,
#breadcrumb-menu-crs > .hide-breadcrumb-content,
#breadcrumb-menu-offers > .hide-breadcrumb-content,
#breadcrumb-menu-main > .hide-breadcrumb-content{
    visibility: hidden;
    padding: 0;
    margin: -25px;
    line-height: 0;
    transition: none;
    opacity: 0;
}
#breadcrumb-menu-main-svg,
#breadcrumb-menu-sub-svg,
#breadcrumb-menu-offers-svg{
    display: flex;
    margin: 0;
    height: 30px;
    pointer-events: none;
    justify-content: center;
}
#breadcrumb-menu-crs a h4{
    pointer-events: none;
    text-align: center;
}
#breadcrumb-menu-main > a > p,
#breadcrumb-menu-sub > a > p,
#breadcrumb-menu-crs > a > p,
#breadcrumb-menu-offers > a > p{
    display: none;
    bottom: 0;
    visibility: hidden;
    opacity: 0;
    white-space: normal;
    text-align: center;
    line-height: 1;
    pointer-events: none;
}
.breadcrumb-menu .hide-breadcrumb-item {
    display: none;
}
#breadcrumb-menu-main.breadcrumb-highlighted a,
#breadcrumb-menu-sub.breadcrumb-highlighted a,
#breadcrumb-menu-crs.breadcrumb-highlighted a,
#breadcrumb-menu-offers.breadcrumb-highlighted a{
    grid-template-columns: 1fr 1fr;
}
#breadcrumb-menu-crs.breadcrumb-highlighted #breadcrumb-menu-sub-crs-content{
    grid-template-columns: 1fr;
    justify-items: center;
}
#breadcrumb-menu-crs.breadcrumb-highlighted #breadcrumb-menu-sub-crs-content h4 {
    text-wrap: balance;
}
#breadcrumb-menu-main.breadcrumb-highlighted a p,
#breadcrumb-menu-sub.breadcrumb-highlighted a p,
#breadcrumb-menu-crs.breadcrumb-highlighted a p,
#breadcrumb-menu-offers.breadcrumb-highlighted a p{
    display: flex;
    justify-content: center;
    opacity: 1;
    visibility: visible;
    transition: 1s all ease;
}
#breadcrumb-menu-main.breadcrumb-highlighted a p multilingual,
#breadcrumb-menu-sub.breadcrumb-highlighted a p multilingual,
#breadcrumb-menu-crs.breadcrumb-highlighted a p multilingual,
#breadcrumb-menu-offers.breadcrumb-highlighted a p multilingual {
    margin: 0;
    font-weight: 600;
    font-size: 14px;
    text-align: center;
}
@media only screen and (min-width: 1100px) {
    #breadcrumb-menu-main.breadcrumb-highlighted a p multilingual,
    #breadcrumb-menu-sub.breadcrumb-highlighted a p multilingual,
    #breadcrumb-menu-crs.breadcrumb-highlighted a p multilingual,
    #breadcrumb-menu-offers.breadcrumb-highlighted a p multilingual{
        font-size: 1.2rem;
    }
}
.breadcrumb-menu{
    display: inline-flex;
    position: sticky;
    width: 100%;
    font-weight: bold;
    top: 50px;
    white-space: pre-wrap;
    z-index: inherit;
    justify-content: center;
    flex-wrap: wrap;
    pointer-events: none;
    bottom: 10px;
    align-items: center;
    cursor: pointer;
}
.breadcrumb-menu-active{
    display: inline-flex;
    align-items: flex-end;
    height: 100%;
    transition: none;
    z-index: inherit;
    position: fixed;
    top: auto;
    left: 0;
    right: 0;
}
.journey_sub_menu{
    padding: 0;
    margin: 0;
    left: unset;
    right: 5px;
    position: fixed;
    bottom: 25px;
    height: auto;
    width: 55px;
    flex-direction: column-reverse;
    background-color: transparent;
    gap: 5px;
    top: auto;
    pointer-events: auto;
}

.station_sub_nav_right, .buses_sub_nav_right, .offers_sub_nav_right, .journey_sub_nav_right {
    position: absolute;
    display: none;
    width: 45px;
    height: var(--sub-menu);
    right: 5px;
    top: 0;
    background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath filter='invert(13%) sepia(98%) saturate(4383%) hue-rotate(344deg) brightness(87%) contrast(94%)' stroke='black' stroke-width='2px' d='M33.79,73.82,55.9,52.61a3.65,3.65,0,0,0,0-5.27L33.77,26.18a10.14,10.14,0,0,1,2.47-11.6l33.6,31a5.83,5.83,0,0,1,0,8.55L36.27,85.42S33.79,85.33,33.79,73.82Z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    z-index: 90;
}


.station_sub_nav_left, .buses_sub_nav_left, .offers_sub_nav_left, .journey_sub_nav_left {
    position: absolute;
    display: none;
    width: 45px;
    height: var(--sub-menu);
    left: 5px;
    top: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath stroke='black' filter='invert(13%) sepia(98%) saturate(4383%) hue-rotate(344deg) brightness(87%) contrast(94%)' stroke-width='2px' d='M68.39,74.19,46.28,53a3.64,3.64,0,0,1,0-5.27L68.41,26.55a10.17,10.17,0,0,0-2.47-11.61l-33.61,31a5.83,5.83,0,0,0,0,8.55l33.6,31.32S68.39,85.69,68.39,74.19Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    z-index: 100;
}
.TOCGR > .app > footer > nav > .station_sub_nav_left,
.TOCGR > .app > footer > nav > .buses_sub_nav_left,
.TOCGR > .app > footer > nav > .offers_sub_nav_left,
.TOCGR > .app > footer > nav > .journey_sub_nav_left{
    /*background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJMYXllcl8yIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI5LjQ4IDE3MDAuNzkiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDojY2UxMzJlO3N0cm9rZS13aWR0aDowcHg7c3Ryb2tlOiB3aGl0ZTsNCiAgICBzdHJva2Utd2lkdGg6IDEwcHg7fTwvc3R5bGU+PC9kZWZzPjxnIGlkPSJBcnR3b3JrIj48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Im0zODMuNTQsODUwLjM5TDEwMTEuNTQsMjIyLjM5YzIzLjkyLTIzLjkyLDIzLjkyLTYyLjcsMC04Ni42MWwtMTE3Ljg0LTExNy44NGMtMjMuOTItMjMuOTItNjIuNy0yMy45Mi04Ni42MSwwTDEzNS43OCw2ODkuMjVsLTExNy44NCwxMTcuODRjLTIzLjkyLDIzLjkyLTIzLjkyLDYyLjcsMCw4Ni42MWwxMTcuODQsMTE3Ljg0LDY3MS4zMSw2NzEuMzFjMjMuOTIsMjMuOTIsNjIuNywyMy45Miw4Ni42MSwwbDExNy44NC0xMTcuODRjMjMuOTItMjMuOTIsMjMuOTItNjIuNywwLTg2LjYxTDM4My41NCw4NTAuMzlaIi8+PC9nPjwvc3ZnPg==");*/
    /*height: 45px;*/
    /*top: 10px;*/
    /*opacity: 0.6;*/
    background-color: #FFFFFF;
    width: 80px;
    left: 0;
    padding-right: 20px;
}

.journey_sub_menu::-webkit-scrollbar, .station_sub_menu::-webkit-scrollbar, .buses_sub_menu::-webkit-scrollbar, .offers_sub_menu::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 0;
    height: 0;
    display: none;
}

.buses_sub_menu li{
    height: 100%;
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    min-width: 70px;
    min-height: 70px;
    width: unset;
    margin: 0 1px;
    padding: 5px;
    border-radius: 5px;
    border: none;
    -webkit-animation: slideInUp 0.2s ease-in-out;
    animation: slideInUp 0.2s ease-in-out;
    overflow: hidden;
}
.journey_sub_menu li{
    min-height: 40px;
    width: 55px;
    height: 55px;
    background: white;
    border: 2px solid black;
    min-width: 55px;
    border-radius: 50px;
    padding: 5px;
    transition: all 0.5s ease 0s;
    left: unset;
    right: 5px;
    position: fixed;
    bottom: 25px;
}

.journey_sub_menu .journey-items-condensed{
    height: 20px;
    width: 20px;
    min-width: 20px;
    min-height: 20px;
    padding: 1px;
}
.journey-items-open,
.journey-items-closed{
    transition: all .1s ease-in;
}
.hide-journey-items{
    opacity: 0;
    visibility: hidden;
}


.buses_sub_menu li:first-of-type {
    margin-left: 5px;
}

.journey_sub_menu li:last-of-type,
.station_sub_menu li:last-of-type,
.buses_sub_menu li:last-of-type,
.offers_sub_menu li:last-of-type {
    margin-right: unset;
}

/*.journey_sub_menu li a, .station_sub_menu li a, .buses_sub_menu li a, .offers_sub_menu li a {*/
/*    height: 100%;*/
/*    width: 100%;*/
/*    -webkit-box-pack: center;*/
/*    justify-content: center;*/
/*}*/

.journey_sub_menu svg,
.station_sub_menu svg,
.buses_sub_menu svg,
.offers_sub_menu svg {
    height: 100%;
}

.journey_sub_menu_active{
    display: block;
}
.menu-footer-lowered-hide{
    visibility: hidden;
    opacity: 0;
    transition: 0.3s all ease;
}
.buses_sub_menu_active{
    top: calc(var(--sub-menu) * -1);
    display: block;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-animation: slideInUp 0.5s ease-in-out;
    animation: slideInUp 0.5s ease-in-out;
}
@media screen and (min-width: 1100px) {
    #breadcrumb-menu-crs{
        width: 100px;
    }
    .moreFooter .breadcrumb-menu #breadcrumb-menu-crs.breadcrumb-highlighted,
    .moreFooter .breadcrumb-menu #breadcrumb-menu-main.breadcrumb-highlighted,
    .moreFooter .breadcrumb-menu #breadcrumb-menu-sub.breadcrumb-highlighted ,
    .moreFooter .breadcrumb-menu #breadcrumb-menu-offers.breadcrumb-highlighted{
        width: 300px;
    }
    #breadcrumb-menu-main > a > p,
    #breadcrumb-menu-sub > a > p,
    #breadcrumb-menu-crs > a > p{
        bottom: 5px;
    }
    .breadcrumb-menu .breadcrumb-shrink,
    #breadcrumb-menu-crs.breadcrumb-shrink{
        width: 80px;
    }
    .breadcrumb-menu div svg{
        height: 70px;
    }
    footer nav ul, .station_sub_menu, .offers_sub_menu {
        grid-template-columns: repeat( auto-fit, minmax(200px, 1fr) );
        gap: 50px;
    }
    .moreFooter > ul > li > a > svg, .station_sub_menu svg, .offers_sub_menu svg{
        max-height: 85px;
        max-width: 85px;
    }
    #journeySubNav{
        bottom: 0;
        transform: translateX(235px);
        left: 50%;
        width: 65px;
    }
    /*.journey_sub_menu li{*/
    /*    right: 0;*/
    /*}*/
}

.sub_menu_icon_active {
    border: 1px black solid;
}

@media only screen and (min-width: 1100px) {
    .station_sub_nav_left, .offers_sub_nav_left, .journey_sub_nav_left {
        display: block;
    }

    .station_sub_nav_right, .offers_sub_nav_right, .journey_sub_nav_right {
        display: block;
    }

    .station_sub_nav_left:hover, .station_sub_nav_right:hover,.journey_sub_nav_left:hover, .journey_sub_nav_right:hover, .offers_sub_nav_right:hover {
        cursor: pointer;
    }
}
.menu-footer-out > .footer-container,
.menu-footer-out > .moreFooter > .breadcrumb-menu{
    background-color: transparent;
}
#stationSubNav > ul > li > a > svg {
    width: 100%;
}
.menu-footer-out{
    min-height: 0;
    height: 110px;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    background-color: transparent;
    pointer-events: none;
}
.footer-container {
    position: sticky;
    top: 0;
    width: 100%;
    margin: 0;
    display: grid;
    height: 50px;
    grid-template-areas: "left menu right";
    padding: 0;
    justify-items: center;
    align-items: center;
    align-content: center;
    z-index: 6;
    background-color: white;
}
.footer-backlight{
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    background-image: linear-gradient(0deg, rgba(211,211,211,.9), rgba(250,250,250,0));
}
.menu-footer-out > .moreFooter{
    overflow: hidden;
    background-color: transparent;
}
.menu-footer-out > .moreFooter > ul,
.menu-footer-out > #stationSubNav,
.menu-footer-out > #stationSubNav > ul,
.menu-footer-out > #offersSubNav > ul,
.menu-footer-out > #offersSubNav{
    visibility: hidden;
    opacity: 0;
}
#stationSubNav > ul > li > a > svg {
    width: 100%;
}
.menu-footer-in {
    transition-timing-function: linear;
    min-height: calc(100%);
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    position: absolute;
    overflow-y: hidden;
}

.menu-footer-in > .footer-container{
    z-index: 100;
}

.menu-footer-lowered{
    height:50px;
}
.menu-footer-out.menu-footer-lowered > .moreFooter{
    opacity: 0;
    visibility: hidden;
    top: 50px;
}
.menu-footer-breadcrumb-active > .moreFooter{
    z-index: inherit;
}
.menu-footer-out > .footer-container > #arrow-menu {
    transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.menu-footer-in > .moreFooter > #arrow-left{
    opacity:0;
    visibility: hidden;
    transition: .3s all ease;
}
.menu-footer-in > .moreFooter{
    position: absolute;
}
.menu-footer-in .footer-backlight{
    opacity: 0;
    visibility: hidden;
}
#arrow-left > svg > path,
#arrow-menu> svg > path{
    fill: white;
}
@media screen and (min-width: 1100px) {
    .app > .menu-footer-out > .footer-container > #arrow-menu{
        margin-bottom: 0;
    }
    .menu-footer-in > .moreFooter{
        position: absolute;
    }
}
.menu-footer-in > .moreFooter > .breadcrumb-menu{
    background: linear-gradient(to top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 15%);
}
@media screen and (min-width: 1100px) {
    .app {
        grid-template-areas:
            "lang lang lang lang lang"
            "header header header header header"
            "main main main main main"
            "main main main main main";
        max-width: unset;
    }
    div.panelForlineDiagram {
        /*max-width: unset;*/
        margin: 0;
    }

    #ErrorMessageDelay {
        max-width: unset;
    }

    #compensation_dismiss {
        max-width: 500px;
        border: 1px black solid;
        margin-left: var(--template-padding);
        border-radius: 5px;
    }

    footer {
        /*top: 0;*/
        /*width: 100%;*/
        /*height: 100% !important;*/
        /*position: relative;*/
        /*bottom: unset;*/
        /*grid-column-end: 2;*/
        /*grid-row-start: 2;*/
        /*grid-row-end: 5;*/
        /*border-right: 1px black solid;*/
        /*border-top: 1px black solid;*/
        /* border-top: none; */
        max-width: 1200px;
        margin: auto auto;
        left: 0;
        right: 0;
    }

    footer nav:first-of-type {
        height: 100%;
    }

    footer nav ul{
        grid-template-columns: repeat( auto-fit, minmax(200px, 1fr) );
        gap: 50px;
        /*display: flex;*/
        /*flex-direction: column;*/
        /*padding: var(--template-padding);*/
    }

    footer nav ul li {
        /*height: auto;*/
        width: 100%;
    }

    footer nav ul li:first-of-type {
        margin-left: 0;
    }

    footer nav ul li:last-of-type {
        margin-right: 0;
    }

    .buses_sub_menu_active {
        bottom: 0;
        width: calc(100% * 4);
        margin-left: 100%;
        top: unset;
        border-bottom: none;
        /* border-right:1px black solid; */
    }

    .TOCGW .app .singlefullitem .panelSizer {
        height: 100%;
    }
    .app .singlefullitem .panelSizer {
        height: 100%;
    }

    /*.TOCGW .app .singlefullitem .panelSizer {*/
    /*    height: 100%;*/
    /*}*/

    #panelSuper {
        position: relative !important;
        max-width: unset;
        /*grid-template-rows: min-content var(--header-height) auto auto;*/
    }

    .TOCRT .app .singlefullitem #panelOffersmenu,
    .TOCRT .app .singlefullitem #panelFreenowoffer,
    .TOCRT .app .singlefullitem #panelOffers,
    .TOCRT .app .singlefullitem #panelWhsmithoffer,
    .TOCRT .app .singlefullitem #panelUppercrustoffer {
        height: calc(100% - var(--sub-menu));
    }

    /*#panelRentals, #panelNationalrail, #panelEvents, #panelPicker, #panelTube, #panelBuses, #panelRiver, #panelTram, #panelDlr, #panelOsi,#panelWeather, #panelMap, #panelInfo, #panelSuper {*/
    /*    height: calc(100% - var(--sub-menu));*/
    /*}*/
}
.TOCGC {
    background-image: none;
}
.TOCES {
    background-image: none;
}
.TOCNT {
    background-image: none;
}
.TOCRT {
    background-image: none;
}
.TOCSS {
    background-image: none;
}
.TOCGR {
    background-image: none;
}
.TOCHT {
    background-image: none;
}
.TOCRT {
    background-image: none;
}
@media only screen and (min-width: 1100px) {
    iframe {
        height: calc(100% - var(--footer-height) + 0.5rem);
    }
}
@media screen and (min-aspect-ratio: 13/9) and (max-width: 896px) {
    .header-cube-header {
        display: none;
    }

    div.journey-v2-heading {
        position: relative;
    }

    .panelSizer {
        height: 100% !important;
    }

    .app {
        overflow-y: scroll;
        grid-template-rows:min-content auto;
    }
}
@media only screen and (min-width: 1100px) {
    #panelOnboard,#panelFoodanddrink {
        margin-bottom: var(--sub-menu);
    }

    #panelRentals,
    #panelNationalrail,
    #panelOsi,
    #panelMap,
    #panelWeather,
    #panelTube,
    #panelBuses,
    #panelRainbows,
    #panelTram,
    #panelDlr,
    #panelStations,
    #panelPicker,
    #panelInfo,
    #panelTaxi,
    #panelOffersmenu{
        margin-bottom: var(--sub-menu);
        /*height: calc(100% - 60px);*/
    }

    .TOCRT .app .singlefullitem #panelOffersmenu,
    .TOCRT .app .singlefullitem #panelFreenowoffer,
    .TOCRT .app .singlefullitem #panelOffers,
    .TOCRT .app .singlefullitem #panelWhsmithoffer,
    .TOCRT .app .singlefullitem #panelUppercrustoffer {
        margin-bottom: var(--sub-menu);
    }

    #panelOnboard, #panelFoodanddrink {
        margin-bottom: var(--sub-menu);
    }
    #panelFoodanddrink {
        padding-bottom: 0;
    }

}
#footerButtonairport {
    visibility: hidden !important;
    display: none !important;
}

#panelJourneyFinder {
    height: 100%;
}

#panelJourneyInfo {
    height: 100%;
}

.data-source-provider-wrapper {
    padding: 0 var(--template-padding);
    margin: var(--template-padding);
}

.data-source-provider-container {
    padding: var(--template-padding);
    margin: auto;
    align-items: center;
    justify-content: center;
    display: flex;
    border-radius: 5px;
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    font-size: 1.3rem;
}

.data-source-provider-container p:nth-of-type(2) {
    display: flex;
    height: unset;
    align-items: Center;
}

.data-source-provider-container svg {
    max-height: 20px;
    height: 20px;
    margin-left: var(--template-padding);
}

.data-source-provider-container p svg {
    max-height: 30px;
    height: 30px;
    margin-left: var(--template-padding);
}

.data-source-provider-svg {
    max-height: 30px;
    height: 30px;
    margin-left: var(--template-padding);
}
.national-rail-enquires {
    width: 20px;
    height: unset !important;
    max-height: unset !important;
}

@media screen and (min-width: 1100px) {
    .national-rail-enquires {
        width: 30px;
    }
}
select {
    box-shadow: none;
    border-radius: 1rem;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-right: 1rem;
    padding-left: 0.5rem;
    border: 0;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat, repeat;
    background-position: right .7em top 50%;
    background-size: .65em auto;
    background: none;
}

.lumo {
    color: #fff;
    background-color: #1e00f8;
}

.grn {
    color: #000;
    background-color: #ffb300;
}
.thameslink {
    background-color: #d386a9;
    color: white;
}






.lioness
 {
    background-color: #ffa600;
    color: white;
}

.suffragette
{
       background-color: #18a95d;
    color: white;
}

.mildmay
{
     background-color: #006fe6;
    color: white;
}


.weaver
{
    background-color: #9b0058;
    color: white;
}

 .liberty {
    background-color: #61686b;
    color: white;
}




.windrush {
    background-color: #dc241f;
    color: white;

}

.rb5
{
  background-color:  rgb(186, 104, 48);
        color: white;
}






.toc-colour-gr{
    fill: var(--lner);
    background: var(--lner);
    color: #fff;
}

.toc-colour-nt{
    fill: var(--northern);
    background: var(--northern);
    color: #fff;
}

.toc-colour-rt{
    fill: var(--nr);
    background: var(--nr);
    color: #fff;
}
.toc-colour-zy{
    fill: var(--zy);
    background: var(--zy);
    color: #fff;
}
.toc-colour-sw{
    fill: var(--sw);
    background: var(--sw);
    color: #fff;
}

.toc-colour-gc{
    fill: var(--gc);
    background: var(--gc);
    color: black;
}

.toc-colour-gw {
    fill: var(--gwr);
    background: var(--gwr);
    color: #fff;
}
#whooshStations .toc-colour-gr{
    fill: var(--lner);
    background: var(--lner);
    color: #fff;
}

#whooshStations .toc-colour-nt{
    fill: var(--northern);
    background: var(--northern);
    color: #fff;
}

#whooshStations .toc-colour-rt{
    fill: var(--nr);
    background: var(--nr);
    color: #fff;
}

#whooshStations .toc-colour-sw{
    fill: var(--sw);
    background: var(--sw);
    color: #fff;
}

#whooshStations .toc-colour-gc{
    fill: var(--gc);
    background: var(--gc);
    color: black;
}

#whooshStations .toc-colour-gw{
    fill: var(--gwr);
    background: var(--gwr);
    color: #fff;
}
multilingual {
    font-size: inherit !important;
    font-weight: inherit !important;
    font-family: inherit !important;
    font-style: inherit !important;
}

/*messages, alerts, cookie modal*/
#ErrorMessage:empty {
    display: none;
}

#ErrorMessageDelay:empty {
    display: none;
}

#ErrorMessageDelay, #compensation_dismiss {
    display: none;
    opacity: 0;
    height: auto;
    /* max-height: 80px; */
    padding: 10px 5px;
    /* bottom: -38px; */
    border: 1px black solid;
    border-left: none;
    border-right: none;
    /* width: calc(100% - var(--template-padding)*2); */
    width: 100%;
    background: white;
    box-shadow: none;
    /* -webkit-box-shadow: 2px 2px 2px 0px #333;
    box-shadow: 0px 0px 4px 1px #333; */
    grid-template-columns:3fr 8fr 1fr;
    grid-auto-rows: 100%;
    column-gap: 10px;
    grid-template-areas:"logo message close";
    align-content: center;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    max-width: 1100px;
    /* Z-index changed to sit above h1 at 2000 */
    z-index: 2001;
    position: sticky;
    top: 0;
}

.ErrorMessageDelayEntries {
    grid-template-columns:1fr 8fr 1fr !important;
}

@media screen and (min-width: 1100px) {
    #ErrorMessageDelay, #compensation_dismiss {
        bottom: var(--footer-height);
        border-top: 1px black solid;
        border-left: none;
        border-right: none;
        border-radius: 5px 5px 0 0;
        box-shadow: none;
    }
}
.cc-window {
    color: rgb(170, 204, 204);
    background-color: rgb(38, 34, 98);
    opacity: 1;
    -webkit-transition: opacity 1s ease;
    transition: opacity 1s ease;
}

.TOCRT .cc-window {
    color: white;
    background-color: var(--nr-secondary);
    opacity: 1;
    -webkit-transition: opacity 1s ease;
    transition: opacity 1s ease;
}
.TOCSW .cc-window {
    color: white;
    background-color: var(--sw);
    opacity: 1;
    -webkit-transition: opacity 1s ease;
    transition: opacity 1s ease;
}
.TOCGW .cc-window {
    color: white;
    background-color: var(--gwr);
    opacity: 1;
    -webkit-transition: opacity 1s ease;
    transition: opacity 1s ease;
}
.TOCGC .cc-window {
    color: white;
    background-color: var(--gc-secondary);
    opacity: 1;
    -webkit-transition: opacity 1s ease;
    transition: opacity 1s ease;
}
.cc-window.cc-invisible,
.cc-invisible {
    opacity: 0;
}
.cc-revoke,
.cc-window {
    position: fixed;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Helvetica, Calibri, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5em;
    display: -webkit-box;
    display: flex;
    flex-wrap: nowrap;
    z-index: 9999;
    bottom: 0;
}

@media screen and (min-width: 1100px) {
    .cc-revoke,
    .cc-window {
        bottom: 1em;
    }
}

.cc-window.cc-floating {
    padding: 2em;
    max-width: 24em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
}

.cc-btn,
.cc-btn-essential,
.cc-link {
    cursor: pointer;
}
.cc-compliance-essential {
    margin-top: 10px !important;
}

.cc-link {
    color: white;
    opacity: 0.8;
    padding: 0.2em;
    text-decoration: underline;
}

.cc-link:hover {
    opacity: 1;
}

.cc-link:active,
.cc-link:visited {
    color: rgb(170, 204, 204);
}

.cc-btn {
    display: block;
    padding: 0.4em 0.8em;
    font-size: 0.9em;
    font-weight: 700;
    border-width: 2px;
    border-style: solid;
    text-align: center;
    white-space: nowrap;
    pointer-events: auto;
    color: rgb(255, 255, 255);
    background-color: rgb(247, 21, 89);
}

.TOCRT .cc-btn {
    background-color: var(--nr);
}
.TOCSW .cc-btn {
    background-color: #0d1c2b;
}
.TOCGW .cc-btn {
    background-color: var(--gwr-secondary);
    color: var(--gwr);
}
.TOCGC .cc-btn {
    background-color: var(--gc);
}

.cc-btn-essential {
    display: block;
    padding: 0.4em 0.8em;
    font-size: 0.9em;
    font-weight: 700;
    border-width: 2px;
    border-style: solid;
    text-align: center;
    white-space: nowrap;
    pointer-events: auto;
    color: rgb(255, 255, 255);
    background-color: #262261;
}

.cc-floating > .cc-link {
    margin-bottom: 1em;
}

.cc-floating .cc-message {
    display: block;
    margin-bottom: 1em;
}
.warning {
    color: red;
}
/*additional info for the station*/
.TOCNT .additional-station-info-div {
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
    background-color: rgba(38, 34, 98, 0.2);
}
.TOCGR .additional-station-info-div {
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
    background-color: rgba(206, 20, 45, 0.2);
}
.TOCRT .additional-station-info-div {
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
    background-color: rgba(240, 126, 38, 0.2);
}
.TOCGC .additional-station-info-div {
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
    background-color: rgba(239, 125, 22, 0.2);
}
.TOCSW .additional-station-info-div {
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
    background-color: rgba(0, 146, 204, 0.2);
}
.TOCGW .additional-station-info-div {
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
    background-color: rgba(10, 73, 61, 0.2);
}
.svg-additional-message-warning {
    height: 15px;
    margin-right: 8px;
}


/*rail whoosh media*/
.uk-map-station {
    fill: #144e63;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
}

.uk-map-station:hover {
    cursor: pointer;
}

.uk-map-mainland {
    fill: #ff751e;
}

.uk-map-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--template-padding) 0;
}

.uk-map-svg {
    height: 65vh;
}

.uk-map-dashboard-line {
    stroke: #144e63;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 3;
    fill: none;
}

.uk-map-dashboard-clouds {
    stroke: #144e63;
    stroke-miterlimit: 10;
    stroke-width: 3;
    fill: none;
}

.uk-map-dashboard-fill {
    fill: #ff751e;
}

.uk-map-station-active {
    fill: #3184AE;
}

.uk-map-input-container {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
    padding: var(--template-padding);
}

.uk-map-input-wrapper {
    width: 80%;
    position: relative;
    max-width: 500px;
}

.uk-map-input-wrapper:hover {
    cursor: pointer;
}

.uk-map-input:hover {
    cursor: pointer;
}

.uk-map-input {
    border-radius: 12px;
    background: #144e63;
    border: none;
    width: 100%;
    height: 3.8rem;
    font-size: 1.3rem;
    padding-left: 1rem;
    color: #FFF;
    font-weight: 700;
    display: flex;
    align-items: center;
}

.uk-map-input > /*multilingual*/
{
    font-size: 1.3rem;
}

.uk-map-input:focus {
    outline: none;
}

.uk-map-input::placeholder {
    color: #FFF;
}

.uk-map-button {
    padding: 0;
    margin: 0;
    background: none;
    width: 15%;
    border: none;
    visibility: hidden;
    opacity: 0;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
}

.uk-map-button-visible {
    visibility: visible;
    opacity: 1;
}

.uk-map-input-stations-list {
    display: none;
    width: 100%;
    position: absolute;
    top: calc(3rem * -4);
    background: #144e63;
    color: #FFF;
    /* padding-bottom: 0.8rem; */
    padding-top: 0.8rem;
    border-radius: 12px 12px 0 0;
}

.uk-map-input-stations-list div {
    display: flex;
    align-items: center;
    height: 3rem;
}

.uk-map-input-stations-list div:hover {
    cursor: pointer;
}

.uk-map-input-stations-list span {
    font-size: 1.3rem;
    font-weight: 700;
    padding-left: var(--template-padding);
    height: 3rem;
    pointer-events: none;
}

.display-list {
    display: block;
}

.uk-map-text {
    padding: var(--template-padding);
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 2;
}

.uk-map-dashboard-svg {
    max-width: 80px;
}

.uk-map-dashboard-svg:hover {
    cursor: pointer;
}

.cookie-approved {
    font-size: 2em;
    color: #333;
    padding: 10px;
    background-color: white;
    border: 3px solid red;
    text-align: center;
    position: absolute;
    cursor: grab;
    user-select: none;
    touch-action: none;
    z-index: 10000;
    border-radius: 15px;
    left: 0;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 100px;
    width: 150px;
}

.cookie-approved-class-choice{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-evenly;
    width: 100%;
    gap: 10px;
    padding-top: 5px;
}

.cookie-approved-container{
    display: flex;
    align-items: center;
    padding: 0;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: space-around;
    gap: 10px;
}

.cookie-approved-preview{
    height: 200px;
}

.cookie-approved h1 {
    font-size: 30px;
}

#cookie-approved-close{
    position: absolute;
    top: 5px;
    right: 10px;
    font-weight: bold;
    font-size: 25px;
}

#cookie-clear-container{
    position: absolute;
    background: white;
    height: 100%;
    border-radius: 15px;
    align-content: center;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

#cookie-clear-button-container{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
}

#cookie-clear-button-container div{
    border: 2px solid red;
    padding: 2px 15px;
    border-radius: 10px;
}

#cookie-clear-button-container div:last-of-type{
    background: red;
    color: white;
}


div.panelHalf {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* perspective: 500px; */
    /* max-width: 750px; */
    margin: auto;
    height:auto;
}
#panelPlan{
    border-bottom: none;
    padding-bottom: 0;
}

.planner-wrapper {
    position: relative;
    transform-style: preserve-3d;
    transition: all 0.3s ease;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    padding-bottom: 135px;
}

@keyframes plannerRotate {
    from {
        transform: translateZ(0px) rotate3d(0, 1, 0, 0deg);
    }
    50% {
        transform: translateZ(-250px) rotate3d(0, 1, 0, 45deg);
    }
    100% {
        transform: rotate3d(0, 1, 0, 90deg);
    }
}

.planner-wrapper-switch {
    /* transform: rotate3d(0, 1, 0, 90deg); */
    animation: plannerRotate 0.3s linear forwards;
}
.planner-form-intro,
.planner-form-intro-li{
    margin: var(--template-padding);
    line-height: 2;
    font-size: 1.3rem;
}

.planner-form {
    /* width: 80%; */
    position: relative;
}

.planner-form-wrapper form {
    width: 250px;
}

.planner-form > input {
    padding-left: 3rem;
}

.planner-form-wrapper {
    display: flex;
    justify-content: center;
    width: 100%;
    align-items: center;
    flex-direction: column;
    position: relative;
}

.planinputcolor {
    color: red;
    font-weight: bold;
}


#panelPlanOutput {
    height: 100%;
}
div.leg-slice {
    display: flex;
    align-items: center;
    flex-direction: column;
}
div.planner-convo {
    font-size: 1.3rem;
    line-height: 2;
    border-radius: 5px;
    /* background-color: #95ddfb; */
    padding-right: var(--template-padding);
    padding-top: var(--template-padding);
    padding-bottom: var(--template-padding);
    width: auto;
    margin: var(--template-padding);
    display: grid;
    grid-template-columns: auto;
    align-items: center;
    column-gap: 8px;
    margin-top: 5px;
    /* display:none; */
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}

div.planner-convo-txt, div.planner-convo-url {
    font-size: 1.3rem;
    line-height: 2;
    padding-left: var(--template-padding);
}

div.planner-convo-url {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--template-padding);
}

.planner-convo-url > h4 {
    text-align: center;
}

div.planner-convo-url h4 {
    line-height: 2;
    font-size: 1.3rem;
    font-weight: 500;
}

div.planner-convo-url h4 a {
    line-height: 2;
    font-size: 1.3rem;
    font-weight: 500;
    text-decoration: none;
    color: #000;
}
.planner_container {
    width: 100%;
    /* position: absolute; */
    position: relative;
    /* max-width: 750px; */
    margin: auto;

    /* transform: translateZ(-230px);
    transform: translateZ(0px); */
    transition: all 0.3s ease;
    background-color: #FFF;
    overflow-y: visible;
    /* height:var(--panel); */
}

.planner-container-hide {
    display: none;
}

.planner_container-switch {
    transform: translateZ(250px);
    /* transform: translateZ(-100px) translateX(50%) rotate3d(0, 1, 0, -90deg); */
}

.planner_modal_container {
    /* transform: translateX(50%) rotate3d(0, 1, 0, -90deg); */
    /* transform: translateZ(300px) translateX(50%) rotate3d(0, 1, 0, 90deg); */
    /* transform: translateZ(0) translateX(0%) rotate3d(0, 1, 0, 90deg); */
    transition: all 0.3s ease;
    background-color: #FFF;
    min-height: var(--panel);
    left: 100vw;
    position: absolute;
    top: 0;
    width: 100%;

}

.planner_modal_container-switch {
    transform: translateX(0%) rotate3d(0, 1, 0, -90deg);
}

.planner_modal_slide {
    left: 0;
}

svg.planner-info-symbol-parent {
    width: 50px;
    margin-top: 13px;
    display: none;
}

circle.planner-info-symbol-circle {
    fill: #95ddfb;
    pointer-events: none;
}

.planner-item {
    display: grid;
    grid-template-columns: 1fr 1fr 80px 80px;
    place-items: start;
    align-items: start;
    padding: 0 var(--template-padding);
    column-gap: 8px;
}

@media screen and (min-width: 767px) {
    .planner-item {
        grid-template-columns: 1fr 1fr 120px 120px;
    }
}

.planner-item div {
    font-size: 1.3rem;
    line-height: 2;
}

.planner-section {
    padding: var(--template-padding) 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* .planner-section:nth-of-type(odd) {
    background:#E5E5E5;
} */
div.planner-hide {
    display: none;
}

div.planner-inputs {
    display: flex;
    padding-left: calc(var(--template-padding) / 2);
    padding-right: var(--template-padding);
    align-items: center;
    border-bottom: 1px #c5c2c2 solid;
}

div.jp-grid-headings-wrapper {
    background: white;
    top: -1px;
    z-index: 5;
    position: sticky;
}

div.planner-inputs:hover {
    cursor: pointer;
}

div.planner-input-txt {
    font-size: 1.3rem;
    line-height: 2;
    margin-left: var(--template-padding);
}

.planner-input-svg {
    width: 38px;
}

div.planner-preview {
    display: grid;
    grid-template-columns: 1fr 1fr 80px 80px;
    place-items: start;
    align-items: start;
    padding: 0 var(--template-padding);
    column-gap: 8px;
    width: auto;
    margin: 0 var(--template-padding);
}

div.planner-item div {
    font-size: 1.3rem;
    line-height: 2;
    border-radius: unset;
    background-color: unset;
    padding: unset;
    width: unset;
    margin: unset;
}

div.planner-preview div:first-of-type {
    display: none;
}

.planner-item {
    background-color: none;
}

.planner-item div:first-of-type {
    display: none;
}

.planner-info-symbol {
    width: 30px;
}

.planner-journey-item {
    border-top: 3px transparent dotted;
    border-bottom: 3px transparent dotted;
    box-sizing: border-box;

}

.active-leg-slice {
    /* background-color:#95ddfb; */
    /* background-color:#FD7720; */
    /* padding-bottom: var(--template-padding); */
    padding-bottom: calc(var(--template-padding) * 2);
    border-bottom: 3px #c3bbbb dotted;
    border-top: 3px #c3bbbb dotted;
}
div.planner-journey-item div.leg-slice:first-of-type div.planner-section {
    display: flex !important;
}

div.show-preview-grid {
    display: grid;
    /* border-bottom: 2px #878484 dotted; */
}

div.planner-changes {
    place-self: start;
    padding: 0 var(--template-padding);
    font-size: 1.3rem;
    line-height: 2;
    background-color: #fa6f6f;
    /* background-color: #95ddfb; */
    border-radius: 3px;
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR div.planner-changes {
    box-shadow:none;
    -webkit-box-shadow:none;
}
div.planner-addons {
    display: flex;
    width: 100%;
    margin-top: var(--template-padding);
    padding: 0 var(--template-padding);
}

div.planner-details {
    font-size: 1.3rem;
    line-height: 2;
}

.planner-then {
    width: 70px;
    height: 70px;
    display: none;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    border-radius: 35px;
    background-color: #95ddfb;
    position: relative;
    margin-top: var(--template-padding);
    margin-bottom: var(--template-padding);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR .planner-then {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.planner-then div {
    font-size: 1.2rem;
    z-index: 3;
}

.planner-then:after {
    content: "";
    height: 140px;
    top: -30px;
    /* z-index: 2; */
    position: absolute;
    width: 10px;
    background-color: #95ddfb;
    display: none;
}

div.planner-details {
    margin-left: var(--template-padding);
}

div.show-preview {
    display: flex;
}

div.planner-headings {
    background-color: white;
    position: sticky;
    top: -1px;
    z-index: 4;
}

.planner-chevron {
    /* transform:rotate(-90deg); */
    transform-origin: center center;
    height: 30px;
    /* margin-left:var(--template-padding); */
    transition: all 0.3s ease;
    min-width: 30px;
}

.anim-chevron {
    transform: rotate(90deg);
}

div.planner-error-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    height: var(--panel);
    /*padding: 0 var(--template-padding);*/
}

div.planner-error-message {
    font-size: 1.3rem;
    line-height: 2;
    text-align: center;
}

svg.planner-reverse-fields-button,
.planner-form-location {
    width: 30px;
    cursor: pointer;

}

svg.planner-reverse-fields-button {
    margin: 37px 0;
    position: absolute;
    right: 5px;
    pointer-events: initial;
}
svg.planner-reverse-fields-button > * {
    pointer-events: none;
}
@media screen and (min-width: 400px) {
    svg.planner-reverse-fields-button {
        right: calc(50vw - 195px);
    }
}

@media screen and (min-width: 1100px) {
    svg.planner-reverse-fields-button {
        right: calc(50% - 195px);
    }
}


svg.planner-reverse-anim {
    animation: stagger 0.3s ease;
    transform-origin: center center;
}

div.planner-bubble {
    padding: var(--template-padding);
}
div.planner-item-bubble {
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    background-color: #95ddfb;
    border-radius: 3px;
    padding: var(--template-padding) calc(var(--template-padding));
}
.TOCGR div.planner-item-bubble {
    box-shadow:none;
    -webkit-box-shadow:none;
}

/* enhanced */

.journey-planner-preview-enhanced {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    column-gap: 8px;
    grid-template-rows:1fr min-content 1fr;
    row-gap: 13px;
    grid-template-areas: "info info departure arrival"
                "connections connections changes changes"
                "operator operator status status"
                "tickets tickets tickets tickets";
    border-bottom: 3px #c5c2c2 dashed;
    margin: 8px var(--template-padding);
    margin-bottom: 0;
    padding-bottom: 21px;
}

.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced {
    border-radius: 15px;
    padding: 10px;
    grid-template-areas: "departure arrow arrival tickets tickets link"
                        "changes changes changes status status link";
    row-gap: 0;
    column-gap: 4px;
    border: black 1px solid;
    grid-template-columns: 15% 15% 20% 15% 20% 15%;
    box-shadow: 0 0px 3px 0 rgba(0,0,0,0.3);
    border-radius: 3px;
    border: none;
    grid-template-rows: 1fr min-content;
}

div.jp-modal-item-container:last-of-type .planner-journey-item.journey-planner-preview-enhanced {
    border-bottom: none;
    padding: var(--template-padding) 0;
    padding-bottom: 21px;
}

.jp-grid-details {
    font-size: 1.3rem;
    line-height: 2;
}
.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-details {
    line-height: 1.5;
}
.jp-grid-info {
    grid-area: info;
    align-self: center;
    display: flex;
    /* justify-content: space-around; */
    align-items: center;
}

.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-info {
    justify-self: center;
    display: grid;
    grid-template-areas: "svg . . icon";
    width: 100%;
}

.jp-grid-info:hover {
    cursor: pointer;
}
.jp-info-icon{
    grid-area: icon;
    display: flex;
    align-items: center;
    justify-content: end;
}

.jp-info-icon > p,
.jp-info-text-multiple{
    pointer-events: none;
}

.jp-info-text-multiple{
    grid-area: svg;
}

.jp-info-text{
    display: flex;
    align-items: center;
    align-self: center;
    justify-self: start;
    border-radius: 3px;
    padding: 1px var(--template-padding);
    margin-top: calc(var(--template-padding) / 2);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    text-align: center;
    font-size: 1.3rem;
    pointer-events: none;
    grid-area: svg;
}
.TOCGR .jp-info-text {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .jp-grid-info {
    align-items: center;
    row-gap: 10px;
    column-gap: 4px;
    box-shadow: 0 0px 3px 0 rgba(0,0,0,0.3);
    border-radius: 3px;
    border: none;
    margin: 0 var(--template-padding);
    display: grid;
    grid-template-areas: "svg svg svg icon icon .";
    padding: 10px 10px;
    grid-template-columns: 15% 15% 20% 15% 20% 15%;
}

.jp-grid-info svg {
    margin-left: 8px;
}

.jp-grid-arrival {
    grid-area: arrival;
    place-self: center;
    justify-self: start;
}

.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-arrival,
.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-departure{
    font-size: 1.5rem;
    font-weight: bold;
}
.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced{
    cursor: pointer;
    grid-template-columns: 25% 10% 25% 10% 20% 10%;
}
/*.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput*/
/*.planner-wrapper .planner_container .jp-modal-item-container*/
/*.planner-journey-item .journey-planner-preview-enhanced .jp-grid-departure{*/
/*    justify-self: end;*/
/*}*/



.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-arrival{
    justify-self: start;
}

.journey-planner-container{
    max-width: 700px;
    margin: auto;
}

@media screen and (min-width: 425px) {
    .TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
    .planner-wrapper .planner_container .jp-modal-item-container
    .planner-journey-item .journey-planner-preview-enhanced .jp-grid-arrival,
    .TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
    .planner-wrapper .planner_container .jp-modal-item-container
    .planner-journey-item .journey-planner-preview-enhanced .jp-grid-departure{
        font-size: 2rem;
    }
}

.jp-grid-arrowDiv-arrow{
    font-size: 1.8rem;
    font-weight: bold;

}

.jp-grid-arrow{
    grid-area: arrow;
    place-self: center;
    justify-self: center;
    display:none;
}
.TOCGR .jp-grid-arrow {
    display:block;
}

.jp-grid-departure {
    grid-area: departure;
    place-self: center;
    justify-self: start;
}
.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-grid-headings .jp-grid-departure,
.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-grid-headings .jp-grid-arrival,
.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container .planner-journey-item
.journey-planner-preview-enhanced .jp-grid-connections,
.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container .planner-journey-item
.journey-planner-preview-enhanced .jp-grid-operator{
    display: none;
}

.jp-grid-connections {
    grid-area: connections;
    place-self: start;
    align-self: center;
    display: flex;
    align-items: center;
}

.jp-grid-changes {
    grid-area: changes;
    place-self: center;
    justify-self: start;
}

.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-changes {
    font-size: 1.4rem;
    color: dimgrey;
}

.jp-modal-content {
    display: none;
    /* max-width: 750px; */
    margin: auto;
    margin-bottom: 110px;
}

.jp-modal-preview {
    display: grid;
    grid-template-columns: 50% 1fr 1fr;
    grid-template-areas:"plat plat plat"
                        "dep time arrival"
                        "operator status .";
    grid-template-rows: min-content auto;
    row-gap: 8px;
    column-gap: 8px;
    padding: var(--template-padding);
}

@media screen and (max-width: 425px) {
    .jp-modal-preview {
        grid-template-areas:"plat plat plat"
                        "dep time arrival"
                        "operator status status";
    }

    .jp-grid-status,
    .jp-grid-tickets,
    .jp-modal-preview-status {
        width: 100%;
    }

    .TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
    .planner-wrapper .planner_container .jp-modal-item-container
    .planner-journey-item .journey-planner-preview-enhanced .jp-grid-status,
    .TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
    .planner-wrapper .planner_container .jp-modal-item-container
    .planner-journey-item .journey-planner-preview-enhanced .jp-grid-tickets {
        width: auto;
    }
}
.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-tickets {
    padding: 0;
    margin: 0;
    gap: 0;
    justify-self: end;
    align-items: center;
}
.jp-modal-preview-origin {
    grid-area: dep;
    place-self: start;
}

.jp-modal-preview-departure {
    grid-area: time;
    /*justify-self: center;*/
}

.jp-modal-preview-arrival {
    grid-area: arrival;
    /*justify-self: center;*/
}

.jp-modal-preview-platform {
    grid-area: plat;
    place-self: start;
}

.jp-modal-preview-operator, .jp-modal-preview-status {
    grid-area: operator;
    place-self: start;
    padding: 1px var(--template-padding);
    border-radius: 3px;
    /* background-color: #fe761e; */
    text-align: center;
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR .jp-modal-preview-operator, .TOCGR .jp-modal-preview-status {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.jp-modal-preview-operator {
    align-self: center;
    display: flex;
    align-items: center;
}

.jp-modal-preview-status {
    grid-area: status;
    justify-self: center;
    align-self: center;
    box-shadow: none;
    padding: 0;
    /*padding-left: 8px;*/
    padding-top: 8px;
}

.active-leg {
    display: block;
}

.journey-info-svg {
    height: 25px;
    /*margin-right: 8px;*/
    margin-left: 8px;
    pointer-events: none;
    filter: drop-shadow(1px 2px 1px rgb(0 0 0 / 0.2));
}
.journey-info-svg {
    filter:none;
}

.jp-grid-mode-icon {
    /*width: 25px;*/
    margin-left: 8px;
    border-bottom: 3px transparent solid;
    display: inline-flex;
    filter: drop-shadow(1px 1px 1px rgb(0 0 0 / 0.2));
}
.TOCGR .jp-grid-mode-icon {
    filter:none;
}

.planner-connections {
    display: flex;
    align-items: center;
    justify-content: Center;
    width: 100%;
    /* margin: 34px 0;
    margin-bottom: 8px; */
    height: 55px;

}

.planner-connections hr {
    /* margin: var(--template-padding); */
    width: 100%;
}

.planner-connections .jp-grid-mode-icon {
    filter: none;
}

.jp-mode-icon-enhanced {
    position: absolute;
    background: white;
}

div.jp-grid-mode-icon:first-of-type {
    margin-left: 0;
}

.jp-grid-headings {
    display: grid;
    /* max-width: 750px; */
    margin: auto;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    margin: 0 var(--template-padding);
    column-gap: 8px;
    grid-template-areas: "date date departure arrival";
    padding: 8px 0;
}

.jp-grid-station {
    grid-area: station;
    place-self: center;
    justify-self: start;
}

/*.jp-modal-item-container:last-of-type .planner-journey-item .journey-planner-preview-enhanced {*/
/*    border-bottom: none;*/
/*}*/

.jp-cancelled .jp-modal-preview-departure,
.jp-cancelled .jp-modal-preview-origin,
.jp-cancelled .jp-modal-preview-arrival {
    text-decoration: line-through;
    color: red;
}

.jp-grid-details.jp-grid-departure.jp-cancelled,
.jp-grid-details.jp-grid-arrival.jp-cancelled,
.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced
.jp-grid-details.jp-grid-changes.jp-cancelled{
    text-decoration: line-through;
    color: red;
}

.planner_modal_container .jp-grid-headings {
    grid-template-columns:50% 1fr 1fr;
    grid-template-areas: "station departure arrival";
}

/*.planner_modal_container .jp-grid-headings .jp-grid-departure,*/
/*.planner_modal_container .jp-grid-headings .jp-grid-arrival {*/
/*    justify-self: center;*/
/*}*/

.planner_container::-webkit-scrollbar,
.planner_modal_container::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.planner_container,
.planner_modal_container {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

@media screen and (min-width: 1100px) {
    .planner-wrapper {
        height: 100%;
    }

    .planner_container,
    .planner_modal_container {
        height: auto;
    }

    .active-leg {
        padding-bottom: 3px;
    }
}
.jp-mode-svg {
    /* width:100%; */
    height: 25px;
    pointer-events: none;
}
.jp-modal-content .jp-mode-svg {
    height:40px;
}
.planner-form-datetime {
    /* width: 80%; */
    border: none;
    height: 50px;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    padding: var(--template-padding);
    /* margin-top: calc(var(--template-padding) * 2); */
    border-radius: 5px;
    font-family: 'Nunito';
    width: 250px;
}
.jp-grid-date {
    grid-area: date;
    align-self: center;
    justify-self: start;
    padding: 1px 13px;
    border-radius: 5px;
    font-weight: 600;
    background-color: #000;
    color: #fff;
}

.jp-grid-operator, .jp-grid-status {
    grid-area: operator;
    align-self: center;
    justify-self: start;
    /* width:100%; */
    border-radius: 3px;
    padding: 1px var(--template-padding);
    margin-top: calc(var(--template-padding) / 2);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    text-align: center;
    font-size: 1.3rem;
}
.TOCGR .jp-grid-operator, .TOCGR .jp-grid-status {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.jp-grid-operator {
    display: flex;
    align-items: center;
}

.jp-grid-status {
    grid-area: status;
    box-shadow: none;
    padding: 8px 0;
}
.TOCGR .jp-grid-status {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.jp-grid-tickets{
    grid-area: tickets;
    display: none;
    flex-direction: row;
    justify-content: center;
}
.TOCGR .jp-grid-tickets {
    display:flex;
}

.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-status{
    justify-self: end;
    margin:0 2px 0 0;
    padding:0;
}

.jp-grid-tickets > .jp-time-override {
    display: grid;
    grid-template-areas: "text text svg .";
    grid-template-columns: 2fr 1fr 1fr 1fr;
    column-gap: 8px;
}

.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-tickets .jp-time-override {
    grid-template-areas: "text text text svg";
}
.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-status .jp-time-override{
    flex-direction: row-reverse;
}


.TOCGR .app .singlefullitem #panelPlan #panelPlanOutput
.planner-wrapper .planner_container .jp-modal-item-container
.planner-journey-item .journey-planner-preview-enhanced .jp-grid-status .jp-time-override .jp-time-svg{
    margin-left: 8px;
    pointer-events: none;
    filter: drop-shadow(1px 2px 1px rgb(0 0 0 / 0.2));
    filter:none;
    height: 20px;
}

.jp-grid-tickets > .jp-time-override
> .jp-grid-tickets-text {
    margin: 0;
}

.jp-grid-tickets-text{
    grid-area: text;
    font-size: 1.2em;
    font-weight: bold;
}
.TOCGR .jp-grid-tickets-text {
    opacity:0;
}

.jp-grid-tickets-svg{
    display: flex;
    grid-area: link;
    align-items: center;
    justify-content: center;
}

.jp-time-override {
    display: flex;
    align-items: center;
}

.jp-time-svg {
    height: 25px;
    filter: drop-shadow(1px 2px 1px rgb(0 0 0 / 0.2));
}
.TOCGR .jp-time-svg {
    filter:none;
}
.jp-time-override div {
    margin-left: 8px;
    font-size: 1.3rem;
    font-weight: 500;
}

.jp-icon-active {
    /* border-bottom:3px #fe761e solid; */
    position: relative;
}

.jp-icon-active:after {
    content: "";
    position: absolute;
    bottom: -7px;
    width: 3px;
    margin-left: calc(50% - 0.5px);
    height: 5px;
    left: 0;
    height: 4px;
    /* background-color: #fe761e; */
}

.jp-icon-active:after {
    bottom: 0;
    margin-left: calc(50% - 10px);
    width: 100%;
    background-repeat: no-repeat;
    opacity: 0.3;
    height: 20px;
    bottom: -20px;
    background-image: url("data:image/svg+xml,%3Csvg data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M80 31.37 54.16 57.85a4.42 4.42 0 0 1-6.37-.06L22.46 30.88s-7.25-3.79-14 2.87L45.5 74.62a7 7 0 0 0 10.32.11L94 34.48s-.14-3-14-3.11Z' style='fill:none%3Bstroke:%23000%3Bstroke-linecap:round%3Bstroke-linejoin:round%3Bstroke-width:5px'/%3E%3C/svg%3E");
}

.jp-bulletins-container {
    padding: 8px var(--template-padding);
    font-size: 1.1rem;
    line-height: 2;
    border-bottom: 1px #c5c2c2 solid;
}

.jp-bulletin-wrapper {
    display: grid;
    grid-template-columns: min-content auto;
    grid-column-gap: 13px;
    place-items: center;
    justify-items: start;
}

.jp-bulletins-item {
    font-size: 1.1rem;
    line-height: 2;
}

.jp-bulletins-item a {
    font-size: 1.1rem;
    line-height: 2;
    text-decoration: underline;
    color: #000;
}

.data-source-provider-text-jp {
    font-size: 14px;
    margin: 0;
    line-height: 1;
}
#planevents-interface {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 50px;
}
.TOCGR #planevents-interface {
    display:none;
}

@media only screen and (min-width: 1400px) {
    #planevents-interface {
        width: 100%;
    }
}

.events-header {
    border-bottom: 3px solid var(--colorTheme);
    margin: 15px;
}
.events-container,
.upcoming-events-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}
.plan-events-event_one-svg,
.plan-events-event_two-svg {
    display: grid;
    padding: 20px;
    grid-template-columns: 120px 40px 120px;
    grid-row-gap: 15px;
    grid-template-areas:
        "svg line info"
        "venue venue venue"
        "start middle end";
    justify-items: center;
}

.plan-events-event_two-svg {
    grid-template-areas:
   "home line away"
    "info info info"
    "venue venue venue"
    ". start ."
}
.plan-events-event_one-svg > *,
.plan-events-event_two-svg > *,
.upcoming-events-one > *,
.upcoming-events-two > * {
    pointer-events: none;
}

.plan-events-event_one-svg > svg,
.plan-events-event_two-svg > svg,
.upcoming-events-one > svg,
.upcoming-events-two > svg {
    grid-area: svg;
    max-width: 115px;
}

.plan-events-event_two-svg > svg,
.upcoming-events-two > svg {
    grid-area: auto;
    height: 110px;
}

.plan-events-start,
.upcoming-events-start {
    grid-area: start;
}

.plan-events-middle {
    grid-area: middle;
}

.upcoming-events-start {
    display: flex;
}

.upcoming-events-date {
    grid-area: date;
    display: flex;
}

.plan-events-end,
.upcoming-events-end {
    grid-area: end;
}

.plan-events-info {
    grid-area: info;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

.plan-events-border {
    grid-area: line;
    border-left: 3px solid var(--colorTheme);
}

.plan-events-venue {
    grid-area: venue;
    text-align: center;
}
.event-selected {
    padding: 17px;
    border: 3px solid var(--colorTheme);
    border-radius: 5px;
}
.jp-shuttle-bus-svg {
    width: 20px;
    margin-left: 8px;
}
@media screen and (min-width: 375px) {
    .planner-form-datetime,
    .planner-form-wrapper form {
        width: 300px;
    }
}/*@import "variables.css";*/

/**{*/
/*    box-sizing: border-box;*/
/*}*/
/*body {*/
/*    max-width: unset;*/
/*    justify-content: unset;*/
/*    height: 100%;*/
/*}*/

#panelPlan.accessibility_planner div.panelHalf {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 1rem;
    transition: all 1s ease;
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: scroll;
    z-index: 10;
    max-width: 1198px;
    margin: 0 auto;
}

#panelPlan.accessibility_planner div.panelHalf.planner-hide {
    display: none;
}

#panelPlan.accessibility_planner div#panelPlanInput{
    z-index: 0;
}

#panelPlan.accessibility_planner div.panelHalf::-webkit-scrollbar {
    display: none;
}

#panelPlan.accessibility_planner div.panelHalf {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

#panelPlan.accessibility_planner .header {
    background-color: var(--main-colour);
    width: 100%;
    height: 6rem;
    /*position: fixed;*/
    z-index: 2;
}

/*planner form input 1st page*/

#panelPlan.accessibility_planner .planner-form-intro {
    width: 300px;
    text-align: center;
    margin-top: 150px;
}


#panelPlan.accessibility_planner .exhaustive input {
    box-shadow: none;
    outline: 1px solid var(--main-colour);
    border-radius: 1.5rem;
    min-height: 4rem;
    height: auto;
    width: 100%;
    padding-left: 3rem;
    border: none;

    &:focus {
        outline: 2px solid var(--main-colour);

    }
}



#panelPlan.accessibility_planner .planner-form-wrapper {
    row-gap: 1rem;

    .searchType-container {
        padding: 15px;
    }
}

#panelPlan.accessibility_planner .planner-via-buttons {
    .exhaustive {
        margin: 0;
    }
}

#panelPlan.accessibility_planner .planner-form-datetime {
    border: none;
    min-height: 4rem;
    padding: var(--template-padding);
    border-radius: 1.5rem;
    outline: 1px solid var(--main-colour);
    width: 300px;
    box-shadow: none;

    &:focus {
        outline: 2px solid var(--main-colour);

    }
}

#panelPlan.accessibility_planner .jf-input-submit {
    border-radius: 1.5rem;
    outline: 1px solid var(--main-colour);
    background-color: var(--main-colour);
    height: 5rem;
    width: 40%;
    max-width: 300px;
    box-shadow: none;
}

#panelPlan.accessibility_planner div.planner-inputs {
    width: 100%;
    border: none;
    background-color: var(--main-colour);
    height: 8rem;
    color: white;
    position: absolute;
    z-index: 1;
}


#panelPlan.accessibility_planner input.radio-selection[type="radio"] {
    outline: 1px solid var(--main-colour);
    border: none;
}

#panelPlan.accessibility_planner input.radio-selection[type="radio"]:checked::before {
    transform: scale(1);
    box-shadow: inset 1em 1em var(--main-colour);
}

#panelPlan.accessibility_planner .buttonforlocation {
    /*left: 0;*/
    /*top: 50%;*/
    /*transform: translateY(-50%);*/
    padding: 6px;
    min-height: 4rem;
}

#panelPlan.accessibility_planner .geo-marker {
    fill: var(--main-colour);
}

#panelPlan.accessibility_planner .exhaustive-active-rt {
    border: 0 solid var(--main-colour);
    border-left-width: 2px;
    border-right-width: 2px;
}

/*body {*/
/*    font-family: Arial, sans-serif;*/
/*    display: flex;*/
/*    margin: 0;*/
/*    background-color: #f0f0f0;*/
/*}*/

#panelPlan.accessibility_planner #preferences-area {
    border: 2px solid #000000;
    border-radius: 5px;
    padding: 20px;
    /*margin-top: 80px;*/
    margin: auto;
    max-width: 800px;
    width: inherit;
    margin-block: .75em 3.5em;
}
#panelPlan.accessibility_planner #planner-preferences {
    background: #fff;
}
#panelPlan.accessibility_planner #preferences-area legend {
    font-weight: bold;
    font-size: 1.2em;
    color: black;
    padding: 0 10px;
}

#panelPlan.accessibility_planner .preferences-main {
    text-align: center;
    margin-top: 96px;
    overflow-y: scroll;
    overflow-x: hidden;
    width: 100%;
}

#panelPlan.accessibility_planner .passenger-assist-container {
    display: flex;
    flex-direction: column;
    row-gap: 10px;
    width: 93%;
    border: 5px solid #3bcdc0;
    margin: 5px auto;
    border-radius: 5px;
    padding: 10px;
    justify-content: center;
    align-items: center;
}

#panelPlan.accessibility_planner .leg-wrapper .jp-passenger-assist-badge {
    margin: 0 0 10px 0;
    border-radius: 10px;
    padding: 5px 10px 0;
    border: 2px solid #3bcdc0;
    width: 120px;
}

#panelPlan.accessibility_planner .jp-modal-content > .passenger-assist-container {
    margin: 5px auto 25px;
    padding: 10px;
}

#panelPlan.accessibility_planner .passenger-assist-container .passenger-assist-wrapper {
    display: flex;
    flex-direction: column;
    row-gap: 10px;
}

#panelPlan.accessibility_planner .passenger-assist-container p {
    text-align: justify;
}

#panelPlan.accessibility_planner .passenger-assist-container p > a {
    color: unset;
    font-weight: 700;
    text-decoration: underline;
}

#panelPlan.accessibility_planner .passenger-assist-container p > span {
    font-weight: 700;
    font-size: 14px;
}

#panelPlan.accessibility_planner .passenger-assist-container svg {
    height: 50px;
    width: auto;
    margin: 0 auto;
}

@media (min-width: 1024px) {
    /*.preferences-main {*/
    /*    padding-top: 15rem;*/
    /*}*/

    /*test properly before deleting, some bulletins could be hidden under the header */
    #panelPlan.accessibility_planner .jp-modal-content > .jp-grid-headings-wrapper + * {
        /*margin-block-start: 3rem !important;*/
    }
    #panelPlan.accessibility_planner .jp-modal-content > * {
        width: 100%;
    }
    #panelPlan.accessibility_planner .jp-modal-content> * :first-of-type {
    }
    #panelPlan.accessibility_planner .jp-time-override {
        justify-content: end;
        align-items: end;
    }

    #panelPlan.accessibility_planner .jp-modal-content >.leg-wrapper {
        /*width: unset;*/
        padding: 0;
    }


}
#panelPlan.accessibility_planner .preferences-main::-webkit-scrollbar {
    display: none;
}

#panelPlan.accessibility_planner .preferences-main {
    -ms-overflow-style: none;
    scrollbar-width: none;
}


#panelPlan.accessibility_planner .preferences-title h1 {
    margin: 0;
}

#panelPlan.accessibility_planner .journey-cancelled-time {
    color: #EA4D3D;
    text-decoration: line-through;
}
#panelPlan.accessibility_planner .final-destination {
    margin-bottom: 10px;
    font-weight: inherit;
    background-color: rgba(217,217,217, 0.24);
    padding: 10px;
    border-radius: 5px;
    width: fit-content;
}
#panelPlan.accessibility_planner .final-destination-strong {
    font-weight: 700;
    font-size: inherit;
}
#panelPlan.accessibility_planner .preferences-description {
    margin: 0 0 20px 0;
}
#panelPlan.accessibility_planner label > span {
    position: absolute;
    left: 0;
    padding: 1em .5em;
    text-transform: uppercase;
    color: white;
}
#panelPlan.accessibility_planner .preferences-toggle-container {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr;
}
#panelPlan.accessibility_planner .preferences-toggle-container .preferences-area {
    margin-block: 2.5em;
    position: relative;
    & > .preferences-title {
        width: 100%;
        display: grid;
        grid-template-columns: 40px max-content auto;
        align-items: center;
        position: absolute;
        top: -1.75em;
        padding-inline-start: 9px;
        & > * {
            background: white;
        }
        & > p {
            padding-inline: 1em;
        }
        & > .preferences-toggle-help {
            justify-self: end;
            padding-inline: 0.75em 1.5em;
            margin-inline: 1em 2em;
        }
    }
}
#panelPlan.accessibility_planner .preferences-interchange-wrapper {
    display: grid;
    grid-template-columns: 1fr 90px;
    margin: 2em 1em;
    justify-items: start;
    gap: 1em;
    align-items: center;
}
#panelPlan.accessibility_planner div[role="heading"] > .preferences-toggle-help {
    position: unset;
}
#panelPlan.accessibility_planner div[role="heading"] > .preferences-toggle-help > .tooltip {
    left: 100px;
}
#panelPlan.accessibility_planner .preferences-interchange-wrapper > p {
    margin-inline-start: 2em;
    text-align: end;
    justify-self: end;
}
#panelPlan.accessibility_planner .preferences-interchange-wrapper > p + div {
    display: flex;
}
#panelPlan.accessibility_planner .preferences-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: inherit;
    padding: 10px 20px;
    background-color: #fff;
    border-radius: 10px;
    /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); */
    box-sizing: border-box;
}

#panelPlan.accessibility_planner .preferences-option svg,
#panelPlan.accessibility_planner .preferences-title svg {
    width: 35px;
    height: auto;
    margin-right: 1.75em;
}


#panelPlan.accessibility_planner .preferences-option span {
    text-align: left;
}

#panelPlan.accessibility_planner .icon-and-text {
    display: flex;
    justify-content: center;
    align-items: center;
    p {
        text-align: left;
    }
}

#panelPlan.accessibility_planner input[type="checkbox"] {
    width: 0;
    height: 0;
    visibility: hidden;
}

#panelPlan.accessibility_planner #planner-preferences label {
    display: block;
    width: 70px;
    height: 40px;
    background-color: #FFF;
    border-radius: 50px;
    position: relative;
    cursor: pointer;
    transition: 0.5s;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

#panelPlan.accessibility_planner #planner-preferences label::after {
    content: "";
    width: 30px;
    height: 30px;
    background-color: #00586F;
    position: absolute;
    border-radius: 50%;
    top: 5px;
    left: 3px;
    transition: 0.5s;
}

#panelPlan.accessibility_planner #planner-preferences input:checked + label {
    background-color: #00586F;
}

#panelPlan.accessibility_planner #planner-preferences input:checked + label::after {
    left: calc(100% - 3px);
    transform: translateX(-100%);
    background-color: #FFF;
}

#panelPlan.accessibility_planner .preferences-helpIcon {
    width: 20px !important;
    margin: 0 -10px 0 0 !important;;
}

#panelPlan.accessibility_planner .preferences-buttons {
    padding: 10px 20px;
    background-color: #00586F;
    color: #FFFFFF;
    font-weight: bold;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    margin-top: 20px;
    border: none;
}

#panelPlan.accessibility_planner .preferences-buttons:disabled {
    pointer-events: none;
}

#panelPlan.accessibility_planner .preferences-buttons:hover {
    color: #000000;
    background-color: #FFFFFF;
    box-shadow: rgba(0, 0, 0, 0.25) 0 8px 15px;
    transform: translateY(-2px);
    cursor: pointer;
}

#panelPlan.accessibility_planner .preferences-buttons:active {
    box-shadow: none;
    transform: translateY(0);
}

#panelPlan.accessibility_planner .preferences-save-clear {
    display: flex;
    justify-content: center;
    gap: 30px;
}

#panelPlan.accessibility_planner .preferences-svg-direct {
    transform: rotate(180deg);
}

#panelPlan.accessibility_planner .preferences-toggle-help {
    display: flex;
    gap: 10px;
}

@media (max-width: 867px) {
    #panelPlan.accessibility_planner #preferences-area {
        width: 95%;
    }

    #panelPlan.accessibility_planner .preferences-toggle-container {
        justify-content: center;
    }

    #panelPlan.accessibility_planner .preferences-option {
        width: 100%;
    }

    #panelPlan.accessibility_planner .preferences-option label {
        width: 50px;
        height: 25px;
    }

    #panelPlan.accessibility_planner .preferences-option label::after {
        width: 20px;
        height: 20px;
        top: 2.5px;
        left: 2.5px;
    }

    #panelPlan.accessibility_planner .preferences-option input:checked + label::after {
        left: calc(100% - 2.5px);
        transform: translateX(-100%);
    }

    #panelPlan.accessibility_planner .preferences-title h1 {
        font-size: 1.5em;
    }
}

@media (max-width: 424px) {
    #panelPlan.accessibility_planner .icon-and-text {
        font-size: 80%;
    }

    #panelPlan.accessibility_planner .preferences-description {
        font-size: 15px;
    }

    /*.preferences-main {*/
    /*    margin-top: 50px;*/
    /*}*/
}

#panelPlan.accessibility_planner #planner-output-content {
    height: 100%;
    width: 100%;
    /*margin-top: 125px;*/
    margin-top: 96px;
    /*padding-bottom: 100px;*/
    overflow-y: auto;
}


#panelPlan.accessibility_planner .preferences-toggle-help {
    position: relative;
}

#panelPlan.accessibility_planner .tooltip {
    visibility: hidden;
    width: 200px;
    background-color: #333;
    color: #fff;
    text-align: center;
    padding: 5px;
    border-radius: 5px;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s, visibility 0.3s;
}

#panelPlan.accessibility_planner .tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #333 transparent transparent transparent;
}

#panelPlan.accessibility_planner .preferences-helpIcon:hover + .tooltip,
#panelPlan.accessibility_planner .preferences-helpIcon:focus + .tooltip {
    visibility: visible;
    opacity: 1;
}

#panelPlan.accessibility_planner .planner_container {
    background-color: unset;
}

#panelPlan.accessibility_planner .planner-chevron {
    height: 40px;
    min-width: 40px;
}

#panelPlan.accessibility_planner .planner-chevron > path {
    fill: white;
    stroke: white;
}

#panelPlan.accessibility_planner div.planner-input-txt {
    line-height: 1.5;

    p:first-of-type {
        font-size: 1.4rem;
    }

    p:nth-child(2) {
        font-size: 1.4rem;
        text-decoration: underline;
    }
}

#panelPlan.accessibility_planner #planner-output {
    overflow: unset;
}

#panelPlan.accessibility_planner .planner-wrapper::-webkit-scrollbar {
    display: none;
}


#panelPlan.accessibility_planner .planner-wrapper {
    transform-style: unset;
    /*padding-bottom: 175px;*/
    /*overflow: auto;*/
    -ms-overflow-style: none;
    scrollbar-width: none;

    height: unset;
    padding-bottom: 3rem !important;

    .jp-bulletins-item {
        text-align: justify;
    }
}

#panelPlan.accessibility_planner .data-source-provider-wrapper{
    margin-bottom: 60px;
}

#panelPlan.accessibility_planner .planner_modal_container {
    position: fixed;
    overflow: scroll;
    height: 100%;
    width: 100%;
    transform: translate(100%, 0px);
    transition: all 1s ease;
    left: unset;
    z-index: 20;
}
#panelPlan.accessibility_planner .planner-wrapper:has(.planner_modal_slide) > .planner_container {
    z-index: 0;
}

#panelPlan.accessibility_planner .planner_modal_slide {
    left: unset;
    transform: translate(0px, 0px);
    /*z-index: 20;*/
    transition: all 1s ease;
}

#panelPlan.accessibility_planner .active-class {
    display: block;
}
#panelPlan.accessibility_planner .jp-modal-content.active-class {
    display: grid;
}
#panelPlan.accessibility_planner .jp-modal-content > * {
    justify-self: center;
    width: 90%;
    max-width: 960px;
}
#panelPlan.accessibility_planner .jp-modal-content.active-class >*:first-of-type {
    max-width: none;
    width: 100%;
}
/*.journey-planner-preview-enhanced-two {*/
/*    display: grid;*/
/*    grid-auto-rows: 1fr 1fr 2fr 2fr 2fr 2fr;*/
/*    grid-template-columns: 1fr 1fr 1fr;*/
/*    grid-template-rows: 1fr min-content 1fr;*/
/*    grid-template-areas:*/
/*        "departure timeTaken arrival"*/
/*        "origin connections destination"*/
/*        "direct changes status"*/
/*        "quickest bulletin status"*/
/*        "stepfree bulletin info";*/
/*    border: none;*/
/*    border-radius: 1.5rem;*/
/*    filter: drop-shadow(1px 1px 2px gray);*/
/*    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);*/
/*    background-color: white;*/
/*    padding: 15px;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    gap: 5px;*/
/*    width: 93%;*/
/*    margin: 8px var(--template-padding);*/
/*    margin-bottom: 0;*/
/*}*/

#panelPlan.accessibility_planner #planner-output-content {
    .jp-icon-active::after {
        bottom: 0;
        background-image: unset;
    }
}

#panelPlan.accessibility_planner .earlier-later-placeholder,
#panelPlan.accessibility_planner .earlier-later-container {
    display: flex;
    flex-direction: column;
    width: 93%;
    align-items: center;
    margin: 15px auto 5px;
    /*gap: 5px;*/
    cursor: pointer;
    height: 4em;
    
    .earlier-later-arrow {
        width: 20px;
        height: 20px;
        border-left: 5px solid black;
        border-top: 5px solid black;
        /*border-width: 0 5px 5px 0;*/
        display: inline-block;
        padding: 3px;

        &.earlier {
            transform: rotate(45deg);

        }

        &.later{
            transform: rotate(225deg);

        }
    }

    .earlier-later {
        display: flex;
        flex-direction: row;
        justify-content: space-evenly;
        align-items: center;
        width: 100%;

        .earlier-later-stripe {
            width: 25%;
            border: .5px solid black;
        }
    }
}
#panelPlan.accessibility_planner .earlier-later-placeholder {
    cursor: unset;
    transition: all 750ms linear;
}
#panelPlan.accessibility_planner .journey-planner-preview-enhanced-two {
    padding: 5px;
    background-color: var(--main-colour);
    border-radius: 5px;
    filter: drop-shadow(1px 1px 2px gray);
    width: 93%;
    margin: 8px var(--template-padding);
    display: flex;
    gap: 5px;
    flex-direction: column;
    cursor: pointer;

    &.cancelled {
        background-color: #EA4D3D;

        .route-card {
            grid-template-rows: repeat(4, auto);
            grid-template-areas:
        "departure-station departure-time"
        "connections-grid results-arrow"
        "arrival-station arrival-time"
        "cancellation-msg results-status";

        /*    grid-template-areas:*/
        /*"departure-station departure-time"*/
        /*"connections-grid results-arrow"*/
        /*"arrival-station arrival-time"*/
        /*"duration results-status"*/
        /*"badges badges"*/
        /*"cancellation-msg cancellation-msg";*/

            padding: 10px 15px;
        }

        & .results-status > p {
            color: #EA4D3D;
        }

        & .time-wrapper > p {
            text-decoration: line-through;
            color: #EA4D3D;
        }

    }

    .results-status-desktop {
        display: none;
    }

}

#panelPlan.accessibility_planner .route-card {
    display: grid;
    grid-template-rows: repeat(6, auto);
    /*grid-template-columns: 2fr 2fr;*/
    grid-template-columns: 2fr 1fr;
    /*grid-template-rows: 1fr min-content 1fr;*/
    grid-template-areas:
        "departure-station departure-time"
        "connections-grid results-arrow"
        "arrival-station arrival-time"
        "duration results-status"
        "badges badges"
        "cancellation-msg cancellation-msg";

    border: none;
    border-radius: 5px;
    /*box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);*/
    background-color: white;
    padding: 15px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    /*width: 93%;*/
    /*margin: 8px var(--template-padding);*/
    margin-bottom: 0;

    .cancellation-msg {
        grid-area: cancellation-msg;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 5px;
    }



}

#panelPlan.accessibility_planner .results-departure-station {
    grid-area: departure-station;
    font-weight: 400;
    font-size: 1.4rem;
}

#panelPlan.accessibility_planner .results-connections {
    grid-area: connections-grid;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 5px;
    max-width: 100%;
    /*flex-wrap: wrap;*/

    .connection-inner {
        flex-basis: fit-content;
        display: flex;
        flex-shrink: 0;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }

    .btn-stripe{
        flex-grow: 1;
        flex-shrink: 10;
        border: .5px solid var(--main-colour);
    }
}

#panelPlan.accessibility_planner .results-arrival-station {
    grid-area: arrival-station;
    font-weight: 400;
    font-size: 1.4rem;
}

#panelPlan.accessibility_planner .time-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    & p {
        font-size: 1.4rem;
    }

    .delayed-time {
        text-decoration: line-through;
        color: red;
    }
}
#panelPlan.accessibility_planner .results-departure-time {
    grid-area: departure-time;
    text-align: center;
}

#panelPlan.accessibility_planner .results-duration {
    grid-area: duration;
    font-weight: 700;
    font-size: 1.2rem;
    align-self: end;
}

#panelPlan.accessibility_planner .results-arrow{
    grid-area: results-arrow;
    text-align: center;

    & svg {
        height: 25px;

    }
}

#panelPlan.accessibility_planner .results-arrival-time {
    grid-area: arrival-time;
    text-align: center;
}

#panelPlan.accessibility_planner .results-status {
    grid-area: results-status;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /*grid-column-start: 2;*/

    & > p {
        text-align: center;
    }
}

#panelPlan.accessibility_planner .operator-container {
    background-color: rgba(217, 217, 217, 0.24);
    padding: 10px;
    width: fit-content;
    border-radius: 5px;
}

/*.journey-details {*/
/*    grid-area: journey-details;*/
/*    display: grid;*/
/*    grid-template-rows: 1fr;*/
/*    grid-template-columns: repeat(2, 1fr);*/

/*}*/
#panelPlan.accessibility_planner .results-badges {
    grid-area: badges;
    text-align: center;
    display: grid;
    grid-template-rows: minmax(auto, 1fr);
    /*grid-template-columns: repeat(auto-fit, minmax(0, 1fr));*/
    grid-template-columns: repeat(2, 1fr);
    gap: 5px;
    padding-top: 10px;

    .badge {

        &:not(.quickest) {
            display: none;
        }

        &.active-badge {
            display: grid;
            justify-items: center;
            grid-template-rows: 1fr;
            grid-template-columns: 2fr 1fr;
            align-items: center;
            gap: 5px;
            padding: 5px;
            border-radius: 5px;
            outline: 2px solid var(--main-colour);
            font-size: 1.2rem;
            font-weight: 700;

            &.quickest > div,
            &.step-free-to-train > div,
            &.direct-train > div {
                background-color: #000000;
            }

            & > div {
                border-radius: 50%;
                margin: 0 5px;

                display: flex;
                justify-content: center;
                align-items: center;
                & > svg {
                    width: 20px;
                    height: 20px;
                }
            }
        }
    }

}

#panelPlan.accessibility_planner .results-badges .badge.active-badge.passenger-assist-badge {
    grid-template-columns: 1fr;
}
#panelPlan.accessibility_planner .toilet-icon-result {
    background:none;
}

#panelPlan.accessibility_planner .results-button {
    /*grid-area: results-button;*/
    text-align: center;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;

     & >p {
         color: white;
         width: 100%;
         font-size: 1.4rem;
     }
}

#panelPlan.accessibility_planner .btn-stripe {
    border: .5px solid white;
    width: 80%;
}

#panelPlan.accessibility_planner .accessible-container {
    display: grid;
    /*grid-template-columns: repeat(3, calc(10% - 2.5px)) repeat(2, calc(35% - 2.5px));*/
    grid-template-columns: repeat(3, calc(7.5% - 2.5px)) repeat(2, calc(35% - 2.5px));
    grid-template-rows: 1fr;
    grid-column-gap: 5px;
    grid-row-gap: 0;
    align-items: center;
    justify-items: center;
    background-color: #FFDD00;
    padding: 5px;
    border-radius: 5px;
}

#panelPlan.accessibility_planner .accessible-text {
    /*grid-area: 1 / 2 / 3 / 6;*/
    grid-area: 1 / 3 / 3 / 6;
    text-align: center;
}
#panelPlan.accessibility_planner .accessible-svg-alert {
    grid-area: 1 / 2 / 3 / 3;
}


@media (max-width: 745px) {
    #panelPlan.accessibility_planner .accessible-container{
        grid-template-columns: 0.5fr repeat(2, 1fr);
    }
    #panelPlan.accessibility_planner .accessible-text {
        grid-area: 1 / 2 / 2 / 4;
    }
    #panelPlan.accessibility_planner .accessible-svg-alert {
        grid-area: 1 / 1 / 2 / 2;
    }
}

/*London underground line colours*/

#panelPlan.accessibility_planner .bakerloo {
    /*background-color: #A65A2A;*/
    background-color: #b26313;
}

#panelPlan.accessibility_planner .central {
    background-color: #dc241f;
}

#panelPlan.accessibility_planner .circle {
    background-color: #ffd329;
}

#panelPlan.accessibility_planner .district {
    background-color: #007d32;
}

#panelPlan.accessibility_planner .hammersmithandcity {
    background-color: #f4a9be;
}

#panelPlan.accessibility_planner .jubilee {
    background-color: #a1a5a7;
}

#panelPlan.accessibility_planner .metropolitan {
    background-color: #9b0058;
}

#panelPlan.accessibility_planner .northern {
    background-color: #000;
}

#panelPlan.accessibility_planner .piccadilly {
    background-color: #0019a8;
}

#panelPlan.accessibility_planner .victoria {
    background-color: #0098d8;
}

#panelPlan.accessibility_planner .waterlooandcity {
    background-color: #93ceba;
}

#panelPlan.accessibility_planner .dlr {
    background-color: #00afad;
}

#panelPlan.accessibility_planner .overground {
    background-color: #ef7b10;
}

#panelPlan.accessibility_planner .tflrail {
    background-color: #0019a8;
}

#panelPlan.accessibility_planner .londontrams {
    background-color: #00bd19;
}

#panelPlan.accessibility_planner .elizabeth {
    background-color: #6950a1;
}

#panelPlan.accessibility_planner .default-underground {
    background-color: #3b3b3b;
}

/*West Midlands Railway*/
#panelPlan.accessibility_planner .lmwm {
    background-color: #f58220;
}

/*London Northwestern Railway*/
#panelPlan.accessibility_planner .lmln {
    background-color: #007a3a;
}

#panelPlan.accessibility_planner .dlr {
    background-color: #00afad;
}

/*liberty overground*/
#panelPlan.accessibility_planner .looy {
    background-color: #61686b;
}

/*weaver overground*/
#panelPlan.accessibility_planner .loow {
    background-color: #9b0058;
}

/*mildmay overground*/
#panelPlan.accessibility_planner .loom {
    background-color: #006fe6;
}

/*lioness overground*/
#panelPlan.accessibility_planner .lool {
    background-color: #ffa600;
}

/*suffragette overground*/

#panelPlan.accessibility_planner .loos {
    background-color: #18a95d;
}

/*windrush overground*/
#panelPlan.accessibility_planner .looh {
    background-color: #dc241f;
}
@media (min-width: 600px){
    #panelPlan.accessibility_planner .route-card {
        .results-badges {
            .badge {
                &.active-badge {
                    display: flex;
                    justify-content: space-between;
                }

                &.passenger-assist-badge {
                    max-height: 60px;
                    justify-content: center;
                }
                &.passenger-assist-badge > svg {
                    height: 100%;
                }

            }
        }
}}

@media (min-width: 992px) {

    #panelPlan.accessibility_planner .earlier-later-container {
        .earlier-later {
            justify-content: center;
            gap: 30px;
        }
    }


    #panelPlan.accessibility_planner .journey-planner-preview-enhanced-two {
        display: grid;
        align-items: center;
        /*flex-direction: row;*/
        grid-template-columns: 1fr minmax(100px, min-content) 100px;
        /*grid-template-areas: "route-card results-status-desktop button";*/
        grid-template-rows: 1fr;
        gap: 5px;
        padding: 0 5px 5px 5px;

        .accessible-container {
            grid-area: 1 / 1 / 2 / 4;
            margin: 5px 2px 0 2px;
        }

        .results-button {
            grid-area: 2 / 3 / 3 / 4;
        }


        .results-status-desktop {
            height: 100%;
            /*border: 2px solid white;*/
            border-radius: 5px;
            grid-area: 2 / 2 / 3 / 3;
            /*grid-area: results-status-desktop;*/
            display: flex;
            flex-direction: column;
            justify-content: space-evenly;
            align-items: center;
            /*grid-column-start: 2;*/
            gap: 10px;
            padding: 15px 0;


            & > p {
                text-align: center;
                color: white;
                font-size: 1.4rem;
            }

            & .delayed-icon-inner {
                fill: white;
            }
        }

        &.cancelled {
            .results-button {
                grid-area: 2 / 2 / 3 / 4;
            }
            /*grid-template-areas: "route-card button";*/
            /*grid-template-columns: 1fr 205px;*/

            .route-card{
                height: 100%;
                grid-area: 2 / 1 / 3 / 2;
                grid-template-columns: 2fr 2fr 2fr 1fr auto;
                grid-template-rows: 1fr 1fr auto;
                grid-template-areas:
                "departure-station connections-grid arrival-station results-status badges"
                "departure-time duration arrival-time results-status badges"
                "cancellation-msg cancellation-msg cancellation-msg results-status badges";
            }

            .cancellation-msg {
                /*grid-area: cancellation-msg;*/
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                gap: 10px;

                .jp-time-svg {
                    height: 20px;
                }
            }

            .status-cancel-icon {
                height: 45px;
            }

            .results-status-desktop {
               display: none;
            }

            .results-status {
                display: flex;
            }


        }
    }


    #panelPlan.accessibility_planner .route-card {
        height: 100%;
        grid-area: 2 / 1 / 3 / 2;
        grid-template-columns: 2fr 2fr 2fr auto auto;
        grid-template-rows: 1fr 1fr auto;
        grid-template-areas:
        "departure-station connections-grid arrival-station results-status badges"
        "departure-time duration arrival-time results-status badges"
        "cancellation-msg cancellation-msg cancellation-msg results-status badges";

        .cancellation-msg {
            grid-area: cancellation-msg;
        }

        & > p {
            text-align: center;
        }

        .jp-time-svg {
            height: 45px;
        }

        &.delayed {
            .time-wrapper {
                flex-direction: row;
                gap: 5px;
            }
        }
    }

    #panelPlan.accessibility_planner .results-duration {
        align-self: center;
    }

    #panelPlan.accessibility_planner .results-status {
        display: none;
    }

    #panelPlan.accessibility_planner .results-arrow {
        display: none;
    }

    #panelPlan.accessibility_planner .results-badges {
        min-width: 90px;
        grid-template-rows: auto;
        /*grid-template-columns: repeat(auto-fit, minmax(0, 1fr));*/
        grid-template-columns: 1fr;
        gap: 10px;
    }

    #panelPlan.accessibility_planner .results-button {
        grid-area: button;

        flex-direction: column;
        gap: 10px;
        padding: 15px 0;
        height: 100%;
        border: 2px solid white;
        border-radius: 5px;
        justify-content: space-evenly;
        .btn-stripe {
            display: none;
        }

    }

    #panelPlan.accessibility_planner .arrow-right {
        width: 25px;
        height: 25px;
        border-left: 5px solid white;
        border-top: 5px solid white;
        /*border-width: 0 5px 5px 0;*/
        display: inline-block;
        padding: 3px;
        transform: rotate(135deg);
    }

}

#panelPlan.accessibility_planner .jp-grid-connections {
    place-self: center;
    flex-wrap: wrap;
}

#panelPlan.accessibility_planner .jp-grid-origin {
text-align: center;
    font-size: 16px!important;
}

#panelPlan.accessibility_planner .jp-grid-destination {
    text-align: center;
    font-size: 16px!important;

}

#panelPlan.accessibility_planner .jp-grid-changes {
    place-self: center;
    text-decoration: none;
    font-size: 12px!important;
    align-self: baseline;
}

#panelPlan.accessibility_planner .results-bullet {
    color: var(--main-colour);
    margin: 0 3px;
}

#panelPlan.accessibility_planner .jp-grid-operator {
    display: none;
}

#panelPlan.accessibility_planner .jp-grid-direct {
    grid-area: direct;
    background-color: var(--main-colour);
    border-radius: 1rem;
    color: #FFFFFF;
    justify-content: center;
    width: 11rem;
    min-width: auto;
    place-self: center;

    p {
        font-size: 18px;
        font-weight: unset;
    }

    svg {
        height: 28px;
        margin-left: 5px;
        align-self: center;
    }
}

#panelPlan.accessibility_planner .jp-grid-stepfree {
    grid-area: stepfree;
    background-color: var(--main-colour);
    border-radius: 1rem;
    color: #FFFFFF;
    justify-content: center;
    width:11rem;
    min-width: auto;
    place-self: center;

    p {
        font-size: 18px;
        font-weight: unset;
    }

    svg {
        height: 36px;
        align-self: center;
    }
}

/*.jp-grid-timeTaken {*/
/*    grid-area: timeTaken;*/
/*}*/


#panelPlan.accessibility_planner .jp-grid-bulletinNotification {
    grid-area: bulletin;
    display: flex;
    flex-direction: row;
    align-self: end;

    svg {
        margin-right: 8px;
    }
}


#panelPlan.accessibility_planner .via-btn {
    background-color: #f0f0f0;
    color: var(--main-colour);
    border: none;
    font-weight: 700;
    font-size: 1.3rem;
    /*text-decoration: underline;*/
    border-bottom: 1px solid var(--main-colour);


}

#panelPlan.accessibility_planner .jp-grid-info {
    background-color: var(--main-colour);
    border-radius: 1rem;
    color: #FFFFFF;
    justify-content: center;
    width: 9rem;
    min-width: auto;
    place-self: end;

    svg {
        height: 17px;
    }


    &.jp-cancelled {
        background-color: red;
    }
}

#panelPlan.accessibility_planner .jp-grid-departure {
    place-self: center;
}
#panelPlan.accessibility_planner .jp-grid-arrival {
    place-self: center;
}

#panelPlan.accessibility_planner .jp-grid-arrival,
#panelPlan.accessibility_planner .jp-grid-departure,
#panelPlan.accessibility_planner .jp-grid-timeTaken {
    font-weight: 700;
}


#panelPlan.accessibility_planner .jp-grid-arrow {
    display: block;
    /*grid-area: arrow;*/
}

#panelPlan.accessibility_planner .jp-grid-mode-icon {
    margin: 0;
}



#panelPlan.accessibility_planner .jp-grid-details {
    padding: 0 6px;
    font-size: 18px;
    display: flex;
    justify-content: center;
    line-height: 2;
    flex-wrap: wrap;
}

#panelPlan.accessibility_planner .jp-grid-quickest {
    grid-area: quickest;
    background-color: var(--main-colour);
    border-radius: 1rem;
    color: #FFFFFF;
    width: 11rem;
    min-width: auto;
    display: flex;
    align-items: center;
    line-height: 2;
    justify-self: center;

    svg {
        margin-left: 8px;
        height: 15px;
    }
}
#panelPlan.accessibility_planner .jp-grid-quickest {

    svg {
        justify-self: center;
    }

}


#panelPlan.accessibility_planner .jp-grid-status {
    color: var(--secondary-colour);
    text-decoration: underline;
    margin: 0;
    padding: 0;
    justify-self: center;


    & .jp-time-override {
        justify-content: end!important;
        align-items: center;

        & > div {
            font-size: 1rem;
            margin-left: 3px;
        }

        & > svg {
            height: 20px;
        }
    }

}

#panelPlan.accessibility_planner .planner-output-button {
    padding: 10px;
    width: 7rem;
    border-radius: 1rem;
    outline: 1px solid var(--main-colour);
    border: none;
    background-color: var(--main-colour);
    color: white;
}

#panelPlan.accessibility_planner .planner-output-buttons {
    display: flex;
    margin-top: 125px;
    gap: 15px;
    justify-content: center;
}

/*.jp-modal-content > :nth-child(2) :not(.passenger-assist-container),*/
#panelPlan.accessibility_planner .jp-modal-content > .jp-bulletins-container {
    padding-top: 0;
}

#panelPlan.accessibility_planner .jp-modal-content .jp-grid-headings-wrapper {
    margin-bottom: 115px;
}

#panelPlan.accessibility_planner .route-summary {
    display: flex;
    gap: 10px;
    justify-content: space-evenly;
    width: 100%;
    align-items: center;
    height: 40px;
    background-color: var(--secondary-colour);

    & p {
        font-weight: 700;
        font-size: 1.5rem;
    }
}



#panelPlan.accessibility_planner .leg-wrapper {
    display: grid;
    grid-template-columns: 0.2fr repeat(2, 2fr) 0.2fr 0.5fr;
    grid-template-rows: 26px 50px auto auto 50px auto;
    grid-column-gap: 2px;
    grid-row-gap: 2px;
    align-items: center;
    justify-items: center;

    .leg-icon {
        height: 25px;
    }

    .operator-name {
        padding: 5px 10px;
        color: white;
        border-radius: 10px;
        width: fit-content;
        max-width: 244px;
    }

    .jp-time-override {
        justify-content: end;
        align-items: end;
    }

    .departure-station-name,
    .arrival-station-name {
        font-size: 18px;
    }

    .operator-container {
        background-color: rgba(217, 217, 217, 0.24);
        padding: 10px;
        width: fit-content;
        border-radius: 5px;
    }

    .leggy-logo {
        height: 25px;
        grid-area: 2 / 1 / 3 / 2;
    }

    .bottom-leggy-logo {
        grid-area: 5 / 1 / 6 / 2;
    }

    .leg-indicator {
        width: 7px;
        height: 100%;
        /*background-color: #000000;*/
        border-radius: 10px;
        grid-area: 3 / 1 / 5 / 2;
    }

    .status-container {
        grid-area: 1 / 3 / 2 / 6;
        justify-self: end;
    }

    .departure-time-info-wrapper {
        grid-area: 2 / 5 / 3 / 6;
        display: flex;
        flex-direction: column;

        .delayed-time {
            text-decoration: line-through;
            color: red;
        }
    }

    .arrival-time-info-wrapper {
         grid-area: 5 / 5 / 6 / 6;
         display: flex;
         flex-direction: column;

        .delayed-time {
            text-decoration: line-through;
            color: red;
        }
     }

    .departure-station-name {
        grid-area: 2 / 2 / 3 / 5;
        justify-self: flex-start;
        padding-left: 5px;
    }

    .tube-msg-container {
        text-align: justify;
        padding: 10px;
        border: 2px solid grey;
        border-radius: 10px;
        width: fit-content;
        grid-area: 4 / 2 / 5 / 4;
        /*max-width: 250px;*/
        display: flex;
        justify-self: baseline;
        margin-left: 15px;
        margin-block: 1em;
    }

    .arrival-station-name {
        grid-area: 5 / 2 / 6 / 5;
        justify-self: flex-start;
        padding-left: 5px;
    }

    .station-train-area {
        padding: 5px 0 5px 15px;
        grid-area: 3 / 2 / 4 / 4;
        width: 100%;
    }

    .arrival-station-information {
        padding-left: 15px;
        grid-area: 6 / 2 / 7 / 4;
        width: 100%;
    }

    .route-wrapper {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 40px;
        width: 100%;

        .jp-platform {
            text-decoration: none;
        }

        .station-info {
            gap: 5px;
            width: 70%;
        }

        .mode {
            text-transform: capitalize;
        }

        .time-info {
            width: 30%;
            align-items: end;
            display: flex;
            flex-direction: column;
            p {
                display: flex;
                text-align: right;
                font-size: 1.3rem;

                &.delayed-time {
                    text-decoration: line-through;
                    color: red;
                }
            }
        }



        .station-wrapper {
            display: flex;
            justify-content: space-between;


            /*:first-of-type {*/
            /*    font-size: 1.4rem;*/
            /*    font-weight: 700;*/
            /*    !*max-width: 190px;*!*/
            /*}*/

        }



        .arr-wrapper {
            align-items: flex-start;
            .step-free {

                display: flex;
                align-items: center;
                margin-top: -10px;

                & > p {
                    font-size: 1.2rem;
                    font-weight: 400;
                }
                & > svg {
                    height: 30px;
                    fill: black;
                }
            }

        }
    }
}

#panelPlan.accessibility_planner .leg-wrapper .operator-name.circle p,
#panelPlan.accessibility_planner .leg-wrapper .operator-name.waterlooandcity p,
#panelPlan.accessibility_planner .leg-wrapper .operator-name.hammersmithandcity p {
    color: #0019a8;
}

#panelPlan.accessibility_planner .jp-platform-arrive {
    padding: 0.75em 0;
}

/*.jp-platform {*/
/*    font-weight: 400;*/
/*}*/

#panelPlan.accessibility_planner .step-free-leg {

    display: flex;
    align-items: center;

    p {
        font-size: 1.2rem;
        font-weight: 400;
        margin-right: 5px;
    }

    svg {
        height: 23px;
        fill: black;
    }
}

#panelPlan.accessibility_planner #planner-output-content > div > div.planner_modal_container.planner_modal_slide > div.jp-modal-content.active-leg.active-class > div.leg-wrapper > div.route-wrapper > div.station-wrapper.dep-wrapper > div.station-info > div.step-free > p {
    font-size: 1.2rem;
    font-weight: 400;
}

#panelPlan.accessibility_planner .end-of-journey {
    margin-top: 1.5em;
    display: flex;


    & > p {
        font-weight: 700;
        width: fit-content;
        margin: 0 auto;
        /*place-self: center;*/
        /*text-transform: uppercase;*/
    }
}

#panelPlan.accessibility_planner .journey-instruction {
    margin: 30px;
    padding: 20px 0;
    border-bottom: 1px solid var(--secondary-colour);
    border-top: 1px solid var(--secondary-colour);
    text-align: center;
}

#panelPlan.accessibility_planner .planner-journey-item {
    display: flex;
    justify-content: center;
}

#panelPlan.accessibility_planner .jp-bulletin-wrapper {
    margin-bottom: 10px;
}

#panelPlan.accessibility_planner .jp-bulletins-container {
    margin-bottom: 15px;
    width: 100%;
}
#panelPlan.accessibility_planner div.planner-form-wrapper button.planner-reverse-fields-button {
    margin: 0;
    border: unset;
    background: unset;
    padding: unset;
    position: absolute;
    right: 1rem;
    top: 5.25rem;
    transform: translateY(-50%);
    width: 30px;
    cursor: pointer;
}
#panelPlan.accessibility_planner .station-result-list {
    z-index: 1;
}
@media screen and (min-width: 501px) {
    #panelPlan.accessibility_planner div.planner-form-wrapper button.planner-reverse-fields-button {
        right: calc(50% - 195px);
    }
}
@media screen and (min-width: 1100px) {
    #panelPlan.accessibility_planner .planner-wrapper {
        /*padding-bottom: 150px;*/
    }

    #panelPlan.accessibility_planner #planner-output-content {
        margin-top: 125px;
    }
    #panelPlan.accessibility_planner .planner-form-wrapper form {
        /*width: 40%;*/
    }
    #panelPlan.accessibility_planner .preferences-toggle-container .preferences-area > .preferences-title {
        top: -1.5em;
    }
    #panelPlan.accessibility_planner label > span {
        padding: .75em .25em;
    }

    #panelPlan.accessibility_planner .planner-output-buttons {
        width: 50%;
        gap: 20px;
        margin-top: 140px;
    }

    #panelPlan.accessibility_planner .planner-output-button {
        font-size: 1.2rem;
    }

    #panelPlan.accessibility_planner .earlier-later-container:nth-of-type(2) {
        padding-block: 1rem 0;
    }

    #panelPlan.accessibility_planner .jp-modal-item-container {
        margin: 0 auto;
    }

    #panelPlan.accessibility_planner .accessible-container {
        grid-template-columns: repeat(3, calc(10% - 2.5px)) repeat(2, calc(35% - 2.5px));

        & > .accessible-text {
            grid-area: 1 / 2 / 3 / 6;
        }
    }

    #panelPlan.accessibility_planner .passenger-assist-container {
        flex-direction: row;
        padding: 10px 30px 10px 10px;
    }

    #panelPlan.accessibility_planner .passenger-assist-container svg {
        min-width: 200px;
    }

    #panelPlan.accessibility_planner .passenger-assist-container p > span {
        font-size: 1.2rem;
    }

}
@media screen and (max-width: 501px) {
    #panelPlan.accessibility_planner .jp-grid-details {
        font-size: 16px;
        line-height: 1.5;
        text-align: center;
    }

    #panelPlan.accessibility_planner .journey-planner-preview-enhanced-two {
        grid-template-rows: 0.5fr min-content 0.5fr 1fr;
    }

    #panelPlan.accessibility_planner .jp-grid-info {
        align-self: center;
        width: 8rem;
        padding: 0 3px;
        margin-top: 5px;
        place-self: center;
    }

    #panelPlan.accessibility_planner .jp-grid-bulletinNotification {
        flex-wrap: nowrap;
        font-size: 12px!important;
        align-self: end;

        p {
            font-size: 12px;
            font-weight: unset;
            align-self: end;
        }
        svg {
            margin: 0;
            align-self: center;
        }
    }

    #panelPlan.accessibility_planner .jp-grid-quickest {
        width: 9rem;
        padding: 0 3px;
        align-self: center;
    }
    #panelPlan.accessibility_planner .jp-grid-direct {
        width: 9rem;
        padding: 0 3px;

        p {
            font-size: 16px;

        }

        svg {
            height:24px;
        }
    }

    #panelPlan.accessibility_planner .jp-grid-stepfree{
        width: 9rem;
        padding: 0 3px;
        align-self: start;

        p {
            font-size: 16px;
            align-self: center;
        }

        svg {
            height:30px;
            margin: -3px;
        }
    }

    #panelPlan.accessibility_planner .jp-grid-timeTaken {
        font-size: 14px;
        font-weight: normal;
    }



}
#panelPlan.accessibility_planner .hide {
    display: none !important;
    cursor: default;
}
#panelPlan.accessibility_planner .train-accessibility-info,
#panelPlan.accessibility_planner .station-accessibility-info {
    position: relative;
    border-radius: 5px;
    /*border: 2px gray solid;*/
    padding: 0.75em 0;
    width: 100%;

    p {
        display: flex;
        align-items: center;
        cursor: pointer;
        font-weight: 400;
    }

}

#panelPlan.accessibility_planner .arrival-accessibility-info {
    padding: 0!important;
}
/*.train-accessibility-info .info-list,*/
/*.station-accessibility-info .info-list {*/
/*    display: grid;*/
/*    grid-template-columns: 30px 1.5fr;*/
/*    gap: 1em;*/
/*    margin-top: 1em;*/
/*    align-items: center;*/
/*    width: max-content;*/
/*}*/
/*@media (min-width: 584px) {*/
/*    .train-accessibility-info .info-list,*/
/*    .station-accessibility-info .info-list {*/
/*        grid-template-columns: 30px 1.5fr 30px 1.5fr;*/
/*    }*/
/*}*/

@media (max-width: 544px) {
    #panelPlan.accessibility_planner .leg-indicator-wrapper {
        padding-bottom: 68px!important;
    }

    #panelPlan.accessibility_planner .step-free {
        padding-top: 10px;
    }
}

@media (max-width: 337px) {
    #panelPlan.accessibility_planner .leg-indicator-wrapper {
        padding-bottom: 87px!important;
    }
}

#panelPlan.accessibility_planner .info-list .icon {
    width: 2em;
    height: 2em;
}

#panelPlan.accessibility_planner .more-info-container {
    flex-direction: column-reverse;
}

#panelPlan.accessibility_planner .more-info {
    justify-content: end;
    display: flex;
    margin-top: 15px;
    margin-bottom: -5px;
}

#panelPlan.accessibility_planner .info-item {
    display: grid;
    grid-template-columns: 1fr 4fr;
    grid-template-rows: repeat(1, 1fr);
    border-bottom: 2px solid #c5c5c5;
    padding: 5px 0;
    .icon {
        grid-area: 1 / 1 / 3 / 2;
        width: 2em;
        height: 2em;
        align-self: center;
        justify-self: center;
    }
    .description {
        grid-area: 1 / 2 / 2 / 5;
        font-weight: 700;
        justify-self: baseline;
    }
    .more-information-text {
        grid-area: 2 / 2 / 3 / 6;
        justify-self: baseline;
    }
}

#panelPlan.accessibility_planner .jp-modal-content > .leg-wrapper {
    & .route-wrapper {
        & .station-wrapper {
            .info-list p:first-of-type {
                font-weight: 600;
                font-size: 14px;
            }
            @media only screen and (min-width: 1100px) {
                .info-list p:first-of-type {
                    font-size: 1.2rem;
                }
            }
        }
    }
}
#panelPlan.accessibility_planner #plus-svg-connections {
    position: absolute;
    top: -11px;
    right: -12px;
    justify-self: end;
}

#panelPlan.accessibility_planner .toggle-chevron {
    transition: transform 0.3s ease;
    margin-left: 8px;
}

#panelPlan.accessibility_planner .train-accessibility-info.expanded .toggle-chevron,
#panelPlan.accessibility_planner .station-accessibility-info.expanded .toggle-chevron {
    transform: rotate(180deg);
}

#panelPlan.accessibility_planner .info-list {
    display: block;
    background-color: #ececec94;
    padding: 10px;
    border-radius: 10px;
}

#panelPlan.accessibility_planner .rotated {
    transform: rotate(180deg);
}

#panelPlan.accessibility_planner .warning {
    color: black;
    margin-block-end: 1em;
    text-align: center;
}
#panelPlan.accessibility_planner .warning.warning-later {
    margin-block-start: 1em;
}

#panelPlan.accessibility_planner .planner-wrapper {
    .lds-roller_container {
        justify-self: center;
        align-self: start;
    }
}
#panelPlan.accessibility_planner .lds-wrapper {
    display: grid;
}
#panelPlan.accessibility_planner .earlier .lds-wrapper {
    transform: scale(.35) translateY(-100%);
}
#panelPlan.accessibility_planner .later .lds-wrapper {
    transform: scale(.35) translateY(-50%);
}

@media (min-width: 501px) {
    #panelPlan.accessibility_planner .jp-modal-content >.leg-wrapper {

        .route-wrapper {
            .operator-name {
                max-width: none;
            }
        }
    }
}
@media screen and (min-width: 1024px) {
    #panelPlan.accessibility_planner .jp-modal-content >.leg-wrapper {
        padding: 0;

        .leg-icon {
            height: 30px;
        }

    }



    #panelPlan.accessibility_planner .jp-bulletins-container {
        padding: 0;
    }


}

@media (min-width: 510px) and (max-width: 1100px) {
    #panelPlan.accessibility_planner .jp-modal-content .jp-grid-headings-wrapper {
        margin-bottom: 115px;
    }

}

@media  (min-width: 1100px) {
    #panelPlan.accessibility_planner .jp-modal-content .jp-grid-headings-wrapper {
        margin-bottom: 135px;
    }

}
#panelPlan.accessibility_planner .sprite_sheet {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

#panelPlan.accessibility_planner .sprite_sheet_individual {
    background-color: var(--main-colour);
    width: 300px;
    height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: var(--border, 2px solid #000);
    border-radius: 10px;
    margin: 20px;
    box-shadow: rgba(0, 0, 0, 0.35) 0 5px 15px;
}

#panelPlan.accessibility_planner .icon_title {
    margin-top: 20px;
}

#panelPlan.accessibility_planner .icon_description {
    color: black;
    margin: 0;
}

#panelPlan.accessibility_planner .data-source-provider {
    display: flex;
    align-items: center;
}
#panelPlan.accessibility_planner .collapse {
    margin: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    * {
        display: none !important;
    }
}
#panelPlan.accessibility_planner .header.expanded-header {
    height: 8rem;
    transition: all 0s ease;
}
#panelPlan.accessibility_planner .header.expanded-header.delayed-transition {
    transition-delay: 1s;
    transition: 0.2s;
}

#panelPlan.accessibility_planner .more-info-container {
    display: flex;
    justify-content: end;
    /*margin: 20px 15px 0 0;*/
}

#panelPlan.accessibility_planner .more-info-svg {
    margin-right: 10px;
}

#panelPlan.accessibility_planner .station-container {
    padding: 10px 0;
    width: fit-content;
}

#panelPlan.accessibility_planner .map-link-wrapper {
    width: fit-content;
    display: grid;
    grid-template-columns: 1fr 30px;
    grid-template-rows: auto auto;
    column-gap: .5em;

    background: rgba(217, 217, 217, 0.24);
    padding: 0.75em;
    border-radius: 0.5em;
    height: fit-content;
    
    line-height: 1.5em;
    color: black;
    transition: 250ms;
}

#panelPlan.accessibility_planner .map-link-text {
    display: block;
    margin-block-end: 1em;
    font-size: 1em;
}

#panelPlan.accessibility_planner .map-link-text span {
    font-weight: 700;
    font-size: 1.25em;
}

#panelPlan.accessibility_planner .map-thumbnail {
    width: 100%;
    max-width: 300px;
    height: auto;
    display: block;
    border: 1px black solid;
    grid-column: 1 / 3;
}

#panelPlan.accessibility_planner .arrival-station-information,
#panelPlan.accessibility_planner .station-train-area {
    display: grid;
}

#panelPlan.accessibility_planner .arrival-station-information > *:is(div, p),
#panelPlan.accessibility_planner .station-train-area > *:is(div, p) {
    grid-column: 1/2;
}

#panelPlan.accessibility_planner .map-icon-wrapper span {
    display: none;
}

#panelPlan.accessibility_planner .map-icon {
    width: 30px;
    height: auto;
}

#panelPlan.accessibility_planner .map-link-wrapper:active,
#panelPlan.accessibility_planner .map-link-wrapper:focus,
#panelPlan.accessibility_planner .map-link-wrapper:hover {
    border: unset;
    transform: scale(1.01);
}

@media (min-width: 900px) {
    #panelPlan.accessibility_planner .map-link-wrapper {
        grid-template-columns: 1fr;
        border: 2px black solid;
        padding: 0.25em 0.75em 0;
        background: white;
    }

    #panelPlan.accessibility_planner .map-link-wrapper:active,
    #panelPlan.accessibility_planner .map-link-wrapper:focus,
    #panelPlan.accessibility_planner .map-link-wrapper:hover {
        border: 2px black solid;
        transform: scale(1.05);
    }

    #panelPlan.accessibility_planner .map-thumbnail {
        display: none;
    }

    #panelPlan.accessibility_planner .map-link-text {
        display: none;
    }

    #panelPlan.accessibility_planner .map-icon-wrapper {
        display: flex;
        align-items: center;
    }

    #panelPlan.accessibility_planner .map-icon-wrapper span {
        display: block;
        font-size: 1.25em;
        font-weight: bold;
        padding-inline-end: 0.75em;
    }
}


#panelPlan.accessibility_planner .preferences-msg {
    width: 93%;
    margin: 20px auto;
    text-align: center;
}



#panelPlan.accessibility_planner .modal-icons {
    display: flex;
    flex-direction: row;
    margin-bottom: 5px;
    align-items: center;
}
#panelPlan.accessibility_planner .modal-icons-train {
    display: flex;
    flex-direction: row;
    margin-bottom: 5px;
    align-items: center;
}

#panelPlan.accessibility_planner .step-free-leg-train {
    display: flex;
    align-items: center;
}

#panelPlan.accessibility_planner .step-free-leg-train p {
    font-size: 1.2rem;
    font-weight: 400;
    margin-right: 5px;
}

#panelPlan.accessibility_planner .step-free-leg-train svg {
    height: 23px;
    fill: black;
}

#panelPlan.accessibility_planner .preferences {
    margin-bottom: 10px;
}

#panelPlan.accessibility_planner .preferences-train {
    margin: 10px 0;
}

#panelPlan.accessibility_planner .error-container {
    display: flex;
    flex-direction: column;
    row-gap: 30px;
    margin: 20px;
}

#panelPlan.accessibility_planner .error-container button {
    align-self: center;
    justify-self: center;
    background-color: var(--main-colour);
    color: #FFFFFF;
    border-radius: 1.5rem;
    height: 5rem;
    width: 40%;
    max-width: 300px;
    box-shadow: none;
    font-size: 1.5rem;
    font-weight: 700;
    outline: 1px solid var(--main-colour);
    border: none;
    margin-top: 30px;
    cursor: pointer;
}

#panelPlan.accessibility_planner .error-container p {
    text-align: justify;
    font-size: 1.3rem;
}/*@import "variables.css";*/


.TOCRT #panelPlan.accessibility_planner {
    background-color: var(--secondary-colour-nr);
    overflow-x: hidden;
}

.TOCRT #panelPlan.accessibility_planner p {
    font-weight: 300;
}
.TOCRT #panelPlan.accessibility_planner .header {
    background-color: var(--main-colour-nr);
}

.TOCRT #panelPlan.accessibility_planner #panelPlanInput .header {
    display: none;
}

.TOCRT #panelPlan.accessibility_planner .planner-form-intro {
    font-weight: 300;
    font-size: 1.4rem;
    margin-top: 50px;
}

.TOCRT #panelPlan.accessibility_planner .exhaustive input {
    outline: 2px solid var(--main-colour-nr);
}

.TOCRT #panelPlan.accessibility_planner .geo-marker {
    fill: var(--main-colour-nr);
}
.TOCRT #panelPlan.accessibility_planner .planner-form-datetime{
    outline: 2px solid var(--main-colour-nr);
}

.TOCRT #panelPlan.accessibility_planner .via-btn {
    color: var(--supplementary-colour-nr);
    border-bottom: 2px solid var(--supplementary-colour-nr);
    background-color: var(--secondary-colour-nr);
}

.TOCRT #panelPlan.accessibility_planner input.radio-selection[type="radio"] {
    outline: 2px solid var(--main-colour-nr);
}

.TOCRT #panelPlan.accessibility_planner input.radio-selection[type="radio"]:checked::before {
    box-shadow: inset 1em 1em var(--main-colour-nr);
}

.TOCRT #panelPlan.accessibility_planner .jf-input-submit {
    outline: 2px solid var(--main-colour-nr);
    background-color: var(--main-colour-nr);
    color: black;
    font-size: 1.4rem;
    /*font-weight: 300;*/
}



.TOCRT #panelPlan.accessibility_planner .planner-chevron > path {
    fill: black;
    stroke: black;
}

.TOCRT #panelPlan.accessibility_planner .planner-inputs {
    background-color: var(--main-colour-nr);
}

.TOCRT #panelPlan.accessibility_planner .planner-input-txt {
    color: black;
}

.TOCRT #panelPlan.accessibility_planner #planner-preferences label {
    outline: 2px solid var(--main-colour-nr);

}

.TOCRT #panelPlan.accessibility_planner #planner-preferences label::after,
.TOCRT #panelPlan.accessibility_planner #planner-preferences input:checked + label,
.TOCRT #panelPlan.accessibility_planner .preferences-buttons {
    background-color: var(--main-colour-nr);
}

.TOCRT #panelPlan.accessibility_planner .preferences-buttons {
    color: black;
    font-weight: 300;
    font-size: 1.4rem;
}

.TOCRT #panelPlan.accessibility_planner label > span {
    color: black
}


.TOCRT #panelPlan.accessibility_planner .journey-planner-preview-enhanced-two {
    background-color: var(--main-colour-nr);
}

.TOCRT #panelPlan.accessibility_planner .btn-stripe {
    border: .5px solid black;
}
.TOCRT #panelPlan.accessibility_planner .results-button > p {
    color: black;
}

/*.TOCRT .results-connections .btn-stripe {*/
/*    border: .5px solid var(--main-colour-nr);*/
/*}*/

.TOCRT #panelPlan.accessibility_planner .results-badges .badge.active-badge {
    outline: 2px solid var(--main-colour-nr);
    font-weight: 300;
}

.TOCRT #panelPlan.accessibility_planner .error-container button {
    outline: 2px solid var(--main-colour-nr);
    background-color: var(--main-colour-nr);
    color: black;
}

.TOCRT #panelPlan.accessibility_planner .accessible-container {
    background-color: var(--supplementary-colour-nr);
}

.TOCRT #panelPlan.accessibility_planner .accessible-text {
    color: var(--secondary-colour-nr);
    /*font-size: 1.4rem;*/
}

@media (min-width:992px) {
    .TOCRT #panelPlan.accessibility_planner .journey-planner-preview-enhanced-two .results-status-desktop {
        color: black;
    }

    .TOCRT #panelPlan.accessibility_planner .results-status-desktop .delayed-icon-inner {
        fill: none;
    }
    .TOCRT #panelPlan.accessibility_planner .results-status-desktop .delayed-icon-outer {
        fill: black;
    }

    .TOCRT #panelPlan.accessibility_planner .journey-planner-preview-enhanced-two .results-status-desktop > p {
        color: black;
    }

    .TOCRT #panelPlan.accessibility_planner .arrow-right {
        border-left: 5px solid black;
        border-top: 5px solid black;
        border-radius: 5px;
    }
}
#rti-feed {
    color: #000000;
    z-index: 1;
    display: block;
    margin: 0 auto;
    padding: 1em;
}

.missing-feeds {
    max-width: 560px;
    margin: 0 auto;
    width: 100%;
    padding: 30px;
    position: relative;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
}

.feedback-terms-container {
    text-align: left;
}
.feedback-terms-list-header {
    background-color: var(--sw);
}

.hiddenTable {
    visibility: hidden;
}

.supersuper {
    background-color: white;
}
ul#MarkerTarget {
    -webkit-padding-start: 2vw;
    padding-inline-start: 2vw;
    padding: 0 var(--template-padding);
}

#showDebugTable {
    font-size: smaller;
}

#icon_greggs {
    width: 100%;
}
.btp-icon {
    width: 110px;
}

.btp-logo-send-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.btp-logo {
    width: 89px;
    margin-top: var(--template-padding);
}

.btp-logo:hover {
    cursor: pointer;
}

.btp-alert svg:last-of-type {
    grid-area: close;
    justify-self: end;
}
.btp-text {
    grid-area: text;
    justify-self: start;
}
.btp-alert-hide {
    display: none;
}
.btp-icon {
    width: 110px;
}

.btp-logo-send-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.btp-logo {
    width: 89px;
    margin-top: var(--template-padding);
}

.btp-logo:hover {
    cursor: pointer;
}

.btp-alert {
    width: 100%;
    /* border-radius: 5px; */
    background: rgb(136, 197, 199);
    position: relative;
    /* margin-top: 21px; */
    padding: var(--template-padding);
    font-size: 1.1rem;
    display: grid;
    grid-template-columns:89px auto 30px;
    grid-template-areas:"text text close";
    column-gap: 8px;
    align-items: center;
    position: absolute;
}

.btp-alert svg:last-of-type {
    grid-area: close;
    justify-self: end;
}

/* .btp-icon {
    grid-area:icon;
    justify-self:start;
} */
.btp-text {
    grid-area: text;
    justify-self: start;
}
.btp-alert-hide {
    display: none;
}

.selected-feedback-icon {
    animation: bloat 0.8s ease;
    -webkit-filter: drop-shadow(0px 0px 5px rgb(255 0 0));
}
.TOCGR .selected-feedback-icon {
    filter:none;
    -webkit-filter:none;
}

.delay-active {
    display: grid !important;
    opacity: 1 !important;
}

.delay-compensation-message {
    grid-area: message;
    display: flex;
    align-items: center;
    justify-content: Center;
    color: #000;

}

.delay-compensation-message div {
    font-size: 1.3rem;
    font-weight: 700;
}

.delay-compensation-svg {
    grid-area: logo;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: Center;
}

.delay-thank-you {
    padding: var(--template-padding);
    margin: auto;
    background: #FFF;
    position: absolute;
    height: var(--panel-sub-menu-active);
    width: 100%;
    transition: all 0.3s ease;
    display: grid;
    grid-template-rows: 0.75fr min-content min-content 1fr;
    grid-template-areas:
        "."
        "svg"
        "text"
        ".";
    top: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
}


.delay-thank-you div {
    grid-area: text;
    text-align: center;
    place-self: center;
    font-size: 1.5rem;
    font-weight: 600;
}

.delay-thank-you svg {
    grid-area: svg;
    place-self: center;
    width: 125px;
}

.delay-thank-you-display {
    opacity: 1;
    visibility: visible;
}
.delay-active-reply {
    grid-area: message;
    align-self: center;
    font-size: 1.3rem;
    font-weight: 700;
}

.delay-active-message {
    grid-area: message;
    align-self: Center;
    font-size: 1.3rem;
    font-weight: 700;
    color: red;
}

.delay-active-message:hover {
    cursor: pointer;
}

.delay-active-logo {
    grid-area: logo;
    /* height: 81% !important; */
    overflow: unset;
    display: block !important;
    place-self: center;
}

.delay-active-close {
    grid-area: close;
    /* height: 34% !important; */
    width: 20px !important;
    max-width: 30px;
    display: block !important;
    overflow: unset;
    place-self: center;
    stroke: black;
    stroke-width: 13px;
}

.delay-active-close-compensation-container {
    grid-area: close;
    width: 20px !important;
    max-width: 30px;
    display: block !important;
    overflow: unset;
    place-self: center;
}

.delay-active-close-compensation {
    stroke: black;
    stroke-width: 13px;
    width: 100%;
}
.station:before {
    height: auto;
    position: absolute;
    left: 68px;
    top: 0;
    bottom: -25px;
    content: " ";
    display: block;
    width: 10px;
    background: #000;
    background-size: 2px;
    z-index: 1;
}
.station:hover {
    cursor: pointer;
}

.station svg:first-of-type {
    position: relative;
    z-index: 1;
    /*    top: -25px; */
}

.station:last-of-type:before {
    bottom: 100%;
}
.test {
    font-family: 'lubalin_graphregular', serif;
}
.welshname {
    /*display: none;*/
    color: #30c5b8;
    font-size: 100% !important;

    /*padding-right: 8px;*/
}
.carbonbox {
    border: 2px solid #EA7400;
    width: 694px;
    height: 113px;
    color: #EA7400;
    font-size: 26px;
}
#homeList {
    font-size: 20px;
    width: 500px;
    margin: 0 auto;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.18), 0 4px 8px rgba(0, 0, 0, 0.36);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.18), 0 4px 8px rgba(0, 0, 0, 0.36);
    /*padding: 2px;*/
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    background-color: white;
}
.TOCGR #homeList {
    box-shadow:none;
    -webkit-box-shadow:none;
}
#homeList a {
    text-decoration: none;
    padding-left: 4px;
}

#homeList li {
    display: block;
}

#homeList h1 span {
    width: 100%;
    display: block;
}
/*noinspection ALL*/
#homeList .CarbonTitle {
    background-color: black;
    color: white;
}
.material-icons {
    font-family: 'Material Icons', monospace;
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}
.rainbowBoard {
    margin-top: 10px;
    color: #fff;
    font-family: Johnston100, sans-serif;
    left: 0;
    position: relative;
    font-size: 14px;
    -webkit-padding-start: 0;
    padding-inline-start: 0;
}

.rainbowBoard td {
    padding: 8px 15px 8px 15px
}

.rainbowBoard tr > td:nth-child(1) {
    width: 50%
}
.black {
    color: #000 !important
}
.partClosure, .severeDelays {
    background: #faf5e1
}
.tflStatus {
    color: #0019A8;
    padding-left: 0.5em;
    align-self: center;
    width: 30vw
}
#showDebugTable {
    font-size: smaller
}
#panelBusstops .panelForlineDiagram .classDebugLocation ul .station:before {
    background: #DC241F;
}

#panelBusstops .panelForlineDiagram h1 {
    display: none;
}

#panelBusstops .panelForlineDiagram .main_header h1 {
    display: unset;
    padding: 0;
}

.dynamic {
    /*border: 1px dotted black;*/
    visibility: hidden;
    display: none;
    width: 400px;
    -webkit-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out;
    /*border: 6px solid #b7007c;*/
    /*border-radius: 4px;*/
    height: auto;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.18), 0 4px 8px rgba(0, 0, 0, 0.36);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.18), 0 4px 8px rgba(0, 0, 0, 0.36);
}
.TOCGR .dynamic {
    -webkit-box-shadow:none;
    box-shadow:none;
}
.tablink {
    background-color: #fff;
    color: #6200ee;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    /*font-size: 17px;*/
    width: 25%;
    text-transform: uppercase;
    font-size: .875rem;
    line-height: 2.25rem;
    font-weight: 500;
    letter-spacing: .0892857143em;
    text-decoration: none;
}

.tablink:hover {
    background-color: #6200ee;;
    color: white;
}
.tabcontent {
    color: white;
    display: none;
    /*padding: 100px 20px;*/
    height: 100%;
    background-color: rgba(255, 255, 255, 1);
    /*overflow-x: hidden;*/
    overflow-x: auto;
    width: 100%;
    padding: 0;
}
#Departures {
    background-color: white;
    color: black;;
}
#Interchange {
    background-color: white;
    color: black;;
}
#Facilities {
    background-color: white;
    color: black;;
}
#Rainbows {
    background-color: white;
    color: black;;
}
.onehundredpercent {
    width: 100%;
}
.onehundredpercent2 {
    width: 100%;
}
.onehundredpercent2 td {
    border-bottom: 1px solid white;
}
.fiftypercent {
    width: 50%;
    vertical-align: top;
    font-size: 14px;
}

.displayblock {
    display: block;
    padding: 2px
}

.formatRainbowBoards {
    border: 1px solid #cccccc;
    margin-top: 10px;
    background-color: white;
    /*box-shadow: 0 0 4px rgba(0, 0, 0, 0.18), 0 4px 8px rgba(0, 0, 0, 0.36);*/
    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.14), 0 2px 4px rgba(0, 0, 0, 0.28);
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.14), 0 2px 4px rgba(0, 0, 0, 0.28);
}
.TOCGR .formatRainbowBoards {
    -webkit-box-shadow:none;
    box-shadow:none;
}
.statusSeverityDescription {
    color: black;
}
.FormatNationalRailArray {
    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.14), 0 2px 4px rgba(0, 0, 0, 0.28);
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.14), 0 2px 4px rgba(0, 0, 0, 0.28);
    background-color: white;
    color: black;;
}
.TOCGR .FormatNationalRailArray {
    -webkit-box-shadow:none;
    box-shadow:none;
}
.otherstatusback {
    background: #faf5e1;
    display: block;
    padding: 2px;
    color: #2070b0;
}
.FormatNationalRailArray a {
    color: black
}
.hiddentoStart {
    display: none;
}
.closebutton {
    color: #32BEF0;
    float: right;
}

.closebutton a:hover {
    color: #32BEF0;
}

.closebutton a:link {
    color: #32BEF0;
}

.FNAlink {
    color: black !important;
}
.pressme {
    background: #00BD19;
    color: white;
    font-family: 'Johnston100-Regular', sans-serif;
    padding: 8px;
    display: none;
}
.x {
    char: 🖼;
}
.tell-us-loader {
    height: var(--panel-sub-menu-active);
    position: absolute;
    top: 0;
    background: white;
    display: none !important;
}

.tell-us-loader-display {
    display: flex !important;
}
.view {
    display: block;
}

#icon_oyster {
    width: 70%;
}

.main_item_info {
    display: none;
}

.visible_item {
    display: grid;
}

.background {
    background: rgba(224, 224, 224, 0.6);
}
.filter_active {
    display: block;
}

.filter_inactive {
    display: none;
}

.TOCGR .main_info_filters button {
    -webkit-box-shadow:none;
    box-shadow:none;
}
.noData {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: var(--inner-panel);
}

.noData svg {
    width: 25%;
    max-width: 100px;
}

.noData p {
    margin-top: var(--template-padding);
    padding: var(--template-padding);
}
.small {
    height: unset !important;
    margin-top: var(--template-padding);
}
.main_journey_item {
    display: grid;

    grid-template-columns:var(--inactive-journey-grid);
    -webkit-column-gap: var(--grid-gap);
    -moz-column-gap: var(--grid-gap);
    column-gap: var(--grid-gap);
    font-size: 18px !important;
    grid-template-areas:
  var(--journey-grid-areas);
    opacity: 1;
}

.main_journey_item:nth-of-type(1) {
    /* padding: 0 0 var(--template-padding) 0 ; */
    font-size: 18px;
    margin: 0 0 var(--template-padding) 0;
    display: grid;
    grid-template-areas:var(--journey-headings);
    /* grid-template-columns:var(--active-journey-grid) !important; */
}
.main_journey_item_fac_grid {

    grid-template-columns:var(--active-journey-grid);
}

.main_journey_item_fac_active svg {
    display: initial !important;
}

.main_journey_item_headings_departure {
    grid-area: departure;
    word-break: break-all;
}

.main_journey_item_headings_departure h3 {
    width: 200%;
}

.main_journey_item_headings_station {
    grid-area: station;
    word-break: break-all;
}

.main_journey_item_headings_facilities {
    grid-area: station;
    word-break: break-all;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: start;
    align-items: flex-start;
}

/* .main_journey_item_facilities_gradient {
  ;
} */
.main_journey_item_headings_facilities h3 {
    margin: 0 var(--template-padding) 0 0;
}

.main_journey_item_headings_facilities svg {
    height: 20px;
    stroke: #000;
    stroke-width: 1px;
}
.main_journey_item_departure {
    grid-area: departure;
}

.main_journey_item_station {
    grid-area: station;
    display: grid;

    grid-template-columns: 4fr 2fr 4fr 4fr;
    grid-template-areas:
  "name name name name"
  "preview preview interchange interchange"
  "facilities facilities facilities facilities";
}

.main_journey_item_station_preview {
    grid-row: 2;
    grid-column: 1;
    display: none;
    grid-area: preview;
    padding: var(--template-padding) var(--template-padding) var(--template-padding) 0;
}
.tube {
    width: 100%;
    height: 25px;
}

.tube:nth-of-type(1) {
    background-color: red;
}

.tube:nth-of-type(2) {
    background-color: blue;
}

.tube:nth-of-type(3) {
    background-color: brown;
}

.tube:nth-of-type(4) {
    background-color: yellow;
}

.tube:nth-of-type(5) {
    background-color: orange;
}
.main_journey_item_station_interchange {
    grid-row: 2;
    grid-column: 3;
    grid-area: interchange;
    margin: -8px 0 0 0;
    padding-bottom: var(--template-padding);
}

.main_journey_item_station_interchange svg {
    height: 35px;
    margin: 0 var(--template-padding) 0 0;
}

.main_journey_item_station p {
    grid-row: 1;
    grid-column: 1;
    grid-area: name;
}

.main_journey_item_station_facilities {
    grid-row: 3;
    grid-column: 1;
    grid-area: facilities;
    height: 35px;
    position: relative;
    overflow: hidden;
    -webkit-transition: height 0.2s ease;
    -o-transition: height 0.2s ease;
    transition: height 0.2s ease;
    margin-bottom: var(--template-padding);
}

.main_journey_item_station_facilities_active {
    height: auto;
}

.main_journey_item_station_facilities_active div {
    display: none;
}

.main_journey_item_station_facilities_gradient {
    position: absolute;
    width: 100%;
    height: 35px;
    background: -o-linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 1));
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.4)), to(rgba(255, 255, 255, 1)));
    background: linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 1));
}

.main_journey_item_station_facilities svg {
    height: 35px;
    width: auto;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    margin: 0 8px 0 0;
}
.main_journey_item_infographic {
    grid-area: infographic;
    position: relative;
}

.main_journey_item_infographic_rect {
    width: 10px;
    background-color: #2c3838;
    height: 100%;
    position: absolute;
    margin: 0 0 0 20px;
    top: 0;
    z-index: -100;
}
.main_journey_item_facilities {
    grid-row: 3;
    grid-column: 1;
    grid-area: facilities;
    position: relative;
}

.main_journey_item_facilities_gradient {
    position: absolute;
    width: 100%;
    height: 80%;
    background: -o-linear-gradient(rgba(255, 255, 255, 0.6), rgb(255, 255, 255));
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.6)), to(rgb(255, 255, 255)));
    background: linear-gradient(rgba(255, 255, 255, 0.6), rgb(255, 255, 255));
}

/* .main_journey_item_departure,
.main_journey_item_station,
.main_journey_item_infographic,
.main_journey_item_facilities {
  word-break: break-word;
} */
.main_journey_item_facilities svg {
    display: none;
}

.main_journey_item_facilities svg:nth-child(2),
.main_journey_item_facilities svg:nth-child(3) {
    display: initial;
}
.clickSvg {
    stroke: violet !important;
}

.opacity {
    opacity: 0;
}
@media only screen and (min-width: 1100px) {
    .main_info p {
        text-align: left;
    }
}
.main_content {
    grid-row: 2;
    grid-column: 1;
    grid-area: content;
    display: grid;
    grid-template-rows: minmax(60px, auto);

    grid-template-columns: 100%;
    overflow-y: scroll;
}

.main_content > *:nth-child(1) {
    grid-row: 1;
    grid-column: 1;
}
.autocomplete {
    margin-bottom: var(--template-padding);
    width: 300px;
    position: relative;
}
.autocomplete input {
    height: 3rem;
    border-radius: 5px;
    font-size: var(--text-input);
    padding-left: 3rem;
    border: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    -webkit-appearance: none;
    width: 300px;
}
.TOCGR .autocomplete input {
    -webkit-box-shadow:none;
    box-shadow:none;
}

.autocomplete input:focus {
    border: 1px none solid;
    outline-color: transparent;
    outline-style: none;
}
.autocomplete-items {
    width: 100%;
    padding: 0 var(--template-padding);
    max-height: 200px;
    overflow-y: scroll;
    margin-top: 0;
    padding-top: 6px;
    border-radius: 0 0 8px 8px;
    border-top: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.TOCGR .autocomplete-items {
    -webkit-box-shadow:none;
    box-shadow:none;
}

.autocomplete-items div {
    font-size: 1.3rem;
    margin: 13px 0;
}

.autocomplete-items div strong {
    font-size: 1.3rem;
}

.autocomplete-items div:hover {
    cursor: pointer;
}
img[alt="map of loca area"] {
    margin: 0 auto;
    display: block;
    width: unset !important;
    height: unset !important;
}
@media screen and (max-width: 500px) {
    #panelRainbows div .main_item_container .main_item {
        width: 100%;
        grid-template-columns: 25% 25% 25% 25%;
        grid-row-gap: 2rem;
        grid-template-areas:
      "departure departure station station"
      "route route platform platform";
    }

    #panelRainbows div .main_item_container .main_item_line {
        padding: 0;
    }

    #panelRainbows div .main_item_container .main_item_line p {
        border-radius: 3px;
        text-align: center;
    }

    #panelRainbows div .main_item_container .main_item_departure p {
        border-radius: 3px;
        text-align: center;
    }

    #panelRainbows div .main_item_container .main_item_station {
        text-align: center;
    }

    #panelRainbows div .main_item_container .main_item:nth-of-type(even) {
        background: none;
    }

    #panelRainbows div .main_item_container .main_item > .main_item_departure {
        grid-row: 1;
        grid-column: 1;
    }

    #panelRainbows div .main_item_container .main_item > .main_item_station {
        grid-row: 1;
        grid-column: 3;
    }

    #panelRainbows div .main_item_container .main_item > .main_item_line {
        grid-row: 3;
        grid-column: 1;
    }

    #panelRainbows div .main_item_container .main_item > .main_item_platform {
        grid-row: 3;
        grid-column: 3;
    }
}
#icon_scroll {
    position: fixed;
    bottom: calc(
            var(--footer-height) + var(--sub-menu) + var(--template-padding)
    );
    right: var(--template-padding);
    z-index: 100;
}

.carbonbox {
    display: none;
}

.station::before {
    left: calc(4em + 20px);
    box-shadow: 0 2px 2px #484848;
    -webkit-box-shadow: 0 2px 2px #484848;
}
.TOCGR .station::before {
    -webkit-box-shadow:none;
    box-shadow:none;
}
.panel_sub_menu_active {
    height: var(--panel-sub-menu-active) !important;
}
.uppercrust_title {
    text-align: center;
    display: none;
}

.uppercrust_container {
    grid-area: content;
    padding: var(--template-padding);
}

@media screen and (min-width: 768px) {
    .uppercrust_container {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: min-content auto auto;
        grid-template-areas:
        "fnTitle fnTitle fnTitle"
        "fnImg fnTerms fnTerms"
        "fnImg fnTerms fnTerms";
    }

    .uppercrust_title {
        display: block;
        grid-column-start: 2;
        place-self: start;
    }

    .uppercrust_img {
        grid-area: fnImg;
        margin-left: unset !important;
        place-self: center;
        grid-row-start: 2;
        grid-row-end: 3;
    }

    .uppercrust_voucherInfo {
        grid-area: fnTerms;
        margin: unset !important;
    }

    .uppercrust_voucherInfo_title {
        place-self: start !important;
    }

    .uppercrust_voucherInfo_terms {
        height: auto !important;
    }

    .uppercrust_terms-gradient {
        display: none;
    }

    .uppercrust_voucherInfo_validFrom {
        place-self: start !important;
    }

    .uppercrust_voucherInfo_validTo {
        place-self: start !important;
    }

    .uppercrust_voucherInfo_code {
        place-self: start !important;
    }

    .uppercrust_voucherInfo_offer {
        grid-column-start: unset !important;
        grid-column-end: unset !important;
        place-self: unset !important;
        margin-top: var(--template-padding);
    }

    .uppercrust_voucherInfo_offer a {
        font-size: 1.4rem;
        text-decoration: none;
        text-align: center;
    }
}

.uppercrust_container p {
    margin: var(--template-padding) 0;
    font-size: 1.4rem;
    line-height: 2;
}

.uppercrust_img {
    /* width: 40%; */
    max-width: 1100px;
    display: flex;
    /* margin-left: 30%; */
}

.uppercrust_img svg {
    width: 60%;
    margin: 10% 20%;
    height: auto;
}

.uppercrust_terms-gradient {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    height: 75px;
    transition: all 0.3s ease;
    opacity: 1;
    visibility: visible;
    background: linear-gradient(rgba(250, 250, 250, 0.3), rgba(250, 250, 250, 1));
    /* linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%); */
}

.statusSeverityDescription {
    color: black !important;
}

.panelSizer2 {
    -webkit-animation-name: fadeForPanel;
    animation-name: fadeForPanel;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
}
#panelForlineDiagram1 .linesymbol {
    left: 20px
}

.icon_capacity {
    width: 40px;
    margin-left: 5px;
}

.loadingmessage {
    border: none !important;
}
.main_item_tell input {
    width: 100%;
    height: 3rem;
    margin-top: var(--template-padding);
    border-radius: 5px;
    font-size: var(--text-input);
    padding: 0 var(--template-padding);
    border: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.TOCGR .main_item_tell input {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.main_item_tell input:focus {
    border: 1px none solid;
    outline-color: transparent;
    outline-style: none;
}
.main_item_tell button {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    border-radius: 5px;
    /* -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);  */
    color: #000;
    background: none;
    cursor: pointer;
    font-size: 1.3rem;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 5rem;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 80%;
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.TOCGR .main_item_tell button {
    box-shadow:none;
    -webkit-box-shadow:none;
}
.main_item_tell {
    width: 100%;
    padding: 0 var(--template-padding);
    /* padding: 0 var(--template-padding);
    margin-top: var(--template-padding); */
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    position: relative;
}
#feedback {
    min-height: 150px;
    resize: none;
    border-radius: 5px;
    font-size: var(--text-input);
    padding: var(--template-padding);
    width: 100%;
    margin-top: var(--template-padding);
    border: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.TOCGR #feedback {
    box-shadow:none;
    -webkit-box-shadow:none;
}

#feedback:focus {
    border: 1px none solid;
    outline-color: transparent;
    outline-style: none;
}

#feedback:invalid {
    background: rgba(255, 0, 0, 0.6);
}
#feedback_counter {
    display: none;
    padding: var(--template-padding);
    padding-left: 5px;
    font-size: 1rem;
    height: 3rem;
}
.main_weather {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    width: 100%;
    grid-area: content;
}
.time_active {
    border: 1px black solid !important;
    border-radius: 3px;
}
.geolocationAlertBox {
    z-index: 100;
    width: 80vw;
    position: absolute;
    top: 35vh;
    height: 30vh;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    padding: var(--template-padding);
    text-align: center;
    align-items: center;
    /*   border:1px black solid; */
    background: white;
    border-radius: 5px;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}

.TOCGR .geolocationAlertBox {
    box-shadow:none;
    -webkit-box-shadow:none;
}

@media screen and (min-width: 1100px) {
    .geolocationAlertBox {
        width: 60vw;
    }
}
.geolocationAlertBox button {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    padding: var(--template-padding) calc(var(--template-padding) / 2);
    border-radius: 3px;
    /* -webkit-box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%);
     box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%);*/
    color: #000;
    background: none;
    width: 30%;
    cursor: pointer;
    font-size: 1.3rem;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR .geolocationAlertBox button {
    box-shadow:none;
    -webkit-box-shadow:none;
}
.onboardMenu {
    position: fixed;
    top: 0;
}

@media screen and (min-width: 1100px) {
    .onboardMenu {
        max-width: 959px;
    }
}
.autocomplete label {
    display: none;
}
.freenow_title {
    text-align: center;
    display: none;
}

.freenow_container {
    grid-area: content;
    padding: var(--template-padding);
}

@media screen and (min-width: 768px) {
    .freenow_container {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: min-content auto auto;
        grid-template-areas:
        "fnTitle fnTitle fnTitle"
        "fnImg fnTerms fnTerms"
        "fnImg fnTerms fnTerms";
    }

    .freenow_title {
        display: block;
        grid-column-start: 2;
        place-self: start;
    }

    .freenow_img {
        grid-area: fnImg;
        margin-left: unset !important;
        place-self: center;
        grid-row-start: 2;
        grid-row-end: 3;
    }

    .freenow_voucherInfo {
        grid-area: fnTerms;
        margin: unset !important;
    }

    .freenow_voucherInfo_title {
        place-self: start !important;
    }

    .freenow_voucherInfo_terms {
        height: auto !important;
    }

    .freenow_terms-gradient {
        display: none;
    }

    .freenow_voucherInfo_validFrom {
        place-self: start !important;
    }

    .freenow_voucherInfo_validTo {
        place-self: start !important;
    }

    .freenow_voucherInfo_code {
        place-self: start !important;
    }

    .freenow_voucherInfo_offer {
        grid-column-start: unset !important;
        grid-column-end: unset !important;
        place-self: unset !important;
        margin-top: var(--template-padding);
    }

    .freenow_voucherInfo_offer a {
        font-size: 1.4rem;
        text-decoration: none;
        text-align: center;
    }
}

.freenow_container p {
    margin: var(--template-padding) 0;
    font-size: 1.4rem;
    line-height: 2;
}

.freenow_img {
    /* width: 40%; */
    max-width: 1100px;
    display: flex;
    /* margin-left: 30%; */
}

.freenow_img svg {
    width: 60%;
    margin-left: 20%;
}

.freenow_terms-gradient {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    height: 75px;
    transition: all 0.3s ease;
    opacity: 1;
    visibility: visible;
    background: linear-gradient(rgba(250, 250, 250, 0.3), rgba(250, 250, 250, 1));
    /* linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%); */
}
@media only screen and (min-width: 768px) {
    .freenow_img {
        height: 40vh;
        object-position: center;
        object-fit: cover;
    }
}

.freenow_voucherInfo {
    display: grid;
    margin-top: var(--template-padding);
    grid-template-columns: auto auto;
    grid-template-rows: min-content;
}

.freenow_voucherInfo_offer {
    grid-column-start: 1;
    grid-column-end: 3;
    place-self: center;
    margin-top: var(--template-padding);
}

.freenow_voucherInfo_offer a {
    font-size: 1.4rem;
    text-decoration: none;
    text-align: center;
    color: #000;
    font-weight: 600;
}

.freenow_voucherInfo_code {
    font-size: 1.4rem;
    font-weight: 700;
    place-self: center;
    grid-column-end: 3;
    grid-column-start: 1;
    margin: calc(var(--template-padding) / 2) 0;
}

.freenow_voucherInfo_title {
    grid-column-end: 3;
    grid-column-start: 1;
    font-size: 1.4rem;
    font-weight: 700;
    place-self: center;
}

.freenow_voucherInfo_validFrom {
    place-self: start;
}

.freenow_voucherInfo_validTo {
    place-self: end;
}

.freenow_voucherInfo_validFrom,
.freenow_voucherInfo_validTo {
    margin-top: var(--template-padding);
    font-size: 1.2rem;
}

.freenow_voucherInfo_terms {
    grid-column-start: 1;
    grid-column-end: 3;
    margin: var(--template-padding) 0;
    font-size: 1.4rem;
    line-height: 2;
    position: relative;
    height: 100px;
    overflow: hidden;
    transition: all 0.3s ease;
    font-weight: 300;
}
@media only screen and (min-width: 768px) {
    .uppercrust_img {
        height: 40vh;
        object-position: center;
        object-fit: cover;
    }
}

.uppercrust_voucherInfo {
    display: flex;
    margin-top: var(--template-padding);
    flex-direction: column;
    text-align: justify;
}


.uppercrust_voucherInfo_hr {
    width: 156px;
    border: none;
    height: 1px;
    background-color: black;
}

.uppercrust_voucherInfo_offer {
    grid-column-start: 1;
    grid-column-end: 3;
    place-self: center;
    margin-top: var(--template-padding);
}

.uppercrust_voucherInfo_offer a {
    font-size: 1.4rem;
    text-decoration: none;
    text-align: center;
    color: #000;
    font-weight: 600;
}

.uppercrust_voucherInfo_code {
    font-size: 1.4rem;
    font-weight: 700;
    place-self: center;
    grid-column-end: 3;
    grid-column-start: 1;
    margin: calc(var(--template-padding) / 2) 0;
}

.uppercrust_voucherInfo_title {
    grid-column-end: 3;
    grid-column-start: 1;
    font-size: 1.4rem;
    font-weight: 700;
    place-self: center;
}

.uppercrust_voucherInfo_validDates {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
    border-radius: 5px;
    margin: 10px auto auto auto;
    padding: 2px 4px;
}

.uppercrust_voucherInfo_validFrom {
    place-self: start;
}

.uppercrust_voucherInfo_validTo {
    place-self: end;
}

.uppercrust_voucherInfo_validFrom,
.uppercrust_voucherInfo_validTo {
    margin: var(--template-padding);
    font-size: 1.2rem;
}

.uppercrust_voucherInfo_terms {
    grid-column-start: 1;
    grid-column-end: 3;
    margin: var(--template-padding) 0;
    font-size: 1.4rem;
    line-height: 2;
    position: relative;
    height: 100px;
    overflow: hidden;
    transition: all 0.3s ease;
    font-weight: 300;
}
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    width: 64px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
    /* border: 1px black solid; */
    max-width: 95%;
}

.slider:before {
    position: absolute;
    content: "";
    height: calc(100% - 8px);
    width: 25px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}
input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}
.TOCGR input:focus + .slider {
    box-shadow:none;
    -webkit-box-shadow:none;
}

input:checked + .slider:before {
    -webkit-transform: translateX(95%);
    transform: translateX(95%);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

.delay-back {
    display: none;
    place-self: center;
    width: 100%;
}

.delay-back-active {
    display: block;
    grid-area: logo;

}

.delay-active-email, .delay-active-prod {
    display: none;
    grid-column-start: 1;
    grid-column-end: 3;
    padding: 0 !important;
    align-self: center;
    font-size: 1.3rem;
    font-weight: 700;
    color: red;
    grid-area: message;
}

.delay-active-email-show, .delay-active-prod-show {
    display: block;
}
.delay-active-message-hide {
    display: none !important;
}
#food-menu {
    visibility: hidden;
    opacity: 0;
    transition: all 1.2s ease-in-out;
}

.food-menu-visible {
    opacity: 1 !important;
    visibility: visible !important;
}
.greggs_offer {
    position: absolute;
    /* height: 100px; */
    bottom: -61px;
    /* border-top: none; */
    /* height: 100px; */
    /* bottom: 0; */
    height: auto;
    background: #fff;
    border: 1px black solid;
    width: 100%;
    margin-left: calc(var(--template-padding) * -1);
    /* border-radius: 0 0 5px 5px; */
    padding: var(--template-padding);
    display: grid;
    grid-template-columns: 2fr 5fr 1fr;
    grid-auto-rows: min-content;
    border-top: none;
    border-right: none;
    place-items: center;
    border-left: none;
}

.greggs_offer svg {
    width: 100%;
    height: 100%;
}

.greggs_offer div:first-of-type {
    padding: 0 var(--template-padding);
}

.greggs_offer_close {
    stroke: black;
    stroke-width: 13px;
    height: 20px;
}

#header-icon_freenow, #header-icon_freenow-offer, #icon_freenow-offer {
    width: 75px;
    place-self: center;
    padding-right: 8px;
}

#icon_uppercrust-offer {
    width: 75px;
    place-self: center;
    padding-right: 8px;
}
.loadingmessage {
    font-variant: small-caps;
    border: 1px solid black;
    padding-left: 2px;
    padding-right: 2px;
}
#aforfooterButtonbusstops0 p,
#aforfooterButtonbusstops1 p,
#aforfooterButtonbusstops2 p,
#aforfooterButtonbusstops3 p,
#aforfooterButtonbusstops4 p,
#aforfooterButtonbusstops5 p,
#aforfooterButtonbusstops6 p,
#aforfooterButtonbusstops7 p {
    /* margin-right:10px; */
    color: #000;
    position: absolute;
}

#aforfooterButtonbusstops0 p {
    color: white
}
.loadingmessage {
    visibility: hidden !important;
    display: none !important;
}
.loadingmessage-display {
    visibility: visible !important;
    display: unset !important;
}
.badJourneyContainer {
    padding: var(--template-padding);
    height: 100%;
}

.badJourneyWrapper {
    display: grid;
    grid-auto-rows: auto;
    row-gap: var(--template-padding);
    place-items: center;
    height: calc(100vh - calc(var(--footer-height) + var(--header-height)) - var(--template-padding));
}

#badJourneyTrain {
    width: 80%;
    stroke-width: 21px;
}

.badJourneyWrapper p {
    text-align: center;
    font-size: 1.8rem;
    line-height: 2;
}
.late_train {
    grid-area: train;
}
.not-yet-running {
    position: fixed;
    display: grid;
    grid-template-rows: 3fr 1fr;
    grid-template-areas: "train"
    "message";
    row-gap: var(--template-padding);
    width: 100px;
    padding: 100px;
    height: 100px;
    top: calc(50% - 100px);
    right: calc(50% - 100px);
    border: 1px black solid;
    z-index: 5000;
    border-radius: 50%;
    background-color: var(--colorTheme);
}
.key-wrapper {
    display: grid;
    grid-area: keys;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: min-content;
    column-gap: var(--template-padding);
    row-gap: 8px;
}

.key-title {
    grid-area: title;
    padding: var(--template-padding) 0;
}

.key-container {
    padding-bottom: var(--template-padding);
    /* padding-top:var(--template-padding); */
    padding-left: var(--template-padding);
    padding-right: var(--template-padding);
    display: grid;
    row-gap: 8px;
    grid-template-areas:"title title"
                        "keys keys";
    margin: var(--template-padding);
    /* border: 1px black solid;
    border-radius: 21px; */
}

.key-container .key-wrapper {
    border-radius: 20px;
    border: 1px black solid;
    padding: var(--template-padding);
    line-height: 2;
}

.key-container .key-title {
    padding-bottom: 0;
}

.key-item {
    display: none;
    grid-template-columns:1fr 1fr;
    column-gap: 5px;
    align-items: center;
}

.key-container .key-item {
    display: grid;
}

.journey-key-item {
    display: grid;
    grid-template-columns:1fr 1fr;
    column-gap: 5px;
    align-items: center;
}

.key-item .icon_capacity {
    width: 50px;
    margin-left: unset;
}

.journey-key-icon {
    width: 50px;
}

.key-item div, .journey-key-item div {
    font-size: 1.3rem;
    font-weight: 600;
}


.key-container-journey {
    display: none;
    padding-bottom: var(--template-padding);
    padding-left: var(--template-padding);
    padding-right: var(--template-padding);
    display: none;
    row-gap: 8px;
    grid-template-areas:"title title"
                        "keys keys";
    margin: var(--template-padding);
    border: 1px black solid;
    border-radius: 21px;
}

.key-active {
    display: grid;
}

.TOCGR .app .scroll-to-top {
    background-color: var(--lner);
}

.scroll-to-top {
    width: 100px;
    margin: var(--template-padding) auto 0;
    border-radius: 50px 50px 0 0;
    background-color: var(--colorTheme);
    display: flex;
    flex-direction: column;
    justify-items: center;
    align-items: center;
    visibility: hidden;
    opacity: 0;
}

.scroll-to-top:hover {
    cursor: pointer;
}

.scroll-to-top-hide {
    display: none;
}

.scroll-to-top-svg {
    width: 50%;
}

.scroll-to-top-paths {
    stroke: #FFF;
}
.compensation-file-upload::-webkit-file-upload-button {
    visibility: hidden;
}

.compensation-file-upload::before {
    content: 'Upload ticket';
    display: inline-block;
    background: linear-gradient(top, #f9f9f9, #e3e3e3);
    border: 1px solid #999;
    border-radius: 3px;
    padding: 5px 8px;
    outline: none;
    white-space: nowrap;
    -webkit-user-select: none;
    cursor: pointer;
    text-shadow: 1px 1px #fff;
    font-weight: 700;
    font-size: 10pt;
}

.compensation-file-upload:hover::before {
    border-color: black;
}

.compensation-file-upload:active::before {
    background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
}
.buses_sub_menu_active {
    top: calc(var(--sub-menu) * -1);
    display: block !important;
}
.delayrepayplease {
    background-color: yellow;
}
.delayrepaypicked {
    border: 2px solid red;
}

div.voi-link {
    display: flex;
    justify-content: center;
}

div.voi-link a svg {
    width: 100px;
}

div.voi-link button {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    border-radius: 5px;
    color: #000;
    background: #FFF;
    cursor: pointer;
    font-size: 1.3rem;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 55px;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    margin: var(--template-padding) 0;
    width: 90%;
    margin-left: 5%;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR div.voi-link-button {
    box-shadow:none;
    -webkit-box-shadow:none;
}

div.voi-link button:focus,
div.voi-link a:focus
div.voi-link:focus {
    border: none;
    outline: none;
}

div.voi-link a {
    text-decoration: none;
    outline: none;
}
svg.whsmith-offer-logo {
    width: 100%;
    margin-left: unset;
}

.event-schedule-container {
    display: flex;
    margin-top: 20px;
}

.event-schedule-wrapper {
    /* grid-area:
    wrapper; */
    width: 100%;
    overflow-x: scroll;
    display: flex;
    row-gap: 8px;
    column-gap: 8px;
    position: relative;
    flex-direction: column;
    align-items: center;
}

.event-schedule-matches {
    grid-area: titles;
    display: flex;
    row-gap: 8px;
    grid-row-start: 2;
    flex-direction: column;
    padding: 133px 0 0 0;
    row-gap: 8px;
    align-items: center;
}

.event-schedule-matches div {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 8px;
    height: 100px;
    width: 100px;
    margin: 13px 10px 7px;
}


.event-schedule-grid {
    display: flex;
}

/*.event-schedule-grid div {*/
/*    !* width:80px;*/
/*    height:80px; *!*/
/*    !* border:1px black solid; *!*/
/*    !* padding:8px; *!*/
/*    !* margin: 0 10px; *!*/
/*    !* height: 50px; *!*/
/*    !* width: 50px; *!*/
/*}*/

.event-schedule-event-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 100px;
    margin-left: 1vw;
    align-content: center;
    flex-wrap: wrap;
}


.event-schedule-event {
    width: 100px;
    height: 100px;
    padding: 8px;
    border-radius: 8px;
    display: block;
}

.event-schedule-no-event {
    width: 80px;
    height: 80px;
    padding: 5px;
    border-radius: 8px;
    display: block;
}

.event-schedule-active-start {
    border-radius: 3px 0 0 3px;
    padding: 13px 0 13px 13px;
}

.event-schedule-active-middle {
    padding: 13px 0;
}

.event-schedule-active-end {
    border-radius: 0 3px 3px 0;
    padding: 13px 13px 13px 0;
}

.event-schedule-date {
    display: flex;
    /* flex-direction:
    column; */
    /* width: 80px; */
    /* height: 80px; */
    justify-content: center;
    align-items: center;
}


.event-schedule-date-wrapper,
.event-schedule-month-wrapper {
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #004d71;
    border: none;
    padding: unset;
    margin: 0 10px;
    height: 60px;
    width: 60px;
}

.event-schedule-month-wrapper {
    border-radius: 0;
    width: 150px;
    background: #004d71;
    color: white;
    height: 25px;
    padding: 0;
}


.event-schedule-date-text,
.event-schedule-month-text {
    width: auto;
    height: auto;
    color: #FFF;
    font-weight: 700;
}

.event-schedule-calendar,
.event-schedule-months {
    place-items: center;
    position: sticky;
    align-self: start;
    top: 0;
    transition: all 0.2s ease;
    FONT-WEIGHT: 100;
}

.event-schedule-months {
    height: 25px;
}

div.event-schedule-grid .event-schedule-date {
    width: 100px;
    height: 100px;
    font-size: 14px;
    FONT-WEIGHT: 100;
    margin-left: 1vw;
}
.event-schedule-title-venue {
    position: absolute;
    /* width:100%; */
    background-color: #FFF;
    bottom: 0;
    height: auto;
    display: none;
    padding: 0 var(--template-padding);
    border: #004d71 3px solid;
    max-width: 300px;
    /* display:flex; */
}

.event-schedule-title-venue-visible, .event-schedule-title-venue-popin {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    animation: addPopin .3s;
    width: 150px;
    text-align: center;
    /* position: sticky;
    left: 0; */
}

@media screen and (min-width: 375px) {
    .event-schedule-title-venue-visible, .event-schedule-title-venue-popin {
        width: 215px;
    }
}

@media screen and (min-width: 768px) {
    .event-schedule-title-venue-visible, .event-schedule-title-venue-popin {
        width: 300px;
    }
}
.event-schedule-title {
    font-size: 1rem;
    font-weight: 600;
    /* align-self:center; */
}

.event-schedule-venue {
    font-size: 1rem;
    margin-top: 2px;
    /* align-self: center; */
}

@media screen and (min-width: 375px) {
    .event-schedule-title {
        font-size: 1.3rem;
    }

    .event-schedule-venue {
        font-size: 1.1rem;
        margin-top: 4px;
    }
}
.event-schedule-matches div svg {
    pointer-events: none;
}
.event-schedule-scroll {
    position: fixed;
    right: var(--template-padding);
    width: 60px;
    height: 60px;
    border-radius: 30px;
    background-color: white;
    padding: 5px;
    opacity: 0.4;
    transition: all 0.2s ease;
}
@media screen and (min-width: 1200px) {
    .event-schedule-scroll {
        position: absolute;
        left: 275px;
    }
}

.event-schedule-scroll svg {
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    pointer-events: none;
}
#panelCommonwealthgames {
    position: relative;
    width: 100vw;
}

@media screen and (min-width: 1100px) {
    #panelCommonwealthgames {
        position: relative;
        width: 80vw;
    }
}

@keyframes spinPlay {
    50% {
        width: 70%;
    }
    100% {
        transform: rotateY(360deg);
    }
}

@keyframes jello {
    from,
    11.1%,
    to {
        transform: translate3d(0, 0, 0);
    }

    22.2% {
        transform: skewX(-12.5deg) skewY(-12.5deg);
    }

    33.3% {
        transform: skewX(6.25deg) skewY(6.25deg);
    }

    44.4% {
        transform: skewX(-3.125deg) skewY(-3.125deg);
    }

    55.5% {
        transform: skewX(1.5625deg) skewY(1.5625deg);
    }

    66.6% {
        transform: skewX(-0.78125deg) skewY(-0.78125deg);
    }

    77.7% {
        transform: skewX(0.390625deg) skewY(0.390625deg);
    }

    88.8% {
        transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    }
}

.animation_commonwealthgames_1,
.animation_upcomingevents_1 {
    transform-origin: center center;
    animation: jello 0.9s;
    -webkit-animation: jello 0.9s;
}

.animation_commonwealthgames_2,
.animation_upcomingevents_2 {
    animation: bloat 0.6s ease;
    -webkit-animation: bloat 0.6s ease;

    transform-origin: center center;

}
#event-schedule-scroll-forward:hover {
    cursor: pointer;
}

#event-schedule-scroll-back:hover {
    cursor: pointer;
}

#event-schedule-scroll-back {
    left: var(--template-padding);
}

#event-schedule-scroll-back svg {
    transform: rotate(90deg);
}

.event-schedule-scroll-hide {
    /* display:none; */
    opacity: 0;
    visibility: hidden;
}

.event-schedule-close {
    display: none;
}
.event-schedule-introduction {
    position: relative;
    width: 100%;
    padding: 8px var(--template-padding);
}

.event-schedule-intro-text {
    font-size: 1.3rem;
    line-height: 2;
    pointer-events: none;
}

.event-schedule-bottom {
    bottom: var(--footer-height);
}
.event-schedule-calendar-hide {
    visibility: hidden;
    opacity: 0;
}

.event-schedule-introduction:hover {
    cursor: pointer;
}
.event-schedule-arrow-container {
    height: 100px;
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 6;
}

@media screen and (min-width: 1100px) {
    #event-schedule-scroll-back {
        left: calc(20vw + var(--template-padding));
    }
}

@media screen and (min-width: 1200px) {
    #event-schedule-scroll-back {
        left: -575px;
    }
}
svg.leg-status-icon {
    width: 100%;
}
.location-svg-hide {
    visibility: hidden;
    opacity: 0;
}
@media only screen and (min-width: 1100px) {
    .event-schedule-title-venue {
        max-width: 400px;
    }
}

. /*multilingual*/
{
    display: inline;
    font-size: 100%;
}
.mlcontent {
    /*width: 100%;*/
    /*background-color: palegreen;*/
    /*border: 1px solid red;*/
    /*display: none;*/
    /*visibility: hidden;*/
}
#panelFeedback mlcontent {
    height: 100%;
}

.strInteral {
    display: none;
    visibility: hidden;
}
.rental-no-data {
    display: none;
}
.header_logo svg.svg-scale {
    top: 10vh;
    position: fixed;
    transform: scale(3);
    height: 70px;
    max-width: 30%;
    -webkit-transition: opacity 1s ease;
    transition: opacity 1s ease;
}

@media screen and (min-width: 1200px) {
    .header_logo svg.svg-scale {
        left: 0;
        margin: auto;
        right: 17em;
    }

    .svg-scale-down {
        -webkit-animation: scaleDesktop 1.3s ease forwards;
        animation: scaleDesktop 1.3s ease forwards;
    }
}
.journey-rtiv2-button {
    display: none;
    padding: 13px 8px;
    font-size: 1.3rem;
    font-weight: 300;
    text-align: center;
    background: none;
    border: none;
    width: 100%;
    margin-top: 13px;
    /* border: 1px var(--gwr) solid; */
    box-shadow: 0 1px 3px #878080;
    border-radius: 5px;
    color: #FFF;
}
.TOCGR .journey-rtiv2-button {
    box-shadow: none;
    -webkit-box-shadow: none;
}

.TOCGW .app #panelJourney .panelForlineDiagram .journey-rtiv2-button {
    background: var(--gwr);
}

.TOCNT .app #panelJourney .panelForlineDiagram .journey-rtiv2-button {
    background: var(--northern);
}

.TOCGC .app #panelJourney .panelForlineDiagram .journey-rtiv2-button {
    background: var(--gc);
}

.TOCRT .app #panelJourney .panelForlineDiagram .journey-rtiv2-button {
    background: var(--nr);
}

.TOCSW .app #panelJourney .panelForlineDiagram .journey-rtiv2-button {
    background: var(--nr);
}

.TOCES .app #panelJourney .panelForlineDiagram .journey-rtiv2-button {
    background: var(--es);
}

.TOCAW .app #panelJourney .panelForlineDiagram .journey-rtiv2-button {
    background: var(--tfw);
}

.journey-rtiv2-button:hover {
    cursor: pointer;
}
.journey-option-visible {
    display: block;
}

.hideFooter {
    transition-timing-function: linear;
    animation: moveFooter .8s ease;
    -webkit-animation: moveFooter .8s ease;
    transform-origin: center;
    animation-fill-mode: forwards;
}
.returnFooter {
    transition-timing-function: linear;
    animation: returnFooter .8s ease;
    -webkit-animation: returnFooter .8s ease;
    transform-origin: center;
    animation-fill-mode: forwards;
}

.mobileApp {
    grid-template-rows: 0 0 auto auto;
}

/*.mobileApp > .singlefullitem {*/
/*    overflow: auto;*/
/*}*/

.mobileApp > .singlefullitem > #panelPlan,
.mobileApp > .singlefullitem > #panelCompensation,
.mobileApp > .singlefullitem > #panelPicker,
.mobileApp > .singlefullitem > #panelTellus,
.mobileApp > .singlefullitem > #panelFeedback {
    height: auto;
}

.mobileApp .singlefullitem #panelJourney {
    height: 100%;
}

.mobileApp > .singlefullitem > .panelSizer > #whooshStations,
.mobileApp > .singlefullitem > .panelSizer > #panelPlanInput,
.mobileApp > .singlefullitem > .panelSizer > #panelJourneypicker,
.mobileApp > .singlefullitem > .panelSizer > .main_item_tell,
.mobileApp > .singlefullitem > .panelSizer > #feedback-multi-step-survey-container,
.mobileApp > .singlefullitem > .panelSizer > #feedback-multi-step-container {
    margin-bottom: 150px;
}

.mobileApp > .above-header-slot-container {
    display: none;
}

.mobileApp .singlefullitem #panelTellus .tell-us-v2-feedback-container .tell-us-v2-introduction {
    display: none;
}

.lds-ellipsis-container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 100%;
}

.lds-ellipsis-container-small,
.feedback-ellipsis-container-small {
    height: 50px;
}

.lds-ellipsis,
.feedback-ellipsis {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}

.lds-ellipsis div,
.feedback-ellipsis div {
    position: absolute;
    top: 33px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: var(--gwr);
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1),
.feedback-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2),
.feedback-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3),
.feedback-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4),
.feedback-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
}
.uk-introduction-container {
    /* padding: var(--template-padding) 0; */
    /* margin-top: var(--template-padding); */
    font-size: 1.4rem;
    padding-bottom: 0;
    padding: var(--template-padding);

}

.uk-introduction-container p {
    font-size: 1.3rem;
    line-height: 2;
}

.uk-introduction-container h2 {
    margin-bottom: var(--template-padding);
}

.uk-introduction-container p:first-of-type {
    margin-bottom: var(--template-padding);
}
#panelBusstops .panelForlineDiagram .classDebugLocation ul .station:before {
    background: #DC241F;
}

#panelBusstops .panelForlineDiagram h1 {
    display: none;
}

#panelBusstops .panelForlineDiagram .main_header h1 {
    display: unset;
    padding: 0;
}

div.panelForlineDiagram .infobutton {
    width: 20px;
    height: 20px !important;
    margin-left: 0.5em;
    display: inline-block;
    background-size: contain;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDBweCIgaGVpZ2h0PSIxMDBweCIgdmlld0JveD0iMCAwIDEwMCAxMDAiPgo8cGF0aCBkPSJNNTAuNDMzLDAuODkyYy0yNy4xMTksMC00OS4xMDIsMjEuOTgzLTQ5LjEwMiw0OS4xMDJzMjEuOTgzLDQ5LjEwMyw0OS4xMDIsNDkuMTAzczQ5LjEwMS0yMS45ODQsNDkuMTAxLTQ5LjEwM1M3Ny41NTIsMC44OTIsNTAuNDMzLDAuODkyeiBNNTksNzkuMDMxQzU5LDgzLjQzMyw1NS4xOTQsODcsNTAuNSw4N1M0Miw4My40MzMsNDIsNzkuMDMxVjQyLjQ2OWMwLTQuNDAxLDMuODA2LTcuOTY5LDguNS03Ljk2OXM4LjUsMy41NjgsOC41LDcuOTY5Vjc5LjAzMXogTTUwLjQzMywzMS4yMTRjLTUuMDQ4LDAtOS4xNDEtNC4wOTItOS4xNDEtOS4xNDJjMC01LjA0OSw0LjA5Mi05LjE0MSw5LjE0MS05LjE0MWM1LjA1LDAsOS4xNDIsNC4wOTIsOS4xNDIsOS4xNDFDNTkuNTc0LDI3LjEyMiw1NS40ODIsMzEuMjE0LDUwLjQzMywzMS4yMTR6Ii8+Cjwvc3ZnPg==")
}

.TOCNT .app .singlefullitem #panelSurvey .feedback-wrapper {
    height: unset;
    width: unset;
}

.TOCNT .app .singlefullitem #panelSurvey .feedback-wrapper .feedback-step {
    height: unset;
    display: block;
    width: 100%;
}

/*alterations*/
.toggle-content-container,
.alterations-container,
.feedback-terms-container {
    margin-bottom: 30px;
    padding: 0;
}

.toggle-content-list,
.alterations-list,
.feedback-terms-list {
    padding: var(--template-padding);
    list-style: none;
    margin: 0;
}

.toggle-content-list-group,
.alterations-list-group,
.feedback-terms-list-group {
    padding: 0;
}

.toggle-content-header,
.TOCSW > .app > .singlefullitem >
#panelAlterations > .alterations >
.alterations-container > .alterations-list >
.alterations-list-group > .alterations-list-header {
    background-color: var(--sw);
}
.toggle-content-list-header,
.alterations-list-header,
.feedback-terms-list-header {
    background-color: #0a493e;
    border-bottom: 1px solid #fff;
    padding: 13px 0;
    position: relative;
    cursor: pointer;
}
.disruptions-list-header {
    background-color: var(--nr-secondary);
    border-bottom: 1px solid #fff;
    padding: 13px 0;
    position: relative;
    cursor: pointer;
}
.toggle-content-list-headline,
.alterations-list-headline {
    font-size: 14px;
    font-weight: 600;
}

.toggle-content-header,
#panelIndustrialaction > .alterations >
.alterations-container > .alterations-list >
.alterations-list-group > .alterations-list-header {
    background-color: #f9dc5c;
}

#panelIndustrialaction > .alterations >
.alterations-container > .alterations-list >
.alterations-list-group >
.alterations-list-header > .alterations-list-headline {
    color: black;
}

.toggle-content-list-headline,
.alterations-list-headline,
.feedback-terms-list-headline {
    display: block;
    padding: 0 55px 0 10px;
    line-height: 24px;
    color: #fff;
    width: 100%;
}

.toggle-content-open-content,
.alterations-open-content,
.feedback-terms-open-content {
    transform: rotate(270deg);
}

.toggle-content-content,
.alterations-content,
.feedback-terms-content {
    overflow: hidden;
    font-size: 0;
    line-height: 0;
    opacity: 0;
    height: 0;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
}

.toggle-content-content > *,
.alterations-content > *,
.feedback-terms-content > * {
    margin: 15px 0;
    padding: revert;
}

.toggle-content-content-grow,
.alterations-content-grow,
.feedback-terms-content-grow {
    opacity: 1;
    line-height: revert;
    font-size: revert;
    display: block;
    height: auto;
}

.toggle-content-more-information,
.alterations-more-information {
    margin-bottom: 50px;
}
/*safe travel*/
.main_journey {
    width: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    grid-area: content;
    font-size: 12px;
    padding: var(--template-padding) 0;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.main_content_container,
.privacy_policy_container {
    grid-area: content;
    padding: var(--template-padding);
}

.main_content_container p,
.privacy_policy_container p, .main_faq p {
    margin: var(--template-padding) 0 calc(var(--template-padding) * 2) 0;
    font-size: 1.4rem;
    font-weight: 300;
    line-height: 2;
    /* padding:0 var(--template-padding); */
}

.main_content_container p,
.privacy_policy_container p, .main_faq p {
    margin: var(--template-padding) 0 calc(var(--template-padding) * 2) 0;
    font-size: 1.4rem;
    font-weight: 300;
    line-height: 2;
    /* padding:0 var(--template-padding); */
}

@media screen and (min-width: 768px) {
    .main_content_container p,
    .privacy_policy_container p, .main_faq p {
        line-height: 1.8;
    }

    .main_content_container p,
    .privacy_policy_container p, .main_faq p {
        line-height: 1.8;
    }
}

.main_content_container h2,
.privacy_policy_container h2 {
    text-align: left;
}

.main_content_container h2,
.privacy_policy_container h2, .main_faq h2 {
    text-align: left;
    font-size: 1.5rem;

}
.toggle-content,
.safe_message,
.onboard-food,
.alterations {
    padding: 0 var(--template-padding);
    line-height: 1.5;
}
.safe_message p /*multilingual*/
{
    font-size: 1.4rem;
    font-weight: 300;
    line-height: 2;
}

.toggle-content,
.nr_safe_seg,
.alterations,
.taxis{
    margin-bottom: var(--template-padding);
}

.toggle-content h2,
.nr_safe_seg h2,
.onboard-food h2,
.alterations h2 {
    text-align: center;
    margin: 0;
    margin: var(--template-padding) 0;
    font-size: 1.5rem;
}

.toggle-content h2,
.nr_safe_seg h2 /*multilingual*/,
.onboard-food h2 /*multilingual*/,
.alterations h2 /*multilingual*/,
.taxis h2
{
    text-align: center;
    margin: var(--template-padding) 0;
    font-size: 1.5rem;
}

.toggle-content a,
.nr_safe_seg a,
.alterations a,
.taxis a {
    font-size: unset;
    /*text-decoration: underline;*/
    color: #000;
}

.toggle-content a,
.nr_safe_seg a /*multilingual*/,
.alterations a /*multilingual*/,
.taxis a
{
    font-size: unset;
    text-decoration: underline;
    color: #000;
}

.taxis a{
    text-decoration: none;
}

.nr_safe_seg ul li {
    font-size: 1.4rem;
    font-weight: 600;
}

.nr_safe_seg ul li /*multilingual*/
{
    font-size: 1.4rem;
    font-weight: 600;
}

.nr_safe_seg ul {
    padding: var(--template-padding);
    margin: 0;
}

.safe_container {
    margin-bottom: var(--template-padding);
}

@media only screen and (min-width: 1100px) {
    .safe_message {
        text-align: left;
        line-height: 1.8;
        margin-left: calc(24% + var(--template-padding));
    }

    .safe_message p, .safe_message a {
        line-height: 1.8;
    }

    .safe_message p /*multilingual*/, .safe_message a /*multilingual*/
    {
        line-height: 1.8;
    }

    .nr_safe_seg h2, .taxis h2 {
        text-align: left;
    }

    .nr_safe_seg h2, .taxis h2 /*multilingual*/
    {
        text-align: left;
    }

    .nr_safe_seg, .taxis {
        margin-left: var(--templte-padding);
    }
}
.safe_item {
    text-align: center;
    width: 100%;
    display: grid;
    place-items: center;
    grid-template-rows: 3fr -webkit-min-content;
    grid-template-rows: 3fr min-content;
}

.safe_item a {
    font-size: 1.4rem;
    text-decoration: none;
    line-height: 2;
}

.safe_item a /*multilingual*/
{
    font-size: 1.4rem;
    text-decoration: none;
    line-height: 2;
}

.safe_item p {
    margin: 1rem 0;
    /*text-align: left;*/
    padding: 0 var(--template-padding);
    font-size: 1.4rem;
    font-weight: 300;
    line-height: 2;
}

.safe_item p /*multilingual*/
{
    margin: 1rem 0;
    text-align: left;
    padding: 0 var(--template-padding);
    font-size: 1.4rem;
    font-weight: 300;
    line-height: 2;
}

.nr_safe_item p /*multilingual*/
{
    text-align: left;
    padding: 0 var(--template-padding);
}

.safe_container {
    display: -webkit-box;
    display: flex;
    width: 100%;
    -webkit-box-align: start;
    align-items: flex-start;
    justify-content: space-around;
    flex-wrap: wrap;
}

.safe_item svg {
    width: 40%;
    margin: 1rem 0;
    padding: 0 var(--template-padding);
    max-width: 100px;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.4));
    -webkit-filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.4));
}
.TOCGR .safe_item svg {
    filter: none;
    -webkit-filter: none;
}

.safe_video {
    width: 100%;
    height: 250px;
}

.safe_container_video {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    width: 100%;
}

@media screen and (min-width: 768px) {
    .safe_item p, .safe_item a {
        line-height: 1.8;
    }

    .safe_item p /*multilingual*/, .safe_item a /*multilingual*/
    {
        line-height: 1.8;
    }
}

@media only screen and (min-width: 1100px) {
    .safe_item {
        grid-template-rows:unset;
        grid-template-columns:25% auto;
        margin: var(--template-padding);
    }

    .safe_item svg {
        width: 60%;
    }

    .TOCRT .app .singlefullitem #panelSafetravel .main_journey .safe_item {
        place-items: start;
        grid-template-columns: 15% auto;
    }
}

.main_faq {
    line-height: 1.8;
    padding: var(--template-padding);
}

.main_faq p a /*multilingual*/
{
    font-weight: 700;
}

.taxis-button /*multilingual*/
{
    color: #fff;
    text-decoration: none;
}

.nr_safe_seg a .taxis-button /*multilingual*/
{
    color: #fff;
    text-decoration: none;
}
/*offers*/
.offers_landing {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--template-padding);
    line-height: 3rem;
}

.offers_landing:nth-of-type(odd) {
    background: #E5E5E5;
}

.offers_landing > a {
    /*pointer-events: none;*/
    color: black;
}

.offers_landing:hover {
    cursor: pointer;
}

.offers_landing_img {
    max-width: 1100px;
    display: flex;
    margin: 13px auto;
    justify-content: center;
}

.offers_landing_img > svg {
    width: 60%;
    height: auto;
    max-width: 300px;
    max-height: 200px;
}

.offers_landing h3,
.offers_landing a {
    font-weight: 400;
    line-height: 2;
    text-align: center;
}

.offers_landing .offers_landing_info h3 {
    font-weight: bold;
}

.offers_title {
    text-align: center;
    display: none;
}

.offers_container {
    grid-area: content;
    padding: var(--template-padding);
    margin-bottom: 50px;
}

.offers_img_icon {
    /*border: 1px black solid;*/
    border-radius: 10px;
    max-width: 70px;
    grid-area: offIcon;
}

.offers_container_svg {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    grid-area: offSVG;
    align-items: center;
    grid-template-areas:
        "offIcon offLogo offLogo"
        "offVoucher offVoucher offVoucher";
}

@media screen and (min-width: 768px) {
    .offers_container {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: 1fr;
        grid-template-areas:
        "offSVG offTitle offTitle"
        "offSVG offTerms offTerms"
        ". button button"
        "conditions conditions conditions";
    }


    .offers_container_svg {
        grid-area: offSVG;

    }

    .offers_title {
        display: block;
        grid-column-start: 2;
        place-self: start;
    }

    .offers_img {
        grid-area: offImg;
        margin-left: unset;
        place-self: center;
        grid-row-start: 2;
        grid-row-end: 3;
    }

    .offers_voucherInfo {
        grid-area: offTerms;
        margin: unset;

    }

    .offers_voucherInfo_title {
        place-self: start;
    }

    .offers_voucherInfo_terms {
        height: auto;
    }

    .offers_terms-gradient {
        display: none;
    }

    .offers_voucherInfo_validTo {
        place-self: start;

    }

    .offers_voucherInfo_code {
        place-self: start
    }

    .offers_voucherInfo_offer {
        grid-column-start: unset;
        grid-column-end: unset;
        place-self: unset;
        margin-top: var(--template-padding);
    }

    .offers_voucherInfo_offer a {
        font-size: 1.4rem;
        text-decoration: none;
        text-align: center;
    }
}

.offers_container p {
    margin: var(--template-padding) 0;
    font-size: 1.4rem;
    line-height: 2;
}

.offers_img {
    max-width: 1100px;
    grid-area: offLogo;
}
.offers_img svg {
    width: 60%;
    margin-left: 5%;
    height: auto;
    max-height: 200px;
}

.offers_voucherInfo {
    margin: 5%;
    grid-area: offVoucher;
}

.offers_voucherInfo_offer {
    margin-top: var(--template-padding);
}

.offers_voucherInfo_offer a {
    font-size: 1.4rem;
    text-decoration: none;
    text-align: center;
    color: #000;
    font-weight: 600;
}

.offers_voucherInfo_code {
    font-size: 1.4rem;
    font-weight: 700;
    margin: calc(var(--template-padding) / 2) 0;
}

.offers_voucherInfo_title {
    font-size: 1.4rem;
    font-weight: 700;
    place-self: center;
}

.offers_voucherInfo_validDates {
    border-radius: 5px;
    margin: 10px auto auto auto;
    padding: 2px 4px;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .offers_voucherInfo_validDates > a {
        text-align: center;
    }
}

.offer_conditions {
    grid-area: conditions;
}

.offers_voucherInfo_validTo {
    font-size: 1.4rem;
    font-weight: bold;
    margin: calc(var(--template-padding) / 2) 0;
}

.offers_voucherInfo_terms {
    margin-top: var(--template-padding);
    font-size: 1.4rem;
    line-height: 2;
    position: relative;
    height: 100px;
    overflow: hidden;
    transition: all 0.3s ease;
    font-weight: 300;
    grid-area: offTerms;
}
.terms-active {
    height: unset;
    overflow: visible;
}
.download-button-container {
    display: none;
    margin-bottom: calc(var(--template-padding) * 2);
    width: 100%;
    max-width: 250px;
    margin-left: auto;
    margin-right: auto;
    align-items: center;
    justify-content: center;
    height: 75px;
    border-radius: 3px;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.TOCGR .download-button-container {
    box-shadow:none;
    -webkit-box-shadow:none;
}
.TOCRT .app .singlefullitem #panelOffers .download-button-container,
.TOCES .app .singlefullitem #panelOffers .download-button-container,
.TOCGC .app .singlefullitem #panelOffers .download-button-container,
.TOCPP .app .singlefullitem #panelOffers .download-button-container {
    display: flex;
    grid-area: button;
    margin-top: var(--template-padding);
    display: flex;
}

.download-button-anchor {
    text-align: center;
    width: 100%;
    font-size: 1.3rem;
    font-weight: 700;
    color: #000;
}

.offer-panel {
    display: none;
}

.offer-panel-active {
    display: block;
    margin-bottom: 50px;
}
.offers-return {
    z-index: 1;
    cursor: pointer;
}

/*supermap*/
.vic-level-menu,
.manchester-level-menu,
.manchester-upstairs-level-menu,
.euston-level-menu,
.euston-mezzanine-level-menu,
.liverpool-level-menu,
.new-street-level-menu {
    position: absolute;
    /* border: 1px black solid; */
    top: calc(50% - 120px);
    height: 280px;
    width: 32px;
    right: 0;
    display: flex;
    background: #FFF;
    box-shadow: -1px 1px 3px grey;
    flex-direction: column;
    justify-content: space-around;
    z-index: 1;
    align-items: center;
}
.TOCGR .vic-level-menu,
.TOCGR .manchester-level-menu,
.TOCGR .manchester-upstairs-level-menu,
.TOCGR .euston-level-menu,
.TOCGR .euston-mezzanine-level-menu,
.TOCGR .liverpool-level-menu,
.TOCGR .new-street-level-menu {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.vic-level-inactive,
.manchester-level-inactive,
.manchester-upstairs-level-inactive
.euston-level-inactive,
.euston-mezzanine-level-inactive,
.liverpool-level-inactive,
.new-street-level-inactive {
    opacity: 0.6;
}

.vic-level-active,
.euston-level-active,
.euston-mezzanine-level-active,
.manchester-level-active,
.manchester-upstairs-level-active,
.liverpool-level-active,
.new-street-level-active {
    color: red;
    text-shadow: 0 0 black;
}

.vic-level-selection,
.manchester-level-selection,
.manchester-upstairs-level-selection,
.euston-level-selection,
.euston-mezzanine-level-selection,
.liverpool-level-selection,
.new-street-level-selection {
    transform: rotate(-90deg);
    font-size: 12px;
    width: 85px;
    height: 16px;
    text-align: center;
}

.vic-level-selection:hover,
.manchester-level-selection:hover,
.manchester-upstairs-level-selection:hover,
.liverpool-level-selection:hover,
.euston-level-selection:hover,
.euston-mezzanine-level-selection:hover,
.new-street-level-selection:hover {
    transform: rotate(-90deg);
    cursor: pointer;
}

#vic-level-faqs {
    display: none;
}
.vic-faq-container,
.manchester-faq-container,
.manchester-upstairs-faq-container,
.vic-faq-container,
.euston-faq-container,
.euston-mezzanine-faq-container,
.liverpool-faq-container,
.new-street-faq-container {
    width: calc(100vw);
}

.vic-faq-tile,
.manchester-faq-tile,
.manchester-upstairs-faq-tile,
.euston-faq-tile,
.euston-mezzanine-faq-tile,
.liverpool-faq-tile,
.new-street-faq-tile {
    padding: var(--template-padding);
}

.vic-faq-tile:hover,
.manchester-faq-tile:hover,
.manchester-upstairs-faq-tile:hover,
.euston-faq-tile:hover,
.euston-mezzanine-faq-tile:hover,
.liverpool-faq-tile:hover,
.new-street-faq-tile:hover {
    cursor: pointer;
}

.vic-faq-tile:nth-of-type(even),
.manchester-faq-tile:nth-of-type(even),
.manchester-upstairs-faq-tile:nth-of-type(even),
.liverpool-faq-tile:nth-of-type(even),
.euston-faq-tile:nth-of-type(even),
.euston-mezzanine-faq-tile:nth-of-type(even),
.new-street-faq-tile:nth-of-type(even) {
    background-color: rgba(224, 224, 224, 0.6);
}

.vic-faq-tile div,
.manchester-faq-tile div,
.manchester-upstairs-faq-tile div,
.euston-faq-tile div,
.euston-mezzanine-faq-tile div,
.liverpool-faq-tile div,
.new-street-faq-tile div,
.vic-faq-tile /*multilingual*/,
.manchester-faq-tile /*multilingual*/,
.manchester-upstairs-faq-tile /*multilingual*/,
.euston-faq-tile /*multilingual*/,
.euston-mezzanine-faq-tile /*multilingual*/,
.liverpool-faq-tile /*multilingual*/,
.new-street-faq-tile /*multilingual*/
{
    width: calc(100vw);
    font-weight: 600;
    font-size: 1.3rem;
    line-height: 2;
    width: calc(100% - calc(20px + var(--template-padding)));
}

.vic-faq-question,
.manchester-faq-question,
.manchester-upstairs-faq-question,
.euston-faq-question,
.euston-mezzanine-faq-question,
.liverpool-faq-question,
.new-street-faq-question {
    display: grid;
    grid-template-columns:min-content auto;
    grid-gap: 8px;
}

.vic-faq-question div,
.manchester-faq-question div,
.manchester-upstairs-faq-question div,
.euston-faq-question div,
.euston-mezzanine-faq-question div,
.liverpool-faq-question div,
.new-street-faq-question div,
.vic-faq-question /*multilingual*/,
.manchester-faq-question /*multilingual*/,
.manchester-upstairs-faq-question /*multilingual*/,
.euston-faq-question /*multilingual*/,
.euston-mezzanine-faq-question /*multilingual*/,
.liverpool-faq-question /*multilingual*/,
.new-street-faq-question /*multilingual*/
{
    font-weight: 600;
    font-size: 1.3rem;
    line-height: 2;
}



@media screen and (min-width: 1100px) {
    .vic-faq-tile div,
    .manchester-faq-tile div,
    .manchester-upstairs-faq-tile div,
    .euston-faq-tile div,
    .euston-mezzanine-faq-tile div,
    .liverpool-faq-tile div,
    .new-street-faq-tile div,
    .vic-faq-tile /*multilingual*/,
    .manchester-faq-tile /*multilingual*/,
    .manchester-upstairs-faq-tile /*multilingual*/,
    .euston-faq-tile /*multilingual*/,
    .euston-mezzanine-faq-tile /*multilingual*/,
    .liverpool-faq-tile /*multilingual*/,
    .new-street-faq-tile /*multilingual*/
    {
        width: calc(80% - calc(20px + var(--template-padding)));
    }
}

.vic-faq-toggle,
.manchester-faq-toggle,
.manchester-upstairs-faq-toggle,
.euston-faq-toggle,
.euston-mezzanine-faq-toggle,
.liverpool-faq-toggle,
.new-street-faq-toggle {
    width: 20px;
    place-self: center;
    transition: 0.3s ease;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    transform-origin: center center;
    -webkit-transform-origin: center center;
    -moz-transform-origin: center center;
    pointer-events: initial;
}

.vic-faq-toggle > *,
.manchester-faq-toggle > *,
.manchester-upstairs-faq-toggle > *,
.euston-faq-toggle > *,
.euston-mezzanine-faq-toggle > *,
.liverpool-faq-toggle > *,
.new-street-faq-toggle > * {
    pointer-events: none;
}
.vic-faq-toggle-turn,
.manchester-faq-toggle-turn,
.manchester-upstairs-faq-toggle-turn,
.euston-faq-toggle-turn,
.euston-mezzanine-faq-toggle-turn,
.liverpool-faq-toggle-turn,
.new-street-faq-toggle-turn {
    transform: rotateX(180deg);
    -webkit-transform: rotateX(180deg);
    -moz-transform: rotateX(180deg);
}

.vic-map-hide,
.manchester-map-hide,
.manchester-upstairs-map-hide,
.euston-map-hide,
.euston-mezzanine-map-hide,
.liverpool-map-hide,
.new-street-map-hide {
    display: none !important;
}

.vic-faq-answer,
.manchester-faq-answer,
.manchester-upstairs-faq-answer,
.euston-faq-answer,
.euston-mezzanine-faq-answer,
.liverpool-faq-answer,
.new-street-faq-answer {
    /* display: none !important; */
    display: none;
    font-weight: unset;
    padding-left: 28px;
    color: var(--colorTheme);
}

.vic-faq-show-answer,
.manchester-faq-show-answer,
.manchester-upstairs-faq-show-answer,
.euston-faq-show-answer,
.euston-mezzanine-faq-show-answer,
.liverpool-faq-show-answer,
.new-street-faq-show-answer {
    display: block;
}

.hide {
    opacity: 0.4;
}

.vic-unit,
.manchester-unit,
.manchester-upstairs-unit,
.euston-unit,
.euston-mezzanine-unit,
.liverpool-unit,
.new-street-unit {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    transform-box: fill-box;
    z-index: 1000;
}
.displayNone {
    opacity: 0;
}
.vic-platform-active,
.manchester-platform-active,
.manchester-upstairs-platform-active,
.euston-platform-active,
.euston-mezzanine-platform-active,
.liverpool-platform-active,
.new-street-platform-active {
    stroke: #c40 !important;
}

.vic-platform-number,
.manchester-platform-number,
.manchester-upstairs-platform-number,
.euston-platform-number,
.euston-mezzanine-platform-number,
.liverpool-platform-number,
.new-street-platform-number {
    stroke: #c40 !important;
    opacity: 0;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transform-origin: 50%;
    transform-box: fill-box;
    -webkit-transform-origin: 50%;
}

.vic-platform-number-active,
.manchester-platform-number-active,
.manchester-upstairs-platform-number-active,
.euston-platform-number-active,
.euston-mezzanine-platform-number-active,
.liverpool-platform-number-active {
    transform: scale(2);
    -webkit-transform: scale(1);
    opacity: 1;
}

.new-street-platform-number-active {
    opacity: 1;
    transform: scale(3);
    -webkit-transform: scale(1);

}
.controls-container {
    overflow-y: scroll;
    margin: auto;
    background-color: white;
    width: 100%;
    padding: 8px;
    font-size: 1.3rem;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
    Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    line-height: 1.8;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    place-items: center;
    z-index: -2;
    /* -webkit-box-shadow: 0px 2px 2px 0px #333;
  box-shadow: 0px 2px 2px 0px #333; */
}


@media screen and (min-width: 340px) {
    .controls-container {
        padding: var(--template-padding);
    }

}

.controls-container-hidden {
    display: none;
}

.controls-container-hidden {
    display: none;
}

.controls-container-hidden {
    display: none;
}

.controls-container-hidden {
    display: none;
}

.vic-instructions-message,
.manchester-instructions-message,
.manchester-upstairs-instructions-message,
.euston-instructions-message,
.euston-mezzanine-instructions-message,
.liverpool-instructions-message,
.new-street-instructions-message {
    padding: var(--template-padding);
    line-height: 1.8;
    display: grid;
    grid-template-columns:3fr min-content;
    column-gap: 10px;
    grid-template-areas:"vic-message vic-close";
    position: absolute;
    /*bottom: calc(var(--sub-menu));*/
    border-radius: 5px;
    background: #FFF;
    box-shadow: 1px 2px 5px grey;
    width: 70%;
    max-width: 500px;
    margin-left: 5%;
}
.TOCGR .vic-instructions-message,
.TOCGR .manchester-instructions-message,
.TOCGR .manchester-upstairs-instructions-message,
.TOCGR .euston-instructions-message,
.TOCGR .euston-mezzanine-instructions-message,
.TOCGR .liverpool-instructions-message,
.TOCGR .new-street-instructions-message {
    box-shadow:none;
    -webkit-box-shadow:none;
}

/* .vic-instructions-message::before {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    border-left: 10px solid transparent;
    border-right: 10px solid var(--colorTheme);
    border-top: 10px solid var( --colorTheme);
    border-bottom: 10px solid transparent;
    transform: rotate(
135deg);
    -webkit-transform: rotate(
    135deg);
    bottom: -10px;
    left: 8px;
} */
.vic-instructions-hide,
.manchester-instructions-hide,
.euston-instructions-hide,
.euston-mezzanine-instructions-hide,
.liverpool-instructions-hide,
.new-street-instructions-hide {
    display: none;
}

.vic-instructions-message h2,
.manchester-instructions-message h2,
.euston-instructions-message h2,
.euston-mezzanine-instructions-message h2,
.liverpool-instructions-message h2,
.new-street-instructions-message h2,
.vic-instructions-message > h2 > /*multilingual*/,
.manchester-instructions-message > h2 > /*multilingual*/,
.euston-instructions-message > h2 > /*multilingual*/,
.euston-mezzanine-instructions-message > h2 > /*multilingual*/,
.liverpool-instructions-message > h2 > /*multilingual*/,
.new-street-instructions-message > h2 > /*multilingual*/
{
    grid-area: vic-message;
    align-self: center;
    font-size: 1.2rem;
}

.vic-instructions-close,
.manchester-instructions-close,
.euston-instructions-close,
.euston-mezzanine-instructions-close,
.liverpool-instructions-close,
.new-street-instructions-close {
    grid-area: vic-close;
    width: 25px;
    align-self: start;
    pointer-events: initial;
}

.vic-instructions-close:hover,
.manchester-instructions-close:hover,
.euston-instructions-close:hover,
.euston-mezzanine-instructions-close:hover,
.liverpool-instructions-close:hover,
.new-street-instructions-close:hover {
    cursor: pointer;
}

.vic-instructions-close > *,
.manchester-instructions-close > *,
.euston-instructions-close > *,
.euston-mezzanine-instructions-close > *,
.liverpool-instructions-close > *,
.new-street-instructions-close > * {
    pointer-events: none;
}

.controls-container-hide {
    display: none;
}

.controls-container-sub {
    position: relative;
    /* height:25vh; */
    flex-wrap: wrap;
    /* justify-content: space-evenly; */
    /*  transition: all 0.2s ease; */
    place-items: center;
    width: 100%;
    /* padding: 13px; */
    overflow: scroll;
    display: none;
    /* padding-top: 34px; */
    background: #fff;
    place-items: center;
    padding: 8px 0 3px;
    flex-direction: row;
    align-items: center;
    overflow-x: scroll;
    transition: all 0.3s ease;
    justify-content: space-around;
    opacity: 0;
    /* -webkit-box-shadow: 0px 2px 2px 0px #333;
  box-shadow: 0px 2px 2px 0px #333; */
    /* padding-bottom:75px; */
}

.vic-choose-unit,
.manchester-choose-unit,
.euston-choose-unit,
.euston-mezzanine-choose-unit,
.liverpool-choose-unit,
.new-street-choose-unit {
    display: none;
    font-size: 1.6rem;
    font-weight: 600;
    margin: 0 auto;
}

.vic-choose-unit-active,
.manchester-choose-unit-active,
.euston-choose-unit-active,
.euston-mezzanine-choose-unit-active,
.liverpool-choose-unit-active,
.new-street-choose-unit-active {
    display: block;
}

@media screen and (min-width: 1100px) {
    .controls-container-sub {
        overflow: visible;
    }
}

.controls-container-sub-gradient {
    position: fixed;
    bottom: 0;
    width: 100%;
    display: none;
    left: 0;
    height: 75px;
    background: linear-gradient(rgba(250, 250, 250, 0.3), rgba(250, 250, 250, 1));
    /* linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%); */
}

.controls-container-sub-active {
    /* bottom: 0; */
    display: flex;
    opacity: 1;
}

.controls-container-sub-close {
    position: absolute;
    top: 0;
    right: 10px;
    width: 13px;
    stroke-width: 21px;
    stroke: #000;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: #fff;
    display: none;
}

@media screen and (min-width: 768px) {
    .controls-container-sub-close {
        right: 21px;
        width: 21px;
    }
}

@media screen and (min-width: 1100px) {
    .controls-container-sub-close {
        left: 21px;
    }
}

.controls-container-sub-close:hover {
    cursor: pointer;
}
.filter-button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    border: 1px transparent solid;
}

.control-title,
.control-title > /*multilingual*/
{
    font-size: 1rem;
    padding: 0;
    margin: 0;
    color: #000;
    white-space: nowrap;
    pointer-events: none;
}
.control-title {
    font-size: 1rem;
    padding: 0;
    margin: 0;
    color: #000;
    white-space: nowrap;
    pointer-events: none;
}

.control-title-active {
    color: red;
}
#toggle-menu {
    display: none;
    position: fixed;
    top: 10px;
    right: 10px;
    background: none;
    border: none;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
    Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    font-size: 1.3rem;
    opacity: 1;
    transition: opacity 0.2s ease;
}

#toggle-menu:hover {
    cursor: pointer;
}
.filter-button {
    /* overrides */
    border-radius: 5px;
    color: #fff;
    max-width: 400px;
    /* min-height: 4rem; */
    /* padding: 0 13px; */
    font-size: 1rem;
    min-width: 70px;
    font-weight: 700;
    background: none;
    transition: border 0.2s ease;
    padding: 5px;
    /* background-color: navy; */
}

@media screen and (min-width: 340px) {
    .filter-button {
        padding: 13px;
    }
}


.filter-button-active {
    border: 1px black solid !important;
}

.filter-button:hover {
    cursor: pointer;
}

.filter-button-sub {
    background: #FFF;
    font-size: 1.3rem;
    -webkit-appearance: none;
    color: #000;
    cursor: pointer;
    width: 100%;
    min-height: 80px;
    margin: 8px 0;
    font-weight: 600;
    width: 30%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    display: inline-block;
    max-width: 125px;
    border: 5px transparent solid;
    border-radius: 13px;
}
.filter-button-sub svg {
    width: 70%;
}

.filter-button-sub:hover {
    cursor: pointer;
}

@media screen and (min-width: 768px) {
    .filter-button-sub {
        font-size: 1.1rem;
        height: 100%;
        padding: 0;
    }

    .filter-button-sub:last-of-type {
        margin-right: 15%;
    }

    .controls-container {
        justify-content: space-around;
    }
}

.vic-map-container,
.manchester-map-container,
.manchester-upstairs-map-container,
.euston-map-container,
.euston-mezzanine-map-container,
.liverpool-map-container,
.new-street-map-container {
    height: 150px;
    overflow: scroll;
}

.vic-map-overflow,
.manchester-map-overflow,
.manchester-upstairs-map-overflow,
.euston-map-overflow,
.euston-mezzanine-map-overflow,
.liverpool-map-overflow,
.new-street-map-overflow {
    height: unset;
    overflow: auto;
}

#vic-map,
#manchester-map,
#manchester-upstairs-map,
#euston-map,
#euston-mezzanine-map,
#liverpool-map,
#new-street-map {
    height: 100%;
    display: block;
    margin: auto;
    max-width: 800px;
    /* position: fixed; */
    bottom: calc(var(--footer-height) + var(--sub-menu) + 5px);
    right: 0;
    transition: all 0.2s ease;
}

#vic-map:hover,
#manchester-map:hover,
#manchester-upstairs-map:hover,
#euston-map:hover,
#euston-mezzanine-map:hover,
#liverpool-map:hover,
#new-street-map:hover {
    cursor: pointer;
}

.bigg {
    width: 100% !important;
    opacity: 1 !important;
    background: #FFF;
    height: 100%;
    display: block;
    margin: auto;
    max-width: 800px;

    transition: all 0.2s ease;
}

@media screen and (min-width: 768px) {
    #vic-map,
    #vic-upstairs-map,
    #euston-map,
    #euston-mezzanine-map,
    #liverpool-map,
    #new-street-map {
        width: 15%;
    }

    .bigg {
        width: auto !important;
        height: var(--panel) !important;
        position: relative !important;
        bottom: unset !important;
    }
}

@media screen and (min-width: 1100px) {
    #vic-map,
    #manchester-map,
    #manchester-upstairs-map,
    #euston-map,
    #euston-mezzanine-map,
    #liverpool-map,
    #new-street-map {
        bottom: var(--sub-menu);
    }
}
.bus-sub-item {
    stroke-linecap: round;
    stroke-linejoin: round;
}

.control svg {
    width: 34px;
    height: 34px;
    overflow: visible;
    pointer-events: none;
}
.vic-ground,
.manchester-ground,
.manchester-upstairs-ground,
.euston-ground,
.euston-mezzanine-ground,
.liverpool-ground,
.new-street-ground {
    fill: #a5c6c4;
}

.vic-unit-background,
.manchester-unit-background,
.manchester-upstairs-unit-background,
.euston-unit-background,
.euston-mezzanine-unit-background,
.liverpool-unit-background,
.new-street-unit-background {
    fill: #5757e5;
    stroke: #5757e5;
    stroke-width: 1px;
}

.vic-unit,
.manchester-unit,
.manchester-upstairs-unit,
.euston-unit,
.euston-mezzanine-unit,
.liverpool-unit,
.new-street-unit {
    fill: #eef;
    stroke: #eef;
    stroke-width: 1px;
    opacity: 1;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
}

.vic-platform-background,
.manchester-platform-background,
.euston-platform-background,
.euston-mezzanine-platform-background,
.liverpool-platform-background,
.new-street-platform-background {
    fill: #c40;
}


.vic-platform-text,
.manchester-platform-text,
.euston-platform-text,
.euston-mezzanine-platform-text,
.liverpool-platform-text,
.new-street-platform-text {
    fill: #fff;
    font-family: Nunito-Bold, Nunito;
    font-size: 28px;
    font-weight: 700;
}


.vic-outline,
.vic-trainline,
.manchester-outline,
.manchester-trainline,
.manchester-upstairs-outline,
.manchester-upstairs-trainline,
.euston-outline,
.euston-trainline,
.euston-mezzanine-outline,
.euston-mezzanine-trainline,
.liverpool-outline,
.liverpool-trainline,
.new-street-outline,
.new-street-trainline {
    fill: none;
    stroke: #000;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 5px;
}

.vic-outline,
.manchester-outline,
.manchester-upstairs-outline,
.euston-outline,
.euston-mezzanine-outline,
.liverpool-outline,
.new-street-outline {
    stroke-width: 8px;
}

.vic-wrapper,
.vic-container,
.manchester-wrapper,
.manchester-container,
.manchester-upstairs-wrapper,
.manchester-upstairs-container,
.euston-container,
.euston-wrapper,
.euston-mezzanine-container,
.euston-mezzanine-wrapper,
.liverpool-container,
.liverpool-wrapper,
.new-street-container,
.new-street-wrapper {
    opacity: 1;
    transition: opacity 0.2s ease;
    -webkit-transition: opacity 0.2s ease;
}
.active-button-anim {
    -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 3.3px rgba(0, 0, 0, 0.048), 0 2.5px 1px rgba(0, 0, 0, 0.06),
    0 4.3px 7.9px rgba(0, 0, 0, 0.072), 0 1.8px 3.4px rgba(0, 0, 0, 0.086),
    0 7px 10px rgba(0, 0, 0, 0.12);
}
.TOCGR .active-button-anim {
    box-shadow:none;
    -webkit-box-shadow:none;
}

.active-unit-anim {
    fill: rgb(246, 111, 124) !important;
    stroke: rgb(246, 111, 124) !important;
    -webkit-filter: drop-shadow(0 0 3px rgb(246, 111, 124));
    filter: drop-shadow(0 0 3px rgb(246, 111, 124));
    animation: fadeIn 0.8s ease alternate-reverse infinite;
}
.TOCGR .active-unit-anim {
    filter:none;
    -webkit-filter:none;
}
.sub-svg {
    pointer-events: none;
}

.filter-button-sub-active {
    border-bottom: 5px blue solid;
}
@media screen and (min-width: 940px) {
    #panelSuper {
        display: grid;
        grid-template-areas:
            "heading heading heading heading"
            "svg svg svg menu"
            "svg svg svg menu"
            "svg svg svg menu";
        grid-template-columns:1fr 1fr 1fr 3fr;
        grid-template-rows: var(--header-height) var(--header-height) auto auto;
    }

    .controls-container-sub-active {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-evenly;
        height: auto;
    }

    .filter-button-sub {
        height: 100px !important;
        width: 100px !important;
        margin-right: 34px;
    }

    #vic-map {
        display: block;
        grid-area: svg;
    }

    .controls-container {
        width: 100% !important;
    }
}
#panelSuper{
    /*padding-bottom: 200px;*/
}

/*taxi*/
.taxis,
.onboard-food {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.onboard-hide {
    display: none;
}

.taxis-button,
.onboard-button {
    width: 100%;
}

/*food and drink*/
.action-btn-anchor,
.taxi-button-anchor,
.onboard-button-anchor {
    max-width: 400px;
    width: 80%;
    display: flex;
    /*padding-bottom: 30px;*/
}
.onboard-button-anchor {
    margin-top: var(--template-padding);
}
.lner-food-container > .onboard-button-anchor{
    width: 100%;
    display: flex;
    padding-bottom: 30px;
    max-width: none;
}

.onboard-button-anchor-text{
    text-align: center;
    margin: var(--template-padding) 0;
    font-size: 1.5rem;
    color: black;
}

.lner-food-container,
.lner-onboard-food{
    padding: 0 0 50px;
}

.lner-onboard-logo,
.lner-food-container-logo{
    margin-bottom: -10%;
    z-index: 1;
    position: relative;
}

.lner-onboard-image,
.lner-food-container-image{
    margin-bottom: -85px;
    z-index: 0;
    position: relative;
    width: 100%;
}

.lner-onboard-button,
.lner-food-container-button{
    width: 80%;
    height: 120px;
    border-radius: 80px;
    font-size: 2.3em;
    border: 7px solid white;
    position: relative;
}

@media screen and (min-width:1100px) {
    .lner-onboard-button,
    .lner-food-container-button{
        height: 150px;
        font-size: 2.3em;
    }
    .lner-onboard-image,
    .lner-food-container-image {
        margin-bottom: -249px;
        clip-path: inset(10% 0 25% 0);
    }
    .lner-onboard-food,
    .lner-food-container{
        margin-top: -60px;
    }
    .lner-onboard-logo,
    .lner-food-container-logo{
        margin-bottom: -15%;
    }
}
#panelOnboard .default_item:last-of-type {
    /*height: calc(var(--panel) / 2);*/
    padding-bottom: 100px;
}

/*tube unused atm*/
.tuberouteTitle {
    padding: 2px;
}

.tubestationnameleft {
    vertical-align: top;
    text-align: left;
    min-width: calc(45% - 30px);
    max-width: calc(45% - 30px);
    padding-right: 5px;
    overflow: hidden;
    /*height: 35px;*/
    min-height: 35px;
    max-height: 800px;
    padding-bottom: 20px;
}

.tubestationbanner {
    text-align: center;
    padding-left: 2px;
    padding-right: 2px;
    min-width: 100px
}

.tubestationnameright {
    vertical-align: top;
    text-align: left;
    min-width: 35%;
    /*max-width: 45%;*/
    /*width: 65%;*/
    overflow: hidden;
    /*height: 35px;*/
    position: relative;
    /*z-index: 1;*/
    min-height: 35px;
    max-height: 800px;
    padding-bottom: 20px;
}


@media screen and (max-width: 600px) {
    .tubestationnameleft {
        max-width: 0;
        width: 0;
        display: none
    }

    .tubestationnameright {
        max-width: 100%;
    }
}


.tubeSpecialNotices {
    color: rgb(220, 36, 31);
}

.firststation {
    font-weight: bold;
    color: black;
    /*background-color: #0A259B;*/
    text-align: right !important;
}

.tuberow {
    display: flex;
    min-height: 35px;
    max-height: 800px;
}

/*.indentstationname {*/
/*    padding-left: 20px;*/
/*}*/

.destinationtube {
    font-weight: bolder;
    color: white;
    background-color: #0019A8;
    padding: 1px;
}

.tubenationalrail {
    /*background-color: red;*/
    /*color: white;*/
    vertical-align: middle;
}

.tubeverysmall {
    font-size: 6pt;
}

.tubeosi {
    /*border: dotted 1px blue;*/
    font-weight: bolder;
}
.tubeontop {
    /*width: 100%;*/
    /*height: 100%;*/
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.8; /* for demo purpose  */
    /*z-index: 0;*/
    margin: 0; /* for demo purpose  */
}
.tubezoneAll {
    width: 30px;
    vertical-align: middle;
    text-align: center;

}

.tubezone1 {
    color: white;
    background-color: blue;
}


.tubezone3, .tubezone5, .tubezone7, .tubezone9 {
    color: #E7E7E8;
    background-color: white;
    border: 1px solid #E7E7E8;
}

.tubezoneT {
    color: #0019A8;
    background-color: #E7E7E8;
}

.tubezone2, .tubezone4, .tubezone6, .tubezone8 {
    color: white;
    background-color: #E7E7E8;
}


.tubezone23 {
    color: white;
    background-color: #DCDDDE;
    border: solid 1px white;

}
div.tuberow {
    border-bottom: 1px #d4cbcb solid;
}


hr.tubespace {
    border-bottom: 1px #d4cbcb dotted;
}

/*perks*/
.text-center,
.perks-container {
    text-align: center;
}

.text-center h2,
.perks-container h2 {
    text-align: left;
}
.perks-container-link{
    width:100%;
    max-width: none;
}
.perks-button {
    color: white;
    text-decoration: none;
    width: 60vw;
}
.railwayguardian-icon-container img {
    width: 20%;
}

.privacy-lner li{
    font-size: 1.4rem;
    font-weight: 300;
}
.privacy-lner u {
    font-size: 1.4rem;
}
.lner-privacy-bold {
    font-weight: bold;
    font-size: 1.4rem;
}
.tellus-lner-images {
    display: flex;
    justify-content: space-around;
    align-items: baseline;
}
.tellus-lner-images a {
    font-size: large;
    text-decoration: none;
    color: black;
}
.tellus-lner-images img {
    width: 100px;
}
.lner-events-container {
    padding: calc(var(--template-padding) / 2) var(--template-padding);
}
.lner-tiquets-event-container {
    display:flex;
    flex-direction:column;
    width:100%;
    padding: 8px;
    padding-bottom: 13px;
    border-bottom:1px grey solid;
}
.lner-tiquets-event-container:last-of-type {
    border-bottom:none;
}
.lner-tiquets-img-img {
    width: 100%;
    margin: auto;
    object-fit: cover;
    border-radius: 5px;
}
.lner-tiquets-title-title {
    font-size: 1.5rem;
    font-weight:600;
    padding:3px 0;
}
.lner-tiquets-content-content {
    line-height: 1.6;
    font-size: 1.4rem;
}
.lner-tiquets-link-button {
    background:var(--lner);
    outline:none;
    border:none;
    border-radius:8px;
    font-size:1.3rem;
    font-weight:600;
    padding:8px;
    text-decoration:none;
    color:#FFF;
    margin-top: 13px;
}
.lner-tiquets-title {
    border-bottom: 1px grey solid;
    font-size: 1.5rem;
    padding: 8px 0;
}
.lner-tiquets-hide {
    display:none;
}
.lner-tiquets-filter-container {
    padding: calc(var(--template-padding) / 2) var(--template-padding);
}
.lner-tiquets-button {
    background: var(--lner);
    outline: none;
    border: none;
    border-radius: 8px;
    font-size: 1.3rem;
    font-weight: 600;
    padding: 8px;
    text-decoration: none;
    color: #FFF;
    margin-top: 13px;
    min-width:150px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    text-align:center;
}
.lner-tiquets-button-text {
    text-align:center;
    font-size: 1.3rem;
    font-weight: 600;
    width:100%;
}
.lner-tiquets-button:hover {
    cursor:pointer;
}
.lner-tiquets-ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    max-width: 300px;
}
.lner-tiquets-li {
    padding: 5px 0;
    font-size: 1.3rem;
    font-weight: 600;
    margin: 3px 0;
    border-bottom: 1px grey solid;
}
.lner-tiquets-li:hover {
    cursor:pointer;
}
.lner-tiquets-li:last-of-type {
    border-bottom:none;
}
.lner-tiquets-dropdown {
    transform-origin:center center;
    transition:all 0.3s ease;
    width: 35px;
}
.lner-tiquets-dropdown-rotate {
    transform:rotate(180deg);
}
.lner-tiquets-content-content b {
    line-height: 1.6;
    font-size: 1.4rem;
}

/*general info about the station*/

.main_item_info {
    /* display:grid; */
    grid-template-areas:"facility deets deets deets deets";

    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    width: 100%;
    grid-template-rows: -webkit-min-content;
    grid-template-rows: min-content;
    place-items: flex-start;
    align-items: center;
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    padding: var(--template-padding);
    /* border-top:1px #333 solid; */
}

.main_item_info:nth-of-type(1) p:nth-of-type(2) {
    grid-row: 1;
    grid-column: 3;
    grid-area: deets;
    place-self: start;
}

.main_item_info svg {
    width: 50%;
    max-width: 60px;
    filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.4));
    -webkit-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.4));
}
.TOCGR .main_item_info svg {
    filter:none;
    -webkit-filter:none;
}
.TOCGR > .app > .singlefullitem > #panelInfo > .main_info > .visible_item > svg {
    max-height: 40px;
}
@media screen and (min-width: 1100px) {
    .TOCGR > .app > .singlefullitem > #panelInfo > .main_info > .visible_item > svg {
        max-height: 70px;
    }
}

.main_item_info_status_symbol {
    display: none !important;
}

.main_info {
    grid-area: content;
    width: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: start;
    justify-content: flex-start;
    flex-wrap: wrap;
}

/* .main_item_info:nth-of-type(even) {
  background:rgba(224, 224, 224, 0.6);
} */
.main_item_dropdown {
    grid-row: 1;
    grid-column: 3;
    width: 100%;
    display: block;
    grid-area: deets;
    padding-right: var(--template-padding);
    word-wrap: break-word;
}

.main_item_dropdown p {
    text-align: center;
    /* font-size:1rem; */
}
main {
    grid-area: main;
}
.main_info_filters {
    grid-area: heading;
    /* display:-webkit-box;
  display:flex; */
    display: none;
    width: 100%;
    justify-content: space-around;
    -webkit-box-align: center;
    align-items: center;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    padding: var(--template-padding);
    background-color: #fff;
}
.main_info_filters button {
    width: 25%;
}

.main_info_filters button {
    -webkit-appearance: none;
    background-size: 400% 400%;
    border: none;
    padding: var(--template-padding) calc(var(--template-padding) / 2);
    border-radius: 3px;
    /*   -webkit-box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%);
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%); */
    color: #000;
    background: none;
    width: 30%;
    cursor: pointer;
    font-size: 1.3rem;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 0.05em;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
    box-shadow: 0 2.8px 2.2px rgb(0 0 0 / 3%), 0 6.7px 3.3px rgb(0 0 0 / 5%), 0 2.5px 1px rgb(0 0 0 / 6%), 0 4.3px 7.9px rgb(0 0 0 / 7%), 0 1.8px 3.4px rgb(0 0 0 / 9%), 0 7px 10px rgb(0 0 0 / 12%);
}
.main_info p {
    text-align: left;
    font-size: 1.2rem;
    line-height: 1.8;
}:root {
    --main-colour: #00586F;
    --main-colour-nr: rgb(240, 126, 38);

    --secondary-colour: #BFBFBF;
    --secondary-colour-nr: #ffffff;

    --supplementary-colour-nr: #004d6f
}.train-transition{
    width: 80%;
    justify-content: space-between;
    max-width: 600px;
    margin: auto;
    display: none;
    position: relative;
    animation: 0.5s ease forwards removeTrainTransition;
    z-index: 2;
}

.train-transition-follow-line{
    transition: all 0.5s ease;background-color: var(--sw);width: 0px;height: 10px;left: 20px;position: absolute;z-index: 0;top:30px;justify-self: left;
}

.train-transition-path-line{
    background-color:#878080;width: calc(100% - 60px + var(--template-padding));height: 10px;left: 20px;position: absolute;z-index: -1;top:30px;
}
.train-transition-icon{
    position: fixed; left: 90px; transition: 0.5s;
}

.train-transition-start-point{
    transform: rotate(270deg);
}

.tell-us-container{
    transition: all 1s ease;
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: scroll;
}

.tell-us-container-content{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.tell-us-buttons-container,
.tell-us-buttons-choice-container{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.tell-us-buttons-choice-container button{
    margin-top: calc(var(--template-padding)* 2);
    padding: 8px 21px;
    width: 75%;
    font-size: 1.4rem;
    border-radius: 5px;
    line-height: 2;
    border: none;
    box-shadow: 0 0 5px #a19797;
    background-color: white;
}

.tell-us-buttons-choice-container button:first-of-type{
    margin-top: var(--template-padding);
}

#tell-us-topic-container .topic-active,
#tell-us-topic-answer-container .topic-active,
.choice-active,
.tell-us-buttons-choice-container .choice-active,
#tell-us-topic-container-thisJourney .topic-active,
.tell-us-topic-answer-other.topic-active{
    -webkit-filter: drop-shadow(2px 4px 6px black);
    filter: drop-shadow(2px 4px 6px black);
    background-color: rgb(0, 146, 204);
    scale: 1.05;
    color:white;
}

.tell-us-topic-container,
.tell-us-topic-answer-container {
    left: 0;
    position: relative;
    margin: 0;
    width: 100%;
    max-width: 550px;
    scrollbar-width: none;
    display: grid;
    align-items: start;
    gap: 15px;
    scroll-snap-type: y proximity;
    -webkit-overflow-scrolling: touch;
    padding: 10px 10px 10px;
    justify-content: center;
    flex-wrap: wrap;
    grid-template-columns: repeat(auto-fit, minmax(105px, 1fr));

}

.tell-us-topic-container-thisJourney {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    justify-content: space-evenly;
    /*height: 100%;*/
}

/*.tell-us-topic-answer-container{*/
/*    max-width: 680px;*/
/*}*/
.tell-us-v2-input,
.tell-us-container .exhaustive-items{
    background-color: white;
}

.tell-us-container .exhaustive input {
    padding-left: 1em;
}


.tell-us-topic-selection,
.tell-us-topic-answer-selection,
.tell-us-topic-answer-other,
.tell-us-topic-selection-container{
    height: 115px;
    width: 115px;
    border: 3px solid black;
    justify-self: center;
    display: flex;
    align-items: center;
    justify-content: space-around;
    transition: 0.5s;
    flex-direction: column;
    background-color: white;
}
.tell-us-topic-answer-other{
    height: 50px;
    width: 150px;
}

.tell-us-topic-selection-container{
    height: 150px;
    width: 160px;
}
.tell-us-topic-selection > svg,
.tell-us-topic-selection-container > svg{
    transition: 0.5s;
}


.tell-us-topic-selection > p, .tell-us-topic-answer-selection > p,
.tell-us-topic-selection-container > p,.tell-us-topic-answer-other > p {
    text-align: center;
}

.tell-us-button-container{
    display: flex;
    justify-content: space-around;
    /*position: fixed;*/
    /*bottom: 40px;*/
    width: 100%;
    padding: 20px 0 55px;
}

.tell-us-buttons{
    margin: 0 5px 5px 0;
    width: 100px;
    border: none;
    background-color: var(--sw);
    color: white;
    box-shadow: grey 2px 2px 2px;
    height: 30px;
}

.tell-us-buttons#tell-us-next{
    margin: 0 0 5px 5px;
}

.tell-us-next {
    visibility: visible;
}
.tell-us-next.hidden {
    visibility: hidden;
}

.tell-us-previous{
    visibility: hidden;
}

.topic-inactive > svg {
    scale: 0.9;
}
.topic-active > svg {
    scale: 1.05;
}
.topic-active > p {
    color:white;
}

@keyframes addTrainTransition {
    0% {
        transform: translateY(-300%);
    }
    100% {
        transform: translateY(0%);
    }
}

@keyframes removeTrainTransition {
    0% {
        transform: translateY(0%);
    }
    100% {
        transform: translateY(-300%);
    }
}

.tell-us-container{
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    height: 100%;
    padding-bottom: 70px;
    z-index: 1;
}

.tell-us-container::-webkit-scrollbar {
    display: none;
}

.tell-us-container .exhaustive{
    width: 100%;
    max-width: 700px;
    justify-self: center;
    margin:auto;

}

tell-us-container .exhaustive .station-result-list{
    width: 100%;
}

.tell-us-v2-date-time{
    max-width: 700px;
    align-self: center;
    margin: 0;
    width: 100%;
}

.tell-us-container-initial{
    height: calc(100% - 15px);
    top: 0;
}

.tell-us-container-2{
    padding-bottom: 50px;
}

.tell-us-topic-input-container{
    width: 95%;
    max-width: 680px;
    min-height: 100px;
    margin-top: 10px;
}

.tell-us-topic-parent{
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    padding: 10px 10px 75px;
    align-content: start;
    max-width: 680px;
    text-align: center;
}

.tell-us-complete-container{
    display: grid;
    width: 90%;
    grid-template-areas:'svg text text';
    align-items: center;
    max-width: 800px;
    grid-template-columns: 1fr 3fr;
    grid-template-rows: auto auto auto;
    gap: 10px;
}
.tell-us-complete-svg{
    height: 75px;
}

#tell-us-station-exhaustive-list > *,
#tell-us-to-exhaustive-list > *,
#tell-us-from-exhaustive-list > *{
    text-align: left;
}
.tell-us-topic-category-container{
    position: relative;
    max-width: 500px;
}

#tell-us-topic-category-container-single-items{
    width: 100%;
}

.tell-us-topic-category-cover{
    display: flex;
    justify-content: center;
}

.topic-items{
    left: 0;
    margin: 0;
    width: 100%;
    overflow: hidden auto;
    scrollbar-width: none;
    display: grid;
    align-items: start;
    gap: 25px;
    grid-template-columns: repeat(auto-fit, minmax(105px, 1fr));
    scroll-snap-type: y;
    padding: 10px;
    min-height: 150px;
    opacity: 0;
    visibility: hidden;
    top: 0;
    /*position: absolute;*/
}
.topic-item-close{
    position: absolute;
    top: -15px;
    right: 1px;
    font-size: 20px;
    height: 10px;
    width: 10px;
    z-index: 1;
    font-weight: bold;
}

.topic-item-hide{
    display: none;
}

.hide-topic-items{
    height: 0;
    display: none;
}
.show-topic-items{
    opacity: 1;
    visibility: visible;
}
@media only screen and (min-width: 425px) {
    .tell-us-topic-selection, .tell-us-topic-answer-selection{
        height: 125px;
        width: 125px;
    }
    .tell-us-topic-selection-container{
        width: 200px;
    }
}
@media only screen and (min-width: 1100px) {
    .tell-us-topic-container, .tell-us-topic-answer-container{
        grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    }
    .tell-us-topic-container-thisJourney >  .topic-item-hide{
        width: 100%;
    }
    .tell-us-topic-selection, .tell-us-topic-answer-selection{
        height: 150px;
        width: 150px;
    }
    .tell-us-topic-answer-other{
        height: 60px;
        width: 200px;
    }
    .tell-us-topic-selection-container{
        width: 250px;
    }
}
/* Auto inserted by whooshmedia\application\routecss from  view\whooshDiagram\TrainLineColours */

.rawef7b10 {background-color: #ef7b10; color: #ffffff} 
.raw00b9f2 {background-color: #00b9f2; color: #ffffff} 
.raw1e467d {background-color: #1e467d; color: #ffffff} 
.raw00bfff {background-color: #00bfff; color: #000000} 
.rawb26300 {background-color: #b26300; color: #fff} 
.raw713563 {background-color: #713563; color: #ffffff} 
.raw0a493e {background-color: #0a493e; color: #ffffff} 
.raw09a4ec {background-color: #09a4ec; color: #ffffff} 
.raw0f0d78 {background-color: #0f0d78; color: #ffffff} 
.raw8cc63e {background-color: #8cc63e; color: #ffffff} 
.raw389cff {background-color: #389cff; color: #ffffff} 
.raw532e63 {background-color: #532e63; color: #ffffff} 
.rawff8200 {background-color: #ff8200; color: #ffffff} 
.rawffd700 {background-color: #ffd700; color: #ffffff} 
.rawfcb828 {background-color: #fcb828; color: #000000} 
.rawff0000 {background-color: #ff0000; color: #ffffff} 
.rawff4713 {background-color: #ff4713; color: #ffffff} 
.rawfff200 {background-color: #fff200; color: #000000} 
.rawd70428 {background-color: #d70428; color: #ffffff} 
.raw6950a1 {background-color: #6950a1; color: #ffffff} 
.raw660f21 {background-color: #660f21; color: #ffffff} 
.raw1d1d1b {background-color: #1d1d1b; color: #ffffff} 
.rawff5aa4 {background-color: #ff5aa4; color: #ffffff} 
.rawce0e2d {background-color: #ce0e2d; color: #ffffff} 
.rawb7007c {background-color: #b7007c; color: #ffffff} 
.rawde005c {background-color: #de005c; color: #ffffff} 
.raw800000 {background-color: #800000; color: #ffffff} 
.rawcc0033 {background-color: #cc0033; color: #ffffff} 
.rawdc0a1e {background-color: #dc0a1e; color: #ffffff} 
.raw1d2e35 {background-color: #1d2e35; color: #ffffff} 
.raw0450a1 {background-color: #0450a1; color: #ffffff} 
.rawff9800 {background-color: #ff9800; color: #000000} 
.raw1e90ff {background-color: #1e90ff; color: #ffffff} 
.raw7f7f7f {background-color: #7f7f7f; color: #ffffff} 
.raw6c2d7e {background-color: #6c2d7e; color: #ffffff} 
.rawffffff {background-color: #ffffff; color: #000000} 
.raw1476bd {background-color: #1476bd; color: #ffffff} 
.rawdc241f {background-color: #dc241f; color: #fff} 
.raw000000 {background-color: #000000; color: #ffffff} 
.rawf07e25 {background-color: #f07e25; color: #000000} 
.raw0000f2 {background-color: #0000f2; color: #ffffff} 
.raw2bfc9f {background-color: #2bfc9f; color: #000000} 
.raw007a3a {background-color: #007a3a; color: #fff} 
.bakerloo {background-color: #b26313; color: #fff} 
.central {background-color: #dc241f; color: #fff} 
.circle {background-color: #ffd329; color: #0019A8} 
.district {background-color: #007d32; color: #fff} 
.hammersmithandcity {background-color: #f4a9be; color: #0019a8} 
.jubilee {background-color: #a1a5a7; color: #fff} 
.metropolitan {background-color: #9b0058; color: #fff} 
.northern {background-color: #000; color: #fff} 
.piccadilly {background-color: #0019a8; color: #fff} 
.victoria {background-color: #0098d8; color: #fff} 
.waterlooandcity {background-color: #93ceba; color: #0019a8} 
.dlr {background-color: #00afad; color: #fff} 
.overground {background-color: #ef7b10; color: #fff} 
.tflrail {background-color: #0019a8; color: #fff} 
.londontrams {background-color: #00bd19; color: #fff} 
.elizabeth {background-color: #6950a1; color: #fff} 
.rawf58220 {background-color: #f58220; color: #fff} 
.rawffa600 {background-color: #ffa600; color: #fff} 
.raw9b0058 {background-color: #9b0058; color: #fff} 
.raw61686b {background-color: #61686b; color: #fff} 
.raw006fe6 {background-color: #006fe6; color: #fff} 
.raw18a95d {background-color: #18a95d; color: #fff} 
.waterloo-city {background-color: #93ceba; color: #0019a8} 
.hammersmith-city {background-color: #f4a9be; color: #0019a8} 
.london-overground {background-color: #ef7b10; color: #fff} 
.tram {background-color: #00bd19; color: #fff} 
.hammersmithcity {background-color: #f4a9be; color: #0019a8}