@font-face {
    font-family:'KudosCond';
    font-style: normal;
    font-weight: normal;
    src: 
      local('KudosCond'),
      url(../fonts/tt0375m_.woff2) format('woff2'),
      url(../fonts/tt0375m_.woff) format('woff');
}

@font-face {
    font-family:'LogoFont';
    font-style: normal;
    font-weight: normal;
    src: 
      local('LogoFont'),
      url(../fonts/Betterlett.woff2) format('woff2'),
      url(../fonts/Betterlett.woff) format('woff');
}

@font-face {
    font-family:'Source Sans Pro';
    font-style: normal;
    /*font-weight: 400;*/
    src: 
      local('Source Sans Pro'),
      url(../fonts/SourceSansPro-Light.woff2) format('woff2'),
      url(../fonts/SourceSansPro-Light.woff) format('woff');
}

body {
 	margin: 0px auto;
	padding: 0px;
	cursor: default;
	font: 18px/24px 'Source Sans Pro', sans-serif;
	color: #000;
	hyphens: auto;
	background-image: url(../img/bg.jpg);
	background-position: bottom center;
	background-attachment:fixed;
	background-size: cover;
	
	-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='path_relative_to_the_HTML_file', sizingMethod='scale')";
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
}

p {margin-top:0px; padding-top:0px; overflow:auto;}

table {
	border-spacing:0px;
	border-collapse: collapse;
	padding:0px;
	border: none;
}

td {
	padding: 0;
	vertical-align:top;
}

/*Head Desktop*/
#Head_mobile {
	visibility:hidden;}

#Head {
	margin:0 auto;
	text-align:center;
	background-color: #286428;
	/*background-color: #96aa5a;*/
	/*background-color: #AAC864;
	background-color: rgb(170,200,100);*/
	width:100%;
	height:50px;
	position:fixed;
	top:0px;
	z-index:100;
	clear:both;
	border-bottom: 1px solid #fff;
}

#Head table {
	margin: 0 auto;
	border: none;
	text-align:center;
	align:center;
	width:100%;
}

/*Menü*/
#Menu td {
	text-align:center;
	height:50px;
	color:#000;
	width:20%;
}

#Menu a.menu, a.menu:visited, a.menu:active {
	font-family:'KudosCond';
	font-size:1.2em;
	font-weight: normal;
	display: block;
	text-decoration:none;
	vertical-align:middle;
	height:40px;
	text-align:center;
	line-height:normal;
	font-weight:bold;
	padding:5px;
	color:#000;
	color: rgb(0,0,0,1.0);
	transition: background-color 0.3s, color 0.3s;
}

#Menu a.menu:hover {
	font-size:1.2em;
	font-weight:bold;
	text-decoration:none;
	vertical-align:middle;
	height:40px;
	text-align:center;
	line-height:normal;
	font-weight:bold;
	padding:5px;
	/*background-color: #000;
	background-color: rgb(100,0,100,1.0);
	color: #AAC864;
	color: rgb(170,200,100,1.0);
	transition: background-color 0.3s, color 0.3s;*/
	border-bottom:none;
}

/*Menü ENDE*/


#Logo {
	margin: 0 auto;
	text-align:center;
	max-width:800px;
	width:100%;
	background-size: 100%;
	position:relative; top:10em;
}

#HGBild {
	/*transform: skew(0deg, -2deg);*/
	margin: 0 auto;
	position: relative;
	top:-30px;
	text-align:center;
	width:100%;
	height:600px;
	/*background: url(../img/backgroundimage/rotate.php);*/
	/*background:url(../img/backgroundimage/head_bg_4.jpg);*/
	background-repeat:no-repeat;
	background-position: center;
	/*border-bottom: 1px solid #FFF;*/
}

#Inhalt div.gedreht_grau {
	margin: 0 auto;
	/*transform: skew(0deg, -2deg);*/
	background-color: #CCC;
	background-color: rgb(204,204,204,0.9);
	width:100%;
	text-align:center;
	padding-top:25px;
	margin-bottom:30px;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	position:relative;
}

#Inhalt div.gedreht_inhalt {
	margin: 0 auto;
	/*transform: skew(0deg, 2deg);*/
	padding-top:0em;
	padding-bottom:2em;
	margin-bottom:20px;
	width:90%;
	max-width:1000px;
	text-align:left;
	color:#000;
	height: auto;
	position:relative;
	overflow: auto;	
}

/*Links*/
a, a:visited, a:active {
  display         : inline-block;
  color           : #000;
  cursor          : pointer;
  text-decoration : none;
  font-weight	  : normal;
  line-height	  : 15px;
}

a::after {
  content                            : "";
  display                            : block;
  margin                             : 0 auto;
  width                              : 0%;
  height                             : 2px;
  background                         : #FFF;
  -webkit-transition-duration        : .5s;
  -o-transition-duration             : .5s;
  transition-duration                : .5s;
  -webkit-transition-property        : all;
  -o-transition-property             : all;
  transition-property                : all;
  -webkit-transition-timing-function : ease;
  -o-transition-timing-function      : ease;
  transition-timing-function         : ease;
  -webkit-transform                  : scaleY(0.9);
  -ms-transform                      : scaleY(0.9);
  transform                          : scaleY(0.9);
  text-decoration					 : none;
  font-weight	 					 : normal;
  border-bottom						 : 2px hidden;
}

a:hover::after {
  width: 100%;
  text-decoration: none;
  border-bottom: none;
  font-weight:normal;
  color:#000;
}

/*a:visited {border-bottom: 1px solid #999933;}*/

#Inhalt a, a:hover {border-bottom:2px solid #000; color: #000;}
#Inhalt a:active {text-decoration:none; font-weight:normal; color: #000;}

#Inhalt a.Bildlink, a.Bildlink:visited, a.Bildlink:active {
	display: inline;
	text-align: left;
	text-decoration: none;
	padding: 0px;
	margin: 0px;
	border:none;
	color:#000;
}

#Inhalt a.Bildlink::after {
	background:none;}

#Inhalt a.Bildlink:hover {
	text-align: left;
	text-decoration: none;
	border: none;
	color:#000;
}

#Inhalt a.ext, a.ext:visited, a.ext:active {
	display: inline-block;
	text-align: left;
	text-decoration: none;
	padding: 0px 0px 0px 20px;
	margin: 0px;
	border:none;
	color: #000;
	background:url(../img/link_extern.png) 3px 3px no-repeat;
	background-size: 11px;
	border-bottom: 2px solid #000;
	font-weight:normal;
	line-height: 15px;
}
#Inhalt a.ext:hover {text-decoration: none;}
#Inhalt a.ext:active {color: #FFF;}

#Inhalt a.int, a.int:visited, a.int:active {
	display: inline-block;
	text-align: left;
	text-decoration: none;
	padding: 0px 0px 0px 20px;
	margin: 0px;
	border:none;
	color: #000;
	background:url(../img/link_intern.png) 3px 3px no-repeat;
	background-size: 11px;
	border-bottom: 2px solid #000;
	font-weight:normal;
	line-height: 15px;
}
#Inhalt a.int:hover {text-decoration: none;}
#Inhalt a.int:active {color: #FFF;}

#Inhalt a.Button, a.Button:visited, a.Button:active {
	font-size:1.3em;
	font-weight:bold;
	color:#FFF;
	font-family:'KudosCond';
	display: inline-block;
	width:90%;
	height:30px;
	vertical-align:middle;
	background-color: #286428;
	text-align:center;
	text-decoration:none;
	box-sizing: border-box;
	border-radius: 5px 5px 5px 5px;
	box-shadow: 0px 0px 15px silver;
	margin:0 auto;
	margin:10px;
}

#Inhalt a.Button:hover {
	background: linear-gradient(to bottom right, #286428, #ccc);
	color:#FFF;
}
#Inhalt a.Button::after {display:inline;}



/*#Inhalt li {
	font-size:1.2em;
	line-height:1.5em;
	margin-bottom:0.5em;
}*/

div.gedreht_inhalt ul {
   list-style-type: square;
   margin-top: 0em;
   margin-bottom: 1em;
   margin-left: 0;
   margin-right: 0;
   padding-left: 40px;
   font-size:1em;
}

img.Pict {
	border: 1px solid #000;
	background-color:transparent;
	padding: 3px;
	margin: 5px;
	box-shadow: 0px 0px 10px grey;
}

img.Pict-rechts {
	border: 1px solid #000;
	background-color:transparent;
	padding: 3px;
	margin: 5px;
	float:right;
	clear:both;
	margin-left:20px;
	height:auto;
	box-shadow: 0px 0px 10px grey;
}

img.rund {
	border-radius: 50% 50% 50% 50%;
	box-shadow: 0px 0px 10px grey;
	border:#000 solid 1px;
}

H1, H2, H3 {
	font-family: 'LogoFont';
	line-height:normal;
	color: #286428;
	clear:both;
	font-style:italic;
	text-align:center;
	hyphens: none;
}

H1 {
	font-size:2em;
	line-height: normal;
	margin-top:0px;
	column-span: all;
}

H2 {
	font-size:1.8em;
	column-span: all;
}

H3 {
	font-size:1.5em;
}

.Highlight {
	font-weight:bold;
	color: #000;
}

#Inhalt div.FlexCont {display:flex; display:-ms-flexbox; flex-wrap:wrap; -ms-flex-flow: wrap; justify-content:center; -ms-flex-pack:center; clear:both;}

#Inhalt div.Flex2er {width:45%; min-width:290px; float:left; margin:10px; padding:0px; text-align:left; height:auto; position:relative; }
div.Flex2er img {text-align:center;}
div.Flex2er p {font-size:1em; line-height:1.2em; text-align:left; clear:both;}

#Inhalt div.Flex3er {width:280px; float:left; margin:10px; padding:7px 7px 0px 7px; text-align:center; background-color:#DCF1FC; height:270px; position:relative; }
div.Flex3er h3 {text-align:center; margin:-7px; padding:7px; line-height: 1.3em; background-color:#333366; color:#FFF;}
div.Flex3er img {width:260px; margin:5px; text-align:center;}
div.Flex3er ul {padding-left:15px;}
div.Flex3er li {padding-bottom:5px;}
div.Flex3er p, ul {font-size:0.9em; line-height:1.2em; text-align:left;}

/*#Inhalt div.Flex4er {width:235px; float:left; padding:5px; text-align:center; position:relative; }*/

#Inhalt div.Flex4er {width:280px; float:left; padding:5px; text-align:center; position:relative; }
div.Flex4er h2 {text-align:center;}
/*div.Flex4er img {margin:5px; text-align:center; width:200px; height:200px;}*/
div.Flex4er ul {padding-left:15px;}
div.Flex4er li {padding-bottom:5px;}
div.Flex4er p, ul {font-size:0.9em; line-height:1.2em; text-align:left;}
div.Flex4er img {margin:5px; text-align:center; width:260px; height: auto;
	/* SCALE */ -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1);
	/* VERZÖGERUNG */ -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear;
	/* Schatten */ -webkit-box-shadow: 0px 0px 5px #ccc; -moz-box-shadow: 0px 0px 5px #ccc; box-shadow: 0px 0px 5px #ccc;
}
div.Flex4er img:hover {
	/* SCALE */ -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1);
	/* Schatten */ -webkit-box-shadow: 0px 0px 10px #ccc; -moz-box-shadow: 0px 0px 10px #ccc; box-shadow: 0px 0px 10px #ccc;
}

#Inhalt div.Galerie {display:flex; display:-ms-flexbox; flex-wrap:wrap; -ms-flex-flow: wrap; justify-content:center; -ms-flex-pack:center; clear:both; padding:10px; margin-bottom:15px;}
div.Galerie img {border: 1px solid #999933; background-color:transparent; padding: 3px; margin: 10px; float:left; height:150px;
	/* SCALE */ -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1);
	/* VERZÖGERUNG */ -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear;
}
div.Galerie img:hover {
	/* SCALE/ROTATE  -webkit-transform: scale(1.05) rotate(-2deg); -moz-transform: scale(1.05) rotate(-2deg); -ms-transform: scale(1.05) rotate(-2deg); -o-transform: scale(1.05) rotate(-2deg); transform: scale(1.05) rotate(-2deg);*/
	/* SCALE*/  -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05);
}
div.Galerie h2 {text-align:center;}
div.Galerie p {width:100%;}
div.Galerie a, a:visited, a:active {display: inline-block; text-decoration: none; border-bottom:none;}
div.Galerie a::after {background:none; border-bottom:none;}
div.Galerie a:hover::after {border-bottom: none; background:none;}

#Inhalt figure {float:right; padding-top:0px; margin-top:0px;}
#Inhalt figure img {width: 400px; height:auto;}
#Inhalt figcaption {font-size:0.8em; text-align:right; font-style:italic; padding-right:10px; line-height:normal;}
#Inhalt figcaption a, a:visited , a:active {font-weight:bold; text-decoration:none; background:none; border:none;}
#Inhalt figcaption a:hover {border: none; color:#000;}
#Inhalt figcaption a::after {background:none;}


div.Spalten {column-width: 300px; column-count: 3; clear:both;}
div.Spalten h3 {padding-top:0px; margin-top:0px;}
div.Spalten p {margin-top:0px;}
div.Spalten img {width:95%; border: 1px solid #999933; background-color:transparent; padding: 3px; margin: 5px; height:auto; clear:both;
	/* SCALE */ -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1);
	/* VERZÖGERUNG */ -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear;
}
div.Spalten img:hover {
	/* SCALE*/  -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05);
}


#Abspann {
	margin: 0 auto;
	width:100%;
	margin-top:3em;
	padding-top:5px;
	padding-bottom: 60px;
	color: #FFF;
	background-color: #96aa5a;
	background-color: rgb(150,170,90,1);
	clear:both;
	display:flex; display:-ms-flexbox; 
	flex-wrap:wrap; -ms-flex-flow: wrap;
	justify-content:center; -ms-flex-pack:center;
	border-top:1px solid #FFF;
	font: 20px/25px 'KudosCond';
}

#Abspann div {
	font-size:0.9em;
	width:310px;
	float:left;
	/*margin:15px;*/
	text-align:left;
	padding:10px;
	display: block;
}

#Abspann a, a:visited, a:active {color:#FFF; text-decoration:none;}
#Abspann a:hover {border-bottom:none;}
#Abspann a.ext, a.ext:visited, a.ext:active {color:#FFF; background:url(../img/link_extern_w.png) 3px 3px no-repeat; background-size: 10px; padding-left:17px;} 
#Abspann a.int, a.int:visited, a.int:active {color:#FFF; background:url(../img/link_intern_w.png) 3px 3px no-repeat; background-size: 10px; padding-left:17px;} 
#Abspann td {color:#FFF;}

#Footline {
	text-align:center;
	background-color: #96aa5a;
	background-color: rgb(150,170,90,1);
	margin: 0 auto;
	width:100%;
	height:20px; 
	margin-top:1em;
	position:fixed;
	bottom:0px;
	padding-top:5px;
	padding-bottom: 30px;
	font-size: 1em; 
	color:#FFF;
	z-index:100;
	vertical-align:bottom;
	clear:both;
	font-family:'Source Sans Pro';
}

#Footline a, a:visited, a:active {
	text-align:center;
	text-decoration: none;
	color : #FFF;
	border:none;
	font-weight:normal;
}

#Footline a:hover {
	text-decoration: none;
	font-weight:normal;
}

.responsive-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.responsive-video {
position: relative;
padding-bottom: 56.25%; /* Default for 1600x900 videos 16:9 ratio*/
padding-top: 0px;
height: 0;
overflow: hidden;
}

#Impressum {column-width: 300px; column-count: 2; font-size:0.8em; line-height:normal; clear:both; padding-top:30px;}
#Impressum H2 {font-size:1.3em; line-height:normal; padding-top:0px; margin-top:0px; font-family:'KudosCond';}
#Impressum H3 {font-size:1.2em; line-height:normal; font-family:'KudosCond';}
#Impressum ul li {line-height:normal; padding:0px;}



@media screen and (max-device-width: 400px) {
  body {
	background-color: #AAC864;
	background-image: url(../img/bg_500px.jpg);
	background-position: top center;
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-size: 100% auto;
  }

  H1, H2, H3 {
    font-size: 1.2em;
	hyphens: none;
  }
  
  #Menu a.menu, a.menu:visited, a.menu:active {font-size:0.8em;}
  #Menu a.menu:hover {font-size:0.8em;}
  
  #HGBild {
	transform: skew(0deg, -2deg);
	margin: 0 auto;
	text-align:center;
	width:100%;
	height:180px;
	/*background: url(../img/backgroundimage/rotate.php);*/
	background-position: bottom center;
	background-size: 100%;
	background-repeat:no-repeat;
}

#Logo {
	margin: 0 auto;
	text-align:center;
	width:90%;
	background-size: 95%;
	position:relative; top:6em;
}


#Inhalt a.Button, a.Button:visited, a.Button:active {display:inline-block; width:100%; height:50px; text-align:center;}

img.Pict-rechts, img.Pict, img.rund {
	height:auto;
    float: inherit;
	clear:both;
	text-align:center;
	width:95%;
	margin: 0 auto;
}

#Inhalt div.Flex4er {width:95%; height:auto; margin:0 auto; text-align:center;}
div.Flex4er img {width:95%; transform: skew(0deg, 2deg); margin:0 auto; text-align:center;}

a, a:visited, a:active {
	display: inline-block;
	text-align: left;
	text-decoration: none;
	padding: 0px;
	margin: 0px;
	border:none;
	color: #000;
	font-weight:normal;
}

#Inhalt a::after {
	background:none;}

#Inhalt a:hover {
	text-align: left;
	text-decoration: none;
	border: none;
	color:#FFF;
}

#Inhalt figure {padding-top:0px; margin-top:0px; margin:0 auto; margin-bottom:1em;}
#Inhalt figure img {width: 95%; margin:0 auto;}
#Inhalt figcaption {font-size:0.8em; text-align:center; font-style:italic;}

#Footline {font-size: 0.9em; height:15px; display: inline-block;}
#Footline a {display: inline-block; font-weight:normal;}

#Abspann div a {line-height:1.5em; display:inline-block; font-weight:normal; text-decoration:underline;}

}