html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    border: 0 none;
    font: inherit;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}

img[id!="loader"] { opacity: 0; }

#loader {
    width:100%;
    position: fixed;
    z-index: 9999;
    background-color: #000;
    height:100%;
    text-align: center;
}

#loader img{
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); }
}

.wrapper,#pre {
  opacity: 0;
  transition: opacity 2s ease-in-out;
  -moz-transition: opacity 2s ease-in-out;
  -webkit-transition: opacity 2s ease-in-out;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    font-family: 'helvetica', sans-serif;
    font-size:18px;
    font-weight: 500;
    line-height: 1.3em;
}
ol, ul {
    list-style: none outside none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
* {
    color: white;
    margin: 0;
    padding: 0;
}
body {
    background-color: black;
    color: #fff;
    height: 100%!important;
    padding-bottom: 10px;
    font-weight: normal;
}

nav a {
    text-decoration: none;
    font-size: 18px;
    font-weight:normal;   
}

#content {
    width: 100%;
}

h1, p, .quote, .author  {
    letter-spacing: 0.5px;
}

img {
    height: auto;
    max-width: 100%;
}
ul {
    list-style-type: none;
}

.bdth {
    width: 100%;
}

h1, .h1-headline{
    font-size: 64px;
    font-weight: 700;
    line-height: 1.2em;
    padding: 0 0 30px 50px;
    text-align: left;
    max-width: 1000px;
}

h2, .h2-headline {
    font-size: 32px;
    font-weight: 500;
    line-height: 1.2em;
}

p, .copy-text {
    font-size: 18px;
    font-weight: normal;
    line-height: 1.3em;
    padding: 0 0 0 50px;
    width: 60%;
}

.author {
    font-size: 12px;
    display: inline;
    border-bottom: 2px solid #fff;
    padding-bottom: 1px;
    text-transform: uppercase;
    font-weight:bold;
}

.margin-b10px {
    margin-bottom:10px;
}

.margin-b25px {
    margin-bottom:25px;
}

.margin-b50px {
    margin-bottom:50px;
}

.margin-b100px {
    margin-bottom:100px;
}

.margin-b150px {
    margin-bottom:150px;
}

.bdth .intro {
    display: block;
    margin: 15% auto 9%;
}
.bdth .large {
    display: block;
    margin: 8% auto 0;
}
.bdth .quote {
    font-size: 32px;
    font-weight: 500;
    line-height: 1.2em;
    margin-left:auto;
    margin-right:auto;
    text-align: center;
    width: 60%;
}

.bdth p {
    padding-left:100px;
}

.contact {
    margin-top: 80px;
    padding-bottom: 15px;
    padding-left: 50px;
    width: 65%;
}
.contact .impress {
    font-weight: normal;
    line-height: 1.4em;
    margin-top: 15px;
    padding-bottom:120px;
    width: 85%;
    max-width:800px;
}
.group:after {
    clear: both;
    content: "";
    display: block;
    height: 0;
    visibility: hidden;
}
.order {
    margin-top: 15%;
    padding-bottom: 15px;
    width: 100%;
}
.order p {
    margin-top: 30px;
    width: 85%;
}

.order a {
    display: block;
    margin-top: 10%;
}
#pre {
    height: 1230px;
}
#pre .slide {
    height: 100%;
    position: fixed;
    width: 100%;
    z-index: 0;
}

#pre .slide img{
    margin-top:-50px;
    position: relative;
}
.wrapper {
    background-color: #000;
    position: relative;
    z-index: 1;
}
.abs {
    position: absolute;
    display: inline;
}

.detop {
    top:2.21%!important;
}

#upleft {
    left:20px;
    padding:20px 0 0 0;
    width:220px;
}

#middletop {
    padding:20px 0 0 0;
    width:100%;
}

#upleft .home{
    width:220px;
}

#upleft .down{
    display: block;
}

#downleft {
    left:20px;
    top: 2.40%;
}

#upright {
    right:20px;
    padding:20px 0 0 0;
}

#upright .language{
    text-align: right;
    width: 50px;
    z-index:9999;
}

#upright .eng {
    display: block;
}

#downright {
    right:20px;
    top: 2.40%;
}
#upleft .bdthlink {
    width:250px;
    z-index:9999;

}
.bdthlink img {
    bottom: 51%;
    position: absolute;
    right: 4%;
    display: none;
}

.bdthlink:hover img{
    display: block;
}

.speclink {
    font-style: italic;
}

.speclink img {
    position: absolute;
    display: none;
    left: 0;
    top:0;
}

.speclink a:hover img{
    display: block;
}

.newslink {
    width: 77px;
    z-index:9999;
}

.newslink img {
    display: none;
    position: absolute;
    right: 15%;
}

.newslink:hover img{
    display: block;

}

.bdthlink .down img {
    right: 53%;
    top: 52%;

}

.language .de img {
    bottom: 45%;
    display: none;
    left: 26%;
    position: absolute;
}

.language .de:hover img{
    display: block;

}

.language .eng img {
    display: none;
    left: 24%;
    position: absolute;
    top: 46%;

}

.language .eng:hover img{
    display: block;

}
.cont {
    width:72px;
    text-align: right;
    z-index:9999;
}
.cont img {
    left: 15%;
    position: absolute;
    display: none;
}


.cont:hover img{
    display: block;
    width:70px;
}

.standard {
    margin-left: auto;
    margin-right: auto;
    display: block;
}
.small{
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.news {
    margin-top: 15%;
    padding-bottom: 15px;
    padding-left: 50px;
    width: 100%;
    box-sizing:border-box;
}
.news .content {
    padding-bottom: 100px;
    padding-left:50px;
}

.news .content h1 {
    padding-left:0;
}

.news .content p {
    max-width:800px;
    padding-left:0;
}

.news .content img {
    display: block;
    padding-bottom: 30px;
}

.news .date {
    margin-bottom:10px;
}

.vertext {
    display: inline-block;
    font-size:12px;
    line-height: 1.6em;
    padding: 4px;
    text-align: center;
    width: 20px;
}

.bdth-vertext-position {
   position: absolute;
   top: 5px;
}

.news-vertext-position { 
   position: absolute;
   top: -2px;
}

.contact-vertext-position { 
   position: absolute;
   top: 5px;
}



.bdth .extradate {
    display: inline-block;
    font-weight: normal;
    letter-spacing: 0.8px;
    line-height: 1.3em;
    position: relative;
    text-align: center;

}

.bdth .posiup {
    top: 230px;
    left: 60%;
}


.info { 
    background: none repeat scroll 0 0 #000;
    border: 3px solid #fff;
    margin: 0 30px;
    padding: 15px;
    position: relative;
    font-weight: 500;
    width:75%;
    margin-left: auto;
    margin-right: auto;
}

.info .extra {
    border-bottom: 4px solid #fff;
    display: inline-block;
    margin: 0 0 15px;
}

.info p {
    width:80%;
}

.info .list{
    margin-bottom: 20px;
    line-height:1.4em;
}

.info .text .no { 
    background-color: #fff;
    border: medium none;
    display: inline-block;
    height: 22px;
    margin: 0;
    top: 2px;
    width: 80px;
    position: relative;
}


.info .buy {
    background: none repeat scroll 0 0 #000;
    border: 3px solid #fff;
    display: block;
    font-weight: 500;
    line-height: 1.2em;
    margin: 166px auto 0;
    padding: 7px;
    text-align: center;
    text-decoration: none;
    width: 170px;
}

.info .buy:hover  {
    background: url(../images/U-bahn-loading-neu.gif) no-repeat;
}

.info .spec {
    float:left;
    position: relative;
    text-align: left;
}

.info .spec:hover .pic{
   visibility: hidden;
}
.info .spec .pic{
    margin: 0 auto;
    position: relative;
    z-index: 99;
}

.info .spec .gif{
    bottom: -6px;
    position: absolute;
    right: 17px;
    z-index: 1;
}

.info .container {
    height: 1150px;
    position: relative;
    top: 60px;
    width:400px;
}

.info p {
    text-align: left;
    width: 360px;
    padding:0 20px 0 20px;
}

.info .box {
    float: left;
    margin-left: 5%;
    margin-top: 45px;
}

.info .box .container span{
    display: block;
    font-size: 1.5em;
    line-height: 1.1em;
    margin: 38px auto 0;
    text-align: center;
    width: 230px;

}

.info .stan {
    float:left;
    position: relative;
    text-align: left;
    padding-right:2%;
}

.info .stan .pic{
    margin: 0 auto;
    position: relative;
    z-index:99;
}

.info .stan .gif{
    bottom: -8px;
    position: absolute;
    right: 17px;
    z-index: 1;
}

.info .linkpic {
    margin:0;
}

.order .lastpic {
    display: block;
    margin:0 auto;
    margin-top:120px;
    width:250px;
}

.absolute {
    position: absolute;
    right: 10%;
    top: 243px;
    text-align: center;

}

.bx-wrapper {
    font-size:18px;
}

.pos-rel {
    position: relative;
}

.bdth-extra-cont {
    padding-left:50px;
}

/* -- Styles for index.html -- */

.wrapper--start {
    position: relative;
    top:50px;
    max-width:1920px;
    height:100vh;
    text-align: center;
}   

.image--start {
    height: auto;
    max-width: 100%;
    z-index:1;
    display: block;
    overflow: hidden;
    width: 65%;
    margin: 0 auto;
}


.overlay h1 {
    text-align: center;

}

.overlay {
    background-color: rgba(0,0,0,0.1);
    position: absolute;
    color: #fff;
    z-index: 100;
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out; 
    transition: all 300ms ease-out;
    left: -100%;
    width: 100%;
    height: 100%;  
    text-decoration: none;
    top:0;
    opacity: 0;

    display:flex;
    align-items: center;
    justify-content: center;
}

.box {
    cursor: pointer;
    position: relative;
    overflow: hidden;
    width: 85%;
    background: #000;
    z-index:1;
    margin: 0 auto;
    display:block;
    text-decoration: none;
}

.box:hover .overlay {
    background-color: rgba(0,0,0,0.4) !important;
    opacity: 1;
    left:0%;
}




.mobile-headline {
    display:none;
    padding:20px 0 35px 0;
    font-weight: 500;
}

/* -- Styles for index.html -- */






@media (min-width: 0px) and (max-width: 1024px) {

    /* -- Styles for Nav -- */ 
    #middletop {
        display:none;
    }

    /* -- Styles for index.html -- */

    .image--start {
        width:80%;
    }

    .mobile-headline {
        display:block;
    }

    .overlay {
        display:none;
    }

    /* -- Styles for index.html -- */


    #pre {
        position: static!important;
        height:100%!important;
    }

    #pre .slide {
        position: static!important;
        width:100%!important;
        height:100%!important;
    }

    #pre img {
        margin-top:0!important;
        position: static!important;

    }
    h1, .h1-headline{
        font-size: 32px;
        font-weight: 500!important;
                padding-left:0px;

    }
    .bdth .quote {
        font-size:21px;
        width:85%;
    }

    p, .bdth p {
        width:80%;
        padding-left:0px;
        margin-left:auto;
        margin-right: auto;
    }

    .news {
        width:84%;
        padding-left:0;
        margin-left:auto;
        margin-right:auto;
    }

    .news p {
        width:100%;
    }
    .vertext {
        padding: 4px!important;
        text-align: center!important;
        width: 20px!important;
        display:block!important;
        position:static!important;
        margin:0 auto!important;
        margin-bottom:20px!important;
    }

    .news .date{
       margin-bottom:20px!important;
   }

   .info .stan {
    margin-bottom:10px;
}

.contact {
    width:84%!important;
    padding:0 8% 0 8%!important;
}

.absolute {
    display:none!important;
}

.news .content {
    padding-bottom: 50px;
    padding-left:0px;
}


}