.media1 {
  background-image: url("../images/Startseite/01.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 400px;
}
.media2 {
  background-image: url("../images/Startseite/02.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 400px;
}
.media3 {
  background-image: url("../images/Startseite/03.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 400px;
}
.media4 {
  background-image: url("../images/Startseite/04.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 350px;
}
.media5 {
  background-image: url("../images/Startseite/05.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media6 {
  background-image: url("../images/Startseite/06.jpg");
  background-repeat: no-repeat;
  background-position: top left;
  background-size: cover;
  height: 350px;
}
.media7 {
  background-image: url("../images/Startseite/07.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 350px;
}
.media8 {
  background-image: url("../images/Startseite/08.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media9 {
  background-image: url("../images/Startseite/09.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media10 {
  background-image: url("../images/Startseite/010.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media11 {
  background-image: url("../images/Startseite/011.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media12 {
  background-image: url("../images/Startseite/012.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media13 {
  background-image: url("../images/Startseite/013.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media14 {
  background-image: url("../images/Startseite/014.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media15 {
  background-image: url("../images/Startseite/015.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media16 {
  background-image: url("../images/Startseite/016.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.card1 {
  display: flex;
  flex-wrap: wrap;
  background-color: #FFF3D1;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card1 > * {
  flex: 1 1 250px;
}
.card2 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f8f8f8;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card2 > * {
  flex: 1 1 250px;
}
.card3 {
  display: flex;
  flex-wrap: wrap;
  background-color: #F5ECBD;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card3 > * {
  flex: 1 1 250px;
}


.card4 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f8f8f8;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card4 > * {
  flex: 1 1 250px;
}
.card5 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f4f0ed;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card5 > * {
  flex: 1 1 250px;
}
.card6 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f8f8f8;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card6 > * {
  flex: 1 1 250px;
}
.card7 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f4f0ed;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card7 > * {
  flex: 1 1 250px;
}
.card8 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f8f8f8;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card8 > * {
  flex: 1 1 250px;
}
.card9 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f4f0ed;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card9 > * {
  flex: 1 1 250px;
}


.card10 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f8f8f8;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card10 > * {
  flex: 1 1 250px;
}
.card11 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f4f0ed;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card11 > * {
  flex: 1 1 250px;
}
.card12 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f8f8f8;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card12 > * {
  flex: 1 1 250px;
}
.card13 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f8f8f8;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card13 > * {
  flex: 1 1 250px;
}
.card14 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f4f0ed;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card14 > * {
  flex: 1 1 250px;
}
.card15 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f8f8f8;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card15 > * {
  flex: 1 1 250px;
}
.card16 {
  display: flex;
  flex-wrap: wrap;
  background-color: #f8f8f8;
  margin: var(--card-margin);
	 border: 10px solid #fff;
  -webkit-box-shadow: 1px 1px 2px #222;
  -moz-box-shadow: 1px 1px 2px #222;
  box-shadow: 0 8px 10px -6px #222;
}
.card16 > * {
  flex: 1 1 250px;
}
:root {
  --card-margin: 1em;
}
.container_dreier {
	
width: 100%;
  display: flex;
  flex-wrap: wrap;
	
}
.container_dreier > * {
	
  flex: 1 1 calc(250px + var(--card-margin));
}
.content {
  align-self: center;
  padding: 1em 2em;
}