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

body {
	height: 100%;
	margin: 0;
	font-family: 'Montserrat';
	line-height: 1.2;
}

@font-face { font-family: 'Montserrat';
	 src: url('./Montserrat-Medium.ttf') format('truetype');
	 src: url('./Montserrat-Medium.woff') format('woff');
	src: url('./Montserrat-Medium.woff2') format('woff2');
}

.text-right a {
	color: #dd9b5c;
	text-decoration: none;
}

.text-right a:focus,.text-right a:hover{
	color: #88b2ef;
}

.navbar{
	padding-x: 2rem;
	background-color: #dd9b5c;
	width: 100%;
	box-shadow: 4px 4px 4px #dd9b5c;
}

.navbar img {
	width: 11%;
	height: auto;
	padding-left: 2rem;
	padding-bottom: 1rem;
	padding-top: 1rem;
}

.banner {
	position: relative;
	background-image: url("./bannerbild.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	height: 400px;
}

.banner img {
	width: 90%;
	height: auto;
}

.banner h1 {
	z-index: 100;
	color: #ffffff;
	font-size: 2rem;
	text-shadow: 2px 2px 4px #000000;
	font-weight: 500;
	margin: 0;
	padding-top:8rem;
	padding-left:4rem;
}

.bild-left{
	
	padding-left: 16rem;
	padding-bottom: 5rem;
	padding-top: 5rem;
}

.text-right {
	vertical-align: top;
	padding-left: 3rem;
	padding-top: 7rem;
}

.bild-left img {
	display: inline-block;
	max-width: 100%;
}

.bild-left, .text-right {
	display: inline-block;
}

h2 {
	color: #808080;
	font-size: 2rem;
	margin: 0;
		
}

footer {
	padding: 1rem;
	background: #88b2ef;
}

#impressum, .copyright {
	display: inline-block;
}
.copyright{
	padding-left: 1rem;
}



	@media screen and (max-width: 1400px){
		.banner h1 {
			font-size: 2rem;
		}
		.navbar img {
			padding:1rem;
			width:14%;
			height: auto;
		}
		
		.bild-left{
			width: 600px;
			padding-left: 11rem;
		}
}
	@media screen and (max-width: 1200px){
		.banner h1 {
			font-size: 1.8rem;
		}
		.navbar img {
			padding:1rem;
			width:16%;
			height: auto;
		}
		.bild-left{
			width: 500px;
			padding-left: 7rem;
		}
		h2 {
			font-size: 1.8rem;
		}
}
	@media screen and (max-width: 992px){
		.banner h1 {
			font-size: 1.6rem;
			line-height: 2.2rem;
		}
		.banner {height:360px;
		}
		.bild-left{
			width: 350px;
			padding-left: 6rem;
		}
		h2 {
			font-size: 1.4rem;
		}
		.text-right {
			padding-left: 2.5rem;
			padding-top: 5rem;
		}
}

@media  (max-width:768px) and (orientation:landscape) {
	
	.banner { height: 230px!important;
		
	}
}

	@media screen and (max-width: 768px){
		.banner h1 {
			font-size: 1.5rem;
			line-height: 2rem;
			padding-left: 2rem;
			padding-top: 6rem;
		}
		.banner {height:285px;
		}
		.navbar img {
			padding:1rem;
			width:19%;
			height: auto;
		}
		.bild-left {
			padding-left: 2rem;
			padding-top: 3rem;
			width: 254px;
		}
		.text-right {
			padding-left: 1.5rem;
			padding-top: 3rem;
		}
		h2 {
			font-size: 1.2rem;
		}
		.text-right p {
			margin-top: 0.5rem;
			margin-bottom: 0.5rem;
		}
		footer {
			margin-top: 8rem;
		}
}
	@media screen and (max-width: 576px){
		.banner h1 {
			font-size: 1.2rem;
			line-height: 1.7rem;
			padding-top: 5rem;
			padding-left: 1rem;
		}
		.banner {height:220px;
		}
		.navbar img {
			padding:0.5rem;
			width:25%;
			height: auto;
		}
		.bild-left {
			max-width: 100%;
		}
		.bild-left {
			padding-bottom: 0rem;
		}
		.bild-left, .text-right {
			display: block;
		}
}
	@media screen and (max-width: 350px){
		.banner h1 {
			font-size: 1rem;
			line-height: 1.4rem;
			padding-top: 3rem;
			padding-right: 1rem;
		}
		.banner {height:153px;
		}
		.navbar img {
			padding:0.5rem;
			width:23%;
			height: auto;
		}
		.bild-left {
			max-width: 100%;
		}
}