/* poppins-regular - latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: local('/fonts'),
       url('/fonts/poppins-v20-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/poppins-v20-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


html {
  scroll-behavior: smooth;
}

body
{
	margin: 0;
	padding: 0;
	font-family: 'Poppins', sans-serif;
}
.container
{
	position: relative;
	with: 100%;
	height: 100vh;
	scroll-behavior: smooth;
	overflow: auto;
	scroll-snap-type: y mandatory;
	scroll-snap-align: start;
}
.section
{
	widht: 100%;
	height: 100vh;
	background-size: cover;
	scroll-snap-align: start;
}

.section:nth-child(1)
{
	background: url(cov2.jpg);
	background-size: cover;
	background-position: center center;
}
.section:nth-child(2)
{
	background: url(buha1.jpg);
	background-size: cover;
}
.section:nth-child(3)
{
	background: url(Modell1.jpg);
	background-size: cover;
}
.section:nth-child(4)
{
	background: url(Marten.jpg) no-repeat;
	background-size: cover;
	background-position: center center;
}
.section:nth-child(5)
{
	background: url(Herrschaft.jpg) no-repeat;
	background-size: cover;
	background-position: center center;
}
.section:nth-child(6)
{
	background: url(Lager.jpg) no-repeat;
	background-size: cover;
	background-position: center center;
}
.section:nth-child(7)
{
	background: url(Lazarett.jpg) no-repeat;
	background-size: cover;
	background-position: right center;
}
.section:nth-child(8)
{
	background: url(LuftbLager.jpg);
	background-size: cover;
	background-position: right center;
}
.section:nth-child(9)
{
	background: url(bg4.jpg) no-repeat;
	background-size: cover;
}
.section:nth-child(10)
{
	background: url(Chotzen.jpg);
	background-size: cover;
	background-position: left center;
}
.section:nth-child(11)
{
	background: url(Bombard.jpg);
	background-size: cover;
	background-position: center center;
}
.section:nth-child(12)
{
	background: url(Befreiung.jpg) no-repeat;
	background-size: cover;
	background-position: center bottom;
}
.section:nth-child(13)
{
	background: url(bg5.jpg);
	background-size: cover;
	background-position: right bottom;
}
.section:nth-child(14)
{
	background: url(view52_fix.jpg);
	background-size: cover;
	background-position: center bottom;
}
.section:nth-child(15)
{
	background: url(view65_fix.jpg);
	background-size: cover;
	background-position: center center;
}
.section:nth-child(16)
{
	background-color: #996633;
	background-size: cover;
}


@media screen and (max-width: 1650px) {
div.title 
h1
{
	font: 3.4em 'Poppins', sans-serif;
	line-height: 1.5;
}
div.title
h3
{
	font: 2.1em 'Poppins', sans-serif;
	line-height: 1.2;
}
}

@media screen and (max-width: 1366px) {
div.title 
h1
{
	font: 2.8em 'Poppins', sans-serif;
	line-height: 1.5;
}
div.title
h3
{
	font: 2.0em 'Poppins', sans-serif;
	line-height: 1.2;
}
}
@media screen and (max-width: 1024px) {
div.title 
h1
{
	font: 2.6em 'Poppins', sans-serif;
	line-height: 1.5;
}
div.title
h3
{
	font: 1.7em 'Poppins', sans-serif;
	line-height: 1.1;
}
div.footer
{
	width: 100%;
	margin: 0 0 0 0;
	padding: 0px 50px 0px 50px;
	border: 0px solid yellow;	
}
div.bottom_l
{
	width: 90%;
	height: 100%;
	display: flex;
	align-items: flex-end;
	float: left;
	border: 0px solid green;
}
}

@media screen and (max-width: 600px) {
div.title 
h1
{
	font: 2.0em 'Poppins', sans-serif;
	line-height: 1.5;
}
div.title
h3
{
	font: 1.1em 'Poppins', sans-serif;
	line-height: 1.1;
}
div.column-bottom_15
{
	margin: 0 0 0 0;
	border: 0px solid red;
}
div.column-kzlag
{
	max-width: 100%;
	margin: 0 0 0 0;
	padding: 0px;
	border: 0px solid yellow;
}
div.anim-column_15
{
	margin: 0 0 0 0;
	border: 0px solid blue;	
}
div.main-column
{
	padding: 5px 30px;
	flex: 2;
	order: 2;
	border: 0px solid blue;
}
div.column-lufan
{
	max-width: 100%;
	margin: 0 0 0 0;
	padding: 0px;
}
div.anim-column_14
{
	width: 100%;
	margin: 0 0 0 0;
	padding: 5px 30px;
	border: 0px solid red;
}
div.footer
{
	width: 100%;
	margin: 0 0 0 0;
	padding: 0px 50px 0px 50px;
	border: 0px solid yellow;	
}
div.rechts_z
{
	display:none;
}
}

@media screen and (max-width: 450px) {
div.container 
h1
{
	font: 2.1em 'Poppins', sans-serif;
	line-height: 1.5;
}
div.container
h3
{
	font: 1.3em 'Poppins', sans-serif;
	line-height: 1.1;
}
div.container
h2
{
	font: 1.1em 'Poppins', sans-serif;
	color: #996633;
	line-height: normal;
}
p
{
	font: 0.7em 'Poppins', sans-serif;
	line-height: normal;
}

div.column-layout
{
	max-width: 100%;
	margin: 0 0 0 20%;
	border: 0px solid blue;
}
div.title
{
	background-color: #fff;
	padding: 10px 30px 10px 30px;
	opacity: 0.9;
	flex: 1;
	order: 1;
	border: 0px solid yellow;
}
div.column-bottom_15
{
	margin: 0 0 0 0;
	border: 0px solid red;
}
div.anim-column_15
{
	margin: 0 0 0 0;
	border: 0px solid blue;	
}
div.column-4
{
	height: 100%;
	max-height: 100%;
	max-width: 100%;
	display: flex;
	flex-flow: row wrap;
	align-content: flex-end;
	margin: 0 0 0 0;
	z-index 1;
	border: 0px solid yellow;
}
div.main-column
{
	padding: 5px 30px;
	flex: 2;
	order: 2;
	border: 0px solid blue;
}
div.column-befrei
{
	width: 100%;
	margin: 0 0 0 0;
	padding: 0px;
	border: 0px solid blue;
}
div.column-lufan
{
	max-width: 100%;
	margin: 0 0 0 0;
	padding: 0px;
}
div.column-kzlag
{
	max-width: 100%;
	margin: 0 0 0 0;
	padding: 0px;
	border: 0px solid yellow;
}
div.column-zwarb
{
	max-width: 100%;
	margin: 0 0 0 0;
	padding: 0px;
	border: 0px solid green;
}
div.column-10
{
	max-width: 100%;
	margin: 0 0 0 0;
	padding: 0px;
	border: 0px solid red;
}
div.anim-column_14
{
	width: 100%;
	margin: 0 0 0 0;
	padding: 5px 30px;
	border: 0px solid red;
}
div.footer
{
	width: 100%;
	margin: 0 0 0 0;
	padding: 0px 50px 0px 50px;
	border: 0px solid yellow;	
}
div.rechts_z
{
	display: none;
}
}







.column-layout
{
	max-width: 60%;
	opacity: 0.8;
	margin: 0 0 auto auto;
	padding: 0px;
	border: 0px solid blue;
}
.title
{
	background-color: #fff;
	padding: 10px 70px;
	opacity: 0.9;
	flex: 1;
	order: 1;
	border: 0px solid yellow;
}
.column-buha
{
	max-width: 300px;
	margin: 0 auto auto 0;
	padding: 0px 20px;
	display: flex;
	border: 0px solid white;
}
.margin-buha
{
	margin: 200px 0 0 0;
	padding: 20px 0 0 0;
	flex: 1;
	order: 1;
	border: 0px solid white;
}

.column-bottom_15
{
	height: 100%;
	max-height: 100%;
	max-width: 100%;
	margin: 0 0 0 auto;
	display: flex;
	flex-flow: row wrap;
	align-content: flex-end;
	z-index: 2;
	border: 0px solid red;
}
.anim-column_15
{
	max-height: 85vh;
	margin: 0 85px 0 40%;
	padding: 5px 30px;
	background-color: #fff;
	opacity: 0.9;
	border: 0px solid blue;	
}
.column-4
{
	max-width: 800px;
	margin: 0 0 auto auto;
	padding: 0px;
	z-index 1;
	border: 0px solid yellow;
}
.main-column
{
	padding: 10px;
	background-color: #fff;
	padding: 5px 30px;
	flex: 2;
	order: 2;
	border: 0px solid red;
}
.column-befrei
{
	max-width: 500px;
	background-color: #fff;
	margin: 0 auto 0 10%;
	padding: 0px;
	display: flex;
	z-index: 1;
}
.column-lufan
{
	max-width: 500px;
	background-color: #fff;
	margin: 0 auto 0 5%;
	padding: 0px;
	display: flex;
	z-index: 1;
}
.margin-re
{
	padding: 10px;
	flex: 1;
	order: 1;
}
.column-kzlag
{
	max-width: 500px;
	background-color: #fff;
	margin: 0 auto 0 20%;
	padding: 0px;
	display: flex;
	/*
	float: left;
	darf nicht stehen, sonst springt div, wenn ein nebenstehender div bei kleinerer Auflösung zu nahe kommt
	*/
}
.column-zwarb
{
	max-width: 500px;
	background-color: #fff;
	margin: 0 90px 0 auto;
	padding: 0px;
	display: flex;
}
.column-10
{
	max-width: 500px;
	margin: 0 70px 0 auto;
	padding: 0px;
	display: flex;
	height: 100%;
	max-height: 100%;
	display: flex;
	z-index: 1;
	align-items: flex-end;
	border: 0px solid red;
}

.column-bottom_14
{
	width: 55%;
	height: 100%;
	max-height: 100%;
	display: flex;
	z-index: 1;
	align-items: flex-end;
	border: 0px solid red;
}
.anim-column_14
{
	max-height: 85vh;
	margin: 0 25% 0 5%;
	padding: 5px 30px;
	background-color: #fff;
	opacity: 0.9;
	border: 0px solid red;
}
.oben_z
{
	width: 100%;
	height: 50%;
	display: row;
	z-index: 1;
	border: 0px solid white;
}
.rechts_z
{
	width: 60px;
	height: 90%;
	display: row;
	float: right;
	z-index: -5;
	border: 0px solid #000;
}




















.column-video
{
	position: relative;
	width: 65%;
	max-height: 80%;
	margin: 0 auto 0 10%;
	padding: 0px;
	display: flex;
	border: 1px solid blue;
}
.anim-video
{
	padding: 0px;
	flex: 2;
	order: 2;
	border: 1px solid red;
}

/*
	zum Anpassen der Größen von Videos und Bilder
	
.video {
   display: block; object-fit: contain; 
   max-width: 100%; 
   max-height: 50%; 
}

.img-fit {
   position: relative;
   width: 50%;
   object-fit: contain;
   height: 20%;
   display: flex;
   border: 1px solid red;
}

*/




.impress
{
	height: 100%;
	padding: 50px;
	border: 0px solid yellow;
}


.footer
{
	width: 100%;
	margin: 0 85px 0 145px;
	padding: 0px 50px 0px 50px;
	background-color: #000;
	opacity: 0.9;
	border: 0px solid green;	
}







h1
{
	font: 4.1em 'Poppins', sans-serif;
	color: #996633;
	line-height: 1.5;
}
h2
{
	font: 1.4em 'Poppins', sans-serif;
	color: #996633;
	line-height: normal;
}
h3
{
	font: 2.4em 'Poppins', sans-serif;
	color: #996633;
	line-height: 0.8;
}
a
{
	color: black;
	text-decoration: none;
}
a:hover
{
	color: #FFFFFF;
	text-decoration: none;
}

p.white
{
	font: 'Poppins', sans-serif;
	color: white;
	line-height: normal;
}
p.imp
{
	font: 'Poppins', Arial, Helvetica, sans-serif;
	color: white;
	line-height: normal;
}
p.abstand
{
	word-spacing: 2.5em;
}
video 
{

	width: 100%;
	height: auto;
}
video_urspr_fix 
{

	display: block;
	margin: 0 auto;

}


.btn_orig
{
	padding: 0px 15px;
	margin: auto 0 30% auto;
	background-color: #fff;
	opacity: 0.8;
	transition-duration: 0.4s;
	display: flex;
	order: 2;
}
.strg
{
	width: 58px;
	height: 70%;
	display: flex;
	flex-direction: column-reverse;
	border: 0px solid yellow;
}

.btn
{
	padding: 0px 15px;
	margin: auto 0 auto auto;
	transition-duration: 0.4s;
	display: flex;
	order: 2;
}

.btn-1
{
	background-color: white;
	border: 2px solid white;
}
.btn-1_orig:hover
{
	background-color: grey;
	opacity: 0.9;
	color: #FFFFFF;
}
.btn-1:hover
{
	background: rgba(153, 102, 51, 0.3);
}

.btnn
{
	height: 50%;
	width: 95%;
	margin-left: 0px;
	margin-top: 0px;
	float: left;
	transition-duration: 0.4s;
}
.btnn-1
{
	background-color: white;
	border: 2px solid white;
}
.btnn-1:hover
{
	background: rgba(153, 102, 51, 0.3);
}

.btnm
{
	height: 25px;
	width: 90%;
	margin-left: 0px;
	margin-top: 0px;
	text-align: center;
	transition-duration: 0.4s;
}
.btnm-1
{
	background-color: white;
	border: 2px solid white;
}
.btnm-1:hover
{
	background: rgba(153, 102, 51, 0.3);
}