.media1 {
  background-image: url("../images/Startseite/01.jpg");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover;
  height: 250px;
}
.media2 {
  background-image: url("../images/Startseite/02.jpg");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover;
  height: 250px;
}
.media3 {
  background-image: url("../images/Startseite/03.jpg");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover;
  height: 250px;
}
.card1 {
  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;
}
.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: #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;
}
.card3 > * {
  flex: 1 1 250px;
}


.media4 {
  background-image: url("../images/Startseite/07.jpg");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover;
  height: 250px;
}
.media5 {
  background-image: url("../images/Startseite/08.jpg");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover;
  height: 250px;
}
.media6 {
  background-image: url("../images/Startseite/09.jpg");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover;
  height: 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;
}


:root {
  --card-margin: 1em;
}
.container_dreier {
	background-color: #FFF;
width: 100%;
  display: flex;
  flex-wrap: wrap;
	
}
.container_dreier > * {
	
  flex: 1 1 calc(250px + var(--card-margin));
}
.content {
  align-self: center;
  padding: 1em 2em;
}