html { 
height:100%;
min-height:100%;
}
body
 {		margin: 0 0;
	 font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 100%; 
	   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -webkit-text-size-adjust:none;
   -ms-hyphens: auto;
   hyphens: auto;
	}
a:link		{color:#910000; text-decoration:none;}
a:visited 	{color:#910000; text-decoration:none;}
a:hover 	{color:#910000; text-decoration:underline;}
a:active 	{color:#910000; text-decoration:none;}
h1{text-align:left; font-family: 'Verdana', sans-serif; font-weight:300; font-size: 150%; text-shadow:none; margin:0px 0px; padding:0px 0px;}
h2{text-align:left; font-family: 'Verdana', sans-serif; font-weight:300; font-size: 200%; text-shadow:none; margin:0px 0px; padding:0px 0px;}
h3{text-align:left; font-family: 'Verdana', sans-serif; font-weight:300; font-size: 130%; text-shadow:none; margin:0px 0px; padding:0px 0px;}
.fett{font-weight:bold;}
a img {
border: none;
outline:none;
}
.bullets {
	display: block;
    vertical-align:middle;
	list-style:none; 
	list-style-type:none; 
	margin: 20px 0;
	padding: 0 0;
}
.bullets li{list-style:none; list-style-type:none; height:40px; left:0px; margin:0 0; padding; 0 0;}
.bullets img{vertical-align:middle; padding: 0px 10px 0px 0px; }
#button1{
  display:none;
  width: 24px;
  height: 20px;
  position: absolute;
  right: 20px; top: 30px;
  margin: 5px auto;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#button1 span{
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #fff;
  border-radius: 4px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#button1 span:nth-child(1) {
  top: 0px;
}

#button1 span:nth-child(2) {
  top: 7px;
}

#button1 span:nth-child(3) {
  top: 14px;
}

#button1.active span:nth-child(1) {
  top: 7px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

#button1.active span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

#button1.active span:nth-child(3) {
  top: 7px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

ul, li {
margin: 0 5px;
padding: 2px;
} 

.scrollToTop{
	width:60px; 
	height:60px;
	padding:10px; 
	text-align:center; 
	background: whiteSmoke;
	font-weight: bold;
	color: #444;
	text-decoration: none;
	position:fixed;
	bottom:10px;
	right:25%;
	margin-left:-30px;
	display:none;
	background: url(../images/arrow_up.png) no-repeat 0px 20px;
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
	z-index:9999;
}


.clearer	{
	clear:both;
	}
.icon {visibility:hidden}	
	
.fromleft{
	animation-name: fromleft;
	-webkit-animation-name: fromleft;	

	animation-duration: 1s;	
	-webkit-animation-duration: 1s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;		

	visibility: visible !important;	
}

@keyframes fromleft {
	0% {
		transform: translateX(150%);
	}
	50%{
		transform: translateX(-8%);
	}
	65%{
		transform: translateX(4%);
	}
	80%{
		transform: translateX(-4%);
	}
	95%{
		transform: translateX(2%);
	}			
	100% {
		transform: translateX(0%);
	}
}

@-webkit-keyframes fromleft {
	0% {
		-webkit-transform: translateX(150%);
	}
	50%{
		-webkit-transform: translateX(-8%);
	}
	65%{
		-webkit-transform: translateX(4%);
	}
	80%{
		-webkit-transform: translateX(-4%);
	}
	95%{
		-webkit-transform: translateX(2%);
	}			
	100% {
		-webkit-transform: translateX(0%);
	}
}	
	
	

#wrapper {
  width:100%;
  height:auto;
	margin: 0 0;
  z-index:1;
  overflow:hidden;
}
#header-wrapper{
	margin: 0px auto;
	padding: 10px 0px;
	top:0px;
	left:0px;
	width:100%;
	height:auto;
	overflow:hidden;
	z-index:1001;
	position:relative;
	background:#910000;
}
#header{
	margin: 0px auto;
	width:1140px;
	height:auto;
	color:#fff;
	z-index:1002;

}
#content-wrapper{
	margin: 0px auto;
	left:0px;
	width:100%;
	height:auto;
}
#logo {
	z-index:1003;
	top:0px;
	left:10px;
  	width:auto;
  	height:auto;
	position:relative;
}
.logo	{
	float:left;
	top:10px;
	left:0px;
	width:auto;
	height:auto;
	padding: 0px 0px;
	margin: 0px 0px;
	border: none;
	outline:none;
	}
#menue1 {
	z-index:130;
	top:20px;
	left:30px;
  	width:auto;
  	height:auto;
	position:relative;
}


.links {
	float:left;
}
.rechts {
	float:right;
}
.box {
  	width:49%;
  	height:auto;
	margin: 0 0;
	padding: 1% 1% 1% 0%;
	float:left;
	text-align:left;
}
.center{
  	text-align:right;
}

.content{
	margin: 0px auto;
    height:auto;
	width:1140px;
}


.picture	{
padding:5px 0px;

	}


#side1{
	top:0px;
	padding:80px 0px;
	color:#666;
	background: #F6F4EC;
	overflow:hidden;
	text-align:left;
	position:relative;
	overflow:hidden;
}

#side1 h2{color:#910000;}

.line {
    display: block;
    margin-left: auto;
    margin-right: auto;
	margin-top:20px;
	margin-bottom:20px;
	}
#side2{
    top:0px;
	padding:80px 0px;
	height: 340px;
	text-align:center;
	background: url(../images/page1a.jpg) no-repeat center center;
	background-size: cover;
	color:#fff;
	overflow:hidden;
}
#side2 h2{text-align:center; margin-top:20px; text-shadow: 2px 2px 2px #252525;}


#side3{
	padding:80px 0px;
	height: auto;
	color:#F6F4EC;
	background:#910000;
	overflow:hidden;
	position:relative;
}
#side3 h2{text-align:center; }

#side3 ul 		{text-align:center; list-style:none; margin-left:0; padding:20px 0px;}
#side3 li 		{text-align:center; list-style:none; width:45%; padding: 0 1%; height:auto; display: inline-block; margin: 0% 0% 3% 1%; vertical-align: top; position:relative; z-index: 775; overflow:hidden; }
#side3 li img	{text-align:center;}
#side3 li a		{color:#1294DA;}
#side3 li a:hover		{color:#33A3DF;}

#side4{
	top:0px;
	padding:80px 0px;
	color:#333333;
	background:#F6F4EC;
	overflow:hidden;
	text-align:left;
	position:relative;
	overflow:hidden;
}





#side5{
	top:0px;
	padding:80px 0px;
	color:#F6F4EC;
	background:#910000;
	overflow:hidden;
	text-align:left;
	position:relative;
	overflow:hidden;
}
#side6{
	top:0px;
	padding:80px 0px;
	color:#F6F4EC;
	background:#910000;
	overflow:hidden;
	text-align:left;
	position:relative;
	overflow:hidden;
}

#side7{
	top:0px;
	padding: 40px 0px;
	width: 100%; max-width: 100%; height: 100%;
	background:#333333;
	color:#fff;
	overflow:hidden;
}
#side7 h3			{color:#009688;}
#side7 a:link		{color:#8E8E8E;text-decoration:none;}
#side7 a:visited 	{color:#8E8E8E; text-decoration:none;}
#side7 a:hover 		{color:#fff; text-decoration:none;}
#side7 a:active 	{color:#8E8E8E; text-decoration:none;}

#nav1 	{
	line-height:200%;
	display:inline;
	padding: 0px 5px 0px 5px;
	color: #F6F4EC;
	text-decoration: none;
	font-size: 100%;
	margin: 0px 0px;
	}
#nav1 li {
	line-height:200%;
	display:inline;
	padding: 0px 5px 0px 3px;
	color: #F6F4EC;
	text-decoration: none;
	border-right: 1px solid #fff;
	}
#nav1 li:last-child {
    border-right: 0;
	} 
#nav1 a {
	line-height:200%;
	display:inline;
	padding: 0px 5px 0px 3px;
	color:#fff;
	text-decoration: none;
	}
#nav1 a:hover {
	line-height:200%;
	display:inline;
	padding: 0px 5px 3px 3px;
	color:#fff;
	text-decoration: none;
	border-bottom: 2px solid #fff;	
	}
#nav1 li a.mainaktiv {
	line-height:200%;
	display:inline;
	padding: 0px 5px 0px 3px;
	text-decoration: none;
	color:#fff;
	}
	
#nav3 	{
	margin: 10px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	color:#8E8E8E;
	text-decoration: none;
	}
#nav3 ul {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	list-style-type:none;
	}
#nav3 li {
	width:50%;
	float:left;
	margin: 0px 0px 0px 0px;
	padding: 3px 0px 7px 0px;
	color:#8E8E8E;
	text-decoration: none;
	list-style-type:none;
	background-image:url(../images/li-bg.png);
	background-repeat: no-repeat;
	}
#nav3 a {
	margin: 0px 0px 0px 0px;
	padding: 3px 0px 7px 0px;
	color:#8E8E8E;
	text-decoration: none;
	}
#nav3 a:hover {
	margin: 0px 0px 0px 0px;
	padding: 3px 0px 7px 0px;
	color:#FFF;
	text-decoration: none;
	}

@-webkit-keyframes drehen {
0% { -webkit-transform: scaleX(1) }
25% { -webkit-transform: scaleX(1) }
50% { -webkit-transform: scaleX(-1) }
75% { -webkit-transform: scaleX(1) }
100% { -webkit-transform: scaleX(1) }
}

@-moz-keyframes drehen {
0% { -moz-transform: scaleX(1) }
25% { -moz-transform: scaleX(1) }
50% { -moz-transform: scaleX(-1) }
75% { -moz-transform: scaleX(1) }
100% { -moz-transform: scaleX(1) }
}

@keyframes drehen {
0% { transform: scaleX(1) }
25% { transform: scaleX(1) }
50% { transform: scaleX(-1) }
75% { transform: scaleX(1) }
100% { transform: scaleX(1) }
}

.drehen {

-moz-animation-name: drehen;
-moz-animation-delay: 3s;
-moz-animation-iteration-count: 1;
-moz-animation-duration: 4s;

-webkit-animation-name: drehen;
-webkit-animation-delay: 3s;
-webkit-animation-iteration-count: 1;
-webkit-animation-duration: 4s;

animation-name: drehen;
animation-delay: 3s;
animation-iteration-count: 1;
animation-duration: 4s;

} 
.drehen hover {

-moz-animation-name: drehen;
-moz-animation-iteration-count: 1;
-moz-animation-duration: 4s;

-webkit-animation-name: drehen;
-webkit-animation-iteration-count: 1;
-webkit-animation-duration: 4s;

animation-name: drehen;
animation-iteration-count: 1;
animation-duration: 4s;

} 
@media only screen and (min-width: 640px) and (max-width: 1139px) {
body{font-size:90%;}
#wrapper 		{width:100%; margin: 0px auto;}
.header			{width:100%; margin: 0px auto; height:auto;}
.content 		{width:98%; margin: 0px 1%;}
.box			{width:98%; margin: 0px auto;}
#menue1 {clear:both; background:#910000; width:100%; left:0px; top:0px; padding:0px 0px;}
.logo	{
	float:left;
	top:10px;
	left:0px;
	width:200px;
	height:auto;
	padding: 0px 0px;
	margin: 0px 0px;
	border: none;
	outline:none;
	}
}

@media only screen and (min-width: 199px) and (max-width: 639px) {
body{font-size:95%;}
#wrapper 		{width:100%; margin: 0px auto;}
.header			{width:100%; margin: 0px auto; overflow:hidden;}
.content 		{width:96%; margin: 0px 2%; padding: 0 0; top:0px;}
.box			{width:98%; margin: 0px auto;}
.content h2	{text-align:left; font-family: 'Verdana', sans-serif; font-size: 130% !important; font-weight: 400; text-shadow: none; margin:0px 0px; padding:0px 0px;}
.content h1	{text-align:left; font-family: 'Verdana', sans-serif; font-size: 120% !important; font-weight: 400; text-shadow: none; margin:0px 0px; padding:0px 0px;}
.center		{width:98%; margin: 0px auto;}
#button1 { display:block; }
.logo	{
	float:left;
	top:10px;
	left:0px;
	width:150px;
	height:auto;
	padding: 0px 0px;
	margin: 0px 0px;
	border: none;
	outline:none;
	}
#side3 li 		{text-align:center; list-style:none; width:96%; padding: 0 1%; height:auto;}
#trenner1{
    width:100%;
	height:20px;
	min-height:20px;
    background: #313E51;
	position:relative;
	overflow:hidden;
}
#side2{height:auto; padding:10px 0px;}
#menue1 {clear:both; background:#910000; width:100%; left:0px; padding:0px 0px; display:none;}
#nav1{
	margin: 0px 0px 0px 0px;
	line-height:100%;
	display:block;
	float:left;
	height:auto;
	width:100%;
	padding: 5px 0px 5px 0px;
	color: #fff;
	text-decoration: none;
	text-align:left;
	font-size: 110%;
}
#nav1 ul {
	margin: 0px 0px 0px 0px;
	text-decoration: none;
}
#nav1 li {
	margin: 5px 0px 5px 0px;
	line-height:100%;
	display:block;
	padding: 5px 0px 5px 10px;
	width:100%;
	float:left;
	color: #fff;
	text-decoration: none;
	font-weight:100;
	border-bottom: 1px solid #fff;	
}
#nav1 li:last-child {
    border-bottom: 0;
	} 
#nav1 a {
	line-height:100%;
	display:block;
	padding: 5px 0px 5px 10px;
	color: #fff;
	text-decoration: none;
	font-weight:100;
	border-bottom: none;
	}
#nav1 a:hover {
	line-height:100%;
	display:block;
	padding: 5px 0px 5px 10px;
	color: #fff;
	text-decoration: none;
	font-weight:100;
	border-bottom: none;
}

#nav1 a.mainaktiv {
	line-height:100%;
	display:block;
	text-decoration: none;
	color: #ffffff;
	font-weight:100;
	border-bottom: none;
}


}