﻿/* = = = = = = = = = = = = = = = = = datei format.css = = = = = = = = = = = = = = = = = = = = = = = = = */
/* ############################################################ */
/* allgemein */
/* ############################################################ */
*, *:before, *:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-moz-transition: width .75s ease-out;
	-webkit-transition: width .75s ease-out;
	transition: width .75s ease-out;
}
.clearfix:before, .clearfix:after {
	content: " ";
	display: table;
}
.clearfix:after {
	clear: both;
}
.clearfix {
	*zoom: 1;
}
.section {
	clear: both;
	margin: 0rem;
	background: transparent;
}
html {
	font-family: "calibri","trebuchet ms",georgia, "Open Sans",helvetica, "arial",roboto, serif;
	font-size: 62.5%;
	line-height: 1.5;
	font-weight: 400;
}
h1, h2 {
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}
body {
	font-size: 1.9rem;
	margin: 0 auto;
	background-color: #DFDFDF;
	color: #4F4F4F;
	margin: 0rem;
}
.container_haupt {
	margin: 0rem;
	background-color: #000;
	width: 100%;
}
/* überschriften */
h1, h2, h3, h4, h5 {
	font-weight: normal;
}
h1 {
	font-size: 2.9rem;
	margin-top: 0rem;
	margin-bottom: 3.5rem;
	color: #000000;
}
h2 {
	font-size: 2.4rem;
	line-height: 2.8rem;
	margin-top: 0rem;
	margin-bottom: 3rem;
}
h3 {
	font-size: 2rem;
	line-height: 2.3rem;
	margin-top: 1.5rem;
	margin-bottom: 1rem;
}
img {
	max-width: 100%;
	height: auto;
	padding: 0rem;
	margin: 0rem;
}
pre {
	margin-bottom: 2rem;
}
/* ############################################################ */
/* allgemein - speziell*/
/* ############################################################ */
.hpname1 {
	font-size: 3rem;
	line-height: 4rem;
	padding-left: 0rem;
	padding-right: 0rem;
	color: #fff;
	margin: 0 auto;
}
.hpname2 {
	font-size: 2.4rem;
	line-height: 3rem;
}
.bild-im-text {
	display: block;
	max-width: 100%;
	margin: 2rem auto;
	border: 0rem;
	border-color: #E9E9E9;
}
.bild-im-text-re {
	display: block;
	max-width: 100%;
	margin: 2rem auto;
	border: 0rem;
	border-color: #E9E9E9;
}
/* ############################################################ */
/* bereich TOP */
/* ############################################################ */
.bereich-top {
	background: transparent;
	color: #fff;
}
.zelle-top {
	display: table-cell;
	width: 100%;
	padding: 0rem;
}
/* ############################################################ */
/* bereich logo */
/* ############################################################ */
.bereich-logo {
	color: #fff;
	text-shadow: 0.1rem 0.1rem 0.1rem #0069D2;
	background-image: url(images/logo0.jpg);
	background-repeat: repeat;
	background-position: 55% 40%;
	background-color: white;
	background-size: cover;
}
.bereich-logo hr {
	margin: 0 auto;
	margin-top: 1rem;
	margin-bottom: 1rem;
	border: none;
	width: 50%;
	border-bottom: solid 0.1rem #DCEBF1;
	height: 0.1rem;
}
.bereich-logo .zelle {
	display: table-cell;
	width: 100%;
	vertical-align: top;
	border-collapse: separate;
}
.bereich-logo .tabelle {
	display: table;
	width: 100%;
	table-layout: fixed;
	border-spacing: 0rem 0rem;
}
.zelle-logo {
	display: table-cell;
	width: 100%;
	height: 88vh;
	text-align: center;
	vertical-align: middle;
}
.bereich-logo .zelle-back {
	display: block;
	width: 100%;
	height: 8vh;
	background: dodgerblue;
	text-align: right;
	vertical-align: bottom;
	background: linear-gradient(to right bottom, transparent 50%,dodgerblue 50%);
}
/* ############################################################ */
/* bereich info 1 */
/* ############################################################ */
.bereich-info1 {
	background-color: dodgerblue;
	color: #DCEBFC;
	padding: 0rem 0rem 0rem 0rem;
}
.bereich-info1 h2 {
	color: white;
	text-align: right;
}
.bereich-info1 hr {
	margin: 0 auto;
	margin-top: 2rem;
	margin-bottom: 2rem;
	border: none;
	width: 100%;
	border-bottom: solid 0.1rem #A6D2FF;
	height: 0.1rem;
}
.bereich-info1 .zelle {
	display: table-cell;
	width: 100%;
	vertical-align: top;
	border-collapse: separate;
}
.bereich-info1 .tabelle {
	display: table;
	width: 100%;
	table-layout: fixed;
	border-spacing: 2rem 1rem;
	margin: 0 auto;
}
.zelle-info1a {
	display: block;
	width: 100%;
	margin-bottom: 2rem;
	vertical-align: middle;
	text-align: right;
	padding: 0rem 0rem 0rem 8rem;
}
.zelle-info1b {
	display: block;
	width: 100%;
	margin-bottom: 2rem;
	vertical-align: middle;
	text-align: left;
	padding: 0rem 0rem 0rem 2rem;
}
.bereich-info1 .text {
}
.bereich-info1 .foto {
	width: 100%;
}
.bereich-info1 .fa {
	color: #fff;
	padding: 1rem;
}
.bereich-info1 .zelle-back {
	display: block;
	width: 100%;
	height: 8vh;
	background: dodgerblue;
	background: linear-gradient(to left bottom, transparent 50%, #0079f2 50%);
}
.bereich-info1 img {
	max-width: 70%;
	border-radius: 36rem;
	height: auto;
	padding: 0rem;
	margin: 0rem;
}
/* ############################################################ */
/* bereich info 2 */
/* ############################################################ */
.bereich-info2 {
	background-color: #0079f2;
	color: #BEE7FC;
	font-style: normal;
}
.bereich-info2 h2 {
	color: #fff;
	margin-bottom: 0;
	text-align: left;
}
.bereich-info2 hr {
	margin: 0 auto;
	margin-top: 2rem;
	margin-bottom: 2rem;
	border: none;
	width: 100%;
	border-bottom: solid 0.1rem #95CAFF;
	height: 0.1rem;
}
.bereich-info2 .zelle {
	display: table-cell;
	width: 100%;
	vertical-align: top;
	border-collapse: separate;
}
.bereich-info2 .tabelle {
	display: table;
	width: 100%;
	table-layout: fixed;
	border-spacing: 2rem 1rem;
	margin: 0 auto;
}
.zelle-info2a {
	display: block;
	width: 100%;
	text-align: center;
	margin-bottom: 2rem;
	vertical-align: middle;
	border-radius: 2rem;
	text-align: right;
	padding: 0rem 2rem 0rem 0rem;
}
.zelle-info2b {
	display: block;
	width: 100%;
	text-align: left;
	margin-bottom: 2rem;
	vertical-align: middle;
	border-radius: 2rem;
	text-align: left;
	padding: 0rem 8rem 0rem 0rem;
}
.bereich-info2 .text {
}
.bereich-info2 .foto {
	margin: 0;
	padding: 0rem 0rem 0rem 0rem;
}
.bereich-info2 .fa {
	color: #fff;
	padding: 1rem;
}
.bereich-info2 .zelle-back {
	display: block;
	width: 100%;
	height: 8vh;
	background-color: #0079f2;
	background: linear-gradient(to right bottom, transparent 50%, dodgerblue 50%);
}
.bereich-info2 img {
	max-width: 70%;
	border-radius: 6rem;
	height: auto;
	padding: 0rem;
	margin: 0rem;
	box-shadow: 4px 7px 4px #1E90FF;
}
/* ############################################################ */
/* bereich info 3 */
/* ############################################################ */
.bereich-info3 {
	background-color: dodgerblue;
	color: #DCEBFC;
}
.bereich-info3 h2 {
	color: #fff;
	margin-bottom: 0;
	text-align: right;
}
.bereich-info3 hr {
	margin: 0 auto;
	margin-top: 2rem;
	margin-bottom: 2rem;
	border: none;
	width: 100%;
	border-bottom: solid 0.1rem #A6D2FF;
	height: 0.1rem;
}
.bereich-info3 .zelle {
	display: table-cell;
	width: 100%;
	vertical-align: top;
	border-collapse: separate;
}
.bereich-info3 .tabelle {
	display: table;
	width: 100%;
	table-layout: fixed;
	border-spacing: 2rem 1rem;
	margin: 0 auto;
}
.zelle-info3a {
	display: block;
	width: 100%;
	margin-bottom: 2rem;
	vertical-align: middle;
	border-radius: 2rem;
	text-align: right;
	padding: 0rem 0rem 0rem 8rem;
}
.zelle-info3b {
	display: block;
	width: 100%;
	margin-bottom: 2rem;
	vertical-align: left;
	border-radius: 2rem;
	text-align: left;
	padding: 0rem 0rem 0rem 2rem;
}
.bereich-info3 .text {
}
.bereich-info3 .foto {
	margin: 0;
	padding: 0rem 0rem 0rem 0rem;
}
.bereich-info3 .fa {
	color: #fff;
	padding: 1rem;
}
.bereich-info3 .zelle-back {
	display: block;
	width: 100%;
	height: 8vh;
	background: dodgerblue;
	background: linear-gradient(to left bottom, transparent 50%, forestgreen 50%);
}
.bereich-info3 img {
	max-width: 90%;
	border-radius: 2rem;
	height: auto;
	padding: 0rem;
	margin: 0rem;
	box-shadow: 4px 7px 4px #0079f2;
}
#idname1 {
	border-radius: 36rem;
	max-width: 90%;
	height: auto;
	padding: 0rem;
	margin: 0rem;
}
/* ############################################################ */
/* bereich inhalt - auf den unterseiten */
/* ############################################################ */
.bereich-inhalt {
	border-top: solid 0.5rem dodgerblue;
	border-bottom: solid 0.5rem dodgerblue;
	width: 100%;
	background-color: lemonchiffon;
	padding: 0rem;
}
.bereich-inhalt h1, .bereich-inhalt h2, .bereich-inhalt h3 {
	color: #4F4F4F;
}
.bereich-inhalt .tabelle {
	display: table;
	width: 100%;
	table-layout: fixed;
	border-spacing: 0rem 0rem;
}
.zelle-inhalt {
	display: block;
	width: 100%;
	padding: 5rem 2rem 5rem 2rem;
	min-height: 20rem;
}
/* ############################################################ */
/* Eigene Formatvorlagen */
/* ############################################################ */
#idname {
	border-radius: 2rem;
	box-shadow: 4px 4px 4px #aaa;
}
.auto-style1 {
	color: #0000FF;
}
.auto-style6 {
	margin-top: 0;
}
.auto-style14 {
	text-align: center;
	color: #0000FF;
}
.auto-style16 {
	text-align: left;
}
.auto-style17 {
	vertical-align: middle;
}
.auto-style18 {
	text-align: center;
}
.auto-style19 {
	border-width: 0;
	margin-left: 10px;
	margin-right: 10px;
}
.auto-style20 {
	color: #FF0000;
	font-size: medium;
}
.auto-style21 {
	color: #0000FF;
	font-size: x-large;
	font-weight: bold;
}
.auto-style46 {
	vertical-align: middle;
	margin-left: 6px;
	margin-right: 6px;
}
.auto-style47 {
	color: #FF0000;
	text-align: left;
}
.auto-style49 {
	color: #FF0000;
	font-size: large;
}
.auto-style57 {
	color: #0000FF;
	font-size: x-large;
	font-weight: bold;
}
.auto-style58 {
	text-align: center;
	font-weight: normal;
}
.auto-style60 {
	text-align: left;
}
.auto-style62 {
	color: #FF0000;
}
.auto-style63 {
	font-size: 1.6rem;
}
.auto-style64 {
	font-weight: bold;
	text-align: left;
}
.auto-style65 {
	color: #0000FF;
	text-align: left;
}
.auto-style72 {
	text-align: center;
}
.auto-style74 {
	margin-top: 10px;
	margin-bottom: 10px;
}
.auto-style82 {
	background-color: #FFA300;
}
.auto-style83 {
	text-align: center;
	color: #FF0000;
	font-size: large;
}
.auto-style84 {
	color: #0000FF;
	font-size: x-large;
}
.auto-style85 {
	vertical-align: middle;
}
.auto-style86 {
	color: #0000FF;
	text-align: left;
	font-size: medium;
}
.auto-style87 {
	color: #0000FF;
	text-align: left;
	font-size: large;
}
.auto-style88 {
	font-size: large;
	color: #0000FF;
}
.auto-style89 {
	text-align: center;
	font-size: large;
}
.auto-style90 {
	text-align: center;
	background-color: #FFA300;
}
.auto-style93 {
	text-align: center;
	color: #FF0000;
    font-weight: bold;
}
.auto-style94 {
	text-align: center;
	color: #FF0000;
}
.auto-style96 {
	font-size: x-large;
	color: #228B22;
}
.auto-style55 {
	text-align: center;
}
.auto-style57 {
	border: 6px solid #FF9900;
	text-align: center;
	background-image: url('images/wald.gif');
	color: #FFFF00;
	font-size: x-large;
	font-weight: bold;
}
.auto-style95 {
	margin-top: 1;
	margin-left: 32px;
	margin-right: 20px;
}
.auto-style96 {
	text-align: center;
	color: #228B22;
	font-weight: bold;
	font-size: x-large;

}
.auto-style97 {
	font-size: medium;
}
.auto-style98 {
	color: #0000FF;
	font-size: medium;

}
.auto-style102 {
	margin-top: 8px;
	margin-bottom: 8px;
}
.auto-style101 {
	font-weight: normal;
}
.auto-style103 {
	text-align: center;
	color: #FCD51C;
	font-weight: bold;
}
.auto-style104 {
	text-decoration: line-through;
}
	.auto-style105 {
	color: #FF0000;
	font-weight: bold;
}

/* ############################################################ */
/* bereich fuss */
/* ############################################################ */
.bereich-fuss {
	background-color: forestgreen;
	color: #EFEFEF;
	padding-top: 2rem;
	padding-bottom: 0rem;
}
.bereich-fuss .tabelle {
	display: table;
	width: 100%;
	table-layout: fixed;
	border-spacing: 0rem 0rem;
}
.zelle-fuss {
	display: block;
	width: 100%;
	text-align: center;
	padding: 0rem;
}
.bereich-fuss .fa {
	color: white;
}
.fussname {
	color: #fff;
	font-size: 1.6rem;
	padding: 1rem 0rem 1rem 0rem;
	text-transform: uppercase;
}
.totop {
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	padding: 1rem;
}
.totop .fa {
	color: white;
}
/* ############################################################ */
/* R  E  S  P  O  N  S  I  V  E */
/* ############################################################ */
/* ==================================== ab 360 pixel ================================== */
@media (min-width: 360px) {
.zelle-logo {
	height: 60vh;
}
}
/* ==================================== ab 480 pixel ================================== */
@media (min-width: 480px) {
.zelle-logo {
	height: 90vh;
}
.bild-im-text {
	max-width: 80%;
}
.bild-im-text-re {
	max-width: 80%;
}
}
/* ==================================== ab 600 pixel ================================== */
@media (min-width: 600px) {
.zelle-info1a {
	display: table-cell;
	padding: 0rem 0rem 0rem 2rem;
}
.zelle-info1b {
	display: table-cell;
	padding: 0rem 0rem 0rem 0rem;
}
.zelle-info2a {
	display: table-cell;
	padding: 0rem 0rem 0rem 0rem;
}
.zelle-info2b {
	display: table-cell;
	padding: 0rem 2rem 0rem 0rem;
}
.zelle-info3a {
	display: table-cell;
	padding: 0rem 0rem 0rem 2rem;
}
.zelle-info3b {
	display: table-cell;
	padding: 0rem 0rem 0rem 0rem;
}
zelle-fuss {
	display: table-cell;
}
.bild-im-text {
	max-width: 80%;
}
.bild-im-text-re {
	max-width: 80%;
}
}
/* ==================================== ab 640 pixel ================================== */
@media (min-width: 640px) {
.zelle-inhalt {
	padding: 5rem 5rem 5rem 5rem;
}
}
/* ==================================== ab 680 pixel ================================== */
@media (min-width: 680px) {
html {
	font-size: 64%;
}
}
/* ==================================== ab 768 pixel ================================== */
@media (min-width: 768px) {
html {
	font-size: 66.5%;
}
.zelle-logo {
	height: 50vh;
}
.zelle-inhalt {
	text-align: justify;
}
}
/* ===================================== ab 800 pixel ================================= */
@media (min-width: 800px) {
.bild-im-text {
	float: left;
	max-width: 30%;
	margin-top: 1rem;
	margin-right: 1.5rem;
	margin-bottom: 0rem;
	margin-left: 0rem;
}
.bild-im-text-re {
	float: right;
	max-width: 30%;
	margin-top: 1rem;
	margin-left: 1.5rem;
	margin-bottom: 0rem;
	margin-right: 0rem;
}
}
/* ===================================== ab 1024 pixel ================================= */
@media (min-width: 1024px) {
html {
	font-size: 69%;
}
.zelle-logo {
	height: 75vh;
}
.bild-im-text {
	margin-top: 1rem;
	margin-right: 2rem;
	margin-bottom: 0.5rem;
	margin-left: 0rem;
}
.bild-im-text-re {
	margin-top: 1rem;
	margin-left: 2rem;
	margin-bottom: 0.5rem;
	margin-right: 0rem;
}
}
/* ===================================== ab 1280 pixel ================================= */
@media (min-width: 1280px) {
html {
	font-size: 72%;
}
.hpname1 {
	font-size: 5rem;
	line-height: 6rem;
}
.hpname2 {
	font-size: 3rem;
	line-height: 5rem;
}
.zelle-info1a {
	padding: 0rem 0rem 0rem 8rem;
}
.zelle-info1b {
	padding: 0rem 0rem 0rem 2rem;
}
.zelle-info2a {
	padding: 0rem 2rem 0rem 0rem;
}
.zelle-info2b {
	padding: 0rem 8rem 0rem 0rem;
}
.zelle-info3a {
	padding: 0rem 0rem 0rem 8rem;
}
.zelle-info3b {
	padding: 0rem 0rem 0rem 2rem;
}
.zelle-inhalt {
	padding: 5rem 8rem 5rem 8rem;
}
}
/* ===================================== ab 1420 pixel ================================= */
@media (min-width: 1420px) {
html {
	font-size: 82%;
}
}
/* +  +  +  +  + +  +  +  +  +  C O D E ENDE  +  +  +  +  +  +  +  +  +  + */
