@charset "utf-8";
/* Grundlegende Formatierungen */
body {
	font-family:Arial;
	font-size:16px; 
	line-height: 150%; 
	margin:0 0 0 0
	}
p {
	padding-left:10px;
	padding-right:10px;
	}
.margin-top-10 {	
	margin-top:10px;
	}
.margin-bottom-10 {	
	margin-bottom:10px;
	}	
.betont {
	font-weight:bold;
	}
.no-flow {
	clear:both;
	}
.seperator {
	height:30px;
	display:block;
}


/* Überschriften */
H1 {
	color:#ff6600; 
	font-size:24px; 
	padding-left:10px;
	}
H2 {
	color:#ff6600; 
	font-size:20px; 
	padding-left:10px;
	}
H3 {
	color:#ff6600; 
	font-size:20px; 
	padding-left:10px;
	}

/* Listen */
li, li li, li li li {
	list-style-type: disc;
	}

.space {
	height:5px;
	}
.content {
	padding-top:10px; 
	background:#ddd; 
	float: left; 
	width:100%; 
	max-width:1000px;
	}

/* Menü */
#menu {
	font-size:20px;
	padding-top: 10px; 
	padding-bottom:0px; 
	font-family:Arial;
	background:#ffffff;
    position: fixed;
	top: -200%;
	float: none;
	width: 100%;
	max-width:260px;
	margin: 0;
	padding: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
	}
#menu ul{
	list-style-type: circle;
	margin: 0px 0px 0px 0px;
	display:block;
	padding:0px;
	float: none;
	}
#menu ul ul{
	padding-left:15px;
	}
#menu li, #menu li li {
	display:block;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 3px; 
	padding-bottom:3px;
	margin: 3px 0px 0px 0px;
	float: none;	
	}
#menu:target { 
	top: 15px; 
	display:block;
	position:fixed;
	}
#menu ul li.close {
	display: block;
	padding-bottom:3px;
	padding-top:1px;
	}
#menu li a:link, #menu li a:visited, #menu li a:hover {
	color: #fff; 
	background-color: #ff6600; 
	text-decoration: none;
	width:100%; 
	max-width:250px; 
	display:block;  
	padding-left:5px; 
	padding-right:5px;
	padding-top:2px;
	padding-bottom:2px;
	} 
#menu li li a:link, #menu li li a:visited, #menu li li a:hover {
	color: #fff; 
	background-color: #ff6600; 
	text-decoration: none; 
	width:100%; 
	max-width:235px; 
	display:block;  
	padding-left:5px; 
	padding-right:5px;
	padding-top:2px;
	padding-bottom:2px;
	} 
#menu li.unterpunkt {
	padding-top:6px; 
	padding-bottom:0px;
	}
.menu-open {
    position: fixed;
	width:100%;
	max-width:260px;
	padding-top:3px;
	padding-bottom:3px;
	background-color:#fff;
	font-size:20px; 
	}
 
.menu-open a:link, .menu-open a:visited, .menu-open a:hover {
	color: #fff; 
	background-color: #ff6600;
	text-decoration: none; 
	width:100%; 
	max-width:250px; 
	display:block;  
	padding-left:5px; 
	padding-right:5px; 
	padding-bottom:3px; 
	padding-top:3px;
	margin-top:0px;
	} 
 
.after-menu {
	width:100%; 
	height:30px; 
	display:block;
	}

/* Teaser */
.teaser-img {
	padding-top:0px; 
	padding-bottom:10px;
	}

.teaser-1-3, .teaser-2-3, .teaser-3-3  {
	width:300px;  
	float:none; 
	padding-right:0px; 
	text-decoration:none; 
	margin:0px auto;
	}

a.teaser-link:link, a.teaser-link:visited {
	display:block; 
	width:300px;  
	text-decoration:none; 
	border:0px; 
	z-index:2;
	color:#ddd; 
	border-bottom-width:2px; 
	border-top-width:2px; 
	border-bottom-style:solid;  
	border-top-style:solid;
	}
	
a.teaser-link:hover {
	color:#ff6600; 
	border-bottom-width:2px; 
	border-top-width:2px; 
	border-bottom-style:solid;  
	border-top-style:solid;
	}

/* Grafiken */
.parallax {  
    height: 300px;
    background-attachment: scroll;
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto;
	}
.img-icon {
	margin-bottom:0px; 
	margin-top:1px; 
	margin-left:5px; 
	margin-right:5px; 
	padding-top:0px; 
	float:left;
	width:auto;
	}
.img {
	margin-bottom:10px; 
	margin-top:10px; 
	margin-left:10px; 
	margin-right:10px; 
	float:left; 
	}	
.logo {
	margin:0px auto; 
	width: 50px; 
	height: 44px; 
	background-image: url(../img/design/logo.jpg);
	background-image: 
    -webkit-image-set(
url(../img/design/logo.jpg) 1x,
url(../img/design/logo-2x.jpg) 2x,
    );
  background-image: 
    image-set(
url(../img/design/logo.jpg) 1x,
url(../img/design/logo-2x.jpg) 2x,
    );
	margin-top:20px; 
	margin-bottom:20px;
	}

/* Accordion */	
	
.accordion {
	background-color: #ddd;
	font-size: 16px;
	color: #ff6600;
	font-weight: bold;
	cursor: pointer;
	padding: 10px;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	transition: 0.4s;
	}
.accordion:after {
	content: '\002B'; /* Unicode character for "plus" sign (+) */
	color: #ff6600;
	float: right;
	margin-left: 5px;
}
.active, .accordion:hover {
	background-color: #ccc; 
	}
.active:after {
	content: "\2212"; /* Unicode character for "minus" sign (-) */	
	}
.panel-h {
	color: #ff6600;
	}
.panel {
	background-color: #fff;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
	padding-left: 0px;
	padding-right: 0px;
	border-right-style: solid;
	border-left-style: solid;
	border-bottom-style: solid;
	border-right-width:10px;
	border-left-width:10px;
	border-bottom-width:0px;
	border-color: #ccc;
	}
.panel-end {
	width:100%;
	height: 10px;
	background-color: #ccc;
	}
	



/*Footer*/
.print-footer {
	display:none;
	}	
.footer {
	margin: 20px 20px 0px 20px; 
	padding-top:5px; 
	text-align:right; 
	padding-right:0px; 
	font-weight:bold; 
	font-size:12px; 
	border-top:1px solid #ff6600;
	}

a.footer-link:link, a.footer-link:visited  {
	color: #000000; 
	text-decoration : underline;
	} 
a.footer-link:hover {
	color: #59585A; 
	text-decoration : none;
	}

/* Links ohne spezielle Klasse */
a, a:link, a:visited  {
	color: #000000; 
	text-decoration: underline;
	}
a:hover {
	color: #59585A;
	text-decoration: none;
	}


/* Layouts ab 1000px Breite. Erbt vorherige Stile. */
<!-- @media only screen and (min-width: 1000px) {

/* Grundlegende Formatierungen */
.all {
	margin:0px auto;
	width:1000px;
	padding-left: 0px;
	padding-right: 0px;
	position:relative;
}

/* Grafiken */
.parallax { 
	height: 400px;
}	

/* Teaser */
.teaser-1-3, .teaser-2-3 {  
	float:left; 
	padding-right:50px; 
	}

.teaser-3-3 { 
	float:left; 
	}

}

/* Layouts ab 1100px Breite. Erbt vorherige Stile. */
<!-- @media only screen and (min-width: 1100px) {

/* Grafiken */
.parallax {
	background-attachment: fixed;
	}
}