/* fonts laden */
@font-face { font-family: HansHand; src: url('hanshand.ttf'); }
@font-face { font-family: Lato; src: url('Lato-Regular.ttf'); }
@font-face { font-family: ArialNarrow; src: url('Arial Narrow Regular.ttf'); }

/* +++++++++++++++++++++++++++++++++++++++++++ */
/*  NAVIGATION                                 */
/* +++++++++++++++++++++++++++++++++++++++++++ */

a
{
	font-size: 16px;
 	font-family: 'Lato', sans-serif;
	/*font-family: ArialNarrow;*/ 
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	/*letter-spacing: 1px;*/
	
}

/* class hauptnavigation */
a.hauptlink1:link, a.hauptlink1:visited 
{ color: #000000; border-radius: 2px; border: 2px solid white; background-color: #E9E767; padding: 4px; }
a.hauptlink1:focus, a.hauptlink1:hover 
{ color: #1D6300; border: 2px solid #1D6300; }

/* class mobile navigation */
a.hauptlinkMob:link, a.hauptlinkMob:visited 
{ background-color: #E9E767; color: #000000; border: 2px solid white; padding: 5px; margin-top: 2px; margin-right: 2px; }
a.hauptlinkMob:focus, a.hauptlinkMob:hover 
{ background-color: #E9E767;  color: #1D6300; border: 2px solid #1D6300; }

/* class im Text Navigation */
a.hauptlink2:link, a.hauptlink2:visited { color: #1D6300; font-size: 16px; border: none; padding-bottom: 5px; }
a.hauptlink2:focus, a.hauptlink2:hover { color: black; font-size: 16px; border: none; padding-bottom: 5px; }

/* +++++++++++++++++++++++++++++++++++++++++++ */
/*  DIVERSE                                    */
/* +++++++++++++++++++++++++++++++++++++++++++ */ 

/* Bilder automatisch skalieren (nur img-tag) */
img { max-width: 100% !important; height: auto; display: block; }
.center { display: flex; justify-content: center; }
.rahmenDiv
{
 	width: auto; color: #000000; background-color: #F6F6B3; 
	border-radius: 10px; padding: 10px;
}

/* +++++++++++++++++++++++++++++++++++++++++++ */
/*  TEXT                                       */
/* +++++++++++++++++++++++++++++++++++++++++++ */

/* Text-Formatierungen mit automatischer Silbentrennung (hyphens) */
#textFeld
{
	font-family: 'Lato', sans-serif; font-size: 16px; color: #000000;
	-moz-hyphens: auto; -o-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; 
	 padding-left: 10px; padding-right: 10px; text-align: justify;
}
/* sonstige Text-Formatierungen */
#textHH24 { font-family: 'HansHand', sans-serif; font-size: 24px; color: #000000; letter-spacing: 1px; }
#textHH24C { font-family: 'HansHand', sans-serif; font-size: 24px; color: #000000; letter-spacing: 1px; text-align: center; }
#textHH18 { font-family: 'HansHand', sans-serif; font-size: 18px; color: #000000; letter-spacing: 1px; } 
#text16 {	font-family: 'Lato', sans-serif;	font-size: 16px; color: #000000; }
#text14 {	font-family: 'Lato', sans-serif;	font-size: 14px; color: #000000; }
#textTitel { font-family: 'Lato', sans-serif;	font-size: 24px; color: #000000;}

/* +++++++++++++++++++++++++++++++++++++++++++ */
/*  Größen ANPASSUNG                           */
/* +++++++++++++++++++++++++++++++++++++++++++ */

#inhAbst { background-color: #ffffff; }
#inhCol1 { float: left; width: 100%; max-width: 335px; }
#inhCol2 { overflow: hidden; text-align: center; margin-top: 10px; } 
#logo { max-width: 200px; }
#textHead { font-family: 'HansHand', sans-serif; font-size: 36px; color: #000000; letter-spacing: 1px; line-height: 46px; max-width: 400px; padding-top: 10px; }
#textSlogan { font-family: 'HansHand', sans-serif; font-size: 16px; color: #000000; letter-spacing: 1px; line-height: 26px; max-width: 400px; padding-top: 10px; } 
#textHH18C { font-family: 'HansHand', sans-serif; font-size: 18px; color: #000000; letter-spacing: 1px; text-align: center; }
.r1-3A { padding-top: 20px; padding-right: 15px; }
.r1-3B { padding-top: 15px; padding-left: 15px; }
.r1-3C { padding-top: 45px; }
.r2-3A { padding-top: 50px; margin-top: 25px; }
.r2-3C { padding-top: 50px; margin-top: 15px; }
.r3-3A { padding-top: 15px; padding-right: 15px; }
.r3-3C { padding-top: 10px; padding-left: 15px; }
.f-r1-text { margin-top: 0px; margin-bottom: 0px; }
.f-r2-text { text-align: center; max-width: auto; padding-top: 30px; }
.f-r3-text { text-align: center; max-width: auto; padding-top: 20px; }

@media screen and (max-width: 980px)
{ 
	#inhAbst { margin-left: 10px; margin-right: 10px; }
	#inhCol1 { clear: both; max-width: 980px; margin-bottom: 20px; }
	#inhCol2 { width: 100%; }
	#logo { max-width: 980px; }
	#textHead { max-width: 980px; }
	#textSlogan { max-width: 980px; }
	#textHH18C { padding-top: 0px; }
	.r1-3A { padding-top: 0px; }
	.r1-3B { padding-top: 0px; } 
	.r1-3C { padding-top: 0px; }
	.r2-3A { padding-top: 0px; margin-top: 0px; }
	.r2-3C { padding-top: 0px; margin-top: 0px;}
	.r3-3A { padding-top: 0px; }
	.r3-3C { padding-top: 0px; }
	.f-r1-text { margin-top: 20px; margin-bottom: 10px; }
	.f-r2-text { padding-top: 0px; margin-top: 20px; margin-bottom: 10px; }
	.f-r3-text { padding-top: 0px; margin-top: 20px; margin-bottom: 10px; }  
}
