html{
    font-size:16px;
}

#header .logo {
    width:45px;
    height:32px;
}

/*Banner*/
/*#banner{*/
/*height:300px;*/
/*width:980px;*/
/*background-color:lightblue;*/
/*    background: url("../img/180606_DB_ST_bahn.deKeyvisual_Skyline_980x300.jpg") no-repeat;
    background-size: cover;
}*/

/*Template Korrekturen*/

footer{
    margin-top:30px;
}
#mobileLogout{
    display:none;
}


.hovernochange:hover{
    color:white !important;
    text-decoration: none !important;
}

.hoverCursor:hover{
    cursor:pointer;
}


.icon-zahlung{
    background-image: url(../img/icon-se530d055c2.png);
    position: absolute;
    top: 50%;
    margin-top: -25px;    
    width: 56px;
    height: 56px;   
}

.icon_tooltip_kalender_inner{
    background-image: url(../img/icon-se530d055c2.png);
    position: absolute;
    /*    top: 50%;
        margin-top: -25px;    */
    width: 20px;
    height: 20px;   
    background-position: -3px -1539px;
}

.icon_kalender_fahrt{
    background-image: url(../img/icon-se530d055c2.png);
    width: 22px;
    height: 22px;   
    background-position: 0px -3401px;
    cursor:pointer;
}

.icon-icon_paydirekt_large {
    background-image: url(../img/ico/zahlungsmittel_vendo_giropay.svg) !important;
    background-repeat: no-repeat;
    background-position: center;
    width: 80px;
    height: 52px;   
}

.icon-icon_paypal_large {
    background-position: 0 -1984px;    
}

.icon-icon_sofort_ueberweisung_large {
    background-position: 0 -2928px;
}

.icon-icon_kreditkarte_large {
    background-position: 0 -1640px;
}

.db-modal span.ico {
    display: block !important;
    position: absolute !important;
    background-size: inherit !important;
}

.db-modal .icons-close-big {
    cursor: pointer !important;
    background-position: -52px 0 !important;
    height: 13px !important;
    width: 13px !important;
}

.db-modal .ico {
    background-image: url(../img/icons-sprite.png) !important;
}

.linkfooter .faq>div {
    margin-top: 30px;
}
.linkfooter .faq>div a {
    color:#333;
}
.linkfooter .faq>div a:hover,.tabletNav-content li a:hover, .meta li a:hover {
    text-decoration: none;
}

#header-elements .burger, #nav-back{
    color:#333;
}

.tabletNav-content li a, .meta li a{
    color: #333;
}
h2.light{
    font-size: 20px;
}

@media only screen and (min-width:767px){
    .modul.social-media-leiste.clearfix{
        margin-bottom:40px;
    }
}
@media only screen and (max-width: 767px){
    #ticketFahrtenFrueherHin, #ticketFahrtenFrueherRueck{
        margin-bottom:10px;
    }

    #quickSwitchColumnResp{
        margin-top: -57px;
        margin-left: 291px;
        float:left;
        display:block;
    }

    .linkfooter {
        background: #626973;
        padding-top: 26px;
    }
}
@media only screen and (max-width: 980px){
    #sidebar, nav {
        display: none;
    }
    #mobileLogout{
        display:block;
    }


}
@media only screen and (max-width: 980px){
    .headerBetweenDesktopAndMobile {
        transform: scale(0.8) !important;
        /*padding: 0px !important;*/
        left: 0px !important;
        bottom: -20px !important;
        margin-left: -30px !important;
        margin-top: -30px !important;
    }   
    .headerBetweenDesktopAndMobile10erTTBuchung {
        transform: scale(0.8) !important;
        /*padding: 0px !important;*/
        left: 0px !important;
        margin-left: -30px !important;
        margin-top: -30px !important;
    } 
}


body > div.container-fluid{
    padding:0px;
}
.breadcrumb {
    margin-bottom:0px;
}

/*allgemein*/
form label{
    width:inherit;
}

.font-db-red {
    color: #cc0000;
}

a.link{
    color:#333;
    display:initial;
}

.link:hover{
    color: #c00;
    text-decoration: underline;
}

a.mailto{
    cursor: pointer;
    color: #f01414;
    text-decoration: underline;
}

a.mailto:hover{
    color: #c00;
}

a.inactive {
    cursor: initial;
}
a.inactive:hover {
    text-decoration: none;
    color:#333;
}

.eingabeflaeche{
    background-color: white;
    box-shadow: 1px 1px 5px rgba(0,0,0,0.349);
    padding: 0px;
}

.padding-Eingabeboxen{
    padding: 20px 77px;
}

.zahlungart-beschreibung{
    margin-left:60px;
    margin-top: 15px;
}

@media only screen and (max-width:567px){
    .padding-Eingabeboxen{
        padding: 20px 20px;
    }   
    .zahlungart-beschreibung{
        margin-left:20px;
    }

}


.paddingNormal_15{
    padding:15px;
}

.abtrenner{
    margin: 0px;
    padding: 0 0 0 0;
    border-top: 1px solid lightgray;
}

.zusendungGreyBackground{
    color: #646973;
    padding: 15px;
    background-color: #f5f5f5;
    margin-top: 30px;
    margin-bottom: 5px;
}


.widthFull{
    width:100%;
}

div.custom-select{
    margin:0;
}

div.custom-select:before {
    z-index:1;
}


.backgroundWhitesmoke{
    background-color:#F5F5F5;
}

.icon-reisender {
    position: relative;
    background-image: url(../img/icon-sprite.png);
    text-indent: 9999em;
    display: inline-block;
    background-position: -33px -3006px;
    width: 40px;
    height: 40px;
    bottom: 10px;
}

.icon-icon_tickets_medium-db-sprite {
    background-position: 0 -2981px;
    width: 40px;
    height: 40px;
    bottom: 10px;
}

.icon_kreditkarte_medium{
    background-position: 0 -1696px;
    width: 40px;
    height: 40px;
}

.ico-db-sprite {
    position: relative;
    background-image: url(../img/icon-se530d055c2.png);
    text-indent: 9999em;
    display: inline-block;
}



/*Startseite Sommer-Ticket*/

.boxPanel{
    box-shadow: 1px 1px 5px rgba(0,0,0,0.349019607843137);
    border-color:lightgrey;
}
.boxPanelText{
    background: rgba(0, 0, 0, 0.4);
    color: white;
    padding: 0 20px;
    display:block;
    position:relative;
}

#startColumnBuchung{
    margin-bottom: 15px;
}
#startBuchungLoginImage{
    background-image: url('../img/460x191_login_U27_1.jpg');
    border-bottom:#f01414 solid 6px;
    height:191px;
    background-size: cover;
}

#startBuchungPanel{
    background-image: url('../img/460x285_U27_1.jpg');
    background-size: cover;
    min-height:285px;
}

#startBuchungLoginWeiterColumn{
    padding:0 0 0 10px;
}

#startBuchungLoginImageSenior{
    background-image: url('../img/460_285_c-comp.jpg');
    /*    border-bottom:#f01414 solid 6px;*/
    height:161px;
    background-size: cover;
    background-position-y: -65px;
}

#startBuchungPanelSenior{
    background-image: url('../img/DB173628_V1.jpg');
    background-size: cover;
    min-height:285px;
}


#kachelSenioren{
    background-image: url('../img/460x285_65_2.jpg');
    background-size: cover;
    min-height:285px;
}

#kachelJunioren{
    background-image: url('../img/460x285_U27_1.jpg');
    background-size: cover;
    min-height:285px;
}

#startLoginPanel{
    min-height:285px;
}

#startBuchungButtonZurbuchung{
    color:#fff;
    bottom: 10px;
    width: 220px;
    position: absolute;
}

.buttonAuswahlSeniorenJunioren{
    color:#fff !important;
    bottom: 10px;
    width: 220px;
    position: absolute;
}

#startBuchungZugangscode{
    margin: 10px 0px 10px 10px;
}

#startBuchungPasswort{
    margin: 0px 0px 10px 10px;
    display:block;
    max-width:100%;
}

@media only screen and (max-width: 767px){
    #teaserText20FahrtenStart{
        font-size:20px !important;
        line-height: 25px !important;
    }
    #startBuchungLoginImageSenior{
        background-position-y: -90px;
    }
    #loginButton{
        width: 100% !important;
        margin: 10px 0px !important;
    }
    #startBuchungLoginWeiterColumn{
        padding:0;
    }
    #startLoginDatenVergessen{
        margin: 15px;
    }
    .buttonAuswahlSeniorenJunioren{
        left: 20px;
    }
    #startBuchungButtonZurbuchung{
        left: 20px;
    }
    #startBuchungZugangscode, #startBuchungPasswort{
        width: 215px;
    }
    #forwardButton{
        margin: 0 10px 20px!important;
        width:215px !important;
    }

}

@media only screen and (min-width: 768px){
    #deleteRueckfahrtGroupPanel{
        padding-right:4px;
    }

    #startBuchungZugangscode{
        max-width:100%;
    }
    #loginButton{
        margin: 0 10px 10px 0px !important;
        width: 100% !important;
    }
    #startLoginDatenVergessen{
        margin: 0 0 0 5px;
    }
    #startBuchungButtonZurbuchung{
        right: 10px;
    }
    .buttonAuswahlSeniorenJunioren{
        right:10px;
    }

    #forwardButton{
        max-width: 94%;
        margin: 52px 10px 10px 0px !important;
        width:200px !important;
    }

    .whiteSpaceNoWrap{
        white-space: nowrap;
    }
}

#index_buch_text_container_left{

}

#startBuchungPanelSenior{
    padding-top: 164px;

}
/*Seite Ticket*/

.marginContainer{
    margin: 20px 20px 30px 20px;
}


#ticketContainerAdresse label{
    display:block;
    margin-bottom:0px;
    margin-top:5px
}

#ContainerAdresse label{
    margin-bottom:0px;
    margin-top:5px;
}

#ContainerAdresse input{
    font-family: DBSansBold !important;
    font-size: 14px !important;
    line-height:20px;
}

/*AGB checkbox*/
#ticketContainerAdresseAGB [type="checkbox"]+label:before, #buchungUeberpruefenContainerAGB [type="checkbox"]+label:before{
    top: 2px;
}

#ticketContainerAdresseAGB [type="checkbox"]+label:after, #buchungUeberpruefenContainerAGB [type="checkbox"]+label:after{
    top: 3px;
    left: 2px;
}



#adresseAnredeSelect, #adresseAnredeSelect:focus{
    border: 1px solid #878c96;
    height:30px;
    outline-color:#878c96;

}

#BahnbonusDatenForm table tr:nth-child(odd) {
    background: none;
}

#BahnbonusDatenForm tr td:first-child{
    width:73px;
}

#BahnbonusDatenForm label{
    display:block;
}

#BahnbonusDatenForm input{
    font-family: DBSansBold !important;
    font-size: 14px !important;
    line-height:20px;
}


/*ticket Fahrten Übersicht*/


#ticketFahrtenUebContainer{
    padding:0 20px 20px 20px;
}

.ticketFahrtenUebTicket{
    display:inline-block;
    border: 2px solid #d5d5d5;
    position:relative;
    width:227px;
    margin-top:15px;
    background-color:#fff;
}

.ticketFahrtenUebHeadingDark{
    background-color: #646973;
    color: #fff;
    padding: 7px 10px 5px 10px;
    margin: -2px -2px 0px -2px;
}

.ticketFahrtenUebHeadingLight{
    background-color: #d5d5d5;
    color: #000;
    padding: 5px 8px;
}

.ticketFahrtenUebContent{
    padding:18px 8px 0px 8px;
    height:246px;
}

.ticketFahrtenUebCircleLeft{
    border: 2px solid #d5d5d5;
    width: 8px;
    height: 16px;
    border-radius: 0 8px 8px 0;
    border-left: 0;
    padding: 0;
    background-color: #f2f2f2;
    position: absolute;
    left: -2px;
    z-index: 9;
}

.ticketFahrtenUebCircleRight{
    border: 2px solid #d5d5d5;
    width: 8px;
    height: 16px;
    border-radius: 8px 0 0 8px;
    border-right: 0;
    padding: 0;
    background-color: #f2f2f2;
    position: absolute;
    right: -2px;
    z-index: 9;
}

.ticketFahrtenUebContainerBereitsEin{
    border-top: 1px solid #d5d5d5;
    padding: 20px 8px 24px 8px;
    margin-top: 6px;
    text-align:center;
}

.ticketFahrtenUebContainerFahrtHin{
    border-top: 1px solid #d5d5d5;
    padding: 15px 8px;
    margin-top: 6px;
}


.ticketFahrtenUebFahrtHinButton{
    float:none !important;
}

.buchungBusverbindungIcon{
    display:inline-block;
    width:10%;
    padding-left: 30px;

}


@media only screen and (max-width: 767px){
    .buchungBusverbindungIcon{
        margin-right:15px;
        padding-left:10px;
    }

    #deleteRueckfahrtGroupPanel{
        padding-right:10px;
    }

    input.ticketFahrtenUebFahrtHinButton{
        float:none !important;
        margin: 0 0 5px 20px!important;
        width:auto !important;

    }



}


#ticketFahrtenUebTicketFahrt1{
    margin-right:10px;
}
#ticketFahrtenUebTicketFahrt2{
    margin-right:6px;
}
#ticketFahrtenUebTicketFahrt3{
    margin-right:10px;
}
@media only screen and (max-width: 531px){
    #ticketFahrtenUebTicketFahrt4{
        margin-right:6px;
    }
}

/*ticket Fortschrittsanzeige */
#ticketContainerFortschrittsanzeige, #buchungFortschrittsanzeige{
    margin-bottom: 0px;
}
/*ticket Reiseauskunft*/
#quickfinder {
    max-width: 840px;
    min-height: 235px;
    margin: 20px auto;
    border: 2px solid #878C96;
    -webkit-box-shadow: 0 0 6px 0 rgba(0,0,0,0.3);
    box-shadow: 0 0 6px 0 rgba(0,0,0,0.3);
    background: #f2f2f2;
    border-top: solid 4px #f01414;
    padding: 10px;
}

#warenkorb{
    max-width: 840px;
    margin: 20px auto;   
}



/*#quickfinder input.button-db{
    margin:10px 10px 10px 0 !important;
}*/

#ticketKonditionen{
    max-width: 840px;
    margin: 20px auto;
    padding: 20px;
}

#reiseauskunftSearchbutton{
    margin: 0 0px 0 0 !important;
}


#letzterGeltungstagContainer_text{
    display:inline-block;
}

@media only screen and (min-width: 768px){
    #quickfinderContainer {
        padding: 0 10px 0 30px;
    }

    #quickfinderContainer {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .ticketZielbahnhofMessage{
        margin-left:23px;
        display:block;
    }

    #letzterGeltungstagContainer_value{
        margin-top:10px
    }

    .hideOnDesktop{
        display: none !important;
    }
}

@media only screen and (max-width: 410px){
    #unverbindliche_angebotssuche_zertt{
        background-position-x: -90px !important;
    }
}
@media only screen and (min-width: 410px){
    .zzert_unverbindliche_buchung_button{
        max-width: 300px;
    }
}

@media only screen and (max-width: 767px){
    #quickfinder{

        border: 0; 
        -webkit-box-shadow: 0 0 0 0; 
        box-shadow: 0 0 0 0 ; 
        border-top: 0;
        padding: 0 0 20px 0;  
    }

    #quickfinderContainer{
        max-width:350px;
        padding:20px 10px 0 20px;
    }

    #letzterGeltungstagContainer_text{
        margin-top:10px
    }

    #letzterGeltungstagContainer_value{
        display:inline;
    }
    .hideOnMobile{
        display: none !important;
    }

}

@media only screen and (min-width: 501px){
    .hideOn500px{
        display: none !important;
    }

}
@media only screen and (max-width: 500px){
    .showOn500px{
        display: none !important;
    }  
    #startBuchungLoginImageSenior{
        background-position-y: -40px ;
    }   
}

#eingabeResetButton{
    padding:0px;
}

@media only screen and (min-width:768px) and (max-width:820px){
    #quickfinder{
        margin: 20px 20px;
    }

    #quickfinderContainer{
        padding: 0 10px 0 10px !important;
    }

    .reiseauskunft_date_row{
        width:43.5%;
    }
}



@media only screen and (min-width:811px){   
    #quickfinderContainer{
        margin-left: 5px;
    }

    #reiseauskunftSearchbutton{
        margin: 0 22px 0 0 !important;
    }

}
@media only screen and (max-width: 380px){   

    #startbahnhof, #zielbahnhof{
        width:192px !important;
    }

    #quickfinderBahnhofstauschColumn{
        margin: 0px;
        padding-left: 0px !important;
    }
}



#startbahnhof, #zielbahnhof {

    border: solid 1px #878c96;
    border-left: solid 0px #878c96;
    width: 251px;
    height: 32px;
}
#startbahnhof-label, #zielbahnhof-label {
    border-right: 0px !important;
    border-left: 1px solid #878c96 !important;
    border-top: 1px solid #878c96 !important;
    border-bottom: 1px solid #878c96 !important;
    padding-left: 6px;
    width: 100%;
    height: inherit;
    position: inherit;
    line-height: 16px;
    color: #878c96;
    line-height: 16px;
    color: #878c96;
    top: 0px;
    width: 20px;
    width: 37px;
    height: 32px;
    background-color: white;
    margin-right: 0px;
}


#quickSwitchColumnDesk{
    width:11.67%;
    text-align: center;
}


svg.icon-swap {
    position: relative;
    height: 32px;
    width: 32px;
    top: 0;
    left: 0;
    padding: 4px;
    fill: #878c96;
    border: solid 1px #878c96;
    background: #fff;
}
svg.icon-swap:hover {
    cursor:pointer
}

#js-auskunft-timeinput{
    min-width:127px;
}

@media only screen and (max-width: 767px){
    form  #quickfinder label {
        padding-top: 7px;
    }
}

.icon-nav {
    background: #f5f5f5 url(../img/icon-sprite.png) no-repeat scroll 0 0;
    cursor: pointer;
    height: 29px;
    width: 30px;
}

.icon-nav:hover {
    background-color: #e1e1e1;
}

.arrow-left {
    background-position: -34px -191px;
}
.arrow-right {
    background-position: -68px -191px;
}


#ui-datepicker-div.ui-datepicker-multi {
    width: 802px !important;
}

#quickfinder div > .ui-datepicker-trigger {
    display: block;
}

#quickfinder #dateHin {
    line-height: 29px;
    min-height: 29px;
    height:29px
}

.quickfinderRowMargin{
    margin-top: 10px;
    margin-bottom: 10px;
}

#quickAnzahlKinder, #quickAnzahlKinder:focus{
    border: 1px solid #878c96;
    height:30px;
    outline-color:#878c96;
    width: 110px;
}

.startbahnhofContainer, .zielbahnhofContainer{
    width:276px;
}
.zielbahnhofContainer{
    margin-left:23px;
}

@media only screen and (min-width:768px) {

    #quickSwitchColumnDesk{
        padding-left: 45px;
    }

}

#searchErrorEingabeflaeche{
    margin-right:20px;
}

#quickfinderButtonContainer{
    padding:15px 20px 0 0;
}

@media only screen and (max-width:767px) {

    .swap {
        transform: rotate(90deg);
    }

    .zielbahnhofContainer{
        margin-left:0px;
        margin-top:-14px;
    }
    #js-auskunft-timeinput{
        margin-top: 10px;
    }
    #quickSwitchColumnDesk{
        display: flex;
        position:absolute;
        margin-top: 25px;
        margin-left: 289px;
    }
    #searchErrorEingabeflaeche{
        margin-right:5px;
    }
    #quickfinderButtonContainer{
        padding:15px 8px 0 0;
    }

}

@media only screen and (max-width:375px) {
    #quickSwitchColumnResp{
        margin-left: 260px;       
    }

    .startbahnhofContainer, .zielbahnhofContainer{
        width:232px;
    }
    .zielbahnhofContainer{
        width:232px;
        margin-top:-14px;
    }

    #quickSwitchColumnDesk{
        display: flex;
        margin-top: 24px;
        margin-left: 245px;
    }

}

@media only screen and (min-width:768px) and (max-width:796px){
    #zielbahnhofColumn{
        margin-left: 10px !important;
    }
}




/*ticket Reiseauskunft Übersicht*/
#reiseausHeadRow{
    margin: 0px;    
    padding: 2px 0 2px 0;
    background-color:#e7e7e7;
}

#reiseaustHeadHaltestelle {
    background-color: #e7e7e7;
}
#reiseausHeadZeit {
    background-color: #e7e7e7;
}
#reiseausHeadDauer {
    background-color: #e7e7e7;
}
#reiseausHeadUmstiege {
    background-color: #e7e7e7;
}
#reiseausHeadProdukte {
    background-color: #e7e7e7;
}
#reiseausHeadAuswahl {
    background-color: #e7e7e7;
}

#reiseausHeadUmstiege {
    padding: 0px;
    text-align: center;
}


@media only screen and (min-width: 768px){

    .reiseauskunft-col-uhrzeit{
        padding-left:0px;       
    }

    #reiseausHeadZeit {
        border-left: 1px solid #fff;
        border-right: 1px solid #fff;
    }
    #reiseausHeadUmstiege {
        border-left: 1px solid #fff;
        border-right: 1px solid #fff;
    }
    #reiseausHeadProdukte {
        border-right: 1px solid #fff;
        padding: 0px;
        text-align: center;
    }
    #reiseausHeadDauer {
        padding: 0px;
        text-align: center;
    }
    .reiseausVerbRow{
        margin: 20px 0px 0px 0px;
        display:flex;
    }

    #zielbahnhofColumn{
        padding:0px;
        margin-left:30px;
    }   

    #rowBahnhof_buch_such{
        margin-right:30px;
    }
}

@media only screen and (max-width: 767px){
    #ticketFahrtenFrueher{
        margin-bottom:10px;
    }

    .reiseausVerbRow{
        margin:10px 0 0px 0;
        padding:10px 0px 15px 0px;       
    }
    .detailsResponseHeadingColumn{
        padding-left:56px;
    }
    .detailsHeadingContainer{
        width:89%;
    }

    .fehlermeldung_bahnhof_suche_buch{
        max-width: 300px;
        display: block;
    }

    svg.icon-swap.fehler_bahnhof_resp{
        top:-20px;
    }
}


.farhtenPrevArrow:before{
    font-family: "db-icons";
    font-size: 7px;
    content: "\f11b";
    color: #fff;
    position: absolute;
    top: 17px;
    left: 6px;
    z-index: 1;
}

.farhtenNextArrow:before{
    font-family: "db-icons";
    font-size: 7px;
    content: "\f11a";
    color: #fff;
    position: absolute;
    top: 17px;
    left: 6px;
    z-index:1;
}

.tootltip-db-icons:before{
    font-family: "db-icons";
    content: "\f138";
    color: #878c96;
    font-size: 18px;
}

a.tootltip-db-icons:hover{
    text-decoration: none;
}

.reiseausColHaltestelle {
    background-color: #fff;
}
.reiseausColZeit {
    background-color: #F5F5F5;
}
.reiseausColDauer {
    background-color: #fff;
}
.reiseausColUmstiege {
    background-color: #F5F5F5;
}
.reiseausColProdukte {
    background-color: #fff;
}
.reiseausColAuswahl {
    background-color: #F5F5F5;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ticketDetailsLineColumn{
    display:inline-block;
    width:66px;
    padding-left: 30px;
}

@media only screen and (max-width: 479px){
    .hide_smaller_than480{
        display:none;
    }
    .reiseausColAuswahl{
        width:100%;
    }
}
@media only screen and (min-width: 479px){
    .hide_greater_than479{
        display:none;
    }
}



@media only screen and (max-width: 767px){
    .reiseausColZeit {
        background-color: #fff;
    }
    .reiseausColUmstiege {
        background-color: #fff;
    }
    .reiseausColAuswahl {
        background-color: #fff;
        margin-top: 15px;
    }

}

.ticketAuswahl_klassePreis{
    display:none;
}

@media only screen and (max-width: 767px){
    .hide_smaller_than768{
        display:none;
    }

    .ticketAuswahl_klassePreis{
        display:block;
        padding-top:10px;
        padding-bottom: 5px;
    }

    .ticketFahrtenRepeatContainer{
        padding-bottom: 0px;
    }

    .ticketDetailsLineColumn{
        margin-right:15px;
        padding-left:10px;
    }

    .auswahl_details_zugnummer_fahrplan{
        text-align:left !important;
    }

    .fahrtenPrevNextColumn{
        margin:0 auto;
        float:none;
        width:100px;
    }

    .ticketDetailsLineColumn{
        padding-top:20px;
        width:32px;
    }

    .ticketUeberpruefenResInklusive{
        padding-top:4px;
    }
}


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

}

.textOverflowElipsis{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}



.sendungstoggleButton{
    cursor:pointer;
    width:170px;
    margin:15px 0;
}

.sendungsDetailsEinblendenButton:hover, .sendungsDetailsAusblendenButton:hover {
    background: #646973;
}
.sendungsDetailsEinblendenButton, .sendungsDetailsAusblendenButton {
    display: inline-block;
    background: #878c96;
    width: 22px;
    height: 22px;
    box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.5);
    text-align: initial;
}

.sendungsDetailsEinblendenIcon, .sendungsDetailsAusblendenIcon{
    fill:white;
    height: 11px;
    width:11px;
    margin:6px 0px 0px 5px;
}

einblendenIconPath  {
    fill:white;
    height: 11px;
    width:11px;
    margin:6px 0px 0px 5px;
}

.ausblendenIconPath, .fahrtDdetailsEinblendenContainer{
    display:none;
}

.ticketFahrtenRepeatContainer{
    display:flex;
    padding-top:10px;
    padding-bottom:10px;
}

/*Überprüfen Sie Ihre Buchung*/
.iconSitzInkl {
    font-family: db-icons;
    color: #333333;
    font-size: 16px;
    margin-left: 4px;
}

/*Bestätigung*/

#bestaetigung_form{
    font-size:14px;
    background: rgb(245,245,245);
}

#bestaetigung_content{
    padding:20px;
}

.bestaetigung_pfeil_rechts{
    margin-top:35px;
    height:20px;
    width:60px;
    background: url("../img/icon-sprite-db-new.png") 0 -2570px no-repeat #fff;
}


@media only screen and (max-width: 767px){
    #bestaetigung_banner_wir_wuenschen{
        display:inline-block;margin-top:20px;
    }

    #bestaetigung_content .bestaetigung_pfeil_rechts {
        display:none;
    }

    #bestaetigung_digital_papier_column{
        margin-top:20px;
        margin-bottom:20px;
    }
    #bestaetigung_digital_papier_column_ticket{
        margin-top:20px;
        margin-bottom:20px;
    }

    #besteaetigung_ticket_speichern_pdf{
        margin-top:20px;
        margin-bottom:20px;
    }

    #bestaetigung_banner_wir_wuenschen{
        display:inline-block;margin-top:20px;
    }

    .bestaetigungMarginResp{
        margin-top: 15px;
    }
    .bestaetigungTicketConfImage{
        margin:0 auto;
    }

}

@media only screen and (min-width:768px){
    /* Bestätigungsseite*/
    .noPaddingGreaterThan768{
        padding:0px;
    }

    #bestaetigung_digital_papier_column{
        width:28%;
    }
    #bestaetigung_digital_papier_column_ticket{

    }

    .bestaetigungTicketConfImage{
        float:right;
    }
}

@media only screen and (min-width:768px) and (max-width:820px){
    .bestaetigungiPadSmallerFontSize{
        font-size:12px !important;
    }

    .iPadPaddingZero{
        padding-right: 0px;
        padding-left: 0px;
    }
}


/*Richfaces Autocomplete*/
/* angepasst*/


#startbahnhof  input.ui-autocomplete-input, #zielbahnhof  input.ui-autocomplete-input{
    width: 236px;
}

@media only screen and (max-width:375px) {
    #startbahnhof  input.ui-autocomplete-input, #zielbahnhof  input.ui-autocomplete-input{
        width: 192px;
    }
    #zielbahnhof  input.ui-autocomplete-input{
        width: 192px;
    }

}

/*#startbahnhofItems, #zielbahnhofItems{
    background: white !important;
    padding-top: 10px;
    padding-bottom:10px;
}

*/#startbahnhof_input, #zielbahnhof_input{
    line-height: 29px;
    min-height: 29px;
    border:0;
}



.ui-autocomplete{
    border: none !important;
    position:relative !important;
    display: inline-block;
    background-image: none;
    background-repeat: repeat-x;
    background-position: top left;
    vertical-align: middle;
}

.pi-spinner{
    display:none !important;
}

input.ui-autocomplete-input{
    background:white;
    font-weight:normal;
}

#startbahnhof input.ui-autocomplete-input {
    padding-left:2px;
}

#zielbahnhof input.ui-autocomplete-input {
    padding-left:4px;
}

.ui-autocomplete-panel{
    overflow: visible;
}

/*


#zielbahnhofItems .ui-autocomplete-item, #startbahnhofItems .ui-autocomplete-item{
    background-color:white;
    width:286px;
    padding-left: 12px;
    font-family: DBSansRegular;
    font-size:14px;
}

#zielbahnhofList .ui-autocomplete-item-sel, #startbahnhofList .ui-autocomplete-item-sel{
    border:none;
}

#zielbahnhofList .rf-au-lst-dcrtn, #startbahnhofList .rf-au-lst-dcrtn{
    border: none;
}


*/.ui-autocomplete-list{
    color:#333;
    border: none;
    background: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-box-shadow: 0 0 12px -2px rgba(0,0,0,0.5);
    box-shadow: 0 0 12px -2px rgba(0,0,0,0.5);
    cursor: pointer;
    font-family: DBSansRegular,Arial,Helvetica,"sans serif";
    font-weight: normal;
    padding:0px;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}


/*#zielbahnhofItems .ui-autocomplete-item:hover, #zielbahnhofItems .ui-autocomplete-item:focus, #zielbahnhofItems .ui-autocomplete-item:active{
    border:none;
    background-color: #e7e7e7;
    color: #333;
    font-family: DBSansRegular,Arial,Helvetica,"sans serif";
    font-weight: normal;
    cursor: pointer;
}

#startbahnhofItems .ui-autocomplete-item:hover, #startbahnhofItems .ui-autocomplete-item:focus, #startbahnhofItems .ui-autocomplete-item:active{
    border:none;
    background-color: #e7e7e7;
    color: #333;
    font-family: DBSansRegular,Arial,Helvetica,"sans serif";
    font-weight: normal;
    cursor: pointer;
}*/

/*.ui-autocomplete-list:before {
    background: #fff;
    content: "";
    display: block;
    height: 10px;
    position: absolute;
    top: -4px;
    left: 10px;
    transform: skew(0deg) rotate(135deg);
    -webkit-transform: skew(0deg) rotate(135deg);
    -moz-transform: skew(0deg) rotate(135deg);
    -ms-transform: skew(0deg) rotate(135deg);
    -o-transform: skew(0deg) rotate(135deg);
    width: 10px;
    box-shadow: -3px 3px 3px 0 rgba(0, 0, 0, 0.12);
    z-index: inherit;
}

#startbahnhofItems .ui-autocomplete-item.rf-au-opt.rf-au-fnt.rf-au-inp, #zielbahnhofItems .ui-autocomplete-item.rf-au-opt.rf-au-fnt.rf-au-inp{
    padding:0px 5px
}
#startbahnhofItems, #zielbahnhofItems{
    margin-top:0px
}
#startbahnhofList .rf-au-lst-scrl, #zielbahnhofList .rf-au-lst-scrl{
    background-color:white
}
#startbahnhofList, #zielbahnhofList{
    margin-top:0px
}
.rf-au-lst-dcrtn{
    padding-top: 10px;
    background-color: white;
}*/


#startbahnhof_panel, #zielbahnhof_panel{   
    /*display:table;*/
    margin-top:10px;
    /*height:300px;*/
    /*overflow-y:scroll;*/
}

#startbahnhof_panel::before, #zielbahnhof_panel::before {
    background: #fff;
    content: "";
    display: block;
    height: 10px;
    position: absolute;
    top: -4px;
    left: 10px;
    transform: skew(0deg) rotate(135deg);
    -webkit-transform: skew(0deg) rotate(135deg);
    -moz-transform: skew(0deg) rotate(135deg);
    -ms-transform: skew(0deg) rotate(135deg);
    -o-transform: skew(0deg) rotate(135deg);
    width: 10px;
    box-shadow: -3px 3px 3px 0 rgba(0, 0, 0, 0.12);
    z-index: inherit;
}



#startbahnhof_panel > ul, #zielbahnhof_panel > ul{  
    max-height:300px;
    overflow: auto;    
}



/*#startbahnhof_input, #startbahnhof_input:hover, #startbahnhof_input:active, #startbahnhof_input:focus{
    background-color: white;
    background-image:none;
    background:none;
    border:none;
    box-shadow: none;
    font-family:DBSansBold, Arial, Helvetica, "sans serif";
    font-size:14px;
}*/

/*#zielbahnhof_input, #zielbahnhof_input:hover, #zielbahnhof_input:active, #zielbahnhof_input:focus{
    background-color: white;
    background-image:none;
    background:none;
    border:none;
    box-shadow: none;
    font-family:DBSansBold, Arial, Helvetica, "sans serif";
    font-size:14px;
}*/

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{
    font-family:DBSansBold, Arial, Helvetica, "sans serif";
    font-size:14px;
    color:#333;
}

/*#startbahnhof_input{
    width:251px;
}
#zielbahnhof_input{
    width:251px;
}*/

.ui-state-highlight, .ui-widget-content .ui-state-highlight,  .ui-widget-header .ui-state-highlight{
    border: 1px solid #fed22f; 
    background: #ffe45c url(images/ui-bg_highlight-soft_75_ffe45c_1x100.png) 50% top repeat-x; 
    color: #363636;

}

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{
    border: 1px solid #666;
    background: #aaa;
    background: #aaa linear-gradient(top,rgba(0,0,0,0.25),rgba(0,0,0,0));
    background: #aaa -webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0.25)),to(rgba(0,0,0,0)));
    background: #aaa -moz-linear-gradient(top,rgba(0,0,0,0.25),rgba(0,0,0,0));
    color: #fff;
    text-shadow: 1px 1px 1px #333;
}


@media only screen and (min-width: 768px){
    #startbahnhof-label{
        border-top: 0.5px solid #878c96;
        border-left: 0px solid #CC0000 !important;
        border-right: 0px solid #CC0000 !important;
        border-bottom: 0px solid #878c96 !important;
    }
    #zielbahnhof-label{
        border-top: 0.5px solid #878c96;
        border-left: 0px solid #CC0000 !important;
        border-right: 0px solid #CC0000 !important;
        border-bottom: 0px solid #CC0000 !important;
    }


}

li.ui-autocomplete-item.ui-autocomplete-list-item.ui-corner-all , .ui-autocomplete-query {
    font-family: DBSansRegular !important;
    font-size: 14px !important;
    font-weight: normal !important;
    line-height:20px;

}

ul.ui-autocomplete-items.ui-autocomplete-list.ui-widget-content.ui-widget.ui-corner-all.ui-helper-reset{
    border:0px;
    padding-left: 10px;
    padding-bottom: 2px;
    padding-top: 2px;
}

ul.ui-autocomplete-items.ui-autocomplete-list.ui-widget-content.ui-widget.ui-corner-all.ui-helper-reset{
    background: #fff;
    margin:0px;
    border:0px;
    padding-left: 0px;
    padding-bottom: 2px;
    padding-top: 2px;
    padding-right:0px
}
li.ui-autocomplete-item.ui-autocomplete-list-item.ui-corner-all.ui-state-highlight{
    background:#e7e7e7;
    color:#333;
    text-shadow:none;
    border:0px;
    border-bottom-left-radius:0px;
    border-bottom-right-radius:0px;
    border-top-left-radius:0px;
    border-top-right-radius:0px;
}
ul.ui-autocomplete-items.ui-autocomplete-list.ui-widget-content.ui-widget li:first-child{
    margin-top:6px;
}
ul.ui-autocomplete-items.ui-autocomplete-list.ui-widget-content.ui-widget li{
    padding-left:10px;
}


/* Buchung Ticketart */

@media only screen and (max-width:767px){
    .navigationRespons{
        margin-left:20px;
    }
}
/*Trefferliste*/
.rf-au-lst-scrl{
    max-height:200px !important;
}


/* Buchung Ticket Überprüfen */
table.table_zusammenfassung{
    width:100%;
}

table.table_zusammenfassung tr{
    background:none;
}

table.table_zusammenfassung td{
    vertical-align: top;
    padding:5px !important;
    font-family: DBSansRegular !important;
    font-size: 14px !important;
    font-weight: normal !important;
}

#package2_01_Angebot{
    height: 22px;
    width: 22px;
    color: white;
    margin-top: 2px;
}

@media only screen and (max-width:420px) {

    #package2_01_Angebot{
        width:18px;
        height:18px;
    }
}

@media only screen and (max-width:380px) {

    #package2_01_Angebot{
        width:16px;
        height:16px;
        margin-top: 4px;
    }

    #pruefenBuchenGesamtpreisContainer{
        padding:2px !important;
    }
}

@media only screen and (max-width:350px) {

    #package2_01_Angebot{
        width:14px;
        height:14px;
        margin-top: 6px;
    }

    #pruefenBuchenGesamtpreisContainer{
        padding:0px !important;
    }

    .pruefen_gesamtpreis {
        font-size: 14px !important;
    }
}

@media only screen and (max-width:480px) {
    #pruefenInner{
        margin: 0 10px;
    }

    .zahlungsartColumn{
        width:100%;
        height: auto !important; 
        padding-top: 15px !important;
    }   
    .widthTicketGuelReise{
        width:100%;
    }

}
.zahlungsartEntgelt {
    text-align: right;
    padding: 15px 30px;
    background-color: whitesmoke;
}

.zahlungsartPaypal{
    background-image: url(../img/icon2x-sa79d2dca33.png);
    background-position: 0 -1960px;
    width: 56px;
    height: 56px;
}

.zahlungsartKreditkarte{
    background-image: url(../img/icon2x-sa79d2dca33.png);
    background-position: 0 -1616px;
    width: 56px;
    height: 56px;
}

/*Radio Button Zahlung*/

.buchungZahlungsart input[type="radio"]:checked+label:after {
    content: "";
    position: absolute;
    left: 5px;
    top: 5px;
    width: 12px;
    height: 12px;
    border-radius: 12px;
    background-color: #c00;
}

.buchungZahlungsart [type="radio"]+label:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 22px;
    height: 22px;
    border-radius: 22px;
    background: #fff;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.15) inset;
    border: 1px solid #878c96;
}

.buchungZahlungsart input[type='radio'] {
    display: none;
    opacity: 0;
    filter: alpha(opacity=0);
    margin: 5px 0 0 5px;
}

@media only screen and (max-width:524px) {
    #ticketContainerFortschrittsanzeige, #buchungFortschrittsanzeige{
        display:none;
    }
    .ticketAuswahl_padding-right_resp{
        padding-right:0px
    }
}



/*Validator*/
.fehlermeldungen-db-color-red{
    color:#CC0000 !important;
}
.fehlermeldungen-db-border-red{
    border: 1px solid #CC0000 !important;
}

.logo-inside-bahn {
    background-image: url("../img/logo-inside-bahn.svg");
}

.logo-community {
    background-image: url("../img/logo-community.svg");
}


/* Template */

.ui-button-text-only .ui-button-text{
    padding-top:0px;
    padding-bottom:0px;
}

.ui-widget-overlay{
    background:#666;
}

.pf_popup .ui-widget-header{
    background:#f01414;
    border-radius: 0;    
} 

.pf_popup{
    top: 50% !important; left: 50% !important;
    transform: translate(-50%, -50%) !important; -webkit-transform: translate(-50%, -50%) !important; -moz-transform: translate(-50%, -50%) !important; -o-transform: translate(-50%, -50%) !important; -ms-transform: translate(-50%, -50%) !important;
    background:white;
    border-radius: 0;
}


.pf_popup div.ui-dialog-titlebar.ui-widget-header.ui-helper-clearfix.ui-corner-top{
    padding: 0 5px;
} 

.pf_popup div.ui-dialog-content.ui-widget-content{
    overflow:hidden;
} 


@media only screen and (max-width: 767px){
    .pf_popup input[type="submit"], input[type="reset"] {
        width: auto !important;
    }
}




button.button-db.color-db-red span.ui-button-text.ui-c{
    color:white;
    font-family: DBSansBold;
}

/* Umfrage */
.umfrage_popup_size {
    width:600px;
    height:400px;
}
.umfrage_popup_link {
    margin: 10px 40px 23px 15px !important;
    display: inline !important;
    text-decoration-line: underline;
}

.db-modal {
    display: none;  
    position: fixed; 
    z-index: 1; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgb(0,0,0); 
    background-color: rgba(0,0,0,0.4);
}

.db-modal-box {
    /*display: none;*/
    position:relative !important;
    background-color: white;
    margin: 5% auto; 
    border: 0;

}

.db-modal-header {
    position:relative !important;
    background-color: red;
    margin: 0; 
    padding: 0 10px;
    border: 0;
    color:white;
}

.db-modal-content {
    position:relative !important;
    margin: 10px;
    border: 0;
    -moz-box-shadow:3px 3px 10px !important;  
    -webkit-box-shadow:3px 3px 10px !important;  
    -khtml-box-shadow:3px 3px 10px !important;  
    box-shadow:3px 3px 10px !important;  
}

#umfrage_popup span.ico {
    display: block !important;
    position: absolute !important;
    background-size: inherit !important;
}

#umfrage_popup .icons-close-big {
    cursor: pointer !important;
    background-position: -52px 0 !important;
    height: 13px !important;
    width: 13px !important;
}

#umfrage_popup .ico {
    background-image: url(../img/icons-sprite.png) !important;
}




@media only screen and (max-width:600px){
    .umfrage_popup_size {
        width: 320px !important;
        height: 750px !important;        
    }
    .umfrage_popup_buttn {
        float: none !important;
        width: 100% !important;
    }
    .umfrage_popup_link {
        margin: 10px 40px 23px 15px !important;
        display: block !important;
        text-decoration-line: underline;
    }

}



@media only screen and (max-width: 400px){
    #startBuchungButtonZurbuchungJunioren{
        margin-bottom:-5px;
    }
}

@media only screen and (max-width: 375px){
    #Index-Weiter-Junioren, #Index-Weiter-Senioren{
        margin-bottom:-5px;
    }
}



#quickfinderTicketauswahl table.radio-db tr{
    background-color:#fff;
}  

#ContainerAdresse select[disabled="disabled"]{
    background-color:#ebebe4;   
    opacity: 0.9 !important;
}

#ContainerAdresse input[disabled="disabled"]{
    background-color:#ebebe4;   
}

.ui-message-error-icon{
    display:none;
}

.ui-message-error-detail{
    margin-left:0;
}

.ui-message-error{
    background-color: white;
    box-shadow: 1px 1px 5px rgba(0,0,0,0.349);
    padding: 0px; 
    border:0;
}



.info {
    opacity: 1 !important;
}

/*bahn.bonus*/
/*.table_bahnbonus {
    width:80%;
}*/
.table_bahnbonus td:nth-of-type(1){
    width:10%;
}
.table_bahnbonus td:nth-of-type(2){
    width:80%;
}
.table_bahnbonus td:nth-of-type(3){
    width:10%;
    text-align:right;
}
.table_bahnbonus td{
    background: white !important;
}

.radio-db td{
    background: white !important;
}

/*Sparkalender*/
#sparHinfahrtElemente{
    padding: 0px 20px 0 20px;
}

#sparHinfahrtenElemente #package1_021_Zurueck_Hin, #sparHinfahrtenElemente #package1_020_Weiter_Hin, #sparHinfahrtenElemente #package1_021_Zurueck_Hin_Resp, #sparHinfahrtenElemente #package1_020_Weiter_Hin_Resp {
    width:40px;
}

.sparTagNavColumn{
    flex: 0 0 50px;
    background:#9fa3ab;
    color:#fff;
    border-top: 2px solid #9fa3ab;
    /*border-bottom: 2px solid #8cb90f;*/
}

.sparTagColumnSelected > .sparElementInner, div.sparTagColumnSelected + div.sparElement>div.sparElementInner, div.sparTagNavColumn + div.sparElement>div.sparElementInner {
    border:none;
}

.sparMouseHover:hover{
    cursor:pointer;
}

.sparElement{
    width: 20%;
    box-sizing: border-box;
}

.sparElementInner{
    border-left: 1px solid #9fa3ab;
}

.sparTagColumn{
    background:#878C96;
    color:#fff;
    border-top: 2px solid #878C96;
    /*border-bottom: 2px solid #8cb90f;*/
}


.sparTagColumnSelected{
    background:#fff;
    color:#333;
    border: solid 2px #8cb90f;
    /*    border-top: solid 2px #8cb90f;
        border-right: solid 2px #8cb90f;
        border-left: solid 2px #8cb90f;*/
}

.sparTagColumnSelected > .sparElementInner, div.sparTagColumnSelected + div.sparElement>div.sparElementInner, div.sparTagNavColumn + div.sparElement>div.sparElementInner {
    border:none;
}

.sparElementDatumWrapper{
    margin-bottom:10px;
}

@media only screen and (max-width:480px) {
    #sparHinfahrtElemente{
        padding: 0px 10px 0 10px;
    }    
    .sparTagNavColumn{
        flex: 0 0 31px;
    }
}

@media only screen and (min-width: 421px){
    .hide_greater_than420{
        display:none;
    }
}

@media only screen and (max-width:767px) {
    #sparHinfahrtenElemente #package1_021_Zurueck_Hin, #sparHinfahrtenElemente #package1_020_Weiter_Hin, #sparHinfahrtenElemente #package1_021_Zurueck_Hin_Resp, #sparHinfahrtenElemente #package1_020_Weiter_Hin_Resp {
        width:30px;
    }
    .sparTagNavColumn{
        flex: 0 0 40px;
    }
    .sparElementResponsiveHidden{
        display:none;
    }
    div.sparElementResponsiveFirstNotHidden>div.sparElementInner{
        border:none;
    }

    .sparElement{
        width: 33.33%;
    }
}



/* Multifahrtauswahl Box */
.multifahrt_strecke_box{
    background: white;
    -webkit-box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.4);
    box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.4);
    margin:0px auto;
    margin-top:10px;
    padding: 15px;
    line-height:initial;
    width:90%;
    display:inline-block;
    position:relative;

    /*min-height:190px;*/
    vertical-align:top;
}
#multi-strecken-result-container div.multifahrt_strecke_box_mehrfahrten{
 width:auto;
 max-width:940px;
 margin-right:20px;
 display:block   
}

@media only screen and (min-width:768px) {
    #multi-strecken-result-container div.multifahrt_strecke_box_mehrfahrten{
        padding-bottom:20px;
    }
}

.ticketAuswahl_greenArrowDiv{
    margin-top:-20px
}

@media only screen and (max-width: 767px){ 
    .multifahrt_strecke_box{
        padding-bottom:5px;
    }
    .ticketAuswahl_greenArrowDiv{
        margin-top:0px
    }
}

.multifahrt_strecke_box:nth-child(even) {
    margin-left:20px;
    margin-right:15px;
}

.multifahrt_strecke_box:nth-child(odd) {
    margin-left:20px;
    margin-right:0px;
}


.multi-icon-touch-knot:before {
    content: "";
    position: absolute;
    left: 1px;
    bottom: 0;
    width: 8px;
    height: 8px;
    background: #646973;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
}

.multi-icon-touch-knot:after {
    content: "";
    position: absolute;
    right: 1px;
    bottom: 0;
    width: 8px;
    height: 8px;
    background: #646973;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
}

.multi-icon-touch-line:after {
    content: "";
    position: absolute;
    left: 12px;
    bottom: 2px;
    right:12px;
    height: 3px;
    background: #646973;
}

.multi-icon-touch-line, .multi-icon-touch-knot {
    width: 100%;
    position: relative;
}


.multi-strecke-box-zielbahnhof{
    text-align:right;
}

@media only screen and (max-width:1023px) {

}

.strecken_tool{
    display:inline-block;
}

@media only screen and (max-width:767px) {
    .multifahrt_strecke_box{
        width:initial;
        display:block;
    }   

    .multifahrt_strecke_box:nth-child(odd) {
        margin-left:20px;
        margin-right:20px;
    }

    .multifahrt_strecke_box:nth-child(even) {
        margin-left:20px;
        margin-right:20px;
    }

    .multi-strecke-box-zielbahnhof{
        text-align:left;
    }

    .multi-icon-touch-line, .multi-icon-touch-knot{
        display:none;
    }

    .multi-fahrt-doppelpfeil {
        -webkit-transform: translateX(-6px) rotate(90deg);     /* Chrome and other webkit browsers */
        -moz-transform: translateX(-6px) rotate(90deg);        /* FF */
        -o-transform: translateX(-6px) rotate(90deg);          /* Opera */
        -ms-transform: translateX(-6px) rotate(90deg);         /* IE9 */
        transform: translateX(-6px) rotate(90deg);             /* W3C compliant browsers */
    } 
    .strecken_tool{
        display:block;
    }

    #archivIconColumn{
        padding-top: 3px;
    }
}

/* Ende Multifahrtauswahl Box */



.featherlight:last-of-type {
    background: rgba(0,0,0,.3) !important;
}

button.featherlight-close-icon.featherlight-close{
    margin:10px;
}

div.featherlight-content{
    width:660px;
    max-width:90%;
}

#quickSwitchColumnResp{
    display:none;
}

#connections{
    max-width: 840px;
    margin: 20px auto;
}

.tableConnectionTableRow{
    margin:0px 0px 5px 0px;
    padding:0px;
}

.tableConnectionTableRow > div > div {
    font-style:normal;
    font-family: DBSansRegular; 
    font-size: 12px;
    font-weight: normal; 
}

.tableConnectionTableRow > div  {
    padding:0;
}


.tableConnectionTableHead{
    margin:20px 0px 5px 0px;
    padding:6px 0px;

}

.tableConnectionTableHead > div > div {
    background-color:#e7e7e7;   
    font-style:normal;
    font-family: DBSansRegular; 
    font-size: 12px;
    font-weight: normal; 
}

.tableConnectionTableHead > div  {
    padding:0;
    border-right:1px solid #f2f2f2;

}

@media only screen and (max-width: 991px){   
    .hide_smaller_than992{
        display:none;
    }

    .background-white_smaller_than992{
        background-color: white;
    }

    .haltestelleHeader{
        display: inline-block;
        padding: 4px 0px 4px 8px;
    }
    .umstiegeColumnWidth{
        text-align:left;
    }

    .auswahl_details_zugnummer_fahrplan{
        text-align:left !important;
    }

}

@media only screen and (min-width: 992px){
    .hide_greater_than991{
        display:none; 
    }

    /*    .haltestelleColumnWidth{
            width:25%;
        }
        .zeitColumnWidth{
            width:7%;
        }
        .dauerColumnWidth{
            width:6%;
        }
        .umstiegeColumnWidth{
            width:5%;
            text-align:center;
        }
        .produkteColumnWidth{
            width:9%;
        }
    */


    .doubleAngebotColumnWidth {
        width: 32%;
    } 

    .background-white_greater_than991{
        background-color: white;
    }

    .tableConnectionRepeatRowSingle{
        display: flex;
    }

}

.farhtenPrevArrow:before{
    font-family: "db-icons";
    font-size: 7px;
    content: "\f11b";
    color: #fff;
    position: absolute;
    top: 17px;
    left: 6px;
    z-index: 1;
}

.farhtenNextArrow:before{
    font-family: "db-icons";
    font-size: 7px;
    content: "\f11a";
    color: #fff;
    position: absolute;
    top: 17px;
    left: 6px;
    z-index:1;
}

.fahrtenPrevNextColumn{
    margin:0 auto;
    float:none;
    width:100px;
}

.tableConnectionRow{
    margin:10px 0;
    box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.4);

}

.tableConnectionRow > div {
    padding:10px;
}


.tableConnectionWrapper{
    box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.4);
}

/*.tableConnectionWrapper > div{
    padding:10px;
}*/

.tableConnectionRepeatRowSingle{
    margin:10px 0;
}

.tableConnectionRepeatRowSingle > div {
    padding:10px;
}

.detailsEinblendenButton, .detailsAusblendenButton{
    display:inline-block;
    background:#878c96;
    width:22px;height:22px;
    box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.5);
    cursor:pointer;
}

.detailsEinblendenIcon, .detailsAusblendenIcon{
    fill:white;
    height: 11px;
    width:11px;
    margin:6px 0px 0px 5px;
}

.detailsEinblendenButton:hover, .detailsAusblendenButton:hover{
    background:#646973;
}

.detailsButton{
    background-image: url('../img/ico/eye.svg') ;
    background-repeat:  no-repeat;
    background-size: cover;
}

#deleteRueckfahrt{
    height: 16px;
    width:16px; 
    fill:#878c96;
    margin-left:10px;

}

#deleteRueckfahrt:hover{
    cursor:pointer;
}

#pruefenInner{
    max-width: 840px;
    margin: 20px auto; 
}

.bootsfaceNoStyle .panel-body{
    border: 0 !important;
    box-shadow: none !important;
    padding: 0px !important;
    margin: 0px !important;
    padding-left: 10px !important;
}
.bootsfaceNoStyle{
    border: 0 !important;
    box-shadow: none !important;
    padding: 0px !important;
    margin: 0px !important;

}
.bootsfaceNoStyle .panel-group{
    border: 0 !important;
    box-shadow: none !important;
    padding: 0px !important;
    margin: 0px !important;
}
.bootsfaceNoStyle .panel-body{
    border: 0 !important;
    box-shadow: none !important;
    padding: 0px !important;
    margin: 0px !important;
}
.bootsfaceNoStyle .panel{
    border: 0 !important;
    box-shadow: none !important;
    padding: 0px !important;
    margin: 0px !important;
}

#navigationResponsReiseauskunft{
    margin: 0; 
    padding-top: 0px;
}




@media only screen and (max-width: 767px){
    input#ticket_neues_kaufen_button{
        width: 210px !important; 
    }

    .reiseauskunft-col-uhrzeit-rueck{
        margin-top: 10px;
    }
    #zielbahnhofColumn{
        margin-top:30px;
    }
    .reiseauskunft_date_row{
        margin-top:5px;
    }
    #reiseauskunft-datum-rueck-row {
        margin-top: 10px;
    }
    #navigationResponsReiseauskunft{
        margin: 0 0px 0 20px;   
    }

    #warenkorb {
        margin: 20px;
    }
    #connections {
        margin: 20px 20px 0 20px;
    }
    #connectionsHinInner{
        margin-bottom: 20px; 
    }
    #connectionsRueckInner{
        margin-bottom: 20px; 
    }
    .warenkorb_eingabeflaeche_resp{
        padding:10px;
    }
    #pruefenInner {
        margin: 0px auto;
    }
    .archivLinkTickets{
        display:block;
        padding-left:5px;
    }
    #ResetAllButton{
        padding: 6px 5px 5px 5px;
    }

    .button-db.color-db-grey {
        height: 28px;
        padding: 3px 20px;
    }

    #reiseauskunft_heading{
        margin:20px auto 10px auto;
        max-width:840px;
    }

    .multifahrtenTicket_repeatContainer .table_bahnbonus td:nth-of-type(1){
        width:0;
    }
    .multifahrtenTicket_repeatContainer .table_bahnbonus td:nth-of-type(3){
        width:0;
    }

    button.button-db.verbindung_fahrt_auswaehlen{
        margin: 0;
    } 

    #warenkorb2 .tableConnectionWrapper{
        padding-bottom:5px;
    }
    #warenkorb2 .tableConnectionWrapper > div:nth-of-type(1){
        padding-top:5px;
    }

    #rowBahnhof_buch_such svg.icon-swap{
        top: -32px !important;
    }
}

#warenkorbContainerReiseauskunft{
    padding:20px;
}

@media only screen and (max-width: 860px) and (min-width: 768px){
    #quickfinder {
        margin: 20px 20px;
    }
    #navigationResponsReiseauskunft{
        margin: 0 ;   
    }
    #warenkorb {   
        margin: 20px;
    }
    #connections {
        margin: 20px;
    }
    #connectionsRueck{
        margin: 20px; 
    }
    #warenkorbContainerReiseauskunft{
        padding:10px;
    }

}
@media only screen and (max-width: 860px) {
    #reiseauskunft_heading{
        margin:20px 20px 10px 20px;
    }
    #ticketeinloesenPruefenNavigation{
        margin: 0 ;
    }
}

@media only screen and (min-width:768px){
    .reiseauskunft-col-uhrzeit-rueck{
        padding-left:0px;   
    }
    #reiseauskunft-datum-rueck-row {
        margin-top: 15px;
    }
    .warenkorb_eingabeflaeche_resp{
        padding:20px;
    }
    .archivLinkTickets{
        padding-left:30px;
    }

    #searchButton, #reiseauskunftSearchbutton{
        width:120px !important;
    }

}

@media only screen and (min-width:861px){
    #ticketeinloesenPruefenNavigation{
        margin: 0 20px 0 20px;
    }
    #reiseauskunft_heading{
        max-width: 840px;
        margin: 20px auto;
    }
}

@media only screen and (min-width:840px){

}

.warenkorb_con_abDatum{
    width: 18%;
}

.warenkorb_con_Startbahnhof{
    width: 18%;
}

.warenkorb_con_Zielbahnhof{
    width: 18%;
}

.warenkorb_con_abZeit{
    width: 15%;
}

.warenkorb_con_anZeit{
    width: 15%;
}

.warenkorb_con_Entfernen{
    width: 16%;
}

/*.ticket_kalender .tooltip.info span:before {
    font-family: "db-icons";
    font-size: 10px;
    content: "\f10d";
    color: #878c96;
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    text-align: center;
    line-height: 17px;
    padding: 0;
    background-color: transparent;
    width: 100%;
}*/

.ticket_kalender thead tr td{
    background-color:#e7e7e7 !important;
}

.ticket_kalender tr {
    /*portal.local.min.css überschreiben*/
    background: none !important;
}

.tooltipster-db div.tooltipster-arrow:before {
    padding-right: 10px;
}

.button-db.color-db-red, .button-db.color-db-grey{
    height:31px;
}

.pointerCursor{
    cursor:pointer;
}

.bulletlist {
    margin: 0px !important;
}

.bulletlist li {
    position: relative;
    padding-left: 20px;
    line-height: 20px;
    margin-bottom: 10px;
}

.bulletlist li:before {
    content: " ";
    width: 5px;
    height: 5px;
    background-color: #878b96;
    position: absolute;
    left: 0;
    top: 8px;
}

/*datenschutz.xhtml / impressum.xhtml*/
.folding-elements .folding-element{
    border-bottom: solid 1px #dedede;            
}
.folding-elements .folding-element>h3 {
    position: relative;
    padding: 10px 20px 10px 0;
    margin: 0;
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.folding-elements .folding-element h3 {
    font-family: DBSansRegular;
    font-size: 16px;
    line-height: 22px;
}
.folding-elements .folding-element>h3:hover {
    color:#c00;
}

.folding-elements .folding-element>h3:after {
    font-family: "db-icons";
    font-size: 7px;
    content: "\f11a";
    color: #878b96;
    position: absolute;
    top: auto;
    left: auto;
    right: 0;
}

.folding-elements .folding-element.active>h3:after {   
    content: "\f11b";
    color:#c00;
}

.folding-elements .folding-element.active>h3 {
    color:#c00;
}

.folding-elements .folding-element>h3:hover:after {
    color:#c00;
}

.folding-elements .folding-element .folding-content {
    position: relative;
    display: none;
    height: 0;
    padding: 0 20px 25px;
    overflow: hidden;
}

.folding-elements .folding-element .folding-content a, #impressum #inhalt a {
    cursor: pointer;
    color: #f01414;
    text-decoration: underline;
}


.folding-elements .folding-element .folding-content a:hover, #impressum #inhalt a:hover {
    color: #c00;
}


.folding-elements .folding-element.active .folding-content {
    display: block;
    height: auto;
}

.folding-elements .folding-element.active .folding-content>ul.bullet-list>li {
    font-family: DBSansRegular;
    font-size: 14px;
}

#datenschutz #sidebar, #impressum #sidebar{
    float:left;
    width: 250px;
}

#datenschutz #sidebarResp, #impressum #sidebarResp{
    display:none;
}

#datenschutz #inhalt, #impressum #inhalt{
    float:left;
    width: 710px;
    position: relative;

}

#datenschutz .newsletter:before, #impressum .newsletter:before{
    font-family: db-icons;
    content: "\f192";
    font-size:16px;
    position: absolute;
    color: #878c96;
    text-align: center;
    width: 18px;
    left: 0;
    top:0;
}

@media only screen and (max-width: 980px){
    #datenschutz #inhalt, #impressum #inhalt {
        width: 100%;
        box-shadow: none;
        margin: 0;
    }
    #datenschutz #sidebarResp, #impressum #sidebarResp{
        display:block;
    }
}

#startbahnhof_panel div.ui-autocomplete-emptyMessage.ui-widget, #zielbahnhof_panel div.ui-autocomplete-emptyMessage.ui-widget{
    background: white;
    font-family: DBSansBold !important;
    font-size: 14px !important;
    line-height:20px;
    padding: 5px;
}

#zielbahnhof.ui-autocomplete .ui-autocomplete-dropdown {
    display:none !important;
}

a.linkNoChangeOnVisitWhite{
  color:white !important;   
}

a.linkNoChangeOnVisitWhite:visited{
   color:white !important; 
}

.bestMehrfahrKachelInfo{
    height:auto;
}

@media (min-width: 768px){
    .bestMehrfahrKachelInfo{
    height:84px;
    }
}

.bestMehrfahrKachelFAQ{
    height:auto;
}

@media (min-width: 768px){
    .bestMehrfahrKachelFAQ{
    height:84px;
    }
    .bestMehrfahrKachelFAQ.bestMehrfahrKachelFAQBusinessHeight{
    height:82px;
    }
    .bestMehrfahrKachelFAQ img{
     margin-top:10px;   
    }
    .bestMehrfahrKachelFAQ td span{
        margin-top:14px;
        display:block;
    }
}


.buttonsStreckenverlaeufe{
    display:flex;
    padding:15px 20px 0 0;
    justify-content: space-between;
}

#ticketsAnmeldenMitBahnID{
    font-family: DBSansBold;
    border: 0!important;
    color: #fff;
    line-height: 20px;
    float: right;
    margin: 0 0 5px 20px;
    width: auto!important;
}

@media (max-width: 767px){
    .buttonsStreckenverlaeufe{
        flex-direction: column;
    }
    .buttonsStreckenverlaeufe a#ticketsAnmeldenMitBahnID{
        display:block;
        margin: 0 ;
        float:none;
        margin-top:20px;
    }
    .buttonsStreckenverlaeufe #ticketsWeiterButton{
        
    }
    
    .buttonsStreckenverlaeufe #buttonsStreckenZurueckDiv{
        order: 3;
        margin-top:20px;
    }
    .buttonsStreckenverlaeufe #buttonsStreckenZurueckDiv input{
        margin-bottom: 0 !important;
    }
    
    .buttonsStreckenverlaeufe #buttonsStreckenVerwerfDiv{
        order: 2;
        margin-top:20px;
    }
    
    .buttonsStreckenverlaeufe #buttonsStreckenWeiterDiv{
        order: 1;
        margin-bottom:15px;
    }
    
    .buttonsStreckenverlaeufe #buttonsStreckenWeiterDiv #ticketsWeiterButton{
        margin-bottom:0 !important;
        margin-top: 20px !important;
    }
}


#bannerMehrfahrtenTicketIMG{
    width:980px; height: 400px; object-fit: cover; object-position: 0 0;
}


@media (max-width: 576px){
    #bannerMehrfahrtenTicketIMG{
        width: 100%;
    }
}