html{
  scroll-behavior: smooth;
}

*{
margin:0;
padding:0;
}

body{
  font-family: 'Montserrat', Verdana, sans-serif;
}

a{
  text-decoration:none;
  list-style: none;
  color:#000000;
  font-weight:300;
  font-size:20px;
}
a:hover{
  text-decoration:none;
  list-style: none;
  color:#000000;
}

h1,h2,h3,h4{
  font-family: 'Montserrat', sans-serif;
  display:inline;
  text-align:left;
  font-weight: 800;
}

.weiss{
 color:#F8F8F8;
}

h1{
  font-size:34px;
}
h2{
  font-weight: 600;
  font-size:28px;
}
.button{
  background-color: #4CAF50; /* Green */
  border: none;
  color: white;
  padding: 16px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  transition-duration: 0.4s;
  cursor: pointer;
}
.schriftkleiner{
  font-size:34px;
}
.container{
  width:100%;
  height:50vh;
  background-image: url("../image/banner4-six.png");
  background-size: cover;
  background-repeat:no-repeat;
  background-position:center;
  background-attachment: fixed;
}

.logo1{
  padding:2% 0 0 2%;
  width:10%;
}
.logo1 img{
  width:100%;
}

.logo-footer img{
  width:100%;
}

.aussen-titel{
  height:30vh;
	display:flex;
	flex-direction:column;
	align-items: center;
  justify-content: center;
}

.mittig{
	margin-left:5%;
	margin-right:5%;  
}
.titel{
  background-color: #FFEE00;
  padding:10px 10px 10px 10px;
  width:100%;
}
.titel h1{
	display:block;
	text-align:center;
 	font-size:32px;
}
.pfeil{
  width:100%;
  padding-top:5%;
  display:flex;
  justify-content: center;
  align-items: center;
}
 

/*Navigation */

.navbar{
  width:100%;
  height:70px;
  top:-70px;
  background-color:rgba(255,255,255,0.60);
  position:fixed;
  z-index:1000;
  
}
.change{
  top:0px;
}

.nav-list{
  padding:25px 0 0 0;
  float:right;
  display: grid;
  grid-auto-flow: column;
  width:50%;
  text-decoration: none;
}

.nav-list li{
   padding:0 0 0 0;
   list-style: none;
}

.nav-link{
  position:relative;
  padding:3px 0;
}

.nav-link::before,
.nav-link::after{
  content:"";
  width:100%;
  height:2px;
  background-color:#FFEE00;
  position:absolute;
  left:0;
  transform: scaleX(0);
  transition:transform 0.5s;
}

.nav-link::after{
  bottom:0;
  transform-origin: right;
}

.nav-link::before{
  top:0;
  transform-origin: left;
}

.nav-link:hover::before,
.nav-link:hover::after{
  transform:scaleX(1);
}

.hamburger-menu{
  width:45px;
  height:40px;
  position:fixed;
  top:20px;
  right:50px;
  cursor:pointer;
  display:flex;
  flex-direction: column;
  justify-content: space-around;
}

.line{
  width:100%;
  height:4px;
  background-color:#FFEE00;
}

.change .line1{
  transform:rotateZ(-45deg) translate(-8px, 6px);
}

.change .line2{
  opacity:0;
}

.change .line3{
  transform:rotateZ(45deg) translate(-8px, -6px);
}

/* -------------------------------------------------------------Buchungsformular ----------------------------------------------------*/

#buchungsformular{
		width:100%;
}
.hintergrund-kontakt{
	background-color:rgba(211,211,211,1.00);
  width:100%;
  height:770px;
  background-repeat: no-repeat;
  background-position:center;
  background-size: 100% 100%;
  margin-bottom:5%;
}
.icons{
	margin:0 auto;
	width:8%;
}
.icons img{
}
.inhalt-kontakt{
  position:relative;
  text-align: justify;
  width:70%;
  height:180px;
  display:block;
  margin:0% auto;
}

.titel-kontakt{
  width:100%;
  position:absolute;
  text-align:center;
  margin:100px auto 0 auto;
}

.titel-kontakt h1{
   font-size:58px;  
}

.contact-form{
  padding:250px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}

.input-fields{
  display:flex;
  flex-direction: column;
  align-content: space-around;
  justify-content: center;
  width:50%;
  height:100%;
}

.input, select{
  font-size:16px;
  margin-bottom:2%;
  padding:3% 0% 2% 2%;
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
		-moz-appearance: none;
		-webkit-appearance: none;
		background-color: rgba(255,255,255,0.70);
		appearance: none;
		border: none;
		width: 98%;
	 box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.3);
  border-radius: 3px;
		outline: none;
		cursor: pointer;
}

textarea{
  font-size:16px;
  padding:3% 0 10% 0;
  height:220px;
}
select {
		-moz-appearance: none;
		-webkit-appearance: none;
		background-color: rgba(255,255,255,0.70);
		appearance: none;
		border: none;
		width: 100%;
  padding-left: 10px;
	 box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.3);
  border-radius: 3px;
		outline: none;
		cursor: pointer;
}
select{
		background-image: url("../image/pfeil-klein.png");
		background-position:98% 50%;
		background-repeat: no-repeat;
}

select:focus::-ms-value {
		background-color: transparent;
}

select option{
		color: #666;
}

select::-ms-expand {
		display: none;
}

.button-kontakt{
  background-color: #FFEE00; 
  width:100%;
  color: black;
  padding:3% 2% 3% 2%;
  font-family: 'Montserrat', sans-serif;
	 font-size: 26px;
  -webkit-box-shadow: 0px 0px 10px -4px rgba(56,56,56,0.64);
  -moz-box-shadow: 0px 0px 10px -4px rgba(56,56,56,0.64);
  box-shadow: 0px 0px 10px -4px rgba(56,56,56,0.64);
}

.button-kontakt:hover{
  background-color: #616161; 
  color: #FFEE00; 
  -webkit-box-shadow: 0px 0px 10px -4px rgba(56,56,56,0.64);
  -moz-box-shadow: 0px 0px 10px -4px rgba(56,56,56,0.64);
  box-shadow: 0px 0px 10px -4px rgba(56,56,56,0.64);
  border: 2px solid #FFEE00;
}
/* -------------------------------------------------------------Buchungsformular ----------------------------------------------------*/


.strich{
 width:100%;
 height:30px;
 background-color:#FFEE00;
 poisition:relative;

}

.slogan{
 width:100%;
 font-size:48px;
 margin-top:-3%;
 position:absolute;
 display:flex;
 flex-direction: row;
 align-content: center;
 justify-content: center;
}
/* footer*/

footer{
 margin-top:2%;
 width:100%;
 background:#616161;
 bottom:0;
 padding:1% 0 1% 0;
}
.logo-footer{
 width:10%;
 margin: 0 auto 0 auto;
}
.adresse{
 margin-top:2%;
 display:flex;
 flex-direction:row;
 align-content: center;
 justify-content: center;
}

.nav-list-footer{
  padding:25px 0 0 0;
  display:flex;
 flex-direction:row;
 align-content: center;
 justify-content: center;
 
}

.nav-list-footer li{
  width:8%;
   padding:0 0 0 0;
   list-style: none;
   display:inline;
}

.nav-list-footer a:hover{
  color:#FFFFFF;
}

@media screen and (max-width: 1690px) {
.slogan{
 font-size:46px;
}
.contact-form{
  padding:250px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}

}

@media screen and (max-width: 1585px) {
.titel-kontakt {
	width: 100%;
	position: absolute;
	text-align: center;
	margin: 50px auto 0 auto;
}
.slogan{
 font-size:45px;
}
.contact-form{
  padding:280px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
}

@media screen and (max-width: 1500px) {

h1{
  font-size:32px;
}
h2{
  font-weight: 600;
  font-size:26px;
}

h3{
  font-size:22px;
}


h4{
  font-size:20px;
}
p{
  font-size:14px;
}
.slogan{
 font-size:40px;
 margin-top:-3.5%;
}

.nav-list-footer li{
  width:12%;
   padding:0 0 0 0;
   list-style: none;
   display:inline;
}

.nav-list-footer p{
  font-size:20px;
}
}


@media screen and (max-width: 1450px) {
td{
  font-size:16px;
}

}

@media screen and (max-width: 1350px) {
.nav-list {
  padding:25px 80px 0 0;
}

.logo1{
  padding:2% 0 0 2%;
  width:10%;
}
.titel-kontakt h1{
   font-size:46px;  
}
.contact-form{
  padding:200px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.input-fields{
  display:flex;
  flex-direction: column;
  align-content: space-around;
  justify-content: center;
  width:65%;
  height:100%;
}

.input{
  font-size:16px;
  margin-bottom:2%;
  padding:3% 0% 2% 2%;
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
}

textarea{
  font-size:16px;
  padding:3% 0 10% 0;
  height:220px;
}
.slogan{
 font-size:36px;
 margin-top:-4%;
}

footer{
 margin-top:2%;
 width:100%;
 background:#616161;
 bottom:0;
 padding:1% 0 1% 0;
}

.logo-footer{
  display:flex;
 flex-direction:row;
 align-content: center;
 justify-content: center;
}


.nav-list-footer li{
  width:10%;
   padding:0 0 0 0;
   list-style: none;
   display:inline;
}
}
@media screen and (max-width: 1280px) {
.contact-form{
  padding:220px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.hintergrund-kontakt{
	height:680px;
	margin-bottom:10%;
}
}

@media screen and (max-width: 1240px) {
.infotext2{
		margin:10% 0 0 0;
	}
.hintergrund-kontakt{
		height:680px;
		margin-bottom:10%;
	}
.contact-form{
  padding:230px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
}

@media screen and (max-width: 1210px) {
.contact-form{
  padding:235px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.slogan{
	 font-size:34px;
	 margin-top:-4.5%;
}
.hintergrund-kontakt{
		height:680px;
		margin-bottom:10%;
	}
}

@media screen and (max-width: 1140px) {
h2{
  font-weight: 600;
  font-size:24px;
}
.contact-form{
  padding:235px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.hintergrund-kontakt{
		height:680px;
		margin-bottom:10%;
	}
}

@media screen and (max-width: 1100px) {

.logo1{
  padding:3% 0 0 3%;
  width:12%;
}

.nav-list-footer p{
  font-size:18px;
}
.contact-form{
  padding:228px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.slogan{
 font-size:34px;
 margin-top:-4.5%;
}
}
@media screen and (max-width: 1024px) {
.contact-form{
  padding:228px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.hintergrund-kontakt{
		height:680px;
		margin-bottom:10%;
	}
}
@media screen and (max-width: 1000px) {
.titel-kontakt h1{
   font-size:42px;  
}
.hintergrund-kontakt{
		height:680px;
		margin-bottom:10%;
	}
.contact-form{
  padding:228px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	display:block;
	margin:-50px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.strich{
 width:100%;
 height:25px;
 background-color:#FFEE00;
 position:relative;

}
.slogan{
 font-size:28px;
 margin-top:-4%;
}

.nav-list-footer li{
  width:12%;
   padding:0 0 0 0;
   list-style: none;
   display:inline;
}

h2{
  font-weight: 600;
  font-size:22px;
}
.button-kontakt{
  padding:4% 2% 4% 2%;
}

.button-kontakt h3{
	 font-size:28px;
}
	
}

@media screen and (max-width: 950px) {
.contact-form{
  padding:232px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-55px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.input-fields{
  height:100%;
}
.strich{
 width:100%;
 height:20px;
 background-color:#FFEE00;
 position:relative;

}
.slogan{
 font-size:28px;
 margin-top:-4.5%;
}

}

@media screen and (max-width: 910px) {
.contact-form{
  padding:232px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-58px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
h1{
  font-size:30px;
}
h2{
  font-weight: 600;
  font-size:24px;
}
h3{
  font-size:20px;
}
h4{
  font-size:18px;
}
p{
  font-size:14px;
}
li{
  font-size:12px;
}
td{
  font-size:16px;
}
td h2{
  font-size:18px;
}

}

@media screen and (max-width: 840px) {
.nav-list-footer p{
  font-size:16px;
}
}

@media screen and (max-width: 810px) {
td{
  font-size:14px;
}
.contact-form{
  padding:232px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-58px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
}


@media screen and (max-width: 800px) {
.hintergrund-kontakt{
  height:610px;
}
.icons{
	margin:0 auto;
	width:12%;
}
.icons img{
	width:50px;
}
.mittig{
	width:60%;
}
.titel{
	text-align: center;
	padding:10px 5px 10px 5px;
}
.titel h1{
	font-size:36px;
}
.logo1{
  padding:3% 0 0 3%;
  width:14%;
}
.line{
  background-color: #000000;
}
.hamburger-menu{
  width:45px;
  height:40px;
  position:fixed;
  top:20px;
  right:50px;
  cursor:pointer;
  display:flex;
  flex-direction: column;
  justify-content: space-around;
}
.change .line1{
  transform:rotateZ(-45deg) translate(-8px, 6px);
}

.change .line2{
  opacity:0;
}

.change .line3{
  transform:rotateZ(45deg) translate(-8px, -6px);
}
.navbar{
  height:140px;
  top:-140px;
}
.change{
  top:0;
}
.nav-list{
  grid-auto-flow:row;
}

.nav-list li{
  padding-bottom:12px;
}

.contact-form{
  padding:232px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-58px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.inhalt-kontakt{
		height:50px;
	}
	
.titel-kontakt h1{
		font-size:38px;
	}

h1{
  font-size:28px;
}
h2{
  font-weight: 600;
  font-size:22px;
}

h3{
  font-size:18px;
}

h4{
  font-size:16px;
}
p{
  font-size:12px;
}
li{
  width:100%;
  font-size:12px;
}
td{
  font-size:16px;
}
td h2{
  font-size:18px;
}

.strich{
 width:100%;
 height:20px;
 background-color:#FFEE00;
 position:relative;

}
.slogan{
 font-size:26px;
 margin-top:-4.5%;
}
.handy{
  margin-top:2%;
}

}


@media screen and (max-width: 700px) {
.input-fields{
  width:90%;
}	
.contact-form{
  padding:235px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-60px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.strich{
 width:100%;
 height:15px;
 background-color:#FFEE00;
 position:relative;

}
.slogan{
 font-size:22px;
 margin-top:-4%;
}

.nav-list-footer li{
  width:14%;
   padding:0 0 0 0;
   list-style: none;
   display:inline;
}

}

@media screen and (max-width: 670px) {
.navbar{
background-color: rgba(255,255,255,0.80);
}
.aussen-titel{
	height:40vh;
}
.mittig{
	width:60%;
}
.titel{
	text-align: center;
	padding:10px 5px 10px 5px;
}
.titel h1{
	font-size:30px;
}
.titel-kontakt h1{
	font-size:34px;
}
.contact-form{
  padding:232px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-58px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.handy{
  margin-top:4%;
}

.strich{
 width:100%;
 height:12px;
 background-color:#FFEE00;
 position:relative;

}
.slogan{
 font-size:20px;
 margin-top:-4%;
}

}
@media screen and (max-width: 655px) {
.handy{
  margin-top:2%;
}

.nav-list-footer li{
  width:16%;
   padding:0 0 0 0;
   list-style: none;
   display:inline;
}
}

@media screen and (max-width: 600px) {
.hintergrund-kontakt{
		height:580px;
		margin-bottom:10%;
	}
.hinweis{
	text-align: center;
	display:block;
	margin:-65px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.titel-kontakt h1{
   font-size:34px;  
}
	
.input-fields{
  width:95%;
}
h1{
  font-size:26px;
}
h2{
  font-weight: 600;
  font-size:20px;
}

h3{
  font-size:18px;
}

h4{
  font-size:16px;
}
p{
  font-size:12px;
}
li{
  font-size:12px;
}
td{
  font-size:14px;
}
td h2{
  font-size:14px;
}
.nav-list-footer p{
  font-size:12px;
}

.nav-list-footer li{
  width:14%;
  padding:0 0 0 0;
  list-style: none;
  display:inline;
}
}

@media screen and (max-width: 550px) {
.hintergrund-kontakt{
	height:600px;
	margin-bottom:10%;
	}
.aussen-titel{
	height:40vh;
}
.mittig{
	width:65%;
}
.titel{
	text-align: center;
	padding:10px 5px 10px 5px;
}
.titel h1{
	font-size:28px;
}
.titel-kontakt{
  width:100%;
  position:absolute;
  text-align:center;
  margin:0px auto 0 auto;
}
.contact-form{
  padding:260px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-75px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size: 20px;
}
.titel-kontakt{
		margin:22% auto 0 auto;
	}	
.titel-kontakt h1{
   font-size:32px;  
}
	
.input-fields{
  width:95%;
}	
.logo1{
  padding:3% 0 0 3%;
  width:16%;
}

h1{
  font-size:24px;
}
h2{
  font-weight:600;
  font-size:18px;

}

h3{
  font-size:16px;
  font-weight:600;
}

h4{
  font-size:14px;
}
p{
  font-size:12px;
}
li{
  font-size:12px;
}
td{
  font-size:14px;
}
td h2{
  font-size:14px;
}

.handy{
  margin-top:0%;
}

.strich{
 width:100%;
 height:12px;
 background-color:#FFEE00;
 position:relative;

}
.slogan{
 font-size:16px;
 margin-top:-4%;
}
}


@media screen and (max-width: 500px) {
.icons{
	margin:0 auto;
	width:18%;
}
.icons img{
	width:50px;
}
.contact-form{
  padding:260px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-75px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size:18px;
}
.titel-kontakt h1{
		font-size:30px;
}
	
.input-fields{
  width:100%;
}
.button-kontakt h3{
		font-size:22px;
	}
.nav-list-footer p{
  font-size:12px;
}

.nav-list-footer li{
  width:16%;
   padding:0 0 0 0;
   list-style: none;
   display:inline;
}
.pfeil a{
	text-align: center;
}	

.pfeil img{
	width:70%;
}

.aussen-titel{
	height:40vh;
}
.mittig{
	width:65%;
}
.titel{
	text-align: center;
	padding:10px 5px 10px 5px;
}
.titel h1{
	font-size:24px;
}
.handy{
  margin:0 auto 0 auto;
}

.strich{
 width:100%;
 height:30px;
 background-color:#FFEE00;
 position:relative;
  margin-bottom:5%;
}
.slogan{
 text-align:center;
 margin-top:-13%;
 font-size:20px;
 line-height: 1.1em;

}
}


@media screen and (max-width: 470px) {
.hintergrund-kontakt{
		height:580px;
		margin-bottom:10%;
	}
.aussen-titel{
	height:40vh;
}
.mittig{
	width:70%;
}
.titel{
	text-align: center;
	padding:10px 5px 10px 5px;
}
.titel h1{
	font-size:26px;
}
.titel-kontakt h1{
		font-size:28px;
	}
.logo1{
  padding:3% 0 0 3%;
  width:18%;
}

h1{
  font-size:24px;
}
h2{
  font-weight:600;
  font-size:18px;
}

h3{
  font-size:15px;
  font-weight:600;
}

h4{
  font-size:13px;
}
p{
  font-size:12px;
}
li{
  font-size:12px;
}
td{
  font-size:13px;
}
td h2{
  font-size:13px;
}
.slogan{
 text-align:center;
 margin-top:-13.5%;
 font-size:20px;
 line-height: 1.1em;
}
}

@media screen and (max-width: 450px) {
.aussen-titel{
	height:45vh;
}
.mittig{
	width:70%;
}
.titel{
	text-align: center;
	padding:10px 5px 10px 5px;
}
.titel h1{
	font-size:22px;
}
.titel-kontakt h1{
		font-size:32px;
	}
.titel-kontakt h1{
		font-size:26px;
	}
.contact-form{
  padding:235px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-70px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size:16px;
}
.logo1{
  padding:3% 0 0 3%;
  width:19%;
}

.nav-list-footer p{
  font-size:12px;
}

.nav-list-footer li{
  width:20%;
   padding:0 0 0 0;
   list-style: none;
   display:inline;
}

.slogan{
 text-align:center;
 margin-top:-15%;
 font-size:20px;
 line-height: 1.1em;
}
}

@media screen and (max-width: 414px) {
.hintergrund-kontakt{
		height:550px;
		margin-bottom:10%;
	}
.titel-kontakt h1{
		font-size:23px;
}
.contact-form{
  padding:200px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-70px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size:16px;
}
}
@media screen and (max-width: 375px) {
.aussen-titel{
	height:45vh;
}
.mittig{
	width:70%;
}
.titel{
	text-align: center;
	padding:10px 5px 10px 5px;
}
.titel h1{
	font-size:22px;
}
.titel-kontakt h1 {
	font-size: 28px;
}	
.hintergrund-kontakt{
		height:540px;
		margin-bottom:10%;
	}
.contact-form{
  padding:200px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-70px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size:16px;
}
.titel-kontakt h1{
		font-size:22px;
}
}
@media screen and (max-width: 320px) {
.titel h1{
		font-size:19px;
	}
.titel-kontakt h1 {
	font-size: 28px;
}	
.hintergrund-kontakt{
		height:500px;
		margin-bottom:10%;
	}
.contact-form{
  padding:180px 0 0 0;
  display:flex;
  justify-content: center;
}
.hinweis{
	text-align: center;
	display:block;
	margin:-70px auto 0% auto;
	position:absolute;
	color:#000000;
	font-size:14px;
}
.titel-kontakt h1{
		font-size:18px;
	}
.titel h1{
	font-size:20px;
}	
}