.media1 {
  background-image: url("../images/vierer-Flexbox/01.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 350px;
}
.media2 {
  background-image: url("../images/vierer-Flexbox/02.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media3 {
  background-image: url("../images/vierer-Flexbox/03.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  height: 350px;
}
.media4 {
  background-image: url("../images/vierer-Flexbox/04.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 350px;
}

.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: #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;
}
.card3 > * {
  flex: 1 1 250px;
}


.card4 {
  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;
}
.card4 > * {
  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;
}