* { margin:0; padding:0; }


@font-face {
    font-family: 'noto_serifbold';
    src: url('fonts/Noto_Serif/notoserif-bold-webfont.eot');
    src: url('fonts/Noto_Serif/notoserif-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Noto_Serif/notoserif-bold-webfont.woff2') format('woff2'),
         url('fonts/Noto_Serif/notoserif-bold-webfont.woff') format('woff'),
         url('fonts/Noto_Serif/notoserif-bold-webfont.ttf') format('truetype'),
         url('fonts/Noto_Serif/notoserif-bold-webfont.svg#noto_serifbold') format('svg');
    font-weight: bold;
    font-style: normal;

}




@font-face {
    font-family: 'noto_serifbold_italic';
    src: url('fonts/Noto_Serif/notoserif-bolditalic-webfont.eot');
    src: url('fonts/Noto_Serif/notoserif-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Noto_Serif/notoserif-bolditalic-webfont.woff2') format('woff2'),
         url('fonts/Noto_Serif/notoserif-bolditalic-webfont.woff') format('woff'),
         url('fonts/Noto_Serif/notoserif-bolditalic-webfont.ttf') format('truetype'),
         url('fonts/Noto_Serif/notoserif-bolditalic-webfont.svg#noto_serifbold_italic') format('svg');
    font-weight: bold;
    font-style: italic;

}




@font-face {
    font-family: 'noto_serifitalic';
    src: url('fonts/Noto_Serif/notoserif-italic-webfont.eot');
    src: url('fonts/Noto_Serif/notoserif-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Noto_Serif/notoserif-italic-webfont.woff2') format('woff2'),
         url('fonts/Noto_Serif/notoserif-italic-webfont.woff') format('woff'),
         url('fonts/Noto_Serif/notoserif-italic-webfont.ttf') format('truetype'),
         url('fonts/Noto_Serif/notoserif-italic-webfont.svg#noto_serifitalic') format('svg');
    font-weight: normal;
    font-style: italic;

}




@font-face {
    font-family: 'noto_serifregular';
    src: url('fonts/Noto_Serif/notoserif-regular-webfont.eot');
    src: url('fonts/Noto_Serif/notoserif-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Noto_Serif/notoserif-regular-webfont.woff2') format('woff2'),
         url('fonts/Noto_Serif/notoserif-regular-webfont.woff') format('woff'),
         url('fonts/Noto_Serif/notoserif-regular-webfont.ttf') format('truetype'),
         url('fonts/Noto_Serif/notoserif-regular-webfont.svg#noto_serifregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


html, body { color: #484848; font-family: "noto_serifregular", serif; height: 100%; font-weight: normal; background-color: #e2001a; }
/* html { background-size: 100%; } */
.main {height: 100%; }
p { font-size: 0.9em; hyphens: auto; font-weight: normal; line-height: 1.45em; text-align: left; letter-spacing: 0; column-count: 1; column-width: 200px; column-gap: 30px; column-rule: 0px solid red; word-wrap: break-word; }
.impressum { font-size: 1em; }

strong, b { font-family: 'noto_serifbold', serif; font-weight: bold;}
i, em { font-family: 'noto_serifitalic', serif; font-weight: italic; }

hr { border: 0.01em solid #7e0000; }

td {}

#menudivwrapper { width: 100%; margin-bottom: 0; padding-right: 8%; padding-left: 8%; border-bottom: 1px solid #7e0000; }
#menudiv { text-align: center; width: 685px; height: 50px; }

#datenschutz { margin: -10px 0 35px 0; font-family: "noto_serifregular", serif; color: #fff; }
#datenschutz a:link { text-decoration: none; color: #fff; }
#datenschutz a:visited { text-decoration: none; color: #fff; }

.datenschutzliste ul { font-size: 0.9em; list-style-type: square; margin:0; padding: 0 0 0 1em; position: relative; }
.datenschutzliste ul li { display: list-item; float: inherit; }



/* SPOILER ANFANG */

.akkordeon:not(:target) .inhalt,
.akkordeon:not(:target) .hide,
.akkordeon:target .show {display: none; }
.akkordeon:target .inhalt {display: block;}
.akkordeon { margin-bottom: 0px; }

.inhalt {
/* box-shadow: inset 0px 0px 10px rgba(0,0,0,0.7); */
padding: 0;
margin: 0;

}

.inhalt p { font-size: 0.8em; }
.show,

.hide {

padding: 0px;
background: none;
/* box-shadow:none!important; */
color:#000;
font-weight: normal;
font-size: 1.05em;
text-decoration: none;
/*text-transform: uppercase; */
font-weight: bold;
/* text-shadow: 2px 2px 5px black; */
/* background-color: #8CC63F; */
}
.show:hover,
.hide:hover {

background: none;
color:#000!important;
transition:0.2s all ease-in-out!important;
/* background-color: #008CBA; */
}

/* SPOILER ENDE */




#Bildbox{
width:99%;
}

.bilder { width: 49.25%; }

.anpassen{
width:100%;
height:100%;
}

strong { color: #7e0000 !important; }

#container { width: 100%; margin:0 auto; }

#header { width:100%; margin-bottom: 3%; margin-top: 3%; }
.linksoben { text-align: left; position: absolute; top: 0; left: 2%; width: 15%; }
.logo { width: 40%; }
.partner { padding-top: 15px; }

 
/* #content { background-color: white; float:left; width:60%; min-height: 200px; margin-bottom: 2%; padding: 2% 2% 2%; font-size: 1.05em; } */
h1 { color: #7e0000; font-size: 1.45em; }
strong.h1 { color: #fff !important; }
h2 { color: #009ee0; font-size: 1.15em; }
h3 { color: #009ee0; font-size: 1.25em; font-weight: normal; }
#pdf { max-width: 350px; background-image: url(pics/pdf.png); background-repeat: no-repeat; background-position: left center; min-height: 90px; padding-top: auto; padding-bottom: 0; padding-left: 110px; margin-bottom: 20px; margin-top: 20px;}
#jpg { max-width: 350px; background-image: url(pics/jpg.png); background-repeat: no-repeat; background-position: left center; min-height: 90px; padding-top: auto; padding-bottom: 0; padding-left: 110px; margin-bottom: 20px; margin-top: 20px;}
#yt { max-width: 350px; background-image: url(pics/yt.png); background-repeat: no-repeat; background-position: left center; min-height: 90px; padding-top: auto; padding-bottom: 0; padding-left: 110px; margin-bottom: 20px; margin-top: 20px;}
#weblink { max-width: 350px; background-image: url(pics/weblink.png); background-repeat: no-repeat; background-position: left center; min-height: 90px; padding-top: auto; padding-bottom: 0; padding-left: 110px; margin-bottom: 20px; margin-top: 20px;}
#flexcont {
	
   display: -webkit-flex;
   display: -ms-flex;
   display: flex;
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
    -webkit-box-align: center;
    /* -webkit-align-items: center; */
     -ms-flex-align: center;
    /* align-items: center; */
     -webkit-box-pack: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     justify-content: center;
     margin-bottom: 40px;
}


.panel-1 {
  
  /* display: -webkit-flex; 
  display: -ms-flexbox; 
  display: flex; */
  border-radius: 0px; background-color: #fff; background-image: url(pics/bg_text.png); width: 45%; padding: 30px; float: left; margin: 5px; }

.panel-1 a:link { color: #009ee0 !important; font-weight: bold; text-decoration: none; }
.panel-1 a:visited { color: #009ee0; text-decoration: none; }
.panel-1 a:hover { color: #009ee0 }
.panel-1 a:active { color: #009ee0 }


.panel-2 {
  
  /* display: -webkit-flex; 
  display: -ms-flexbox; 
  display: flex; */
  border-radius: 0px; color: #fff; background-color: #7e0000; width: 25%; padding: 30px; float: left; margin: 5px; 
 
}

.panel-2 li { width: 100%; padding-right: 2%; border: none; }
.panel-2 li a { font-family: 'noto_serifregular', serif; font-weight: normal; font-size: 0.9em; height: 35px; text-align: left; line-height: 33px; background-color: #323232; background-size: 100% 100%; background-repeat: no-repeat; background-position: left center; width: 94%; margin-bottom: 10px; padding-right: 0; border-left: 3px solid #646464; padding-left: 5%; border-top-color: #fff; border-top-width: 0; border-right-color: #fff; border-right-width: 0; border-bottom-color: #fff; border-bottom-width: 0; }
.panel-2 li:hover a { background-color: #555; background-size: 100% 100%; background-repeat: no-repeat; background-position: left center; ´ }
.panel-2 h1 {color: #fff; }


/*Strip the ul of padding and list styling*/
ul { font-size: 15px; list-style-type:none; margin:0; padding:0; position: absolute; }

/*Create a horizontal list with spacing*/
li {
	display:inline-block;
	float: left;
	margin-right: 1px;
}

/*Style for menu links*/
li a { display:block; min-width:170px; height: 50px; text-align: center; line-height: 50px; color: #000; font-family: sans-serif; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; text-decoration: none; text-transform: uppercase; letter-spacing: 1px; }

/*Hover state for top level links*/
li:hover a { color: #fff; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; }

li:visited a { color: #fff; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; }


/*Style for dropdown links*/
li:hover ul a { background: #7e0000; color: #fff; height: 50px; line-height: 46px; text-align: center; min-width: 130px; }

/*Hover state for dropdown links*/
li:hover ul a:hover {
	background: #000;
	color: #fff;
}

/*Hide dropdown links until they are needed*/
li ul {
	display: none;
}

/*Make dropdown links vertical*/
li ul li {
	display: block;
	float: none;
}

/*Prevent text wrapping*/
li ul li a {
	width: auto;
	min-width: 80px;
	padding: 0 20px;
}

/*Display the dropdown on hover*/
ul li a:hover + .hidden, .hidden:hover {
	display: block;
}



/*Style 'show menu' label button and hide it by default*/
.show-menu { text-decoration: none; line-height: 1.35em; color: #000; font-size: 2.5em; font-family: sans-serif; font-stretch: 500%; text-align: center; display: none; }
.show-menu:hover { color: #fff; } 
/*Hide checkbox*/
input[type=checkbox]{
    display: none;
}

/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #menu{
    display: block;
}
 

/*    Ab nur noch 900 px Breite    */
@media screen and (max-width: 900px){

	p { font-size: 1.05em; }
	li a { display:block; min-width:140px; height: 50px; text-align: center; line-height: 46px; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; text-decoration: none; }
	.logo {width: 60%; }
	#container { width: 100%; margin: 0px; }
	.panel-1 { width: 50%; }
	.panel-2 { width: 25%; }
	#menudivwrapper { width: 100%; margin-bottom: 20px; padding-right: 0px; padding-left: 0%; }
	#menudiv { text-align: center; width: 550px; height: 50px; margin-bottom: 1px; }

	

/*    Ab nur noch 680 px Breite    */
@media screen and (max-width: 680px){
	
	p { font-size: 1.05em; }
	#header { text-align: center; width: 100%; padding-top: 0; }
	
	.logo {width: 80%; }
	#container { width: 100%; margin: 0px; }
	.bilder { width: 100%; }
	.panel-1 { width: 80%; }
	.panel-2 { width: 80%; margin: 1pt; padding: 20px; background-color: #7e0000; }
	#menudivwrapper { width: 100%; margin-bottom: 0px; padding-right: 0%; padding-left: 0%; }
	#menudiv { text-align: center; width: auto; height: 50px; margin-bottom: 1px; }
	
	.datenschutzliste ul { display: block; font-size:1.05em; list-style-type: square; margin:0; padding: 0 0 0 1em; position: relative; }
	.datenschutzliste ul li { display: list-item; float: inherit; }
	
	
	ul {
		position: static;
		display: none;
	}
	/*Create vertical spacing*/
	li {
		margin-bottom: 1px;
	}
	/*Make all menu links full width*/
	ul li, li a {
		width: 100%;
		
	}
	
	li:hover ul a { background: none; color: #000000; }
	
	li:hover ul a:hover {
	background: #7e0000;
	color: #fff;
}
	/*Display 'show menu' link*/
	.show-menu {
		display:block;
	}
	
}


