﻿     html{
 height:100%;
 min-height:100%;
  
        
        
 }
html, body{
	width: 100%;
	height:100%;
	min-height:100%;
	   -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
 
   
 }


body
{

margin:0px;padding:0px; color:#616161; font-size:12pt; font-family: 'Open Sans', sans-serif; font-weight:400; line-height:1.4em; background-color:#f3f3f3;}

h6
{clear:both;margin-top:10px; margin-bottom:10px;}
h1
{font-weight:400;padding:0px;font-size:24pt; margin-top:25px; line-height:1.2em; font-family: 'Open Sans', sans-serif; color:#EC6600;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
} 

h3
{margin:0px; padding:0px;} 

.full
{width: 100% !important; min-width:100% !important; max-width:100% !important; height: auto !important; border:none;}

a:link { text-decoration:none;color:#457a9b;  }
a:visited { text-decoration:none;color:#457a9b;  }
a:active { text-decoration:none;color:#457a9b; }
a:hover { text-decoration:underline;color:#57b6df; }


a.change:link { color:#000000;  }
a.change:visited { color:#000000;  }
a.change:active { color:#000000; }
a.change:hover { color:#000000; }

a.linkwhite:link { color:#838383;  }
a.linkwhite:visited { color:#838383;  }
a.linkwhite:active { color:#838383; }
a.linkwhite:hover { color:orange; }

a.unten:link { text-decoration:none;color:#555555;  }
a.unten:visited { text-decoration:none;color:#555555;  }
a.unten:active { text-decoration:none;color:#555555; }
a.unten:hover { text-decoration:underline; color:#555555; }

.sprachen
{position: absolute; width:100%; height:20px; text-align:right; color:#838383; font-size:9pt;}

.ws_images td
{font-size:14pt;}

#mail
{top:120px; left:50%; margin-left:-590px; font-weight:bold; font-size:9pt; width:200px; position:absolute; z-index:5000;}

#nulltarif
{position:absolute; width:auto; left:50%; top:125px; margin-left:-150px; color: #000009; font-family: Verdana, Geneva, Tahoma, sans-serif; font-size:12pt; font-weight:bold !important; }


#punkt ul {margin:0px !important;}

#punkt li {background: url(punkt.png) no-repeat left top;
  padding: 5px 0px 3px 25px;
  /* reset styles (optional): */
  list-style: none;
  margin: 0px;
	color: #555555;
}

.kontaktfeldeins
{width:260px;margin-bottom:15px;border:1px solid #b7b7b7; margin-top:8px;}
 
.textarea
{width:260px;margin-bottom:15px;border:1px solid #b7b7b7; margin-top:8px;}

.kontaktfeldzwei
{width:91%;
margin-bottom:15px;border:1px solid #b7b7b7; margin-top:8px;
}
 
.textareazwei
{width:95%;margin-bottom:15px;border:1px solid #b7b7b7; margin-top:8px;}

#fonttext
{font-size: 14pt; font-family: 'Tienne', serif;font-weight:bold;-webkit-text-stroke: 0.3px; }

.absatz
{width: 760px; height:auto; float:left; -webkit-box-shadow: 0px 0px 48px -13px rgba(0,0,0,0.6);
-moz-box-shadow: 0px 0px 48px -13px rgba(0,0,0,0.6);
box-shadow: 0px 0px 48px -13px rgba(0,0,0,0.6); background:white;margin-top:25px;padding:20px;
	color: #FA6726;
}

.teambilder img
{width: 100px !important; height:115px !important; -webkit-box-shadow: 0px 0px 48px -13px rgba(0,0,0,0.6);
-moz-box-shadow: 0px 0px 48px -13px rgba(0,0,0,0.6);
box-shadow: 0px 0px 48px -13px rgba(0,0,0,0.6); background:white;margin-top:10px;padding:2px; margin-bottom:5px;}

.busflotte img
{width:146px !important; 
height:102px !important;
}

#logo
{width:200px; height:120px; position:absolute; left:50%; margin-left:-580px}

#oben
{width:100%; height:155px; background-image:url(backoben.jpg);}

#obenmitte
{position:absolute; width: 380px; top:33px; left:50%; margin-left:-200px; }

#verbaende
{display:none; position:absolute; left:50%; margin-left:310px; width:270px; top:20px;}



#navi
{background:#436673; width:100%;}

#naviinner
{ width:1170px; margin:auto;}



.btn {
  background: #5c5c5c;
  background-image: -webkit-linear-gradient(top, #5c5c5c, black);
  background-image: -moz-linear-gradient(top, #5c5c5c, black);
  background-image: -ms-linear-gradient(top, #5c5c5c, black);
  background-image: -o-linear-gradient(top, #5c5c5c, black);
  background-image: linear-gradient(to bottom, #5c5c5c, black);
  -webkit-border-radius: 10;
  -moz-border-radius: 10;
  border-radius: 10px;

  text-shadow: 3px 1px 3px #1f041f;
  -webkit-box-shadow: 2px 2px 8px #1f1400;
  -moz-box-shadow: 2px 2px 8px #1f1400;
  box-shadow: 2px 2px 8px #1f1400;

  color: #ffffff !important;
  
  
  padding: 14px;padding-top:7px; padding-bottom:7px;
  border: solid white 2px !important;
  text-decoration: none;
  margin:8px; margin-top:25px;
  margin-left:8px;
  width:auto;
  display:inline-block;
  text-decoration: none !important;
}

.btn:hover{
  background: #5d8492;
  background-image: -webkit-linear-gradient(top, #5d8492, #1d3c48);
  background-image: -moz-linear-gradient(top, #5d8492, #1d3c48);
  background-image: -ms-linear-gradient(top, #5d8492, #1d3c48);
  background-image: -o-linear-gradient(top, #5d8492, #1d3c48);
  background-image: linear-gradient(to bottom, #5d8492, #1d3c48);
  text-decoration: none;
}




.btno {
  background: #ea7c1a;
  background-image: -webkit-linear-gradient(top, #ea7c1a, #b95a09);
  background-image: -moz-linear-gradient(top, #ea7c1a, #b95a09);
  background-image: -ms-linear-gradient(top, #ea7c1a, #b95a09);
  background-image: -o-linear-gradient(top, #ea7c1a, #b95a09);
  background-image: linear-gradient(to bottom, #ea7c1a, #b95a09);
  -webkit-border-radius: 10;
  -moz-border-radius: 10;
  border-radius: 10px;

  text-shadow: 3px 1px 3px #1f041f;
  -webkit-box-shadow: 2px 2px 8px #1f1400;
  -moz-box-shadow: 2px 2px 8px #1f1400;
  box-shadow: 2px 2px 8px #1f1400;

  color: #ffffff !important;
  
  
  padding: 14px;padding-top:7px; padding-bottom:7px;
  border: solid white 2px !important;
  text-decoration: none;
  margin:8px; margin-top:25px;
  margin-left:0px;
  width:auto;
  display:inline-block;
  text-decoration: none !important;
}

.btno:hover{
  background: #5d8492;
  background-image: -webkit-linear-gradient(top, #5d8492, #1d3c48);
  background-image: -moz-linear-gradient(top, #5d8492, #1d3c48);
  background-image: -ms-linear-gradient(top, #5d8492, #1d3c48);
  background-image: -o-linear-gradient(top, #5d8492, #1d3c48);
  background-image: linear-gradient(to bottom, #5d8492, #1d3c48);
  text-decoration: none;
}

#main
{width:1170px; margin:auto;}

#rechts
{width:300px; float:right;margin-top:10px;}

#mitte
{ background-color:#f3f3f3}

#headingseitenformular
{font-size:18pt; color: #747474; text-align:justify;}

#seitenformular
{width:300px; margin-top:25px; font-size:9pt; line-height:1.2em; background-color:#eeeeee; -webkit-box-shadow: 0px 0px 48px -13px rgba(0,0,0,0.6);
-moz-box-shadow: 0px 0px 48px -13px rgba(0,0,0,0.6);
box-shadow: 0px 0px 48px -13px rgba(0,0,0,0.6);}

#stadt
{width:800px; margin-bottom:-29px; padding-top:0px;}

#stadtbild
{width: 800px; height: 66px}

#footer
{width:100%; background-image:url(footerback.png); clear:both;}

#footer a
{color:white !important}

#footerinner
{width: 1170px; height: 200px; margin:auto;padding-top:40px; color:white; font-weight:300; font-size:20px;}

#bezahlungen
{float:right; margin-top:-30px;}


@media screen and (max-width: 1200px) {

#nulltarif
{left:50%; top:125px; margin-left:-150px;}


#slider td
{line-height:1.4em;}

#logo

{width:180px; height:100px; left:50%; margin-left:-460px}


#mail
{top:120px; left:50%; margin-left:-480px;}

#obenmitte
{width: 350px; top:28px; left:50%; margin-left:-180px;}

#verbaende
{left:50%; margin-left:230px; width:230px; top:20px;}

#naviinner
{ width:930px;}

#main
{width:930px;}

#stadt
{width:600px; margin-bottom:-29px; padding-top:0px;}

#stadtbild
{width: 600px; height: 56px}

.absatz
{width: 560px; float:left;}

#footerinner
{width: 930px; height: 200px; font-weight:300; font-size:20px;}

.ws_images td
{font-size:12pt;}
}

@media screen and (max-width: 1000px) {

.ws_images td
{font-size:10pt;}

#slider td
{line-height:1.2em;}

#logo
{width:180px; height:100px; left:15px; margin-left:auto}


#mail
{top:120px; left:5px; margin-left:auto; font-size:8pt;}

#verbaende
{left:auto; margin-left:auto; width:230px; top:20px; right:15px;}

#naviinner
{ width:95%;}

#main
{width:85%;}

#stadt
{width:100%; margin-bottom:-29px; padding-top:0px;}

#stadtbild
{width: 100%; height: auto}

.absatz
{width: 95%; float:none;}

#footerinner
{width: 95%; height: 200px; font-weight:300; font-size:20px;}

#rechts
{display:none}
}

@media screen and (max-width: 850px) {

.ws_images td
{font-size:9pt;}

h1
{line-height:1.2em;font-size:22pt;}

#obenmitte
{width: 350px; top:45px; left:auto; right:18px; margin-left:auto;}

#verbaende
{display:none}

.btn
{margin:8px; margin-top:5px;
  margin-left:0px;
  
  padding: 7px;padding-top:3px; padding-bottom:3px;}
  
#nulltarif
{left: auto; right:20px; top:115px; margin-left:auto;}
	
#slider td
{line-height:1.3em;}

#slider
{margin-left:-25px; margin-top:-5px;}

}

@media screen and (max-width: 620px) {

#obenmitte
{width: 290px; top:45px; }
#logo
{width:160px; height:120px; left:15px; top:18px; margin-left:auto}
#stadtbild
{width: 104%; height: auto}

#slider
{display:none;}
}

@media screen and (max-width: 520px) {

#obenmitte
{display:none}

#nulltarif
{display:none}
#logo
{width:160px; height:120px; left:15px; top:-10px; margin-left:auto}

#oben
{height:95px; }

#stadtbild
{width: 106%; height: auto}

h1
{line-height:1.2em;font-size:18pt;}

}

/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }


.fade-in {
	opacity:0;  /* make things invisible upon start */
		
	-webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
	-moz-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;

	-webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode:forwards;
	animation-fill-mode:forwards;

	-webkit-animation-duration:1.9s;
	-moz-animation-duration:1.9s;
	animation-duration:1.9s;
}

.fade-in.one {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
animation-delay: 0.2s;
}

.fade-in.two {
-webkit-animation-delay: 0.6s;
-moz-animation-delay:0.6s;
animation-delay: 0.6s;
}

.fade-in.three {
-webkit-animation-delay: 1.0s;
-moz-animation-delay: 1.0s;
animation-delay: 1.0s;
}

.fade-in.four {
-webkit-animation-delay: 1.4s;
-moz-animation-delay: 1.4s;
animation-delay: 1.4s;
	}

@media screen\0 { 
.fade-in {
opacity:1; }
}


.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
} 