@charset "utf-8";
body{background: #819FF7; font-family: Arial; overflow: auto;}


.top	{text-align: center; height: auto; width: 97%; color: #9acd32; font-size: 40%; padding: 0 .5em 0 .5em;}
.txt	{text-align: center; height: auto; width: 97%; color: #9acd32; font-size: 30%; padding: 0 .5em 0 .5em;}
.fla	{text-align: center; height: auto; width: 97%; color: #9acd32; font-size: 40%; padding: 0 .5em 0 .5em;}

#wrapper	{background: #ffffff; margin: 0 auto; max-width: 100%; width: 98%;
		border: 1px solid #d0d0d0; border-radius: 3px;
		box-shadow: 0 0 10px 0px rgba(15, 3, 25, 0.5);}


header		{max-width: 100%; width: 99.5%; background: #ffffff; 
		list-style: none; margin: 0; padding: 0.1em 0 0 0.2em;}


.bild_beschriftung {position: relative;}
.bild_beschriftung img {display: block;}

.bild_beschriftung span
{ 
	position: absolute; bottom: 20%; left: 10%; width: 46%; color: #000000; font-size: 200%;
	text-align: center; vertical-align: middle; 
 	line-height: 2.5em; border-top: 1px solid #854b0d;
	background-color: rgba(99, 99, 90, 0.6);
}


h1	{background: #f0f0f0; width: 97%; margin: auto; padding: 1em .5em 1em 0; font-size: 1.3em;}
h2	{color: #854b0d; font-size: 1.0em;}
h1, h2 	{font-weight: bold; text-align: center;}


.einer	{width: 98.5%; margin: .5em; padding: .15em; 
	font-size: 90%; font-size-adjust: 0.60; line-height: 140%;} 


.dreier	{width: 32.4%; float: left; margin: .6em .3% .6em .4%; padding: .7em 0 .7em 0;
	font-size: 100%; font-size-adjust: 0.50; line-height: 1.4em; text-align: justify;}


.kasten {

  width: 98.8%;
  height: 100%;

  color: green;
  background-color: lightyellow;
  border:  2px solid red;
  border-radius: 1em;

  margin: .5em .1% .5em .1%; 
  padding: .6em .5em .6em .5em;

  box-sizing: kasten;
  -moz-box-sizing: kasten;
  -webkit-box-sizing: kasten;

}

.kastel { display: block; float: left;

  width: 47.5%;
  height: auto;

  color: red;
  background-color: lightyell9w;
  border:  2px solid red;
  border-radius: 1em;

  margin: .5em .7% .5em .1%; 
  padding: .6em .5em .6em .5em;

  box-sizing: kastel;
  -moz-box-sizing: kastel;
  -webkit-box-sizing: kastel;

}


img	{text-align: center; max-width: 100%; height: auto; width: auto;}




navo ul		{list-style: none; margin: 0 0 3em 0; padding: 0.1em 0 0 0.2em;}
navo ul li	{float: left; width: 19.95%;}

navo ul li a	{background: #819FF7; display: block; padding: .6em 0 .6em 0;
		font-size: 110%; font-weight: bold; font-size-adjust: 0.58; 
		color: #000000; text-decoration: none; text-align: center;}

navo ul li a:hover	{background: #ffee00; color: #000080;}
navo ul li a:active	{background: #ff8000; color: #000080;}

p	{padding: 1em .5em 1em .5em; color: #62615C;}


footer 	{width: 99.4%; overflow: hidden; text-align: center; margin: 0 .2em .3em .2em; padding: 0;}

navu ul		{list-style: none; margin: 0; padding: 0.1em 0 0 0.2em;}
navu ul li	{float: left; width: 19.95%; font-size: 1.3em;}

navu ul li a	{background: #819FF7; display: block; padding: .6em 0 .6em 0;
		font-weight: bold; font-size-adjust: 0.58;
		color: #000000; text-decoration: none; text-align: center;}

navu ul li a:hover	{background: #ffee00; color: #000080;}
navu ul li a:active	{background: #ff8000; color: #000080;}

i		{color: #ff0000;}

 

/* = Handy Breit *//* = Handy Breit *//* = Handy Breit */
/* = Handy Breit *//* = Handy Breit *//* = Handy Breit */

@media screen and (max-width: 1600px){
	header{width: auto;}

.top	{font-size: .8em; font-size-adjust: 0.40; line-height: 1em;}
.txt	{font-size: .8em; font-size-adjust: 0.60; line-height: 1em;}

.bild_beschriftung span 
{
	color: #00ff00; bottom: 21%; line-height: 2.3em; font-size: 170%;
}
	#banner{display:none;}
#ohne-formular{display:none;}

navo		{width: auto;}
navo ul		{margin: .2em; padding: 0;}
navo ul li	{width: 20%; font-size: 86%;}


.dreier		{width: 33,8%; margin: .6em .2% .6em .4%; padding: .7em 0 .7em 0;
		font-size: 80%; font-size-adjust: 0.60; line-height: 140%;} 

.kasten {justify-content: center; max-width: calc (49% - 4px); width: 93%; margin: .5em 1% .5em 1%;}



navu		{width: auto;}
navu ul		{list-style: none; margin: 0; padding: 0;}
navu ul li	{width: 20%; font-size: 96%;}

footer 		{font-size: 90%}
}




/* = Handy HOCH *//* = Handy HOCH *//* = Handy HOCH */
/* = Handy HOCH *//* = Handy HOCH *//* = Handy HOCH */

@media (max-width: 680px) {header{width: 98%;}

.top	{font-size: .5em; font-size-adjust: 0.40; line-height: 1em;}
.txt	{font-size: .6em; font-size-adjust: 0.60; line-height: 1em;}
.li	{font-size: 80%;}

.bild_beschriftung span {bottom: 24%; line-height: 1.9em; font-size: 80%; color: #ffff00;}

h1, h2 	{font-weight: bold; text-align: center;}

	navo 		{margin: .4em 0 0 .2em;}
	navo ul		{font-size: 130%; margin: 0; padding: 0;}
	navo ul li	{width: 99%; padding: .2em 0 .1em 0;}
	navo ul li a 	{padding: .6em;}

	

p	{padding: .3em .5em .3em .5em; color: #62615C; font-size: .8em;}


.ul, li		{font-size: 70%;}


.dreier	{width: 98%; padding: 0; font-size: 1em; font-size-adjust: 0.60; line-height: 1.1em; text-align: justify;}


.kasten {justify-content: center; max-width: calc (50% - 4px); margin: .5em 1% .5em 1%;}

	navu 		{margin: 2em 0 15em 0; padding: 0 0 1em 0;}
	navu ul		{font-size: 130%;}
	navu ul li	{width: 98.5%; margin-left: .1em; padding: .2em 0 .1em 0;}


footer 	{margin-top: 1em; padding: 0; font-size: 60%}
}