@charset "utf-8";
/* CSS Document */

body {
	position: relative;
	padding: 0;
	margin: 0;
	font-family: Verdana, Arial, Helvetica, Geneva, Sans-Serif, sans-serif;
	font-size: 1.2em;
}

p, h1, h2, h3, h4 {
	padding: 0;
	margin: 0;
	margin-bottom: 0.8em;
	margin-top: 0.8em;
}

h1, h2, h3, h4 {
	color: rgba(175,0,0,1.00);
}

h4 {
	color: rgba(100,100,100,1.00);
}

a {
	text-decoration: none;
}

.wrapper {
	display: flex;
	flex-direction: column;
	margin: 0 auto;
	width: 100%;
	padding: 0;
}

.reminder {
	padding: 0.2em 1em;
	margin-bottom: 0.3em;
	background: rgba(200,200,200,1.00);
	color: rgba(54,54,54,1.00);
}

.reminder p {
	padding: 0;
	margin: 0;
}

.reminder a {
	color: rgba(200,30,30,1.00);
	font-weight: bold;
}

.abgrenzung {
	padding-top: 1em;
	margin: 1em 0.5em;
	border-top: thin solid rgba(64,64,64,1.00);
}

header {
	position: relative;
	max-width: 100%;
	height: auto;
}

.bilder {
	position: relative;
}

.bild00 {
	max-width: 100%;
	height: auto;
}

.slides {
	position: absolute;
	top: 0;
	left: 0;
	max-width: 100%;
	height: auto;
}

.rahmen0 {
	position: absolute;
	top: 5em;
	left: 0em;
	padding-left: 0.5em;
	background: rgba(255,255,255,0.49)
}

.rahmen1 {
	position: absolute;
	top: 1em;
	left: 0em;
	padding-left: 0.5em;
	background: rgba(255,255,255,0.7);
	width: 30%;
}

.rahmen2 {
	position: absolute;
	bottom: 1em;
	right: 0em;
	text-align: right;
	padding-top: 0.2em;
	background: rgba(255,255,255,0.7);
	width: 60%;
}

.rahmen2 h1 {
	margin: 0;
	padding-right: 0.5em;
	font-size: 1.6em;
}

.rahmenbild1 {
	max-width: 90%;
}

.rahmenbild2 {
	max-width: 100%;
}

@keyframes ein {
    0% {opacity: 0;}
    5% {opacity: 1;}
    95% {opacity: 1;}
    100% {opacity: 0;}
}

.weiter {
	clear: both;
}

main div {
	text-align: center;
}

.nhz {
	margin: 0.5em;
}

.nhz img {
	max-width: 90%;
	border: thin solid rgba(64,64,64,1.00);
	border-radius: 0.5em;
	padding: 1em;
	background: rgba(231,255,144,0.20);
}

.hauptinhalt {
}

.produkte {
	display: flex;
	flex-flow: row wrap;
	font-size: 90%;
	text-align: center;
}

.produkte a {
	flex: 1 1 10%;
	margin: 0.5em;
	padding: 1em;
	border: thin solid rgba(64,64,64,1.00);
	border-radius: 0.5em;
	vertical-align: bottom;
	color: rgba(0,0,0,1.00);
	background: rgba(231,255,144,0.20);
}

.sonstige .produkte a {
}

.produkte img {
	max-width: 100%;
}

.top-ads {
	text-align: center;
}

.top-ads p {
	margin-bottom: 0.5em;
}

.top-ads img {
	margin: 0.5em;
}

/*--------------------------------------------------*/

footer a {
	color: rgba(120,0,0,1.00);
}

.footerlinkbutton {
	border: 0;
	background: 0;
	padding: 0;
	margin: 0;
	color: rgba(120,0,0,1.00);
}

.infobox {
	display: none;
	position: absolute;
	top: 17em;
	right: 2em;
	z-index: 1500;
	padding: 1em;
	margin-bottom: 1em;
	max-width: 85%;
	border-radius: 0.5em;
	background: rgba(255,227,147,1.00);
	font-size: 90%;
}

.infoxfeld {
	position: fixed;
	top: 18em;
	right: 0.5em;
	text-align: center;
}
	
.infoxfeld button {
	width: 3em;
	height: 3em;
	border: thin solid rgba(255,20,20,1.00);
	border-radius: 50%;
	background: rgba(255,227,147,1.00);
	color: rgba(255,0,0,1.00);
	font-size: 120%;
	font-weight: bold;
	cursor: pointer;
}



#RRVCookiesPopup {
	display: none;
	flex-flow: row nowrap;
	position: fixed;
	top: 5em;
	left: 0;
	max-width: 100%;
	background: rgba(84,84,84,0.90);
	font-size: 0.9em;
	color: rgba(255,255,255,1.00);
	padding: 1em;
	z-index: 1000;
}

#RRVCookiesPopup a {
	color: rgba(255,200,200,1.00);
	text-decoration: underline;
}
	
#pad2 button {
	margin-left: 1em;
	width: 4em;
	height: 4em;
	border: thin solid rgba(0,0,0,1.00);
	border-radius: 0.5em;
	background: rgba(0,147,30,1.00);
	color: rgba(255,255,255,1.00);
	font-size: 120%;
	font-weight: bold;
	cursor: pointer;
	transition: ease-in-out 0.3s;
}

#pad2 button:hover, #pad2 button:active {
	background: rgba(255,91,93,1.00);
}

#nixda {
	width: 0;
	height: 0;
	max-width: 0;
	max-height: 0;
	padding: 0;
	margin: 0;
	border: 0;
	font-size: 0;
}

/* --------------------------------------------------
Breakpoint
----------------------------------------------------*/

@media all and (min-width: 60em) {
	
	.rahmen2 h1 {
		font-size: 180%;
	}
	
	.reminder {
		font-size: 90%;
	}
	
	main {
		max-width: 80%;
		margin: 0 auto;
	}
	
	.infobox {
		top: 13em;
		right: 3em;
		max-width: 85%;
		font-size: 85%;
	}

	.infoxfeld {
		position: fixed;
		top: 14em;
		right: 1.5em;
	}
	
	#RRVCookiesPopup {
		top: 4em;
	}
}