/* ##################################################################### */
/* #### Fonts ########################################################## */

	/* noto-sans-regular - latin */
	@font-face {
		font-family: 'Noto Sans';
		font-style: normal;
		font-weight: 400;
		src: url('../Fonts/noto-sans-v27-latin-regular.eot'); /* IE9 Compat Modes */
		src: local(''),
		 	url('../Fonts/noto-sans-v27-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 	url('../Fonts/noto-sans-v27-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
		 	url('../Fonts/noto-sans-v27-latin-regular.woff') format('woff'), /* Modern Browsers */
		 	url('../Fonts/noto-sans-v27-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
		 	url('../Fonts/noto-sans-v27-latin-regular.svg#NotoSans') format('svg'); /* Legacy iOS */
  	}
  	/* noto-sans-italic - latin */
  	@font-face {
		font-family: 'Noto Sans';
		font-style: italic;
		font-weight: 400;
		src: url('../Fonts/noto-sans-v27-latin-italic.eot'); /* IE9 Compat Modes */
		src: local(''),
		 	url('../Fonts/noto-sans-v27-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 	url('../Fonts/noto-sans-v27-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
		 	url('../Fonts/noto-sans-v27-latin-italic.woff') format('woff'), /* Modern Browsers */
		 	url('../Fonts/noto-sans-v27-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
		 	url('../Fonts/noto-sans-v27-latin-italic.svg#NotoSans') format('svg'); /* Legacy iOS */
  	}
  	/* noto-sans-700 - latin */
  	@font-face {
		font-family: 'Noto Sans';
		font-style: normal;
		font-weight: 700;
		src: url('../Fonts/noto-sans-v27-latin-700.eot'); /* IE9 Compat Modes */
		src: local(''),
		 	url('../Fonts/noto-sans-v27-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 	url('../Fonts/noto-sans-v27-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
		 	url('../Fonts/noto-sans-v27-latin-700.woff') format('woff'), /* Modern Browsers */
		 	url('../Fonts/noto-sans-v27-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
		 	url('../Fonts/noto-sans-v27-latin-700.svg#NotoSans') format('svg'); /* Legacy iOS */
  	}
  	/* noto-sans-700italic - latin */
  	@font-face {
		font-family: 'Noto Sans';
		font-style: italic;
		font-weight: 700;
		src: url('../Fonts/noto-sans-v27-latin-700italic.eot'); /* IE9 Compat Modes */
		src: local(''),
		 	url('../Fonts/noto-sans-v27-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 	url('../Fonts/noto-sans-v27-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
		 	url('../Fonts/noto-sans-v27-latin-700italic.woff') format('woff'), /* Modern Browsers */
		 	url('../Fonts/noto-sans-v27-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
		 	url('../Fonts/noto-sans-v27-latin-700italic.svg#NotoSans') format('svg'); /* Legacy iOS */
  	}


/* ##################################################################### */
/* #### HTML5 display definitions ###################################### */

	article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display:block; }



/* ############################################################ */
/* #### Allgemeine Formatierungen (Schriften, Listen,... ) #### */

	*,
	*::before,
	*::after{ box-sizing:border-box; }

	html{ overflow-y:scroll; /* Scrollbar */ }

	html, body, table, th, td, div, li{
		font-size:12px;
		line-height:1.4em;
	}

	h1{
		font-weight:bold;
		font-size:12px;
		line-height:1.4em;
		margin: 0 0 1em 0;
	}
	h2{
		font-weight:normal;
		font-size:12px;
		line-height:1.4em;
		margin: 0 0 1em 0;
	}

	p{ margin: 0 0 1em 0; }

	b, strong{ font-weight:bold; }

	a{
		outline:0;
		color:#000000;
	}

	img{ border:none; max-width:100%; height:auto; }

	figcaption{
		padding-top:5px;
		font-size:12px;
		line-height:1.4em;
	}

	.align-right{ text-align:right; }
	.align-center{ text-align:center; }

	div.clearer{ clear:both; }

	/* Contain floats: h5bp.com/q */
	.clearfix:before, .clearfix:after{ content:""; display:table; }
	.clearfix:after{ clear:both; }


/* ##################################################################### */
/* #### Slider ######################################################### */

	.frame-type-r2_slider{ display:flex; justify-content:flex-end; }
	/*div.gallery{ background-color:#efefef; } */
		div.gallerynav{ position:relative; height:25px; }
			div.gallerynav .prev{ position:absolute; top:0; right:66px; }
			div.gallerynav .next{ position:absolute; top:0; right:0 }
		img.galleryimg{
			width:auto; height:auto; max-width:100%; max-height:60vh;
			margin-bottom:17px;
		}


/* ##################################################################### */
/* #### Inhaltselement r2_tiles (Kacheln) ############################## */

	ul.tiles{
		margin:0; padding:0; list-style:none;
		display:grid; grid-template-columns:repeat(3, 1fr); grid-gap:30px;
	}
		ul.tiles li{ margin:0; padding:0; }
			ul.tiles a{ text-decoration:none; }
			ul.tiles figure{ margin:0; }
			ul.tiles figcaption{ padding:10px 3px 10px 15px; }

@media screen and (max-width:984px){
	ul.tiles{ grid-template-columns:repeat(2, 1fr); }
}
@media screen and (max-width:400px){
	ul.tiles{ grid-template-columns:repeat(1, 1fr); }
}


/* ##################################################################### */
/* #### Inhaltselement r2_sticker ###################################### */

	.frame-type-r2_sticker{
		width:228px; margin:30px auto 0; padding:0; background:none;
	}
	div#content.content-home .frame.frame-type-r2_sticker{ margin-top:30px; }
		.frame-type-r2_sticker .sticker{
			position:relative; display:grid; place-items:center;
			width:228px; height:228px;
			text-decoration:none; color:#6c6d6f;
			transform:rotate(-10deg);
		}
		.frame-type-r2_sticker .sticker:focus-visible{ outline:2px solid #8a8b8d; outline-offset:10px; }
			.frame-type-r2_sticker .sticker__disc{
				position:absolute; inset:0; width:100%; height:100%;
				object-fit:contain; pointer-events:none; z-index:0;
			}
			.frame-type-r2_sticker .sticker > span{
				position:relative; z-index:1;
				display:flex; flex-direction:column; align-items:center; justify-content:center;
				width:78%; padding:4px; text-align:center;
			}
			.frame-type-r2_sticker .sticker > span span:nth-child(1){
				margin-bottom:7px;
				font-size:12px; letter-spacing:0.04em;
			}
			.frame-type-r2_sticker .sticker > span span:nth-child(2){
				font-size:14.5px; font-weight:500; letter-spacing:-0.015em; line-height:1.28; color:#3a3b3d;
			}
			.frame-type-r2_sticker .sticker > span span:nth-child(3){
				margin-top:8px; max-width:12.2em;
				font-size:12.5px; line-height:1.38; color:#5a5b5d;
			}

@media screen and (min-width:985px){
	.frame-type-r2_sticker{ margin-top:0; margin-left:auto; margin-right:0; transform:translateX(50%); }
	div#content.content-home .frame.frame-type-r2_sticker{ margin-top:0; }
}
@media screen and (max-width:720px){
	.frame-type-r2_sticker,
	.frame-type-r2_sticker .sticker{ width:196px; height:196px; }
	.frame-type-r2_sticker .sticker > span span:nth-child(2){ font-size:13px; }
	.frame-type-r2_sticker .sticker > span span:nth-child(3){ font-size:11.5px; }
}



/* ############################################################ */
/* #### allg. Raster / Seitenaufteilung ####################### */

	html, body{
		margin:0;
		padding:0;
		height:100%;
		color:#6c6d6f;
		background-color:#ffffff;
		text-align:center;
		font-family: 'Noto Sans', arial, verdana, helvetica, lucida, sans-serif;	
	}

	
	div#website{
		position:relative; margin: 0 auto; padding: 20px 0 30px 0; width:985px; text-align: left; background-color:#ffffff;
		min-height:100%; display:flex; flex-direction:column;
	}
		div#header{ position:relative; height:170px; margin: 0 15px 0 15px; padding-top:40px; }
			img#signet{ position:absolute; top:17px; right:0; }
			
			div#navigation ul{
				margin:0; padding:0; list-style:none;
				display:flex; flex-wrap:wrap; align-items:flex-start; gap:40px;
			}
			div#navigation ul ul{ position:absolute; left:0; top:72px; }
			div#navigation ul ul ul{ top:32px; }
				div#navigation ul li{ margin:0; padding:0; font-size:13px; line-height:16px; }
					div#navigation a{ display:inline-block; height:16px; text-decoration:none; color:#b9b9b9; padding: 0; }
					div#navigation a:hover, div#navigation a.act{ color:#6c6d6f; }
					div#navigation a.act{ font-weight:bold; background-color:#ffffff; }
					div#navigation ul ul a,
					div#navigation ul ul a:hover,
					div#navigation ul ul a.act{ background-image:none; }
		
		div#content{ margin: 0 15px 0 15px; flex:1 0 auto; }
		div#content.content-home{ display:flex; justify-content:center; align-items:center; text-align:center; }
			div#content.content-home .frame{ margin-top:50px; color:red; }

			.col1{ overflow:hidden; float:left;  width:500px; padding-top:25px; }
			.col2{ overflow:hidden; float:right; width:430px; }
			.col3{ overflow:hidden; float:left;  width:430px; clear:left; }
			.col4{ overflow:hidden; float:right; width:500px; clear:right; }

		div#footer{ padding:50px 15px 0 0; text-align:right; }
			ul#metaNav{ margin:0; padding:0; list-style:none; }
				#metaNav li{ display:inline; margin:0 0 0 15px; padding:0; }
				#metaNav li:first-child{ margin-left:0; }
					#metaNav a{ text-decoration:none; color:#6c6d6f; }
					#metaNav a.cur, #metaNav a:hover{ text-decoration:underline; }

	@media (max-width:984px){
		div#website{ width:655px; }
			/*div#header{ }*/
				div#navigation ul{ width:auto; }
				div#navigation > ul{ display:block; gap:0; }
				div#navigation > ul > li{ margin-bottom:5px; }
				div#navigation ul ul{ position:static; padding:5px 0 0 10px; }
			/*div#content{ }*/
				.col1,.col2,.col3,.col4{ width:300px; }
	}
	@media (max-width:654px){
		div#website{ width:auto; }
			div#header{ height:auto; padding-top:17px; }
				img#signet{ position:static; display:block; margin:0 auto; }
				div#navigation{ margin:20px 0 20px 0; }
			/*div#content{ }*/
				.col1,.col2,.col3,.col4{ width:auto; float:none; }
	}