.railLines {
    background-color: #fff;
}

.routeInfoButton {
    height: 60px;
    width: 75%;
    margin-top: 10px;
    text-align: left;
    color: #00205b;
    font-size: 16px;
    border-radius: 5px;
    background-color: #EAEAEA;
}

.routeInfoButton-White {
    height: 80px;
    color: #242526;
    font-weight: 600;
    background-color: #FFFfff;
    border: solid 1px rgba(36, 37, 38, 0.1);
    box-shadow: 1px 1px 10px 6px #eaeaea;
    margin-top: 0;
    margin-bottom: 30px;
}

.info-content {
    font-size: 16px;
}

.info-header {
    padding-bottom: 20px;
    font-weight: bold;
}

.info-subheader {
    padding-bottom: 20px;
    /*padding-left: 50px;*/
    font-size: 16px;
    font-weight: bold;
}

HTML
/*--------------------------------------------------------------
# Section
--------------------------------------------------------------*/
section {
    padding: 0 0 0 0;
}

.section-bg {
    background-color: #F7F7F7;
}

.section-title {
    text-align: center;
    padding-bottom: 30px;
}

    .section-title h2 {
        font-size: 32px;
        font-weight: 600;
        margin-bottom: 20px;
        padding-bottom: 20px;
        position: relative;
    }

        .section-title h2::before {
            content: '';
            position: absolute;
            display: block;
            width: 120px;
            height: 1px;
            background: #ddd;
            bottom: 1px;
            left: calc(50% - 60px);
        }

        .section-title h2::after {
            content: '';
            position: absolute;
            display: block;
            width: 40px;
            height: 3px;
            background: #3498db;
            bottom: 0;
            left: calc(50% - 20px);
        }

    .section-title p {
        margin-bottom: 0;
    }

/*--------------------------------------------------------------
# Station Information
--------------------------------------------------------------*/

.info-button {
    margin-top: 10px;
    width: 90%;
    text-align: left;
    font-size: 14px;
    color: #163c63;
    font-weight: bold;
}

.stationInfo {
    padding: 10px 0;
}

/*--------------------------------------------------------------
# Popular Destinations
--------------------------------------------------------------*/

#popular-destinations {
    width: 250px;
    height: 400px;
    margin: 0 0 0 -200px;
    -webkit-transform: skew(6deg);
    -moz-transform: skew(6deg);
    -o-transform: skew(6deg);
    overflow: hidden;
    position: relative;
}

#popularDestinations .info-icon {
    font-size: 20px !important;
}

/*--------------------------------------------------------------
# Bay Assignments
--------------------------------------------------------------*/

.bayAssignments {
    padding: 10px 0;
    background-color: lightgray;
}

    .bayAssignments .table-bordered {
        background-color: white;
    }

/*--------------------------------------------------------------
# Station Art
--------------------------------------------------------------*/

#station-art {
    width: 250px;
    height: 400px;
    margin: 0 0 0 -200px;
    -webkit-transform: skew(6deg);
    -moz-transform: skew(6deg);
    -o-transform: skew(6deg);
    overflow: hidden;
    position: relative;
}

#customer-features {
    width: 250px;
    height: 400px;
    margin: 0 0 0 0;
    -webkit-transform: skew(12deg);
    -moz-transform: skew(12deg);
    -o-transform: skew(12deg);
    overflow: hidden;
    position: relative;
}

.station-art-image {
    /*width: 900px;
    height: 600px;*/
    position: absolute;
    top: -20px;
    left: 100px;
    right: -100px;
    bottom: -30px;
    -webkit-transform: skew(-20deg) !important;
    -moz-transform: skew(-20deg) !important;
    -o-transform: skew(-20deg) !important;
}

.customer-feature-image {
    width: 900px;
    height: 600px;
    position: absolute;
    top: 0;
    left: 0px;
    right: 0px;
    bottom: 0;
    -webkit-transform: skew(-20deg, 0) !important;
    -moz-transform: skew(-20deg) !important;
    -o-transform: skew(20deg) !important;
}

.table {
    width: 100% !important;
}


/*--------------------------------------------------------------
# Other Stations
--------------------------------------------------------------*/

.otherStations .other-station-box {
    text-align: center;
    margin-bottom: 20px;
    box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1);
    padding: 30px 20px;
    background: #fff;
}

.otherStations input {
    margin-top: 20px;
    margin-bottom: 50px;
    padding: 10px 24px;
    transition: 0.4s;
    border-radius: 4px;
    width: 100%;
}

.otherStations button[type="submit"] {
    background: #163c63;
    border: 0;
    padding: 10px 24px;
    color: #fff;
    transition: 0.4s;
    border-radius: 4px;
    width: 70%;
}

    .otherStations button[type="submit"]:hover {
        background: #163c63;
    }

@media (max-width: 450px) {
    .routeInfoButton {
        width: 100% !important;
    }
}

.grid-row-border {
    border-top: solid lightgray 2px;
}

.rail-station-kendo-grid a, .rail-station-kendo-grid .material-icons, .rail-station-kendo-grid .material-icons-outlined, .rail-station-kendo-grid .material-symbols-outlined, .rail-station-kendo-grid .material-symbols-outlined, .rail-station-kendo-grid img {
    color: var(--dart-dark-blue);
    height: 43px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rail-station-kendo-grid .list-style-inline li a {
    display: inline;
}

.rail-station-kendo-grid .background-color-LightGray {
    min-width: 75px;
}

.circled {
    border-radius: 50%;
    height: 43px;
    width: 100%;
    position: inherit;
    z-index: 9;
}

    .circled.yellow {
        background-color: orange;
    }

.rail-station-kendo-grid .k-grid td {
    vertical-align: top;
}

.min-height-85px {
    min-height: 85px;
}

.rail-station-kendo-grid td[role="gridcell"] {
    padding: 0 !important;
}

.w-97 {
    width: 97% !important;
}

.rail-station-kendo-grid .k-master-row > td[role="gridcell"] {
    border-radius: 12px;
}

.skewed {
    transform: skew(-6deg);
}

.unskewed {
    transform: skew(6deg);
}

@media screen and (max-width: 768px) {
    .m-sm-only-auto {
        margin: auto;
    }
}

.rail-station-kendo-grid .k-grid .k-grouping-row + tr td.k-group-cell {
    background-color: white;
    border-top: none !important
}

.rail-station-kendo-grid table {
    border-spacing: 0 10px !important;
    border-collapse: separate !important;
}