﻿html {
    font-family: "Gotham SSm A", "Gotham SSm B", sans-serif;
    font-size: 100%;
    line-height: 1.5;
    touch-action: manipulation;
    /* overflow: hidden; */
    zoom: reset;
}


body {
    font-family: "Gotham SSm A", "Gotham SSm B", sans-serif;
    overflow-x: hidden;
    min-width: 320px;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-overflow-scrolling: touch;
    font-size: 62.5%;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    color: #1E234F;
}

.time-tbl-body-container p {
    font-size: unset;
    margin: unset;
}

.time-table-cardgroup .table {
    display: table;
}

.wrapper-destinationtimetablecontainer2 {
    height: 50px;
}

.time-tbl-body-container .btn {
    padding: 6px 12px;
    font-size: 1.6em;
}

.rowfix {
    padding: 0 !important;
}

.list-detail-table tbody tr, .list-detail-table tbody td {
    border: 0;
}

.list-detail-table tbody tr {
    border-bottom: 1px solid #80CFF4;
}

    .list-detail-table tbody tr:first-child, .list-detail-table tbody tr:last-child {
        border-bottom: 0;
    }

.nofloat {
    float: none !important;
}

.time-table-card-2 table tr:hover td:not(:empty) {
    background: #eee;
    cursor: pointer;
}

.relative-position {
    position: relative !important;
}

.time-tbl-form-card .autocomplete-items.journey-dropdown {
    width: calc(100% - 17px);
    padding: 0;
    top: 42px;
}

.wrapper-destinationtimetablecontainer2 {
    border: 1px solid transparent;
}

.list-detail-time-table-cardgroup table.list-detail-table tr td {
    font-weight: normal;
}

.stationsbeforematch {
    font-weight: normal !important;
}

.stationsaftermatch {
    font-weight: 600 !important;
}

.wrapper-destinationtimetablecontainer2 {
    vertical-align: middle;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

    .wrapper-destinationtimetablecontainer2 span:first-child {
        display: block;
        width: 100%;
    }

ul.week-days, ul.week-days li {
    margin-bottom: 0;
}

.list-detail-time-table-cardgroup table.list-detail-table tr td:last-child,
.list-detail-time-table-cardgroup table.list-detail-table tr th:last-child {
    padding-left: 5em;
    min-width: auto
}

p.service-title img {
    width: 100%;
    max-width: 25px;
    margin-right: 5px;
}

.time-tbl-form-card-main-title.form-label {
    display: block;
    font-size: 1.8em;
    font-weight: 700;
}

.time-tbl-form-card-sub-title.form-label {
    display: block;
    font-size: 1.6em;
    font-weight: lighter;
    margin-bottom: 0;
    line-height: 1.2;
}

.time-tbl-form-card .validation {
    position: relative;
    bottom: -5px;
    right: 0;
    background: #a51717;
    padding: 5px 7px;
    font-size: 13px;
    z-index: 9;
}

.time-tbl-form-card .self-align {
    align-self: flex-start;
}

#timetableContainer > div:last-child .time-table-cardgroup {
    padding-bottom: 4em;
}

.font-weight-normal {
    padding-left: 15px;
    position: relative;
    color: #1E234F;
}

    .font-weight-normal::before {
        content: "-";
        position: absolute;
        top: -5px;
        left: 3px;
        display: block;
    }

@media(max-width:576px) {
    .font-weight-normal {
        font-weight: normal !important;
        padding-left: 0;
    }

        .font-weight-normal::before {
            display: none;
        }

    .card.time-table-nxtprv p.time-tbl-title span {
        display: block;
        font-size: 11px;
        margin-top: -7px;
    }
}

p.service-title.space {
    margin-bottom: 5px;
}

/*end*/
.pr-0 {
    padding-right: 0 !important;
}

.pl-0 {
    padding-left: 0 !important;
}



.component-jumbotron {
    position: relative;
    z-index: 1;
    background-image: linear-gradient(-90deg, #954090 13%, #039BD5 86%);
    min-height: 360px;
}


    .component-jumbotron .container:after {
        content: "";
        border-color: transparent transparent #fff transparent;
        border-style: solid;
        border-width: 0 0 7vw 100vw;
        bottom: -1px;
        height: 0;
        position: absolute;
        left: 0;
        z-index: 3;
        width: 0;
    }

    .component-jumbotron .content {
        padding: 100px 30px calc(4vw + 35px) 30px;
        width: 100%;
    }

    .component-jumbotron .jumbotron__title {
        font-size: 5.6em;
        font-weight: 700;
        line-height: 62px;
        margin: 0 0 10px 0;
        text-transform: uppercase;
        text-align: center;
        color: #fff;
    }

    .component-jumbotron .jumbotron__subtitle {
        font-size: 2.4em;
        line-height: 28px;
        font-weight: 700;
        text-align: center;
        margin: 0 0 12px 0;
        color: #fff;
    }

.time-table-card-2 tr td:first-child {
    width: 25%;
    min-width: auto;
}

.time-tbl-body-container {
    margin-top: 5em;
    margin-bottom: 5em;
}

    .time-tbl-body-container h2 {
        margin-bottom: 0.5em;
        font-size: 36px;
        color: #1E234F;
    }

.card.time-tbl-form-card {
    padding: 5em;
    background: #1E234F;
    color: #fff;
    border: 0;
}




.time-tbl-form-card input[type="text"], .time-tbl-form-card select {
    border: 0;
    padding: 10px;
    border-radius: 0;
    outline: none;
    font-size: 14px;
    color: #1E234F;
    line-height: 1.15;
    margin: 0;
    height: 42px;
}

.btn-time-tbl-wrapper, .time-tbl-display-card {
    margin-top: 2em;
}

    .btn-time-tbl-wrapper .btn {
        margin-right: 1em;
    }

    .btn-time-tbl-wrapper .btn-primary {
        background: #00A6E6;
        font-weight: 700;
        border-radius: 20px;
        min-width: 115px;
        border: 1px solid transparent;
        transition: 0.3s;
    }

        .btn-time-tbl-wrapper .btn-primary:hover, .btn-time-tbl-wrapper .btn-primary:active {
            background: #00b7ff;
        }

    .btn-time-tbl-wrapper .btn-secondary {
        background: #EEE9F3;
        font-weight: 700;
        border-radius: 20px;
        min-width: 100px;
        border: 1px solid transparent;
        color: #1e234e;
        transition: 0.3s;
    }

        .btn-time-tbl-wrapper .btn-secondary:hover, .btn-time-tbl-wrapper .btn-secondary:active {
            background: #d9cee4;
            color: #1e234e;
        }

.time-tbl-display-card {
    padding: 2em 5em;
    background: #F2F4F8;
    border: 0;
}

.btn-time-tbl-back.btn-success {
    background: #00A6E6;
    font-weight: 700;
    border-radius: 20px;
    min-width: 100px;
    border: 1px solid transparent;
    color: #1e234e;
    transition: 0.3s;
    width: 100px;
    color: #fff;
    transition: 0.3s;
}

    .btn-time-tbl-back.btn-success:hover, .btn-time-tbl-back.btn-success:active {
        background: #00b7ff;
        border: 1px solid transparent;
    }

.timetbl-back-icon {
    position: relative;
}

    .timetbl-back-icon::before {
        content: "\2039";
        position: absolute;
        top: 2px;
        left: -22px;
        display: block;
        font-size: 1.5em;
        width: 15px;
        height: 15px;
        margin: 0;
        padding: 0;
        line-height: 10px;
    }

.time-tbl-display-card .time-tbl-descp {
    margin-top: 2em;
}

p.service-title {
    font-size: 1.6em;
    margin-bottom: 0;
}

.time-tbl-station-name {
    font-weight: 700;
}

.time-table-card {
    padding: 0.5em 3em;
    font-size: 1.8em;
    height: 100%;
    background: #d6e1f2;
    border: 0;
    border-radius: 0;
}

    .time-table-card tr td:last-child {
        font-weight: 700;
    }

.time-table-cardgroup {
    padding: 0 0.6em;
    background: #80CFF4;
}

.time-table-card-2 {
    padding: 0 0.3em;
    font-size: 1.8em;
    height: 100%;
    border: 0;
    border-radius: 0;
    background: #80CFF4 !important;
}

    .time-table-card-2 tr th {
        background: #1E234F;
        color: #fff
    }

    .time-table-card-2 tr td {
        color: #1E234F;
    }

        .time-table-card-2 tr td:last-child {
            font-weight: 700;
        }

    .time-table-card-2 tr td, .time-table-card-2 tr th {
        height: 3.5em;
        vertical-align: middle;
        padding: 0 0 0 2em;
        font-size: 16px !important;
        width: auto;
        min-width: auto;
    }

    .time-table-card-2 tr th {
        height: 2em;
        background: #1E234F !important;
    }

    .time-table-card-2 tr:not(:first-child) {
        border-color: #80CFF4;
    }

    .time-table-card-2 table tbody tr:focus-visible {
        outline: 2px solid #80CFF4;
        outline-offset: -4px;
    }

.tpe-services-block {
    display: flex;
}

.btn-week-block {
    text-align: right;
}

    .btn-week-block span {
        background: #1E234F;
        display: inline-block;
        color: #fff;
        font-size: 1.6em;
        padding: 0.5em 1em;
    }

.time-display {
    text-align: center;
    background: #80CFF4;
    color: #1E234F;
    font-weight: 700;
    border: 0;
    height: auto;
    border-radius: 0;
}

.time-tbl-title {
    font-weight: 700;
    margin-bottom: 0;
    text-align: center;
    text-transform: uppercase;
}

.time-table-nxtprv {
    font-size: 1.8em;
    border: 0;
    border-radius: 0;
    padding-bottom: 0;
    margin: 0.6em 0;
}

p.modal-title {
    font-size: 2em;
    font-weight: 700;
    margin-bottom: 0.2em;
}

p.modal-sub-title {
    margin-bottom: 0;
    font-size: 1.6em;
    font-weight: 400;
}

.modal-header-content .station-name {
    font-weight: 700;
}

.train-schedule-table tr th {
    text-align: left;
    font-size: 1.2em;
}

.train-schedule-table tr td {
    text-align: left;
    font-size: 1.2em;
}

.calendar-table tr th {
    text-align: center;
    font-size: 1.2em;
}

.calendar-table tr td:empty {
    width: auto;
    height: auto;
    background: #eee;
    border: 2px solid #fff;
}

.calendar-table tr td {
    text-align: center;
    background: #eee;
    border: 2px solid #fff;
    font-size: 1.4em;
}

.info-block {
    font-size: 1.3em;
    padding: 0.5em;
}

    .info-block .info-date-txt {
        font-weight: 700;
    }

.show-detail-popup .btn-close {
    font-size: 2em
}

/* page list detail table */
.list-detail-card {
    margin-top: 3em;
    background: #f1f4f8;
    border: 0;
}

table.list-detail-table {
    position: relative;
    width: 95%;
    margin: 0 auto;
    border: 0;
    padding: 0 40px;
}

    table.list-detail-table tr th, table.list-detail-table tr td {
        font-size: 1.6em;
        background: #f1f4f8;
    }

        table.list-detail-table tr td:first-child {
            font-weight: 500;
        }

    table.list-detail-table tr:first-child::before {
        content: '';
        position: absolute;
        left: -23px;
        top: 55px;
        display: block;
        width: 8px;
        height: 8px;
        background: #1b345f;
        z-index: 9;
        border-radius: 50%;
    }
    /*table.list-detail-table tr:first-child::before {
    content: '';
    position: absolute;
    left: -23px;
    top: 55px;
    display: block;
    width: 50px;
    height: 50px;
    background: green;
    z-index: 13;
    border-radius: 50%;
    border: 2px solid red;
} */
    table.list-detail-table tr:last-child, table.list-detail-table tr:first-child {
        position: relative;
    }
@media not all and (min-resolution: 0.001dpcm) {

    @supports (-webkit-touch-callout: none) {

        .timetbl-back-icon::before {
            left: -15px;
            top: 2px;
            border: 1px solid #00A6E6;
            font-size: 30px;
        }
    }

    @supports not (-webkit-touch-callout: none) {

        .timetbl-back-icon::before {
            left: -15px;
            top: 1px;
            border: 1px solid green;
        }
    }
}


@media screen and (-webkit-min-device-pixel-ratio:0) {



    table.list-detail-table tr:last-child td {
        position: relative;
    }

        table.list-detail-table tr:last-child td:first-child::after {
            content: '';
            position: absolute;
            left: -23px;
            top: 14px;
            display: block;
            width: 8px;
            height: 8px;
            background: #1b345f;
            z-index: 9;
            border-radius: 50%;
        }

    table.list-detail-table tr:first-child th {
        position: relative;
    }

        table.list-detail-table tr:first-child th:first-child::after {
            content: '';
            position: absolute;
            left: -23px;
            top: 55px;
            display: block;
            width: 8px;
            height: 8px;
            background: #1b345f;
            z-index: 9;
            border-radius: 50%;
        }
}


/*2nd end*/

/*end*/

table.list-detail-table tr:last-child::before {
    content: '';
    position: absolute;
    left: -23px;
    top: 15px;
    display: block;
    width: 8px;
    height: 8px;
    background: #1b345f;
    z-index: 9;
    border-radius: 50%;
}

table.list-detail-table tr::before {
    content: '';
    position: absolute;
    left: 20px;
    top: 55px;
    display: block;
    width: 2px;
    height: calc(100% - 72px);
    background: #acb6bc;
}

table.list-detail-table tr th, table.list-detail-table tr:last-child td {
    border: 0;
}

.font-light {
    font-weight: normal !important;
    color: #ccc !important;
}
/* end */

.list-detail-time-table-cardgroup {
    padding: 4em;
    background: #80CFF4;
    height: 100%;
}

    .list-detail-time-table-cardgroup .list-detail-card {
        margin-top: 0;
        background: #fff;
        border: 0;
        border-radius: 0;
    }

    .list-detail-time-table-cardgroup table.list-detail-table tr th, .list-detail-time-table-cardgroup table.list-detail-table tr td {
        font-size: 1.6em;
        background: #fff;
        color: #1E234F;
    }

ul.week-days {
    padding-left: 0;
    list-style-type: none;
}

    ul.week-days li {
        display: inline-flex;
        border: 1px solid #6E6E6E;
        width: 20px;
        height: 20px;
        align-items: center;
        justify-content: center;
        color: #6E6E6E !important;
        font-size: 0.8em;
        margin-right: 2px;
    }

        ul.week-days li.filled {
            color: #fff !important;
            background: #20234E;
            border: 1px solid #20234E;
        }

@media(max-width: 768px) {
    .time-table-card-2 {
        font-size: 1.5em;
    }

        .time-table-card-2 tr td, .time-table-card-2 tr th {
            padding: 0 0 0 1em;
        }

        .time-table-card-2 tr td {
            word-break: break-word;
        }
}

@media(max-width: 576px) {
    .component-jumbotron .jumbotron__title {
        font-size: 3em;
        line-height: normal;
    }

    .card.time-tbl-form-card, .time-tbl-display-card {
        padding: 2em;
    }

    .time-table-nxtprv {
        margin: 0.3em 1em;
    }

    .time-table-card {
        padding: 0.5em 1em;
    }

    table.list-detail-table tr::before {
        left: 3.5px;
        width: 1px;
    }

    table.list-detail-table tr:first-child::before, table.list-detail-table tr:last-child::before {
        left: -24px;
    }

    .tpe-services-block {
        display: block;
        margin-top: 1.8em;
    }

        .tpe-services-block .btn-week-block {
            text-align: right;
        }

    .time-table-cardgroup {
        padding: 0 5px;
    }

    .component-jumbotron {
        min-height: auto;
    }

    .time-tbl-body-container h2 {
        font-size: 25px;
    }

    .time-table-nxtprv .time-tbl-title {
        text-align: center;
    }

    .list-detail-time-table-cardgroup {
        padding: 1em;
    }

    table.list-detail-table {
        width: 100%;
    }

    table.list-detail-table {
        padding: 0 25px;
    }

    .list-detail-time-table-cardgroup table.list-detail-table tr th, .list-detail-time-table-cardgroup table.list-detail-table tr td {
        min-width: auto;
        font-size: 14px;
    }


    .card.time-table-nxtprv p.time-tbl-title span {
        display: block;
    }

    .time-table-cardgroup {
        display: flex;
    }

    .time-table-card-2 {
        width: 50%;
        padding: 0 0.2em;
        margin-bottom: 0 !important;
    }

        .time-table-card-2 tr td, .time-table-card-2 tr th {
            font-size: 11px !important;
        }

        .time-table-card-2 tr th {
            height: 2.5em;
        }

    p.service-title, .btn-week-block span, .time-tbl-body-container p {
        font-size: 14px;
        display: block;
        text-align: left;
    }

        p.service-title.station-name-icon {
            display: flex;
        }

    .time-tbl-station-name {
        padding-left: 3px;
    }

    .btn-week-block span.time-tbl-station-day {
        text-align: center;
        display: inline-block;
    }

    .time-tbl-display-card .time-tbl-descp {
        margin-top: 0;
    }

    .time-table-cardgroup .table {
        margin-bottom: 0;
    }

    .time-table-card {
        font-size: 14px;
    }

    .list-detail-time-table-cardgroup table.list-detail-table tr td:last-child {
        text-align: right;
    }

    .wrapper-destinationtimetablecontainer2 {
        height: auto;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .wrapper-destinationtimetablecontainer2 {
        vertical-align: middle;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }

    ul.week-days, ul.week-days li {
        margin-bottom: 0;
    }

    .list-detail-time-table-cardgroup table.list-detail-table tr td:last-child, .list-detail-time-table-cardgroup table.list-detail-table tr th:last-child {
        padding-left: 0;
        min-width: auto;
    }

    .list-detail-time-table-cardgroup table.list-detail-table tr td:first-child {
        white-space: nowrap;
    }
}

.time-tbl-body-container input:focus,
.time-tbl-body-container select:focus,
.time-tbl-body-container button:focus {
    outline: 2px solid #00b7ff;
    outline-offset: 3px;
}

.time-tbl-body-container button:focus-visible {
    box-shadow: none;
}

#nodatamessage {
    position: relative;
    bottom: -15px;
    left: 0px;
    background: #a51717;
    font-size: 13px;
    padding: 5px 7px;
    width: fit-content;
}

.time-table-card-2 tr td:first-child {
    width: 25%;
    min-width: auto;
    font-weight: normal;
}

.sidebar .component-qtt-form .btn-primary {
    background: #009DDB;
}

@media(max-width: 375px) {
    .time-table-card-2 tr td, .time-table-card-2 tr th {
        padding: 0 0 0 0.3em;
    }

    ul.week-days li {
        width: 15px;
        height: 15px;
        line-height: 1;
    }
}

@media(max-width:576px) {
    .time-tbl-form-card .validation {
        position: relative;
        bottom: -5px;
        right: 0;
        display: inline-block;
    }
}

@media(max-width: 320px) {
    p.service-title, .btn-week-block span, .time-tbl-body-container p {
        font-size: 12px;
    }
}

@media(min-width:577px) and (max-width: 767px) {
    .component-jumbotron {
        min-height: 170px;
    }
}

@media(min-width:769px) and (max-width: 1023px) {
    .time-table-cardgroup {
        padding: 0 1em;
    }

    .time-table-card-2 {
        padding: 0px 0.5em;
    }
}


/*iPhone 13 and iPhone 13 Pro
 2532x1170 pixels at 460ppi */
@media only screen and (device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) {
    .timetbl-back-icon::before {
        top: 1px;
        left: -17px;
        width: 16px;
        height: 16px;
        border: 1px solid #00A6E6;
    }

    .timetbl-back-icon {
        position: relative;
        top: 0;
        left: 0;
    }
}
}
