html{
    font-size: 14px !important;
}

body{
    font-size: 100% !important;
}

label{
    font-weight: normal;
}


footer{
    padding:0px;
    background:none !important;
    margin-top:5px;

}
.ul-li-db{
    background: transparent url("../../img/placeholder/icons.gif") 0 -8989px no-repeat;
    padding: 2px 0 0 16px;
    margin-bottom: 4px;
}
.ul-db{
    margin-top: 5px;
    margin-bottom: 0;
    line-height: 22px;
    padding-bottom: 20px;
}
#footerDatenschutz>div, #footerVerbindungen>div{
    /*background:#f5f5f5 !important;*/
    -webkit-box-shadow: 0 -5px 5px -1px rgba(0, 0, 0, 0.15) !important;
    box-shadow: 0 -5px 5px -1px rgba(0, 0, 0, 0.15) !important;
    /*margin-top: 30px !important;*/
    padding-left: 40px;
}

/*Reset*/
table tr:nth-child(odd) {
    background: none;
}

h2 {
    font-size: 20px;
    font-style: normal;
    font-weight: normal;
    font-family: DBSansRegular;
    margin: 15px 0 15px 20px;  
}

a {
    color:#333;
    text-decoration: none;
}
a:hover {
    color:#c00;
    text-decoration: underline;
    cursor:pointer;
}

/* für Sitz Icon inkl. Text*/
a:hover sup{
    color:#c00 !important;
}

a:focus {
    color: #333;
    text-decoration:none;
}

img{
    display:initial;
}

/*Validator*/
.validationError{
    border: 1px solid #c00 !important;   
}
.fehlermeldungen-db-color-red{
    color:#CC0000 !important;  
}
.fehlermeldungen-db-border-red{
    border: 1px solid #CC0000 !important;
}
.fehlermeldungen-db-haken{
    display:inline-block;
    margin: -24px;
    margin-top: 7px;
    color:#8CB90F;
    font-family: "db-icons";    
    z-index:10;
}

.fehlermeldungen-db-fehler{
    border-color:#CC0000 !important;
    color:#CC0000; 

}

.fehlermeldungen-db-fehlertext{
    /*display:none;*/
    width: 90%;   
    color:#CC0000;
    font-family: DBSansRegular;
    margin-left: 5px;
    margin-top: 5px;
    margin-bottom: 10px;
}

/* == Template ==*/

/*Language Selector*/
#header #language-selector{
    cursor:pointer;
}

#header #language-selector a{
    color:#333;
}

#header #language-selector a:hover{
    color:red;
}

/*Search Field*/
#header .searchform input.search-field{
    background:none;
}

/*Bahnofsauswahl*/
optgroup{
    background-color:#878c96;
    color:white;
}

optgroup option {
    background:white;
    color:black;
}

/*Banner*/
#banner{
    height:160px;
    background: url("../img/banner_vat.jpg") no-repeat;
    background-size: cover;
}

/*Inhalt*/
#inhalt{
    background-color:rgb(255,255,255);
}


/* Headline on every page.*/
#headlineOnEveryPageInner {
    margin: 20px 20px 0 20px;
}

.headlineBooking{
    margin-left:0 !important;
}


/*Fortschrittsanzeige*/
svg.fortschrittsanzeige-db{
    margin:20px 0px 10px 0;
    background-color:white;
}

/*Navigation*/
nav {
    display:none;
}

/*Quickfinder*/
#quickfinder {
    max-width:780px;
    min-height:100px;
    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;
}

#quickfinderContainer{
    margin-top:15px;
}

#quickfinder .radio-db {
    display:inline-block;
    vertical-align: top;
    margin-left:10px;
}

#quickfinder table.radio-db tr td label{
    width:auto;
}

#quickfinder .row {
    margin-bottom:20px;
}

#anzahlReisende_abschnitt .row{
    margin-bottom:10px !important;
}

/*#anzahlReisende_abschnitt_neu .row{
    margin-bottom:10px !important;
}*/

#QuickfinderHaltestelleDB_Row {
    margin-bottom:5px  !important;
}

#ResetAllButton{
    padding: 6px 20px 5px;
}


#bahnCardReisender1, #bahnCardReisender2, #bahnCardReisender3, #bahnCardReisender4, #bahnCardReisender5{
    height:32px;
    width:252px;
} 


/*############################################*/


/*Eingabeboxen*/
.eingabeflaeche{
    background-color:white;
    border:solid;
    border-color:lightgrey;
    border-width:0.1px;
    box-shadow:1px 1px 5px rgba(0,0,0,0.349019607843137);
    padding:0px;
}

/*Info-Box für Neue Anwendung*/
.info-box-neue-anwendung {
    background-color: #f0f4f8;
    border: 1px solid #d1d9e0;
    border-left: 5px solid #2874a6;
    padding: 20px;
    margin: 20px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    position: relative;
}

.info-box-neue-anwendung::before {
    content: "ℹ";
    position: absolute;
    left: -2px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    background-color: #2874a6;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: bold;
    margin-left: -15px;
}

.info-box-neue-anwendung h3 {
    margin: 0 0 10px 0;
    font-size: 18px;
    font-weight: bold;
    color: #2874a6;
}

.info-box-neue-anwendung p {
    margin: 8px 0;
    line-height: 1.5;
    color: #333;
}

.info-box-neue-anwendung a {
    color: #2874a6;
    text-decoration: none;
    font-weight: bold;
}

.info-box-neue-anwendung a:hover {
    text-decoration: underline;
}



#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;
}

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

.startbahnhofContainer, .zielbahnhofContainer{
    width:276px;
}

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



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

    .startbahnhofContainer, .zielbahnhofContainer {
        width: 240px;
    }
}

#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;
}

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;
}

.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;
}

#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;
}




.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;
}

.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){

    .ticketauswahlKamineCont{
        display:inline-flex;
    }

    #deleteRueckfahrtGroupPanel{
        padding-right:4px;
    }

    #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;
    }

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

    .BahnCardReisenderRow{
        padding-left:0px;
    }

}

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;
}

/*#zielbahnhofContainer{
    float:right;
    display:inline-block;
}*/

#anzahlReisende{width:135px;}
/*#anzahlReisende_neu{width:auto;}*/
/*
 Eingabe Datum Textfelder
#dateHin{
    margin-left:80px;
    width:auto;
    border-left:0px !important;
    border-right:1px solid #878c96 !important;
    border-top:1px solid #878c96 !important;
    border-bottom:1px solid #878c96 !important;
}


 #dateHin-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:absolute;
    line-height:16px;
    color: #878c96;
    background-color:white !important;
}

#dateRueck-label{
    border-right:0px;
    border-left:1px solid #878c96;
    border-top:1px solid #878c96;
    border-bottom:1px solid #878c96;
}

#dateRueck{
    border-left:0px !important;
    border-right:1px solid #878c96 !important;
    border-top:1px solid #878c96 !important;
    border-bottom:1px solid #878c96 !important;
}



/*Verbindungsanzeige*/
.sparpreisFlexpreisMargin img{
    display:inline-block;
}

#detailsOben {
    padding:10px 20px;
    background:white;
    margin-bottom:10px;
    box-shadow: 1px 3px 5px -2px rgba(0,0,0,0.349019607843137);
}

#detailsOben table td{
    vertical-align: top;
    font-family: DBSansRegular !important;
    font-size: 14px !important;
}

.sparpreisFlexpreisMargin{
    margin:0 0px 0 0 ;
    float:none;
    /*    display: inline-block;*/
}

.no_text_decoration:hover{
    text-decoration: none;
}


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

.verbindungDetailsEinblendenButton:hover, .verbindungDetailsAusblendenButton:hover{
    background:#646973;
}



#connectionsHin .price, #connectionsRueck .price{
    font-family: DBSansBold !important;
    font-size:14px;
}

.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;
}

.hideiPad{
    display:none;
}

.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;

}

#tableConnectionRepeatRow{

}

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

}

.tableConnectionRepeatRowSingle > div {
    padding:10px;
}

#detailsEinblendenHin{
    display:none;
}

#detailsEinblendenRueck{
    display:none;
}


/*Adresse*/
.table_adresse{
    width:80%;
    margin-bottom:20px;
}
.table_adresse td{
    padding:0 10px !important;
}
.table_adresse td:nth-of-type(1){
    width:10%;
}
.table_adresse td:nth-of-type(2){
    width:45%;
}
.table_adresse td:nth-of-type(3){
    width:23%;
}
.table_adresse td:nth-of-type(4){
    width:22%;
}

/*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;
}

/*Zahlung*/
.table_zahlung{
    width:100%;
}
.table_zahlung td{
    padding:10px !important;
}
.table_zahlung td:nth-of-type(1){
    width:10%;
}
.table_zahlung td:nth-of-type(2){
    width:15%;
}
.table_zahlung td:nth-of-type(3){
    width:25%;
}
.table_zahlung td:nth-of-type(4){
    width:25%;
}
.table_zahlung td:nth-of-type(5){
    width:25%;
}
.table_zahlung.headline td{
    padding:0px !important;
}
.table_zahlung.headline td:nth-of-type(1){
    width:10%;
}
.table_zahlung.headline td:nth-of-type(2){
    width:30%;
}
.table_zahlung.headline td:nth-of-type(3){
    width:60%;
}

/*Prüfen und Buchen*/

#detailsEinblendenBahnBonus a, #KreditkartenDatenForm a{
    color:#333;
}

#detailsEinblendenBahnBonus a:hover, #KreditkartenDatenForm a:hover{
    color:#c00;
}

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

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

}

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


/*Icons*/
a.infoButton {
    font-family: db-icons;
    color:#8f949e;
    font-size:16px
}
a.infoButton:hover, a.infoButton:active, a.infoButton:visited{
    text-decoration: none;
    color:#8f949e;
}



/*Austauschen*/
.toggleTabBtn {
    position: relative;
    background: #878c96;
    width: 32px;
    height: 32px;
    cursor: pointer;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.3);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.3);
}

.toggleTabBtn:before {
    font-family: "db-icons";
    font-size: 7px;
    content: "\f11a";
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -6px 0 0 -5px;
}

.toggleTabBtn.active:before {
    content: "\f11b";
    margin-top: -7px;
}

.datepicker {
    height:32px !important;
}

.ui-datepicker-trigger{
    display:inline !important;
    /*    margin-left:5px !important;*/
    margin-bottom:2px !important;

    /*display:none;*/
    /*width:20px;*/
    /*height:20px;*/
    /*padding:5px;*/
    /*border: 1px solid #878c96;*/
    /*background-image: url(../img/kalender.png);*/
    /*background-position: 4px -242px;*/
}

/*Pfeile Input*/
.icon-nav {
    background: #f5f5f5 url("../img/icon-sprite.png") no-repeat scroll 0 0;
    cursor: pointer;
    height: 30px;
    width: 30px;
}
.icon-nav:hover{
    background-color:#e1e1e1;
}
.arrow-left{
    background-position:-34px -191px
}
.arrow-right{
    background-position:-68px -191px
}
.pull-right{
    float:right
}
.pull-left{
    float:left;
    text-align:left;
    top:0 !important;
    left:0 !important
}


/*Phone*/
@media (max-width: 599px) { 
    .padding-Eingabeboxen{
        padding:20px 15px !important;
    }    
}

/*Phone*/
@media (max-width: 700px) { 
    svg.fortschrittsanzeige-db{
        display:none;
    }
}


/*Tablet Porträt*/
@media (min-width: 600px) {  }

/*Tablet Landscape*/
@media (min-width: 980px) { 
    nav {
        display:block;
    }
}

/*Desktop*/
@media (min-width: 1200px) { }

/*Big Desktop*/
@media (min-width: 1800px) {  }



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

}

#ui-datepicker-div .ui-datepicker-group.ui-datepicker-group-last {
    margin: 0 0px 0px;
    width: 358px;
}

#ui-datepicker-div{width:385px}

.ui-datepicker-trigger:hover {
    color: transparent;
    background: url("../img/ico/icon-sprite-db-new.png") 0 -967px no-repeat #fff;
    background-color: #e7e7e7;
    width: 30px;
    height: 30px;
    overflow: hidden; 
    margin: 0 0 0 9px;
    padding: 15px;
}

#quickfinderBahnhofstausch:hover{
    cursor: pointer;
}

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

#zielbahnhofColumn{
    padding-left:0px;
}
#quickSwitchColumnResp{
    display:none;
}

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

    .ticketauswahlKamineCont{
        display:none;
    }


    #ticketFahrtenFrueherHin, #ticketFahrtenFrueherRueck{
        margin-bottom:10px;
    }

    #deleteRueckfahrtGroupPanel{
        padding-right:10px;
    }

    .reiseauskunft-col-uhrzeit{
        margin-top:10px
    }

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

    #suche_container_sucheButton{
        padding-right:0px !important;
    }

    #anzahlReisende1Column1{
        margin-bottom: 10px;
    }


    #quickfinderBahnhofstauschColumn{
        padding-top: 20px;
    }

    #zielbahnhofColumn{
        padding-left: 15px;
        margin-top: 15px;
    }


    #zielbahnhofContainer{
        float:left;
    }

    .swap {

        transform: rotate(90deg);
        border: solid 1px #878c96;
        background: #fff;
    }

    #banner{
        display:none !important;;
    }

    #quickfinder{

        border: 0; 
        -webkit-box-shadow: 0 0 0 0; 
        box-shadow: 0 0 0 0 ; 
        border-top: 0;
        padding: 0;  

    }

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

    #ui-datepicker-div{
        width:auto}





    input[type="submit"], input[type="reset"]{
        width: auto !important; 
    }

    /*    #quickfinderResetColumn{
            display: inline-block;
            float: left;
            padding-left: 0px;
        }
    
        #quickfinderSucheColumn{
            float:right;
            padding-left: 0px;
        }
    
        #quickfinderResetSucheRow{
            margin: 20px 0px 0px !important;
            max-width: 300px;
            float: none;
        }*/

    .BahnCardReisenderRow {
        padding-top:15px; 
    }

    #bahnCardReisender1{

    }

    /*    Tabelle*/
    /* Force table to not be like tables anymore */
    #detailsOben table, #detailsOben thead, #detailsOben tbody, #detailsOben th, #detailsOben td, #detailsOben tr {
        display: block;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    #detailsOben thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }


    #detailsOben td {
        /* Behave  like a "row" */
        border: none;
        /*			border-bottom: 1px solid #eee;*/
        position: relative;
        /*        padding-left: 50%;*/
    }

    #detailsOben td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
    }


    /*                ###################*/



    .auswahl_tarifBox, .auswahl_tarifBox_rueck {
        border:2px solid white;
    }

    #tableConnections .emptyCellRow{
        display:none;
    }

    /*		#tableConnections tr { border: 1px solid #ccc; }*/

    #tableConnections td {
        /* Behave  like a "row" */
        border: none;
        position: relative;
        padding-left: 50%;
    }

    #tableConnections td:before {
        /* Now like a table header */
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
    }

    #tableConnections td::before{
        display:block;
    }

    /*
    Label the data
    */

    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(1):before{content:"Haltestelle";font-family: DBSansBold}
    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(2):before{content:"Zeit";font-family: DBSansBold}
    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(3):before{content:"Dauer";font-family: DBSansBold}
    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(4):before{content:"Umstiege";font-family: DBSansBold;text-align:left}
    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(4){text-align:left !important}
    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(5):before{content:"Sparangebote";font-family: DBSansBold}
    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(6):before{content:"Flexpreis";font-family: DBSansBold}
    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(7):before{content:"Auswahl";font-family: DBSansBold}

    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(2) > td:nth-child(3){display:none}
    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(2) > td:nth-child(1){width:auto !important}
    #tableConnections > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(1){width:auto !important}

    /*              ##############*/

    #tableConnectionsRueck table, #tableConnectionsRueck thead, #tableConnectionsRueck tbody, #tableConnectionsRueck th, #tableConnectionsRueck td, #tableConnectionsRueck tr {
        display: block;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    #tableConnectionsRueck thead  {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    #tableConnectionsRueck .emptyCellRow{
        display:none;
    }

    #tableConnectionsRueck td {
        /* Behave  like a "row" */
        border: none;
        position: relative;
        padding-left: 50%;
    }

    #tableConnectionsRueck td:before {
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
    }

    #tableConnectionsRueck td::before{
        display:block;
    }

    /*
    Label the data
    */

    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(1):before{content:"Haltestelle";font-family: DBSansBold}
    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(2):before{content:"Zeit";font-family: DBSansBold}
    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(3):before{content:"Dauer";font-family: DBSansBold}
    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(4):before{content:"Umstiege";font-family: DBSansBold;text-align:left}
    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(4){text-align:left !important}
    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(5):before{content:"Sparangebote";font-family: DBSansBold}
    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(6):before{content:"Flexpreis";font-family: DBSansBold}
    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(7):before{content:"Auswahl";font-family: DBSansBold}


    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(2) > td:nth-child(3){display:none}
    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(1) > td:nth-child(1){width:auto !important}
    #tableConnectionsRueck > tbody.boxShadow.font-db-t4 > tr:nth-child(2) > td:nth-child(1){width:auto !important}

    /*Reisender*/
    .reisender_ort_container{
        width:100% !important;
    }

    /* ##### Bestätigungsseite*/

    #bestaetigung_content .bestaetigung_pfeil_rechts {
        display:none;
    }

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

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


    .hide_smaller_than768{
        display:none;
    }

    .clear_smaller_than768{
        clear:both;
    }

    /* Busverbindungen */
    .busverbindungenRepeatContainer{padding-bottom: 0px;}


}


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




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

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

    /*    #alterReisender1, #alterReisender2, #alterReisender3, #alterReisender4, #alterReisender5{
            margin-left:10px;
        }*/

    #zielbahnhofContainer{
        margin-right:12px !important;
    }

    #quickfinderBahnhofstauschColumn{
        padding-left:6% !important;
    }

    #suche_container_sucheButton{
        padding-right: 10px !important;
    }

    .showiPad{
        display:block;
    }
    #kundeAnredeContainer{
        width:105px !important;
    }

    .bestaetigungiPadSmallerFontSize{
        font-size:12px !important;
    }

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

/*.alterReisenderColumn{
    margin: 0 10px 0 0;
}

#alterReisender1, #alterReisender2, #alterReisender3, #alterReisender4, #alterReisender5{
    margin-right:0px;
}*/


/* Verbindungsanzeige */

.iconSitzInkl{
    font-family:db-icons;
    color:#333333;
    font-size:16px;
    margin-left:4px;
}

a.sparpreisFlexpreisMargin:hover .iconSitzInkl{
    color:#c00;
    text-decoration: none !important;
}


.pruefenBuchenBahnhofsname{
    display:block;
}

/*@media only screen and (min-width:768px) and (max-width:880px){
    .containerSitzplatzIcon{
        display:block;
        margin-left:24px;
        margin-top:5px;
    }
}*/

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

    .pruefenBuchenWeitereAngabenColumnAdresse{
        padding-right:12px;
    }

    #pruefenBuchenWeitereAngabenColumnAendern1{
        margin-left:-10px !important;
    }

    #pruefenBuchenWeitereAngabenColumnAendern2{
        margin-left:-10px !important;
    }

    .pruefenBuchenVerbindungPlaetze{
        display:inline-block;
    }

}


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

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

    .pruefenBuchenBahnhofsname{
        display:inline-block;
    }

    .hide_greater_than767{
        display:none; 
    }


    #quickfinderContainer  {
        padding:0 10px 0 30px ;
    } 

    /*    .alterReisenderColumn{
            padding-left:46%;
            padding-right:20%;
            margin: 0 10px 0 18px;
        }*/

    .BahnCardReisenderColumnDiv{
        /*margin-left:27px;*/

    }
    #searchErrorRow{
        margin-right:10px;
    }

    #anzahlReisende{width:150px;}
    /*#anzahlReisende_neu{width:auto;}*/




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

    .sparpreisFlexpreisMargin{
        margin:0;
        float:none;
    }

    .sparpreisFlexpreisMargin:focus{
        text-decoration: none;
        color:#333;
    }
    /*    .sparpreisFlexpreisMargin:hover{
            color:#c00 !important;
            text-decoration: underline;
        }*/


    #KreditkarteGueltigColomn{
        margin-top:15px;
    }


    /* Bestätigungsseite*/
    .noPaddingGreaterThan768{
        padding:0px;
    } 

    #bestaetigung_digital_papier_column{
        width:28%;
    }



    /* Prüfen Buchen */

    .pruefenBahnCardBonusPunkteRow{
        margin-left: 25%;
        padding-left: 15px;
    }

    #pruefenRueckfahrtFirstColumnRow{
        margin-top:-10px;
    }

}

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

.angebotRespColumnWidth:nth-child(odd) {
    width:42%;   
}
.angebotRespColumnWidth:nth-child(even) {
    width:58%;   
    padding-bottom:8px;
}

@media only screen and (max-width: 347px){
    .angebotRespColumnWidth {
        width:100% !important;   
    }
}

@media only screen and (max-width: 380px){
    #startbahnhof, #zielbahnhof{
        width:204px !important;
    }

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


    #bahnCardReisender1, #bahnCardReisender2, #bahnCardReisender3, #bahnCardReisender4, #bahnCardReisender5{
        height:32px;
        width:260px !important;
    } 

}

/*Tooltip*/

.info{
    opacity: 1 !important;
}

.tooltip, .tooltipCondition {
    z-index: 1 !important;;
}

.tooltip.info span::before, .tooltipCondition.info span::before {
    line-height: 16px !important;
}



.tooltip.info.tooltipstered, .tooltipCondition.info.tooltipstered{
    margin:0px !important;
}





.select-db #bahnCardReisender1,.select-db #bahnCardReisender2,.select-db #bahnCardReisender3,.select-db #bahnCardReisender4,.select-db #bahnCardReisender5{
    width:267px;

}

/*#alterReisender1, #alterReisender2, #alterReisender3, #alterReisender4, #alterReisender5{
    width:46px;height:32px;margin-left:3px;padding-left:4px !important;text-align: center;
}*/

#bahnCardReisender_1_Tooltip, #bahnCardReisender_2_Tooltip, #bahnCardReisender_3_Tooltip, #bahnCardReisender_4_Tooltip, #bahnCardReisender_5_Tooltip, #suche_sitzplatz_tooltip{
    display:inline;
}

.tooltip.info.tooltipstered {
    display:inline !important;
}



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

}

#deleteRueckfahrt:hover{
    cursor:pointer;
}




.icon-connection-db-sprite {
    background-position: 0 -180px;
    width: 9px;
    height: 42px;
    top:4px;
}

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

.icon-icon_tickets_medium-db-sprite {
    background-position: 0 -2984px;
    width: 40px;
    height: 40px;
    bottom: 10px;
    margin-left:-5px;
}

#adresseDesReisendenForm .form-control{
    border-radius:0px;
    border: solid 1px #878c96;
    font-family: DBSansRegular; 
    color:#333 !important;
}

#adresseDesReisendenForm .form-control:focus{
    border-color: #ccc;
    outline: 0;
    -webkit-box-shadow: 0;
    box-shadow: 0 0 0;
    font-family: DBSansRegular; 
    color:#333 !important;
}

#KreditkartenDatenForm .form-control{
    border-radius:0px;
    border: solid 1px #878c96;
    font-family: DBSansRegular; 
    color:#333 !important;
}

#KreditkartenDatenForm .form-control:focus{
    border-color: #ccc;
    outline: 0;
    -webkit-box-shadow: 0;
    box-shadow: 0 0 0;
    font-family: DBSansRegular; 
    color:#333 !important;
}
#BahnbonusDatenForm .form-control{
    border-radius:0px;
    border: solid 1px #878c96;
    font-family: DBSansRegular; 
    color:#333 !important;
}

#BahnbonusDatenForm .form-control:focus{
    border-color: #ccc;
    outline: 0;
    -webkit-box-shadow: 0;
    box-shadow: 0 0 0;
    font-family: DBSansRegular; 
    color:#333 !important;
}
/*#GutscheinDatenForm .form-control{
    border-radius:0px;
    border: solid 1px #878c96;
    font-family: DBSansRegular; 
    color:#333 !important;
}

#GutscheinDatenForm .form-control:focus{
    border-color: #ccc;
    outline: 0;
    -webkit-box-shadow: 0;
    box-shadow: 0 0 0;
    font-family: DBSansRegular; 
    color:#333 !important;
}*/

.gutscheinFeld{
    max-width:200px;   
}

/* Hier wird die Container Klasse vom Menü überschrieben.*/
.container-fluid:first-of-type{
    padding:0 0 0 0;
}

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

#ResetAllButton{
    color:white;
}

#ResetAllButton:hover{
    color:white;
    text-decoration:none;
}

#adresseDesReisendenForm label {
    font-family: DBSansRegular !important;
    font-size: 14px !important;
    font-weight: normal !important;
    width:100%;
}

#adresseDesReisendenForm input, #adresseDesReisendenForm select {
    font-family: DBSansBold !important;
    font-size: 14px !important;

}

.grauerKastenEingabeInfos .panel-group{
    margin-bottom:0;
    margin-top:10px;
    height:35px;
}

.grauerKastenEingabeInfos .panel-group .panel{
    border-radius: 0;
    border:none;
}

.grauerKastenEingabeInfos .panel-body{
    background-color: #f5f5f5;
    padding:10px !important;
}
.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;
}
/*CheckBox-Haken fix*/
[type="checkbox"]+label:before {
    width: 20px !important;
    height: 20px !important;
}
[type="checkbox"]+label:after {
    top: 2px !important;
    left: 2px !important;
}



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

    /*    #alterReisender1, #alterReisender2, #alterReisender3, #alterReisender4, #alterReisender5{
            margin-left:0px;
        }*/

    #reisender_automobilclub_row{
        margin-right: 0px;
    }


    .tooltip.info span {
        position: relative;
        display: inline-block;
        border: solid 1px #878c96;
        border-radius: 100%;
        height: 17px;
        width: 17px;
        background-color: #fff;
        margin: 6px 0 0 6px;
    }

    /* Verbindungsanzige */

    .verbindungEingabeflaeche{
        margin-bottom:0px;
    }

    .verbindungEingabeflaecheDetails{
        margin-left:-1px;
    }


    #connectionsHin .button-db, #connectionsRueck .button-db{
        padding: 3px 10px 5px !important;
    }

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



    /* Busverbindungen */
    .buchungBusverbindungIcon{
        margin-right:15px;
        padding-left:10px;
    }


    /* Reisender */
    #kunde_kk_nummer{
        width: 90%;
        margin-bottom:10px;
    }

    #kunde_kk_typColumn{
        margin-top:10px;
    }

    #KreditkarteGueltigColomn{
        margin-top: 10px;
        margin-bottom:10px;
    }

    #kunde_kk_monat_container{
        margin-top:10px;
        margin-bottom:10px;
    }

    #kunde_kk_jahr_container{
        margin-top:10px;
        margin-bottom:10px;
    }

    #kunde_kk_pruefnummer{
        margin-top:10px;
        margin-bottom:10px;
    }

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


    /*Validator Messages Korrektur*/
    #suche_startbahnhof_error{
        margin-bottom: 40px;
    }
    #suche_zielbahnhof_error{
        margin-left: 5px !important;
        margin-bottom: 15px !important;
    }
    #suche_anzahlreisende_error{
        margin-bottom: 20px !important;
    }
    #suche_alter1_error, #suche_alter1ung_error{
        width: auto !important;
        margin-top: 10px !important; 
        margin-left: 5px !important; 
    }
    #suche_alter2_error, #suche_alter2ung_error, #suche_alter3_error, #suche_alter3ung_error, #suche_alter4_error, #suche_alter4ung_error, #suche_alter5_error, #suche_alter5ung_error {
        width: auto !important;
        margin-top: 10px !important; 
        margin-left: 5px !important; 
    }
    #kundeLandContainer, #kundeAnredeContainer{
        max-width: none !important;
    }
    #zahlung_info_email, #info_automobilclub, #zahlung_info_rechnungsadresse, #reisender_firmenname_container, #reisender_strasse_container{
        width: 90% !important;
    }

    #pruefenBahnBonusPunkteIconText{
        display:inline-block;
    }

    #pruefenRueckfahrtFirstColumnRow{
        margin-top:-25px;
    }

    .pruefen_gewaehlteangebote_responsive{
        padding: 0px 20px 0px 30px !important;
    }
    #pruefen_ausgewaehlteangebote_ticketicon{
        padding-left: 0px !important;
        padding-bottom: 30px !important;
    }
    .pruefen_aendern{
        padding-top: 10px !important;
    }
    .pruefen_headline{
        padding-bottom: 10px !important;
    }
    #pruefen_gesamtpreis_eurozeichen{
        display: none;
    }
    .pruefen_gesamtpreis{
        font-size: 16px !important;
    }
    .pruefen_angebote_preise{
        float: none !important;
        padding-right: 0px !important;
    }
    .pruefen_angebote_hinruecktrenner{
        display: block !important;
    }
    form label {
        padding-top: 7px; 
    }

    form #reisender_nachname_label, form #reisender_eimail_wiederholen_label{
        padding-top: 0px;       
    }



    .quickFinderSelectMarginKorrektur{margin-top: 10px; }

    /* prüfen*/
    .pruefenBahnCardBonusPunkteRow{
        margin-left: 15px;

    }


}

#KreditkartenDatenForm .form-group {
    margin-bottom: 0px; 
}
#BahnbonusDatenForm .form-group {
    margin-bottom: 0px; 
}


/*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/ico/icon-sprite-db-new.png") 0 -2570px no-repeat #fff;
}
.font-db-red{
    color: #cc0000 !important;
}

/* Überschreibung der portal.min.css*/
@media (-webkit-min-device-pixel-ratio: 1.5), not all, not all, not all, (min-resolution: 144dpi){
    .ico {

        -moz-background-size: auto;
        -o-background-size: auto;
        -webkit-background-size: auto;
        background-size: auto; 
    }
}


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

.tooltip.info.tooltipstered.display_inline{
    display:inline !important;
}

.tooltip.info.tooltipstered.display_none {
    display:none !important;
}

img.greyscale {
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
}



/* Karte */

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

    #map{
        padding-right:30px;
    }
    #kundeAnredeContainer{
        width:45% !important;
    }
}


@media only screen and (min-width:768px) and (max-width:820px){
    #map{
        padding-right:10px;
    }
}


.karteHaltestelleCircle{ 
    cursor:pointer;
    transform:scale(1.5);

}

.karteLinieInaktiv{
    stroke:gray !important;
}


.karteGray{
    stroke:gray !important;
}

.startbahnhofCircleFill{
    fill:#231f20 !important;
}


.startbahnhofCircleFill{
    fill:#231f20 !important;
}

#sparHinRueckContainer{
    padding-bottom: 30px;
    box-shadow: 1px 3px 5px -2px rgba(0,0,0,0.349019607843137);
}

.sparkalender td{
    text-align: center;
    padding:0 10px !important;
    font-size:14px;
}

.sparkalender td:nth-of-type(3){
    background-color:#e7e7e7 !important;
}
.sparkalender td:nth-of-type(4){
    background-color:#e7e7e7 !important;
}
.sparkalender td:nth-of-type(5){
    background-color:#e7e7e7 !important;
}
.sparkalender td:nth-of-type(6){
    background-color:#e7e7e7 !important;
}

a.sparpreisFlexpreisMargin:hover {
    text-decoration: none;
}

.no-touch a.sparpreisFlexpreisMargin:hover{
    text-decoration: none;
}

a.sparpreisFlexpreisMargin span{
    vertical-align: baseline;
}

a.sparpreisFlexpreisMargin:hover span{
    color:#c00;
/*    text-decoration: underline;*/
}
/*
Test Pseudoklasse lang
#banner h2 span:lang(en){
    color:green;
}

#banner h2 span:lang(de){
    color:blue;

lang="#{i18nBean.language}"
}*/


/* Sprachanpassungen */

/* Pruefen Buchen*/

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

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

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

    .gutscheinFeld{
        max-width:100px;   
    }
}

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

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

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

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

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

    #pruefenBuchenGesamtpreisContainer{
        padding:0px !important;
    }

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

#altersklasseReisender1, #altersklasseReisender2, #altersklasseReisender3, #altersklasseReisender4, #altersklasseReisender5{
    min-width: 192.65px !important;
}


@media only screen and (max-width:767px) {
    #anzahlReisende{
        min-width: 192.65px !important;
    }
    a.sparpreisFlexpreisMargin span{
        vertical-align: baseline;
    }
}

@media only screen and (min-width:768px) and (max-width:870px){
    #pruefenBuchenPlzColumn{
        width:20%;
    }

    #pruefenBuchenOrtColumn{
        width:29%;
    }
}


/*#bahnCardReisender_1_Tooltip.hideWithImportant.tooltip.info.tooltipstered{
    display:none !important;
}*/
#bahnCardReisender_2_Tooltip.hideWithImportant.tooltip.info.tooltipstered{
    display:none !important;
}
#bahnCardReisender_3_Tooltip.hideWithImportant.tooltip.info.tooltipstered{
    display:none !important;
}
#bahnCardReisender_4_Tooltip.hideWithImportant.tooltip.info.tooltipstered{
    display:none !important;
}
#bahnCardReisender_5_Tooltip.hideWithImportant.tooltip.info.tooltipstered{
    display:none !important;
}


.radioButtonPreis{
    height: 22px !important;
    width: 22px !important;
}

.chevron14:hover{
    text-decoration: underline !important;
    color:#cc0000;
}

.chevron14 {
    font-size: 14px;
    line-height:20px;
}

.chevron14:before {
    content: "";
    color: #c00;
    height: 9px;
    background-image: url("../img/ico/chevron.svg");
    background-repeat: no-repeat;
    margin-right: 5px;
    display: inline-block;
    padding-right: 9px;
}

/* Sparkalender */

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

.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;*/
}

.sparMouseHover:hover{
    cursor:pointer;
}


#sparFahrtenContainterHin, #sparFahrtenContainterRueck{
    margin:0 40px;
    padding:5px 10px
}

#sparFahrtenContainterHin div:not(:last-child), #sparFahrtenContainterRueck div:not(:last-child) { 
    padding-top: 3px;
    padding-bottom:3px;
    border-bottom: 1px solid rgba(159, 163, 171, 0.5);   
}

#sparFahrtenContainterHin div:last-child, #sparFahrtenContainterRueck div:last-child { 
    padding-top: 3px;  
}



/*.sparTagBorderRightResponsive{
    border-right: 1px solid #9fa3ab;
}*/

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

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

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

.sparElementDatumWrapper{
    margin-bottom:10px;
}

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

#sparRueckfahrtenElemente #package1_021_Zurueck_Rueck, #sparRueckfahrtenElemente #package1_020_Weiter_Rueck, #sparRueckfahrtenElemente #package1_021_Zurueck_Rueck_Resp, #sparRueckfahrtenElemente #package1_020_Weiter{
    width:40px;
}



@media only screen and (max-width:767px) {
    .sparElementResponsiveHidden{
        display:none;
    }
    div.sparElementResponsiveFirstNotHidden>div.sparElementInner{
        border:none;
    }

    .sparElement{
        width: 33.33%;
    }

    #sparNextbuttonRow input[type="submit"] {
        float: right !important; /* Korrektur für portal.min */
    }

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

    #sparRueckfahrtenElemente #package1_021_Zurueck_Rueck, #sparRueckfahrtenElemente #package1_020_Weiter_Rueck, #sparRueckfahrtenElemente #package1_021_Zurueck_Rueck_Resp, #sparRueckfahrtenElemente #package1_020_Weiter{
        width:30px;
    }

    .sparTagNavColumn{
        flex: 0 0 40px;
    }

    #sparFahrtenContainterHin, #sparFahrtenContainterRueck{
        margin:0 5px;
    }

    .sparListStationsAndTime{
        display:block;
    }
}

#sparHinfahrtElemente{
    padding: 0px 20px 0 20px;
}
#sparRueckfahrtElemente{
    padding: 20px 20px 0px 20px;
}

#ueberschriftSparkalender{
    padding: 10px 10px 15px 20px;
}

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

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

.footerInner{
    padding:20px;
}

#zahlungInner{
    margin:0 20px;
}

#pruefenInner{
    margin: 0 10px;
    padding-top:10px;
}

@media only screen and (max-width:480px) {
    .sparTagNavColumn{
        flex: 0 0 31px;
    }
    #sparHinfahrtElemente{
        padding: 0px 10px 0 10px;
    }
    #sparRueckfahrtElemente{
        padding: 20px 10px 20px 10px;
    }
    #detailsOben {
        padding:10px;
    }
    #ueberschriftSparkalender{
        padding: 10px 10px 15px 10px;
    }
    #connectionsHinInner{
        padding:0 10px 20px 10px;
    }
    #connectionsRueckInner{
        padding:0 10px 20px 10px;
    }
    .footerInner{
        padding:20px 10px;
    }
    #zahlungInner{
        margin:0 10px;
    }
    #headlineOnEveryPageInner{
        margin:10px 10px 0 10px;
    }
    #pruefenInner{
        margin: 0 10px;
    }
}



/*@media only screen and (min-width:767px) {
    .sparTagBorderRightDesktop{
        border-right: 1px solid #9fa3ab;
    }
}*/

/*Template Korrekturen*/
.ui-datepicker-trigger {
    color: transparent;
    background: url(../img/icon-s73bc5bf69c.png) 0 -577px no-repeat #fff;
}

#language-selector a.toggle-link {
    background: url(../img/icon-s73bc5bf69c.png) 4px -470px no-repeat;
}

#language-selector a.toggle-link:hover {
    background: url(../img/icon-s73bc5bf69c.png) 4px -338px no-repeat;
}

#language-selector.open a.toggle-link {
    background: url(../img/icon-s73bc5bf69c.png) 4px -382px no-repeat;
}


/* The Modal (background) */
.db-modal {
    display: none;  
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.db-modal-content {
    position:relative !important;
    background-color: white;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 0;
}

/* Template */

#service-nav > li:nth-child(4) > a{
    border-right:none;
}

/*Social Media Icons*/
/*#doc > footer > div.modul.social-media-leiste.clearfix > ul{
    visibility: hidden;
}*/


@media only screen and (max-width: 767px){
    #doc > footer > div.section.clearfix.full-width > div.notice.clearfix{
        background: #626973;
    }
}



/*div.notice.clearfix{
    display:none;
}*/

#doc > div.section.clearfix.full-width{    
    margin-bottom: 0px;
}
div.notice.clearfix{
    margin-top: 15px;
    background: #f2f2f2;
    padding-top: 20px;   
}

#service-nav li a {
    font-size: 12px;
}

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


#reservierung_radio_row table.radio-db td label{
    width:auto;   
}

#reservierung_radio_row table{
    margin-left:15px;    
}

@media only screen and (min-width: 768px){
    #reservierung_select_row{
        display:none;
    } 
    .desk_none{
        display:none !important;
    }
    .res_einerDerSitz{
        margin-left:-52px;
    }
    .warenkorbGesamtpreisDiv{
        margin-top:10px
    }
}


@media only screen and (max-width: 767px){
    #reservierung_radio_row{
        display:none;
    } 
    .resp_none{
        display:none !important;
    } 
}

@media only screen and (max-width: 400px){
    .sitzIconResp{
        margin-right: -7px;
    } 

}

#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: 4px 8px;
}

.ticketFahrtenUebContent{
    padding:18px 8px 0px 8px;
    height:300px;
}
.angebotsKaminBedingungenContainer{
    /*    background-color:aqua;*/
    height:220px;
}

.ticketFahrtenUebCircleLeft{
    border: 2px solid #d5d5d5;
    width: 8px;
    height: 16px;
    border-radius: 0 8px 8px 0;
    border-left: 0;
    padding: 0;
    background-color: #f5f5f5;
    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: #f5f5f5;
    position: absolute;
    right: -2px;
    z-index: 9;
}

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

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


.ticketFahrtenUebFahrtHinButton{
    float:none !important;
}
@media only screen and (max-width: 767px){
    input.ticketFahrtenUebFahrtHinButton{
        float:none !important;
        margin: 0 0 5px 20px!important;
        width:auto !important;

    }

    .ticketFahrtenUebContainerBereitsEin {
        padding:5px 10px;
    }

}


#ticketFahrtenUebContainer .ticketFahrtenUebTicketFahrt:nth-child(1){
    margin-right:5px;
}


#ticketFahrtenUebContainer .ticketFahrtenUebTicketFahrt:nth-child(2){
    margin-right:6px;
}

#ticketFahrtenUebContainer .ticketFahrtenUebTicketFahrt:nth-child(3){
    margin-right:10px;
}
#ticketFahrtenUebContainer .ticketFahrtenUebTicketFahrt:nth-child(4){
    margin-right:10px;
}

@media only screen and (max-width: 531px){
    #ticketFahrtenUebContainer .ticketFahrtenUebTicketFahrt:nth-child(1){
        margin-right:6px;
    }
}

form div .ticketSelectRadio label{
    width:auto;  
    padding-left:0px;
}

.radio-db.ticketSelectRadio input[type="radio"]+label:before{
    top:0px !important;
}
.radio-db.ticketSelectRadio input[type="radio"]+label:after{
    top:4px !important;
}


.selectedFahrtBorder{
    border-color: #646973 !important;
}

.angeboteKonditonenHeadingLink:hover{
    cursor:pointer;
}


@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:41%;
    }
    .zeitColumnWidth{
        width:7%;
    }
    .dauerColumnWidth{
        width:6%;
    }
    .umstiegeColumnWidth{
        width:5%;
        text-align:center;
    }
    .produkteColumnWidth{
        width:9%;
    }
    .superSparangebotColumnWidth{
        width:17%;
    }
    .sparangebotColumnWidth{
        width:15%;
    }

    .doubleAngebotColumnWidth {
        width: 32%;
    } 

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

    .tableConnectionRepeatRowSingle{
        display: flex;
    }

}

/*Zahlungs-Auswahl-Classes*/
@media only screen and (max-width:480px) {
    .zahlungsartColumn{
        width:100%;
    }   
}

.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;
}

.icon-zahlung{
    background-image: url(../img/icon-se530d055c2.png);
    position: absolute;
    top: 50%;
    margin-top: -25px;    
    width: 56px;
    height: 56px;   
}
.zahlungsartEntgelt {
    text-align: right;
    padding: 15px 30px;
    background-color: whitesmoke;
}

.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;
}

/* 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;
    }

}


/* ZielBahnhof*/
.select-db-customZiel {
    position: relative !important;
    height: 29px;
    width:237px;
    /*width: 100% !important;*/
    overflow: hidden !important;
    background: #fff !important;
    -moz-box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
    /*    margin: 0 0 20px 0;*/
}

select[disabled]{
    cursor: auto !important;
    opacity: 0.5 !important;
    filter: alpha(opacity=0.5) !important;
}

.select-db-customZiel:before {
    font-family: "db-icons";
    font-size: 8px;
    content: "\f11a";
    color: #878c96;
    position: absolute;
    top: 12px;
    left: auto;
    right: 10px;
}

.select-db-customZiel select {
    border-left:none;
    border-right:none;
    border-top:none;
    -moz-box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box;
    display: inline !important;
    position: inherit;
    width: 100%;
    height: 32px;
    padding: 0 38px 0 5px !important;
    /*    border: 1px solid #878c96 !important;*/
    background: transparent !important;
    font-family: "DBSansBold","Arial","Helvetica",sans-serif;
    color: #333;
    font-weight: normal;
    font-style: normal;
    font-size: .875em;
    line-height: 20px !important;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    border-radius: 0 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    -ms-appearance: none !important;
    -o-appearance: none !important;
    outline: 0 !important;
    text-indent: .01px;
    text-overflow: "";
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.select-db-customZiel select option {
    font-family: DBSansRegular;
    font-weight: normal;
    display: block;
    white-space: pre;
    min-height: 1.2em;
    padding: 0px 2px 1px;
}

.select-db-customZiel select option[selected]{
    font-family:DBSansBold
}

.select-db-customZiel select option[disabled]{
    font-family:DBSansBold;
    background:#878c96;
    color:white;
}

.select-db-customZiel select::-ms-expand{display:none}
.select-db-customZiel select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}
.select-db-customZiel select:focus::-ms-value{background:transparent;color:#000}

@media only screen and (max-width:374px){
    .select-db-customZiel {
        width: 201px;
    }
    .select-db-customZiel select{
        width: 198px;
    }

}





/*    font-family: "db-icons";
    font-size: 9px;
    content: "";
    color: #c00;
    position: absolute;
    top: 0;
    left: 0;*/