
/*navi*/
#mobilNav {
  display: none;
  min-height:100%;
}

#resmenu{
  display: none;
}

@media screen and (max-width: 990px){
  #header .center {
    width: 100%;
  }
  #downheader #title {
    display: none;
  }  
  
  #mainNav .dropnav li a, #mainNav .dropnav li:hover a {
    width: auto;
    line-height: 1.7em;
    background: none;
  }
  #mainNav li .dropnav ul {
    width: 770px;
    margin: 0;
  }
  
  #mainNav .dropnav li {
    width: 130px;
    padding: 20px 10px 0px;
  }
  .keyvisual .center {
    width:100%;
  }
  .keyvisual .center img{
    width:100%;
    height:auto;
  }  
  .default .content-row .center {
    width: auto;
  }
  .default .ceTextPic.box .ceInnerText .contenttable {
    width: auto;
  }
  .draweheadline h2 {
    background-position: right 10px center;
    padding-right: 10px;
  }
  .default .ceText.zweidrei, .default .ceImage.zweidrei, .default .ceTextPic.zweidrei, .default .ceHtml.zweidrei {
    width:100%;
  }
  .bx-wrapper img {
    height: auto;
    max-width:647px;
    width:100%;
  }
  .fahrplan .left-side,
  .fahrplan .right-side {
    float:none;
    clear:both;
    width:96%;
  }
  .fahrplan label {
    width:auto;
  }
  .fahrplan .right-side .control-label{
    width:100%
  }
  .fahrplan input.span4[type="text"] {
      width: 29%;
    }
  .fahrplan input[type="text"].span2{
    width:28.5%;
  }
  .fahrplan textarea {
      width: 57.5%;
    }
  .fahrplan select {
      width: 62.5%;
    }
  .fahrplan .center-side {
    margin-top:40px;
  }
  .Tx-Formhandler input[type="text"] {
    width:60%;
  }
  .Tx-Formhandler textarea {
    width:60%;
  }
  #footer .center {
    margin-right: 25px;
    margin-left:25px;
    width: 100%;
  }
  #footerbox2, #footerbox3 {
    width:20%;
    font-size: 0.85em;
  }
  #footerbox1 {
    font-size: 0.85em;
    width: 44%;
    margin-right: 20px;
    max-width: 310px;
    margin-bottom:-20px;
  }
  #footermeta ul {
    margin-left:0px;
    font-size: 0.938em;
  }
  #footermeta ul li {
    padding-left: 30px;
    line-height:40px;
  }
  #footer-inner {
    padding-top:20px;
  }
  
}

@media screen and (max-width: 787px){
  body > #wrap{
    min-height: 1px;
  }
    #mobilNav {
    display:block;
  }
  /*Navi*/
  #mobileLogo{
    width:150px;
  }
  #resmenu {
    display: block;
    background-image:url(../img/mobile-trigger.png);
    top: 50px;
    right: 0px;
    z-index:100;
    position:absolute;
    width:32px;
    height:32px;
  }    
  #resmenu div {
    display: block;
    width:32px;
    height:32px;
        cursor:pointer;    
  }
  #resmenu div:hover{
    text-decoration: none;
  }
  #mobilNav {
    bbackground-image: url(../img/bg.jpg);
    background-color:#e6e6e6;
    position: fixed;
    z-index: 5000;
    height:100%;
    min-height: 100%;
    margin-left: 0;
    width: 100%;  
    left:0;  
   }
  #mobilNav .nav-close{
    position:absolute;
    top:0px;
    right:0px;
    cursor:pointer;
   }
  #mobilNav .frame{
      height: 100%;
    overflow: scroll;
    position:relative;
  } 
  #mobilNav  ul.list-horizontal{
    margin-bottom: 100px;
    margin-left:0;
    border-top: 1px solid #ccc;
  }  
  #mobilNav  ul li{
    float:none;
    position:relative;
  }
  #mobilNav  ul li a{
    color:#4d4d4d;
    text-decoration: none;
    /*font-size:16px;*/
    border-bottom: 1px solid #ccc;
    padding: 9px 5px;
    display: block;
   }
  #mobilNav  ul li a.act-2,
  #mobilNav  ul li a.act-3{
    background-color:#9edcf6;
    color:#333;
   }
 
   #mobilNav  ul li ul{
    margin-left: 0px;
    padding-left:0px;
    list-style: none;
    background-color:#f2f2f2;
   }
   #mobilNav  ul li ul li a{
    padding-left: 20px;
   } 
   #mobilNav  ul li ul li ul li a{
    padding-left:40px;
   }
     #mobilNav ul li ul .active,   
     #mobileNav .active {
    background-color:#e6e6e6 !important;
    color:#333;
     }   
   #mobileNav  .white {
     background-color:#fff;
   }
   #mobilNav  H2 {
    padding: 22px 5px;
    color:#ffffff;
    background:-webkit-gradient(linear, left top, left bottom, from(#008ad1), to(#0022a1));
    background-image: -moz-linear-gradient(top, #008ad1 10%, #0022a1 100%); 
    /*background-color:#000080;*/
    margin-bottom: 0px;
   }
   #mobilNav  H2 a{
    display: block;
    font-size: 24px;
    line-height: 40px;
    text-align: center;
   }
  #mobilNav .menu-arrow{
    position: absolute;
    top: 0px;
    right: 0px;
    cursor:pointer;
    background-image: url(../img/menu-close.png);
    height: 40px;
    width: 55px;
    z-index: 3000;
  }
  #mobilNav .menu-arrow.open{
    background-image: url(../img/menu-open.png);
  }
  #mobilNav form {
    margin:  0;
  }
  #mobilNav input.text {
    font-size:      16px;
    padding:        10px;
    height:          36px;
    border-radius:  0;
    width:           265px;
    width:           271px;
    width:           100%;
  }
  #mobilNav .error {
    width:            271px;
    padding:           15px;
    background-color:  #e7cbc2;
    color:            #db4416;
    font-size:        16px;
    font-family:       'robotobold';
  }
  #mobilNav  .error img {
    float:          left;
    margin-right:    9px;  
    margin-top:      5px;
    margin-bottom:  5px;
  }
  #langnav-mobile{
    padding-bottom:50px;
    overflow:hidden;
  }
  .lang-center{
    width:186px;
    margin:0 auto;
  }
  #langnav-mobile ul{
    list-style:none;
  }
  #langnav-mobile ul li{
    border:1px solid #fff;
    border-radius:4px;
    color:#fff;
    float:left !important;
    width:70px;
    height:30px;
    line-height:30px;
    text-align:center;
    padding:0;
    margin-right:10px;
    font-size:18px;
  }
  #langnav-mobile ul li a{
    color:#fff;
    text-align:center;
    padding:0;
    height:30px;
    line-height:30px;
    border:none;
    font-size:18px;
  }

  #header, #upperheader{
    height:85px;
  }
  #header .center {
    width: 92%;
  }  
  #upperheader{
    position:relative;
  }
  #banner, #login, #navwrap{
    display:none;
  }
  #downheader #title {
    float: left;
    margin-left: 70px;
    margin-top:-65px;
  }
  #logo{
    float:left;
    margin-top:20px;
  }
  #logo img {
    width:100%;
    height:auto;
  }
  .default .content-row .center {
    min-height:10px;
  }
  .center{
    width:100%;
  }
  .step1{
  width:305px;
  background-image:none;
  background-color:transparent;
  }
  .step2{
   display:none;
  }
  .jsb_calendar.input_container{
    height:65px;
  }
  .input_container, .inline_input_container {
    width:48%;
  }
  #route_search_wrapper .center #step1{
  width:100%;
  background-image:none;
  }
  #step2{
    display:block;
    margin-top:40px;
    height:auto;
    background-color:#fff;
  }
  
  #route_search_wrapper  .ceHtml{
    background-image:none;
    background:-webkit-gradient(linear, 85% 20%, 10% 21%, from(#008ad1), to(#0022a1));
    background-image: -moz-linear-gradient(left, #0022a1 0%, #008ad1 100%);
    background-image: linear-gradient(to right, #0022a1 0%, #008ad1 100%);
  }
  
  #route_search{
    margin-left:10px !important;
  }
  #route_search_wrapper{
    height:auto;
    margin-bottom:25px;
  }
  #route_search_wrapper input[type="text"]{
  width:90%;
  height:37px;
  }
  
  #route_search_now_submit{
  width:285px;
  height:36px;
  }
  #route_search_wrapper input[type="text"]#route_search_time_input, 
  #route_search_wrapper input[type="text"]#route_search_date_input{
    width:90%;
    float:left;
    margin-right:0;
    margin-bottom:0;
  }
   #route_search_wrapper input[type="text"]#route_search_date_input{
    margin-right:10px;
  }
  .jsb_calendar.input_container{
    height:85px;
  }
  .wrapper_links .extended_search{
    float:left;
    margin-left:10em;
  }
  .wrapper_height{
    padding-top:0;
  }
  #route_search_now_submit{
    margin-top:12px;
    clear:right;
    float:right;
    margin-right:4em;
  }
  .wrapper_links{
    float:none;
    width:100%;
    margin-top:-38px;
  }
  .right .ceText a{
    height:60px;
    width:215px;
  }
  .left {
    margin:0 auto;
    width:100%;
  }
  .right {
    margin:0 auto;
    width:90%;
    float:none;
    border:none;
  }
  .right .ceText {
    margin-top:2em;
  }
  .ceText.zweidrei,
  .ceImage.zweidrei,
  .ceTextPic.zweidrei,
  .ceHtml.zweidrei{
    max-width:642px;
    margin:0 auto;
    float:none;
  }
  .ceText.drei,
  .ceImage.drei,
  .ceTextPic.drei,
  .ceHtml.drei{
    width:90%;
    margin:0 auto;
    float:none;
  }
  .start .ceText.drei, .start .ceImage.drei, .start .ceTextPic.drei, .start .ceHtml.drei {
    height:auto;
    margin-bottom:2em;
  }
  .drei .singleImage {
    float:left;
    width:47%;
  }
  .left .ceImage img {

    display:block;
    max-width:90;
  }
  .drei .ceInnerText {
    width:auto;
    padding-left:50%;
    border-top: 7px solid #000080;
  }
  .ceText.drei:last-child, .ceImage.drei:last-child, .ceTextPic.drei:last-child, .ceHtml.drei:last-child {
    margin:0 auto;
  }
  #route_search_wrapper .step2  {
    display:none;
  }
  .ceTextPic.box .singleImage, .drawerPic{
    margin-top: 0px;
    width:285px;
  }
  .drei .singleImage {
    border-bottom: none;
  }
  .ceTextPic.box .singleImage img {
    border: none;
  }
  .ceTextPic.box h2 {
    padding: 5px 10px;
  }
  .default .content-row .ceText, 
  .default .content-row .ceTextPic, 
  .default .content-row .ceImage, 
  .default .content-row .ceHtml {
    margin-bottom: 25px;
    margin-top: 25px;
  }
  .default .ceTextPic.box .ceInnerText .contenttable {
    float: left;
  }  
  .default .ceTextPic.box .ceInnerText .contenttable {
    margin-top:0px;
  }
  .contenttable {
    margin-left: -10px;
  }
  .default .ceTextPic.box .ceInnerText .contenttable td {
    width:48%;
  }
  .drawerPic .caption {
    padding-left: 10px;
    width:265px;
  }
    .fahrplan input.span4[type="text"] {
      width: 29%;
    }
  .fahrplan input[type="text"].span2{
    width:46%;
  }
  .fahrplan input[type="text"].span4 {
    width:46%;
  }
  .fahrplan textarea {
      width: 96%;
    }
  .fahrplan select {
      width: 98.8%;
    }
  .Tx-Formhandler input[type="text"] {
    width:95.5%;
  }
  .Tx-Formhandler textarea {
    width:95.5%;
  }
  .fahrplan .control-label.small {
    width:100%;
  }

  .werkstatt .content-row .center #content-inner{
    background-image:url(../img/bvo-logo.png);
    background-repeat:no-repeat;
    background-position:left top;
    padding-top:150px;
  }

  
  
}
@media screen and (max-width: 658px){
  #footerbox1 {
    background-image: none;
    
  }
  #footerbox1 .ce-inner-text {
    padding-left: 0px;
  }
}

@media screen and (max-width: 480px){
	.form-group .control-label {
		margin-top: 10px;
	}
	#popupContent div {
		display: block !important;
		float: none;
		text-align: center;
	}
  #resmenu {
    top: 35px;
  }  
  #breadcrumb_resp {
    display:block;
    height:0.5em;
    padding:0 25px;
    background:-webkit-gradient(linear, 85% 20%, 10% 21%, from(#008ad1), to(#0022a1));
    background-image: -moz-linear-gradient(left, #0022a1 0%, #008ad1 100%);
    background-image: linear-gradient(to right, #0022a1 0%, #008ad1 100%);
  }
  #breadcrumb {
    background-image:none;
    background:none;
    color:#008ad1;
    background:-webkit-gradient(linear, 85% 20%, 10% 21%, from(#fff), to(#fff));
    background-image: -moz-linear-gradient(left, #fff 0%, #fff 100%);
    background-image: linear-gradient(to right, #fff 0%, #fff 100%); 
  }
  #breadcrumb, #breadcrumb a {
    color:#0022a1;
  }
  #logo{
    margin-top:8px;
    height:60px;
    width:60px;
  }
  #header .center {
    width: 305px;
  }  
  #content{
    padding-top:20px;
    margin-top:0;
    width:100%;
    /*max-width:335px;*/
    margin-left:auto;
    margin-right:auto;
    margin-bottom: 0px;
  }
  .center{
    width:305px;
  }
  .default .content-row .center{
  padding:30px 10px 125px 10px;
  width:285px;
  }
  
  h1 {
    margin-bottom:30px;
    line-height: 120%;
  }
  .start .content-row{
    margin-top:0;
    margin-bottom:0;
  }
  .keyvisual .center{
  width:305px;
  }
  .keyvisual .caption {
    padding: 3px 10px;  
    line-height:150%;
  }
  .keyvisual .center img{
  width:305px;
  height: auto;
  }  
  .left{
    width:305px;
    margin-bottom:25px;
    overflow:hidden;
    margin:0 auto;
  }
  .right {
    margin:0 auto;
    width:90%;
    float:none;
    border:none;
  }
  .right .ceText {
    margin-top:2em;
  }
  .ceText.zweidrei,
  .ceImage.zweidrei,
  .ceTextPic.zweidrei,
  .ceHtml.zweidrei{
    width:647px;
    margin:0 auto;
    float:none;
  }
  .ceText.drei,
  .ceImage.drei,
  .ceTextPic.drei,
  .ceHtml.drei{
    width:90%;
    margin:0 auto;
    float:none;
  }
  .start .ceText.drei, .start .ceImage.drei, .start .ceTextPic.drei, .start .ceHtml.drei {
    height:auto;
    margin-bottom:2em;
  }
  .drei .singleImage {
    float:none;
    width:310px;
    border-bottom: 7px solid #000080;
  }
  .drei .singleImage img {
    width:310px;
  }
  .drei .ceInnerText {
    width:auto;
    padding: 15px 20px;
    border-top:none;
  }
  .left .ceImage img{
    max-width:305px;
    height:auto;
  }
  .left .ceImage{
    background-color:#fff;
    height:220px;
  }
  .bx-wrapper .bx-prev{
    background-image:url(../img/prevarr.png);
  }
  .bx-wrapper .bx-next{
    background-image:url(../img/nextarr.png);
  }
  .bx-wrapper .bx-controls-direction a{
    height:13px;
    width:11px;
  }
  .bx-has-controls-direction{
    width:305px;
  }
  .bx-controls-direction{
    position:relative;
    margin:0 auto;
    margin-top:50px;
    width:65px;
  }
  .bx-controls-auto{
    display:block;
    
  }
  .bx-viewport{
    border-bottom:solid 5px #000080 !important;
    border-top:solid 5px #000080 !important;
  }
  .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto{
    width:305px;
    bottom:-33px;
  }
   .bx-wrapper .bx-controls-auto .bx-start.active{
    display:none;
   }
   .bx-wrapper .bx-controls-auto .bx-stop.active{
    display:none;
   }
  .right{
  width:305px;
  max-height:370px;
  }
  .step1{
  width:305px;
  background-image:none;
  background-color:transparent;
  }
  .step2{
   display:none;
  }
  .jsb_calendar.input_container{
    height:65px;
  }
  
  .input_container, .inline_input_container {
    width:auto;
  }
  #route_search_wrapper .center #step1{
  height:235px;
  width:100%;
  background-image:none;
  }
  #step2{
    display:none;
    margin-top:40px;
    min-height:325px;
    height:auto;
    background-color:#fff;
  }
  
  #route_search_wrapper  .ceHtml{
  background-image:url(../img/searchbg-res.png);
  background-repeat:no-repeat;
  }
  
  #route_search{
    margin-left:10px !important;
  }
  #route_search_wrapper{
    height:auto;
    margin-bottom:25px;
  }
  #route_search_wrapper input[type="text"]{
  width:270px;
  height:37px;
  }
  
  #route_search_now_submit{
  width:285px;
  height:36px;
  clear:both;
    float:none;
    margin-right:0;
  }
  #route_search_wrapper input[type="text"]#route_search_time_input, 
  #route_search_wrapper input[type="text"]#route_search_date_input{
    width:122px;
    float:left;
    margin-right:0;
    margin-bottom:0;
  }
   #route_search_wrapper input[type="text"]#route_search_date_input{
    margin-right:10px;
  }
  .jsb_calendar.input_container{
    height:85px;
  }
  .wrapper_links .extended_search{
    float:right;
    margin-left:0;
  }
  
  .wrapper_height{
    padding-top:0;
  }
  #route_search_now_submit{
    margin-top:12px;
  }
  
  .wrapper_links{
    float:none;
    width:285px;
    margin-top:-38px;
  }
  .right .ceText a{
    height:60px;
    width:215px;
  }
  .ceText.drei,
  .ceImage.drei,
  .ceTextPic.drei,
  .ceHtml.drei{
    width:306px;
    margin-right:30px;
    margin-bottom:25px;
  }
  .right .ceText{
    height:35px;
    padding-top:0;
    padding-bottom:0;
    border:none;
    margin-bottom:10px;
  }
  .right{
    border:none;
  }
  .right .ceText .headline a{
    height:35px;
    display:inline;
    color:#2B2C82;
  }
  .right .ceText .headline{
    display:block;
    color:#2B2C82;
    font-size:1.125em;
    background-image:url(../img/rightarr.png);
    background-position:right center;
    background-repeat:no-repeat;
    line-height:35px;
  }
  .right .ceText  .ce-inner-text{
    display:none;
  }

  .start .right .ceText  .ce-inner-text{
    display:block;
    padding: 5px 0;
  }

  .start .right .ceText{
  height: 70px;
  }
  
  .ceTextPic.box .ce-inner, .drawerContent{
    padding-left:0;
    padding-right:0;
    padding-top:0;
  }
  .default .ceTextPic.box .ceInnerText, .drawerText{
    padding-left:10px;
    padding-right:10px;
    
  }
  .draweheadline h2{
    background-position:250px center;
  }
  
  
  
  
  .fahrplan input[type="text"].span4,
    .fahrplan input[type="text"].span2,
  .fahrplan input[type="text"],
    .fahrplan  textarea  {
    width:92%;
  }
  .fahrplan #inputLocally {
    width:25%;
  }
  .fahrplan .other {
    margin-top:30px;
  }
  .Tx-Formhandler input[type="submit"] {
    width:98%;
  }
  .Tx-Formhandler input[type="text"],
    .Tx-Formhandler textarea  {
    width:92.5%
  }
  .tx-indexedsearch-searchbox-sword{
    width:255px;
  }
  #footer{
    height:auto;
    /*max-width:335px;*/
    margin-left:auto;
    margin-right:auto;
    line-height: 120%;
  }
  #footer .center {
    margin:0;
  }
  .footerbox {
    margin:0;
    float:none;
  }
  #footerbox1{
    background-image: none;
    font-size: 0.85em;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    width: 70%;
  }
  #footerbox1 .ce-inner-text {
    padding-left: 0px;
  }
  #footerbox1 .ceText {
    margin-bottom: 0px;
  }  
  #footerbox1 .headline {
    margin-bottom: 15px;
  }  
  #footer-inner {
    height: auto;
  }  
  #footerbox2, 
  #footerbox3 {
    display: none;
  }
  #footerbox2  ul li{
    position:relative;
  }
  #footerbox2  ul li a{
    color:#4d4d4d;
    text-decoration: none;
    /*font-size:16px;*/
    border-bottom: 1px solid #ccc;
    padding: 9px 5px;
    display: block;
   }
  #footerbox2  ul li a.active,
  #footerbox2  ul li ul li a.act-2,
  #footerbox2  ul li ul li a.act-3{
    background-color:#fff;
    color:#333;
   }
 
  
  
  #footermeta{
    font-size: 0.74em;
    padding-top: 10px;
    height: 100%;
    padding-bottom: 10px;
    margin-top:1em
  }
  #footermeta #metanav {
    margin-left:20px;
  }
  #footermeta ul{
    float:left;
    margin-left:0;
  }
  #footermeta ul li{
    padding-left:0;
    line-height: 170%;
    padding: 0px 5px;
    border-right: 1px solid #4d4d4d;
  }
  #footermeta ul li#last_meta {
    border-right: none;
    padding-right: 0px;
  }
  #footer h2,
  #footer h3,
  #footer h4{
    font-size: 0.88em;
  }
  #footer p{
    font-size: 0.88em;
  }
  #footer a{
    font-size: inherit;
  }
  #footer-inner {
    padding-top: 30px;
  }
  
  .werkstatt .content-row .center #content-inner{
    background-image:url(../img/bvo-logo.png);
    background-repeat:no-repeat;
    background-position:left top;
    padding-top:150px;
  }  
  
}
