@import url('https://fonts.googleapis.com/css2?family=Blinker:wght@100;200;300;400;600;700;800;900&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Roboto:wght@100;300;400;500;700;900&display=swap');

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

html {
	height: 100%;
	font-size: 100%;
}

h1 {
	font: 800 max(4rem, 5.6vw)/1.2 "Blinker", sans-serif;
	text-align: center;
	color: rgb(24, 24, 24);
	margin: 0;
}

h2 {
	font: 500 max(1.5rem, 1.5vw)/1.1 "Roboto", sans-serif;
	text-align: left;
	color: rgb(55, 54, 54);
	margin: 0 0 .5vw 0;
	width: 100%;
}

h3 {
	font: 800 max(1.5rem, 2vw)/1.1 "Blinker", sans-serif;
	text-align: left;
	color: rgb(55, 54, 54);
	margin: 0;
}

h4 {
	font: 800 max(1.5rem, 1.4vw)/1.1 "Open Sans", sans-serif;
	text-align: left;
	margin: 0;
}

h6 {
	font: 800 max(1rem, .7vw)/1.2 "Open Sans", sans-serif;
	text-align: left;
	color: rgb(65, 64, 64);
	margin: 0;
}

.br {
	height: 0;
	width: 98%;
}

p {
	color: black;
	font: 300 max(1rem, 1vw)/1.3 "Roboto", sans-serif;
	margin: 0;
	text-align: left;

	a:hover {
		color: rgb(244, 8, 244);
	}

}

a:link {
	color: black;
	text-decoration: none;
}

a:hover {
	color: rgb(241, 59, 3);
}

a:active {
	color: red;
}

a:visited {
	color: black;
}

img {
	width: 100%;
	height: auto;
	/* Verhindert zusätzlichen Abstand unter dem Bild */
	display: block;
}

figure {
	border: 1px solid hidden;
	border-radius: 8px;
	background: lightgoldenrodyellow;
	box-shadow: rgba(0, 0, 0, 0.148) 0px 1px 2px 0px;
	margin: 0;
	overflow: hidden;

	figcaption {

		p {
			font: 300 max(.9rem, .5vw)/1.3 "Roboto", sans-serif;
		}
	}

	&.card01 {
		figcaption {
			padding: .25rem .75rem .5rem .75rem;
		}

		&.max1280 {
			max-width: 1280px;
		}

		&.max800 {
			max-width: 800px;
		}

		&.max720 {
			max-width: 720px;
		}

		&.max640 {
			max-width: 640px;
		}

		&.max450 {
			max-width: 450px;
		}
	}
}

body {
	background: white;
	border: 0;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	height: 100%;
	max-width: 3840px;
	display: grid;
	grid-template-rows: 1fr auto;
	grid-template-columns: 1fr;
	justify-content: center;
	align-items: start;

	/*fix Header-Bereich:*/
	header {
		position: fixed;
		display: grid;
		grid-template-columns: auto 1fr;
		align-items: center;
		z-index: 50;
		top: 0;
		width: 100%;
		background: transparent;
		transition: background-color .3s ease, height .4s ease-out;
		height: 6vw;
		min-height: 4rem;

		div {
			grid-column: 1;
			width: 12.5vw;
			min-width: 10rem;
			height: 4.2vw;
			min-height: 3rem;
			margin: 1vw 0 0 1vw;
			background: url(../img/logo.png) no-repeat center center / contain;
			transition: background-image .2s ease-in-out;
		}

		div:hover {
			background: url(../img/logo_hover.png) no-repeat center center / contain;
			cursor: pointer;
		}

		nav {
			grid-column: 2;
			display: grid;
			grid-template-columns: repeat(5, auto);
			justify-content: right;
			padding: 0 1% 2% 0;

			a,
			a:after,
			a:before {
				font: 700 max(.85rem, .75vw)/1.3 "Open Sans", sans-serif;
				display: block;
				padding: .8rem 1rem;
				text-decoration: none;
				margin: 0 10px;
				transition: all .2s;
			}

			a {
				position: relative;
				z-index: 1;
				color: yellow !important;
			}

			a:hover {
				color: white;
				text-decoration: none;
			}

			a:after {
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				bottom: 0;
				right: 0;
				margin: auto;
				width: 100%;
				height: 1px;
				content: '.';
				color: transparent;
				background: #f89605;
				visibility: none;
				opacity: 0;
				z-index: -1;
			}

			a:hover:after {
				opacity: 1;
				visibility: visible;
				height: 70%;
				border: 1px solid hidden;
				border-radius: 7px;
			}

			a.active {
				color: darkred;
				cursor: default;
				pointer-events: none;
			}

			/* evtl unnötig
			a.active:hover {
				color: red;
				text-decoration: none;
			}

			a.active:after {
				display: none;
			} */
		}

		@media (width <=1280px) {
			grid-template-columns: 1fr auto;
			height: auto;
			min-height: auto;

			div {
				display: none;
			}

			nav {
				grid-template-columns: auto;
				grid-template-rows: repeat(6, auto);
				justify-content: right;
				padding: 1% 1% 0 0;

				a,
				a:after,
				a:before {
					font: 600 max(.75rem, .9vw)/1 "Open Sans", sans-serif;
					text-shadow: 1px 1px 3px rgb(88, 88, 88);
					padding: .7rem .5rem;
					margin: 0;
					text-align: right;
				}

				a:hover {
					color: black;
					text-shadow: none;
				}

				a:after {
					display: block;
					position: absolute;
					top: 0;
					left: 0;
					bottom: 0;
					right: 0;
					margin: auto;
					width: 100%;
					height: 1px;
					content: '.';
					color: transparent;
					background: rgb(129, 248, 56);
					visibility: none;
					opacity: 0;
					z-index: -1;
				}

				a.active {
					color: magenta;
				}
			}
		}

		@media (width <=1280px) and (orientation: landscape) {
			grid-template-columns: auto 1fr;
			height: 6vw;
			min-height: 4rem;

			div {
				display: grid;
				margin: 1vw 0 0 0;
			}

			nav {
				grid-template-columns: repeat(6, auto);
				grid-template-rows: auto;
				padding: 0 1% 2% 0;

				a,
				a:after,
				a:before {
					font: 700 max(.75rem, .75vw)/1.3 "Open Sans", sans-serif;
					padding: .7vw .7vw;
					color: yellow;
					margin: 0 10px;
				}

				a:hover {
					color: white;
					text-shadow: none;
				}

				a:after {
					text-align: center;
					display: block;
					position: absolute;
					top: 0;
					left: 0;
					bottom: 0;
					right: 0;
					margin: auto;
					width: 100%;
					height: 1px;
					content: '.';
					color: transparent;
					background: #f89605;
					visibility: none;
					opacity: 0;
					z-index: -1;
				}
			}
		}
	}

	header.sticky {
		background: rgba(0, 128, 0, 0.829);
		box-shadow: rgba(0, 0, 0, 0.09) 0px 1px 1px;
		border-bottom: .4rem solid rgba(255, 255, 0, 0.815);
		height: 3vw;
		min-height: 3rem;

		div {
			background: url(../img/logo02.png) no-repeat center center / contain;
			width: 8.5vw;
			min-width: 8.5rem;
			height: 1.8vw;
			min-height: 1.8rem;
			margin: 0 0 0 1vw;
		}

		div:hover {
			background: url(../img/logo_hover.png) no-repeat center center / contain;
		}

		nav {
			padding: 0 1% 0 0;

			a {
				font: 400 max(.8rem, .7vw)/1.3 "Open Sans", sans-serif;
				color: white !important;
			}

			a.active {
				color: yellowgreen;
				cursor: default;
				pointer-events: none;
			}
		}

		@media (width <=1280px) {
			background: none;
			box-shadow: none;
			border-bottom: none;
			height: auto;
			min-height: auto;

			nav {

				a,
				a:after,
				a:before {
					font: 300 max(.75rem, .75vw)/1 "Open Sans", sans-serif;
					text-shadow: none;
					margin: 4px 3px 0 0;
					padding: .6rem .5rem;
					background: rgba(133, 2, 189, 0.5);
					border: 1px solid hidden;
					border-radius: 7px;
					text-align: center;
				}

				a:hover {
					color: yellow;
					text-decoration: none;
				}

				a:after {
					display: block;
					position: absolute;
					top: 0;
					left: 0;
					bottom: 0;
					right: 0;
					margin: auto;
					width: 100%;
					height: 1px;
					content: '.';
					color: transparent;
					visibility: none;
					opacity: 0;
					z-index: -1;
				}

				a.active {
					color: magenta;
				}
			}
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: rgba(0, 128, 0, 0.829);
			box-shadow: rgba(0, 0, 0, 0.09) 0px 1px 1px;
			border-bottom: .4rem solid rgba(255, 255, 0, 0.815);
			height: 3vw;
			min-height: 3rem;

			nav {
				padding: 0 1% 0 0;

				a {
					font: 400 max(.7rem, .7vw)/1.3 "Open Sans", sans-serif;
					color: white;
				}

				a,
				a:after,
				a:before {
					font: 400 max(.7rem, .7vw)/1.3 "Open Sans", sans-serif;
					color: white;
					background: none;
					padding: .8rem .8rem;
					margin: 0 9px;
				}

				a:after {
					text-align: center;
					display: block;
					position: absolute;
					top: 0;
					left: 0;
					bottom: 0;
					right: 0;
					margin: auto;
					width: 100%;
					height: 1px;
					content: '.';
					color: transparent;
					background: darkred;
					visibility: none;
					opacity: 0;
					z-index: -1;
				}

				a:hover:after {
					opacity: 1;
					visibility: visible;
					border: 1px solid hidden;
					border-radius: 7px;
				}

				a.active {
					color: lime;
				}
			}
		}
	}

	/*fix Header Ende*/

	main {
		grid-row: 1/2;
		display: grid;
		grid-template-rows: 1fr;
		grid-template-columns: 1fr;
		justify-items: center;
		padding: 0 0 1vw 0;

		@media (width <=1280px) {
			padding: 0 0 2vw 0;
		}

		hgroup {
			display: grid;
			grid-template-rows: 1fr;
			grid-template-columns: 1fr;
			justify-content: center;
			align-items: end;
			height: clamp(25vw, 26vw, 27vw);
			overflow: hidden;
			margin: 0 0 .25rem 0;

			h1 {
				color: white;
				text-shadow: 2px 2px 6px rgb(71, 71, 71);
			}

			@media (width <=1280px) {
				height: clamp(72vw, 73vw, 74vw);

				h1 {
					display: none;
				}
			}

			@media (width <=1280px) and (orientation: landscape) {
				height: clamp(25vw, 26vw, 27vw);

				h1 {
					display: contents;
				}
			}
		}

		.box3x {
			display: grid;
			grid-template-rows: 1fr;
			grid-template-columns: 18vw 1fr 18vw;
			gap: .5rem;
			margin: .25rem .5rem .25rem .5rem;

			article-li {
				grid-row: 1/2;
				grid-column: 1/2;
			}

			article-mi {
				grid-row: 1/2;
				grid-column: 2/3;
				display: grid;
				grid-template-columns: 1fr;
				grid-template-rows: 1fr;
				justify-items: center;
				align-items: start;
				padding: 0 .25rem 0 .5rem;

				div {
					margin: 0 0 1vw 0;

					p {
						font: 400 max(.8rem, .65vw)/1.3 "Roboto", sans-serif;
						text-align: center;
						color: darkcyan;

						a:link {
							font: 400 max(.8rem, .65vw)/1.3 "Roboto", sans-serif;
							color: darkcyan;
							text-decoration: none;
							padding: 3px;
						}

						a:hover {
							color: white !important;
							background: #f89605;
							border: 1px solid hidden;
							border-radius: 4px;
						}

						a:visited {
							color: darkcyan;
						}
					}
				}

				.txt {
					padding: 1rem 0;
				}
			}

			article-re {
				grid-row: 1/2;
				grid-column: 3/4;
			}

			.li_re {
				display: grid;
				grid-template-rows: 1fr;
				grid-template-columns: 1fr;
				justify-items: center;
				align-items: end;
				gap: .5rem;
			}

			@media (width <=1280px) {
				grid-template-rows: auto auto;
				grid-template-columns: 1fr 1fr;

				article-mi {
					grid-row: 1/2;
					grid-column: 1/3;
				}

				article-li {
					grid-row: 2/3;
					grid-column: 1/2;
				}

				article-re {
					grid-row: 2/3;
					grid-column: 2/3;
				}
			}
		}

		.box2x {
			display: grid;
			grid-template-rows: auto;
			grid-template-columns: auto auto;
			justify-items: center;
			gap: .5rem;
			margin: .25rem .5rem .25rem .5rem;

			.li {
				grid-row: 1/2;
				grid-column: 1/2;
			}

			.re {
				grid-row: 1/2;
				grid-column: 2/3;
			}

			.txt {
				padding: 1rem 1rem;
			}

			@media (width <=1280px) {
				grid-template-rows: auto auto;
				grid-template-columns: auto;

				.li {
					grid-row: 1/2;
					grid-column: 1/2;
				}

				.re {
					grid-row: 2/3;
					grid-column: 1/2;
				}
			}
		}

		.box1x {
			display: grid;
			grid-template-rows: auto;
			grid-template-columns: auto;
			justify-content: center;
			justify-items: center;
			align-items: start;
			gap: .5rem;
			margin: .25rem .5rem .25rem .5rem;

			h3 {
				margin: 1vw 0 .25rem 0;
			}
		}

		.img6x {
			/*grid-template-columns: repeat(auto-fill, minmax(390px, .8fr));*/
			grid-template-columns: repeat(6, 1fr);

			@media (width <=1920px) {
				grid-template-columns: repeat(5, 1fr);
			}

			/* 				@media (width <=1600px) {
					grid-template-columns: repeat(5, 1fr);
				} */

			@media (width <=1440px) {
				grid-template-columns: repeat(4, 1fr);
			}

			/* 				@media (width <=1366px) {
					grid-template-columns: repeat(5, 1fr);
				} */

			@media (width <=1280px) {
				grid-template-columns: repeat(3, 1fr);
			}

			@media (width <=1024px) {
				grid-template-columns: repeat(2, 1fr);
			}

			@media (width <=600px) {
				grid-template-columns: repeat(1, 95vw);
			}

			.card01 {
				height: 100%;
			}
		}

		.img5x {
			grid-template-columns: repeat(5, 1fr);

			@media (width <=1920px) {
				grid-template-columns: repeat(3, 1fr);
			}

			@media (width <=1280px) {
				grid-template-columns: repeat(2, 1fr);
			}

			@media (width <=800px) {
				grid-template-columns: repeat(1, 1fr);
			}

			.card01 {
				height: 100%;
			}
		}

		.img4x {
			grid-template-columns: repeat(4, 1fr);

			@media (width <=1280px) {
				grid-template-columns: repeat(2, 1fr);
			}

			@media (width <=600px) {
				grid-template-columns: repeat(1, 1fr);
			}

			.card01 {
				height: 100%;
			}
		}

		.img3x {
			grid-template-columns: repeat(3, 1fr);

			@media (width <=1920px) {
				grid-template-columns: repeat(2, 1fr);
			}

			@media (width <=800px) {
				grid-template-columns: 1fr;
			}

			.card01 {
				height: 100%;
			}
		}

		.card02 {
			box-shadow: rgba(150, 150, 150, 0.685) 1px 1px 4px;
			position: relative;

			* {
				transition: all 0.25s ease;
			}

			:hover img {
				transform: scale(1.1);
			}

			figcaption {
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				padding: 0;
				display: grid;
				grid-template-rows: 1fr;
				grid-template-columns: 1fr;
				align-items: end;

				h4 {
					color: white;
					text-shadow: 2px 2px 6px rgba(65, 64, 64, 0.742);
					padding: 0 0 .2rem .5rem;
				}

				p {
					font: 400 max(.8rem, .7vw)/1.2 "Roboto", sans-serif;
					color: white;
					background: linear-gradient(0deg, rgba(0, 0, 0, 0.792), rgba(0, 0, 0, 0.226), rgba(0, 0, 0, 0));
					padding: 0 .3rem .5rem .5rem;
				}

				span {
					height: .5rem;
				}
			}
		}

		.card02:hover {
			transition: all 0.3s ease;
			box-shadow: rgba(0, 0, 0, 0.676) 0px 4px 12px;
		}

		.card03 {
			display: grid;
			grid-template-rows: auto auto;
			grid-template-columns: auto 1fr;

			img {
				grid-row: 1/3;
				grid-column: 1/2;
				max-width: 800px;
			}

			figcaption {
				grid-row: 1/3;
				grid-column: 2/3;
				padding: .25rem .25rem .25rem .25rem;
			}
		}

		.bg_txt {
			width: 100%;
			background: lightgoldenrodyellow;
			box-shadow: rgba(0, 0, 0, 0.148) 0px 1px 2px 0px;
			border: 1px solid hidden;
			border-radius: 7px;
			/* margin: .25rem 0 .25rem 0; */
			padding: .5rem;

			h6 {
				margin: 0 0 .25rem 0;
			}

			a {
				font: 300 max(.9rem, .65vw)/1.3 "Roboto", sans-serif;
				color: black;
				text-decoration: none;
			}

			a:hover {
				color: rgb(241, 59, 3) !important;
			}

			a:visited {
				color: black;
			}

			P {
				font: 300 max(.9rem, .65vw)/1.3 "Roboto", sans-serif;
			}

			ul {
				list-style: disc;
				margin: .2rem 0 0 0;
				padding: 0 0 0 .5rem;

				li {
					text-align: left;
					margin: 0 .6rem .3rem .6rem;
				}
			}
		}
	}

	footer {
		grid-row: 2/3;
		display: grid;
		grid-template-columns: 1fr auto;
		grid-template-rows: auto;
		background: url(../img/bg_foo.png) no-repeat center top / cover;

		nav {
			grid-column: 1;
			display: grid;
			grid-template-columns: repeat(5, auto);
			justify-content: left;
			margin: 1.7vw 0 0 0;
			height: 2vw;

			a,
			a:after,
			a:before {
				font: 200 max(.8rem, .75vw)/1.3 "Roboto", sans-serif;
				display: block;
				padding: .8rem 1rem;
				text-decoration: none;
				margin: 0 10px;
				transition: all .2s;
			}

			a {
				position: relative;
				z-index: 1;
				color: white !important;
			}

			a:hover {
				color: black !important;
				text-decoration: none;
			}

			a:after {
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				bottom: 0;
				right: 0;
				margin: auto;
				width: 100%;
				height: 1px;
				content: '.';
				color: transparent;
				background: #4af805;
				visibility: none;
				opacity: 0;
				z-index: -1;
			}

			a:hover:after {
				opacity: 1;
				visibility: visible;
				height: 70%;
				border: 1px solid hidden;
				border-radius: 7px;
			}

			a.active {
				color: lightskyblue;
				cursor: default;
				pointer-events: none;
			}
		}

		div {
			grid-column: 2;
			margin: 1.5vw 1vw 1vw 0;

			p {
				font: 300 max(.7rem, .6vw)/1.3 "Roboto", sans-serif;
				color: white;
			}
		}

		@media (width <=1280px) {
			background: url(../img/bg_foo_1920.png) no-repeat center top / cover;

			nav {
				grid-template-rows: repeat(5, auto);
				grid-template-columns: auto;
				height: auto;
				margin: 1vw 0 1vw 1vw;

				a,
				a:after,
				a:before {
					font: 200 max(.8rem, .75vw)/1.3 "Roboto", sans-serif;
					padding: .7rem .5rem;
					margin: 0;
					text-align: left;
				}

				a:after {
					display: block;
					position: absolute;
					top: 0;
					left: 0;
					bottom: 0;
					right: 0;
					margin: auto;
					width: 100%;
					height: 1px;
					content: '.';
					color: transparent;
					background: paleturquoise;
					visibility: none;
					opacity: 0;
					z-index: -1;
				}
			}

			div {
				margin: 3vw 2vw 1vw 0;

				p {
					font: 300 max(.7rem, .6vw)/1.3 "Roboto", sans-serif;
					color: white;
				}
			}
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/bg_foo.png) no-repeat center top / cover;

			nav {
				grid-template-columns: repeat(5, auto);
				grid-template-rows: auto;
				margin: 2vw 0 1vw 1vw;
				height: 2vw;

				a,
				a:after,
				a:before {
					padding: .6rem .5rem;
					margin: 0 10px;
					text-align: center;
				}

				a:after {
					display: block;
					position: absolute;
					top: 0;
					left: 0;
					bottom: 0;
					right: 0;
					margin: auto;
					width: 100%;
					height: 1px;
					content: '.';
					color: transparent;
					background: yellow;
					visibility: none;
					opacity: 0;
					z-index: -1;
				}
			}

			div {
				margin: 2vw 2vw 2vw 0;
			}
		}
	}

	/* Seiten */

	#start {
		background: url(../img/index/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/index/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/index/bg.jpg) no-repeat center top / contain;
		}
	}

	#startseite {
		background: url(../img/startseite/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/startseite/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/startseite/bg.jpg) no-repeat center top / contain;
		}
	}

	#themen {
		background: url(../img/themen/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/themen/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/themen/bg.jpg) no-repeat center top / contain;
		}
	}

	#exped {
		background: url(../img/expeditionen/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/expeditionen/bg_1920.jpg) no-repeat center top / contain;

			hgroup {
				height: clamp(100vw, 101vw, 102vw);
			}
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/expeditionen/bg.jpg) no-repeat center top / contain;

			hgroup {
				height: clamp(25vw, 26vw, 27vw);
			}
		}
	}

	#kontakt {
		background: url(../img/kontakt/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/kontakt/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/kontakt/bg.jpg) no-repeat center top / contain;
		}
	}

	#ueber {
		background: url(../img/uebermich/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/uebermich/bg_1920.jpg) no-repeat center top / contain;

			hgroup {
				height: clamp(100vw, 101vw, 102vw);
			}
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/uebermich/bg.jpg) no-repeat center top / contain;

			hgroup {
				height: clamp(25vw, 26vw, 27vw);
			}
		}
	}

	/* Thema */
	#baeume {
		background: url(../img/thema/baeume/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/baeume/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/baeume/bg.jpg) no-repeat center top / contain;
		}
	}

	#biodivers {
		background: url(../img/thema/biodevers/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/biodevers/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/biodevers/bg.jpg) no-repeat center top / contain;
		}
	}

	#blattschneider {
		background: url(../img/thema/blattschneider/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/blattschneider/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/blattschneider/bg.jpg) no-repeat center top / contain;
		}
	}

	#buschflieger {
		background: url(../img/thema/buschflieger/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/buschflieger/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/buschflieger/bg.jpg) no-repeat center top / contain;
		}
	}

	#campen {
		background: url(../img/thema/campen/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/campen/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/campen/bg.jpg) no-repeat center top / contain;
		}
	}

	#echsen {
		background: url(../img/thema/echsen/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/echsen/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/echsen/bg.jpg) no-repeat center top / contain;
		}
	}

	#epiphyten {
		background: url(../img/thema/epiphyten/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/epiphyten/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/epiphyten/bg.jpg) no-repeat center top / contain;
		}
	}

	#fortschritt {
		background: url(../img/thema/fortschritt/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/fortschritt/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/fortschritt/bg.jpg) no-repeat center top / contain;
		}
	}

	#fototipps {
		background: url(../img/thema/fototipps/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/fototipps/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/fototipps/bg.jpg) no-repeat center top / contain;
		}
	}

	#froesche {
		background: url(../img/thema/froesche/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/froesche/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/froesche/bg.jpg) no-repeat center top / contain;
		}
	}

	#guides {
		background: url(../img/thema/guides/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/guides/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/guides/bg.jpg) no-repeat center top / contain;
		}
	}

	#guyana {
		background: url(../img/thema/guyana/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/guyana/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/guyana/bg.jpg) no-repeat center top / contain;
		}
	}

	#infektion {
		background: url(../img/thema/infektionen/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/infektionen/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/infektionen/bg.jpg) no-repeat center top / contain;
		}
	}

	#indigeneswissen {
		background: url(../img/thema/indigeneswissen/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/indigeneswissen/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/indigeneswissen/bg.jpg) no-repeat center top / contain;
		}
	}

	#insekten {
		background: url(../img/thema/insekten/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/insekten/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/insekten/bg.jpg) no-repeat center top / contain;
		}
	}

	#inseln {
		background: url(../img/thema/inseln/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/inseln/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/inseln/bg.jpg) no-repeat center top / contain;
		}
	}

	#langstrecke {
		background: url(../img/thema/langstrecke/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/langstrecke/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/langstrecke/bg.jpg) no-repeat center top / contain;
		}
	}

	#menschundregenwald {
		background: url(../img/thema/menschundregenwald/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/menschundregenwald/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/menschundregenwald/bg.jpg) no-repeat center top / contain;
		}
	}

	#mimikry {
		background: url(../img/thema/mimikry/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/mimikry/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/mimikry/bg.jpg) no-repeat center top / contain;
		}
	}

	#mythos {
		background: url(../img/thema/mythos/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/mythos/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/mythos/bg.jpg) no-repeat center top / contain;
		}
	}

	#nachts {
		background: url(../img/thema/nachts/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/nachts/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/nachts/bg.jpg) no-repeat center top / contain;
		}
	}

	#naturvoelker {
		background: url(../img/thema/naturvoelker/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/naturvoelker/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/naturvoelker/bg.jpg) no-repeat center top / contain;
		}
	}

	#orchideen {
		background: url(../img/thema/orchideen/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/orchideen/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/orchideen/bg.jpg) no-repeat center top / contain;
		}
	}

	#paddelboot {
		background: url(../img/thema/paddelboot/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/paddelboot/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/paddelboot/bg.jpg) no-repeat center top / contain;
		}
	}

	#palaeo {
		background: url(../img/thema/palaeo/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/palaeo/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/palaeo/bg.jpg) no-repeat center top / contain;
		}
	}

	#paradiesvoegel {
		background: url(../img/thema/paradiesvoegel/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/paradiesvoegel/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/paradiesvoegel/bg.jpg) no-repeat center top / contain;
		}
	}

	#pflanzen {
		background: url(../img/thema/pflanzen/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/pflanzen/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/pflanzen/bg.jpg) no-repeat center top / contain;
		}
	}

	#regenwald {
		background: url(../img/thema/regenwald/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/regenwald/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/regenwald/bg.jpg) no-repeat center top / contain;
		}
	}

	#regenwaldretten {
		background: url(../img/thema/regenwaldretten/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/regenwaldretten/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/regenwaldretten/bg.jpg) no-repeat center top / contain;
		}
	}

	#saeugetiere {
		background: url(../img/thema/saeugetiere/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/saeugetiere/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/saeugetiere/bg.jpg) no-repeat center top / contain;
		}
	}

	#schlangen {
		background: url(../img/thema/schlangen/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/schlangen/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/schlangen/bg.jpg) no-repeat center top / contain;
		}
	}

	#schmetterlinge {
		background: url(../img/thema/schmetterlinge/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/schmetterlinge/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/schmetterlinge/bg.jpg) no-repeat center top / contain;
		}
	}

	#spinnen {
		background: url(../img/thema/spinnen/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/spinnen/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/spinnen/bg.jpg) no-repeat center top / contain;
		}
	}

	#stockwerk {
		background: url(../img/thema/stockwerk/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/stockwerk/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/stockwerk/bg.jpg) no-repeat center top / contain;
		}
	}

	#trekking {
		background: url(../img/thema/trekking/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/trekking/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/trekking/bg.jpg) no-repeat center top / contain;
		}
	}

	#voegel {
		background: url(../img/thema/voegel/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/voegel/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/voegel/bg.jpg) no-repeat center top / contain;
		}
	}

	#wasserfaelle {
		background: url(../img/thema/wasserfaelle/bg.jpg) no-repeat center top / contain;

		@media (width <=1280px) {
			background: url(../img/thema/wasserfaelle/bg_1920.jpg) no-repeat center top / contain;
		}

		@media (width <=1280px) and (orientation: landscape) {
			background: url(../img/thema/wasserfaelle/bg.jpg) no-repeat center top / contain;
		}
	}
}