.image-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	background: #000;

}

.image-box {
	position: relative;
	margin: 5px;
	padding: 5px;

}

.a1 {
	grid-column: 1 / 2;
	grid-row: 1;

}

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

}


.c1 {
	grid-column: 1 / 2;
	grid-row: 2;

}

.d1 {
	grid-column: 2 /3;
	grid-row: 2;

}


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

}

.f1 {
	grid-column: 2 /3;
	grid-row: 3;

}



figure {
	display: inline-block;
	margin: 0 0 0 0;
	width: 100%;
}

img {
	display: block;
	width: 100%;
	/* oder eine feste Breite */
	height: auto;
}

img.gr {
	display: block;
	margin: auto;
	max-width: 50%;
}

.k-text {
	position: absolute;
	top: 15%;
	left: 10%;
	transform: translate(-50%, -50%);
	color: white;
	/* Textfarbe */
	font-size: calc(12px + (18 - 12) * ((100vw - 320px) / (1600 - 320)));
	text-align: center;
	background: #04856e;
	color: #fff;
	padding: 20px;
}

#formular  {
		position: absolute;
		margin-top: -100px;
	}
	
	  .b-green, .b-green:before {
    background: rgba(73,155,234,1);
    background: -moz-linear-gradient(45deg, rgba(73,155,234,1) 0%, rgba(26,188,156,1) 100%);
    background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(73,155,234,1)), color-stop(100%, rgba(26,188,156,1)));
    background: -webkit-linear-gradient(45deg, rgba(73,155,234,1) 0%, rgba(26,188,156,1) 100%);
    background: -o-linear-gradient(45deg, rgba(73,155,234,1) 0%, rgba(26,188,156,1) 100%);
    background: -ms-linear-gradient(45deg, rgba(73,155,234,1) 0%, rgba(26,188,156,1) 100%);
    background: linear-gradient(45deg, rgba(73,155,234,1) 0%, rgba(26,188,156,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#1abc9c', GradientType=1 );
  }
	
	
  .b-pink, .b-pink:before {
    background: rgba(231,72,234,1);
    background: -moz-linear-gradient(45deg, rgba(231,72,234,1) 0%, rgba(75,26,188,1) 100%);
    background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(231,72,234,1)), color-stop(100%, rgba(75,26,188,1)));
    background: -webkit-linear-gradient(45deg, rgba(231,72,234,1) 0%, rgba(75,26,188,1) 100%);
    background: -o-linear-gradient(45deg, rgba(231,72,234,1) 0%, rgba(75,26,188,1) 100%);
    background: -ms-linear-gradient(45deg, rgba(231,72,234,1) 0%, rgba(75,26,188,1) 100%);
    background: linear-gradient(45deg, rgba(231,72,234,1) 0%, rgba(75,26,188,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e748ea', endColorstr='#4b1abc', GradientType=1 );
  }	
  
  .grad {
  display: inline-block;
  position: relative;
  border-radius: 3px;
  text-decoration: none;
  padding: .5em;
  margin: .5em;
  font-size: 2em;
  font-weight: bold;
  transition: all .5s;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.grad:hover {
  text-shadow: 0px 0px 0px rgba(255, 255, 255, .75);
}
.grad:hover:after {
  left: 100%;
  top: 100%;
  bottom: 100%;
  right: 100%;
}
.grad:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
  border-radius: 5px;
  transition: all .5s;
}
.grad:after {
  content: '';
  display: block;
  position: absolute;
  left: 2px;
  top: 2px;
  bottom: 2px;
  right: 2px;
  z-index: -1;
  border-radius: 5px;
  transition: all .5s;
   background: #000; 
}
.grad2 {
  display: inline-block;
  font-size: 2em;
  margin: .5em;
  padding: .5em;
  border-radius: 5px;
  transition: all .5s;
  filter: hue-rotate(0deg);
  color: #FFF;
  text-decoration: none;
}
/*END BASE BUTTON*/
/*ROTATE*/
.rot-360-noscoop:hover {
  filter: hue-rotate(360deg);
  transform: rotate(360deg);
}
.rot-135:hover {
  filter: hue-rotate(135deg);
}
.rot-90:hover {
  filter: hue-rotate(90deg);
}
/*END ROTATE*/
.grad-border { 
 border-width: 4px;
  border-style: solid;
  border-image: linear-gradient(to right,rgba(73,155,234,1), rgba(26,188,156,1)) 1;
}

.kontakt-erl {
max-width: 80%;
margin: auto;
}

.anpassung {
text-decoration: underline;
text-underline-offset: 4px;
}

.mitte {
  max-width: fit-content;
  margin-left: auto;
  margin-right: auto;
}

/* ===============
   TABELLE
   =============== */

.tab-div {
max-width: 80%;
margin: auto;
}



table.phpm {
  background-color: #494352; 	
  color: #fff;
  border: 1px solid #fff;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  width: 100%;
  font-size: 1rem;

}

table.phpm2 {
  background-color: #151021; 	
  color: #fff;
  border: 1px solid #fff;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  width: 100%;
  font-size: 1rem;

}

table.phpm caption {
 
}

table.phpm tr {
  color: #fff;
  border: 1px solid #ddd;
  padding: .35em;
}

table.phpm2 tr {
  color: #fff;
  border: 1px solid #ddd;
  padding: .35em;
}

table.phpm th,
table.phpm td {
  padding: .625em;
  text-align: left;
}

table.phpm2 th,
table.phpm2 td {
  padding: .625em;
  text-align: left;
}

/* Large rounded green border */
hr.verwendung {
  margin: 35px 0px;
  height: 20px;
   background: linear-gradient(45deg, rgba(73,155,234,1) 0%, rgba(26,188,156,1) 100%);
}

.footerinfo  {
	  max-width: fit-content;
  margin-left: auto;
  margin-right: auto;
margin-bottom: 35px;
}

@media screen and (max-width: 1024px) {
	
	.tab-div {
max-width: 95%;

}
	
  table.phpm {
    border: 0;
  }

  table.phpm caption {

  }
  
  table.phpm thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  
  table.phpm tr {
    border-bottom: 3px solid #ddd;
    display: block;
  }
   
   
  table.phpm td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: .8em;
    text-align: right;
  }
  
  table.phpm td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;

  }
  
  table.phpm td:last-child {
    border-bottom: 0;
  }



	
  table.phpm2 {
    border: 0;
  }

  table.phpm2 caption {

  }
  
  table.phpm2 thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  
  table.phpm2 tr {
    border-bottom: 3px solid #ddd;
    display: block;
  }
   
   
  table.phpm2 td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: .8em;
    text-align: right;
  }
  
  table.phpm2 td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;

  }
  
  table.phpm2 td:last-child {
    border-bottom: 0;
  }
}



/* ===============
   Flexbox Impressum
   =============== */

div.flex-container {
	margin-top: 100px;
	margin-bottom: 0px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #26173B;
	color: #B7B6B6;
	max-width: 50%;
	height: 400px;
	margin-left: auto;
	margin-right: auto;
	hyphens: auto;
}

.inhalt {
	max-width: 100%;
	hyphens: auto;
	font-size: calc(12px + (12 - 8) * ((100vw - 300px) / (1800 - 300))) !important;
	text-align: justify;

}

p.text-center {
	text-align: center;
	margin-bottom: 40px;
	font-size: calc(15px + (17 - 15) * ((100vw - 320px) / (2560 - 320)));

}

p.ltrText {
	unicode-bidi: bidi-override;
	direction: rtl;
	text-align: center;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (2560 - 320)));
}

p.ltrText2 {
	unicode-bidi: bidi-override;
	direction: rtl;
	text-align: left;
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (2560 - 320)));
}

.datenschutz {
max-width: 80%;
margin: auto;

}


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

	.k-text {
		position: absolute;
		top: 15%;
		left: 15%;
	}


	@media screen and (max-width: 992px) {
		.image-wrapper {
			grid-template-rows: 1fr;
		}

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

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


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

		.d1 {
			grid-column: 1 / 3;
			grid-row: 4;
		}

       .e1 {
	grid-column: 1 / 3;
	grid-row: 5;

}

.f1 {
	grid-column: 1 /3;
	grid-row: 6;

}


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

		.k-text {
			top: 15%;
			left: 10%;
		}
	}

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

		.k-text {
			top: 15%;
			left: 13%;
			padding: 5px;
		}
		
		.datenschutz {
max-width: 95%;
margin: auto;

}

div.flex-container {
	max-width: 95%;

}


	}

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

	@media screen and (max-width: 384px) {
		.k-text {
			top: 17%;
			left: 17%;
			padding: 5px;
		}
	}