#bus_page #map{
    overflow:hidden;
    min-height: 800px;
    height: 100%;
    z-index: 0;
    
}

#fahrplan, #abfahrtForm {
    position:relative;
}

@media (max-width: 992px) {
    .mapContainer{
        position:relative;
    }

    #mobileScroll{
        position: absolute;
        height: 100%;
        background-color: #fff;
        width: 60px;
        opacity:0;
        right: 0;
        top: 150px;
        z-index: 1;
    }
}

@media (min-width: 1024px) {
    #bus_page > #controls{
        max-width: 520px;
    }
}

@media (min-width: 1024px) {
    .form > .row > div.col-1:first-child,.form > .row > div.col-1:last-child{
        padding-left: 10px;
    }
}

@media (max-width: 1024px) {
    .form > .row > div.col-1:first-child,.form > .row > div.col-1:last-child{
        padding-left: 4px;
        text-align:center;
    }

  
}

@media (max-width: 500px) {
    #fahrplan_results .routeEnd{
        padding-left: 0px;
    }

    #fahrplan_results .routeInfos{
        width: 83.33333333%;
        margin-left:0;
    }
}

.loading{
    display:none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; 
    background-color: rgba(0,0,0,0.2);
    z-index: 1;
}

.loading.show{
    display: block;
}

.loading-icon >i{
    position: absolute;
    top: 40%;
    font-size: 3em;
}

.errorMsg{
    color: var(--sw-danger)
}

#bus_page{
    font-weight: normal;
}
.accordion-body.fahrplan,.accordion-body.abfahrten{
    background: var(--sw-light-green)
}

#bus_page #controls{
    background: var(--sw-secondary-brand);
}

#accordion-bus > div:first-child{
    border-top: none;
}

#switchStartEnd{
    color: var(--sw-primary-brand-BITV);
    cursor: pointer;
}

.suggestion_container{
    position: relative;
    display:none;
}

.suggestion_container.show{
    display:block;
}

.suggestion_container .suggestion_overlay{
    box-shadow: 0 .125rem .25rem #0000004d;
    left: 0;
    position: absolute;
    right: 0;
    background-color: var(--sw-primary-brand-BITV);
    color: #fff;
    cursor: pointer;
    max-height: 300px;
    overflow-y:auto;
    overflow-x:hidden;
    z-index: 100;
}



.suggestion_container .suggestion_overlay a{
    color: #fff;
    font-weight: normal
}

.departureIcon, .startIcon, .endIcon, .locationIcon{
    color: var(--sw-primary-brand-BITV);
    opacity: 0.8;
}

#fahrplan_results,#abfahrten_results{
    background-color: #fff;
}


.routeResults .routeResult > div{
    padding: 0px;
}
.routeResults .routeResult .routeLine{
    position:relative;
    height: 60px;
}

.routeStart, .routeEnd{
    font-weight: bold;
}
.routeStart > div,
.routeEnd > div{
    color: green;
}

.routeStart > div.later,
.routeEnd > div.later{
    color: red;
}

.routeResults .routeResult{
    padding-top: 20px;
    border-top: 1px solid #ccc;
    padding-bottom: 10px;
    cursor: pointer;
}

.routeResults .routeResult:first-child{
    border-top: none; 
}

.routeResults .routeResult .routeMiddle .routeLine .routeLineBackground{
    position: absolute;
    top: 10px;
    height: 3px;
    background-color: #ccc;
    width: 100%;
}

.routeResults .routeResult .routeLine > div{
    position: absolute;
    padding: 2px;
    background-color: #fff;
}

i.fa-bus-simple{
    color: var(--sw-primary-brand-BITV);
}

.busLine{
    background-color: var(--sw-primary-brand-BITV) !important;
}

.routeResults .routeResult .routeLine .tripLine .lineName{
    width: 100%;
    background-color: var(--sw-primary-brand-BITV);
    border-radius: 8px;
    text-align: center;
    color: #fff;
    font-weight: bold;
}

.routeResults .routeResult .routeIcon{

    margin-right: 10px;
    color: #999;
   
}

.routeDuration, .routeChanges, .totalPayment{
    float: left; 
}

.routeDuration{
    width: 40%;
}

.routeChanges{
    width: 30%;
}

.totalPayment{
    width: 30%;
}

.routeContentMore, .stopInfo, #timetable_modal{
    display:none;
}

.routeContentMore.show, .stopInfo.show, #timetable_modal.show{
    display:block;
}

.routeResults .routeResult .routeContentMore{

    width: 100%;
    clear: both;
    background-color:#f3fcfc;
    border-top: 1px solid #ccc;
    padding: 5px;
}


.routeResults .routeResult .routeContentMore .tripStart .tripStartTime,
.routeResults .routeResult .routeContentMore .tripEnd .tripEndTime{
    font-weight: bold;
}

.routeResults .routeResult .routeContentMore .tripResult{


    border-top: 1px solid #ccc;
  
    overflow: hidden;

}


.routeResults .routeResult .routeContentMore .tripResult > div.tripMiddle{
    display: flex;
    margin-left: 0px;
}

.routeResults .routeResult .routeContentMore .tripResult:first-child{
    border-top: none;
}

.routeResults .routeResult .routeContentMore .tripStartTime span,
.routeResults .routeResult .routeContentMore .tripEndTime span{
    color: green;
    font-size: 0.9em;
    display:inline-block;
    margin-left:3px;
}

.routeResults .routeResult .routeContentMore .tripStartTime span.later,
.routeResults .routeResult .routeContentMore .tripEndTime span.later{
    color: red;
}

.tripResult .tripIcon .lineName{
    display: inline-block;
    padding: 2px 15px;
    border-radius: 8px;
    background-color: var(--sw-primary-brand-BITV);
    color: #fff;
    font-weight: bold;
}

.tripResult .tripIcon .material-icons{
    float:left;
}

.tripResult .tripStart{
    border-bottom: 1px dashed #ccc;
    margin-bottom: 5px;
    padding-bottom: 5px;
}

.tripResult .tripEnd{
    border-top: 1px dashed #ccc;
    margin-top: 5px;
    padding-top: 5px;
}

.routeResults .routeResult .routeContentMore .tripMiddleLeft > div{
    margin-left: 14px;
    height: 100%;
    background-color: #ccc;
    width: 3px;
}

.routeResults .routeResult .routeContentMore .tripMiddleLeft{
    margin-lefT: px;
}


.tripMiddleRight .stopInfo{
    
    background-color: transparent;
    border-top:1px solid #009f9f;
}

.tripMiddleRight .stopInfo .stopResult{
    padding: 2px 0px;
}

.tripMiddleRight .stopInfo .stopResult .stopResultTime > span{
    font-size: 0.9em;
    color: green;
}
.tripMiddleRight .stopInfo .stopResult .stopResultTime > span.later{
    color: red;
}

.iconButton,.leaflet-marker-icon .fa-circle-h{
    color: var(--sw-primary-brand-BITV);
    
}

.leaflet-marker-icon:not(.startIcon,.endIcon,.departureIcon){
    display:none;
}

.leaflet-marker-icon.show{
    display:block;
}

.routeResults .feedback{
    color: #999;
    font-size: 0.9em;
    padding: 10px;
}

.routeResults .feedback a{
    color: #999;
}

.routeResults .feedback a:hover{
    text-decoration: underline
}

.mapRowItem{
   cursor : pointer;
	padding: 5px;
    border-bottom: 1px solid #ccc
}

.mapRowItem:last-child{
    border-bottom: none;
}

.mapRowItem i{
    color: var(--sw-primary-brand-BITV);
    margin-right: 10px;

}

.leaflet-popup-content {
    width: 300px!important;
}

.leaflet-container a.leaflet-popup-close-button{
    width: 40px;
    height: 40px;
    top: 10px;
    right: 10px;
    font-size: 30px;
    font-weight: bold;

}





#abfahrtForm .stopResults .stopResult, 
#abfahrtForm .stopResults .stopResult .moreContent .moreContentResult{
   
    border-top: 1px solid #ccc;

}



#abfahrtForm .stopResults .stopResult:first-child, #abfahrtForm .stopResults .stopResult .moreContent .moreContentResult:first-child{
    border-top: none;
}

#abfahrtForm .stopResults .stopResult .departureTime,
#abfahrtForm .stopResults .stopResult .moreContent .departureTime{
    font-weight: bold;
}

#abfahrtForm .stopResults .stopResult .differenceTime,
#abfahrtForm .stopResults .stopResult .moreContent .differenceTime{
    
     color: green;
    font-size: 0.9em;
    margin-top: 2px;
}

#abfahrtForm .stopResults .stopResult .differenceTime.later,
#abfahrtForm .stopResults .stopResult .morecontent .differenceTime.later{
    color: red;
}

#abfahrtForm .stopResults .stopResult .line{
    background-color: var(--sw-primary-brand-BITV);
    border-radius: 8px;
    text-align: center;
    color: #fff;
    font-weight: bold;
   
}


#abfahrtForm .stopResults .stopResult {
    cursor: pointer;
}


#abfahrtForm .moreContent{
    border-top: 1px solid var(--sw-primary-brand-BITV);
}

#modal-timetable .lineName{
    color: var(--sw-primary-brand-BITV);
}


:root {
  --walkTripColor: #666;
  --busTripColor:  #018389;
}

.walkTripColor{
    color: var(--walkTripColor);
    
}

.busTripColor{
    color: var(--busTripColor);
}


.walkTripBgColor{
    background-color: var(--walkTripColor);
}

.buskTripBgColor{
    background-color: var(--busTripColor);
}