<div class= "medaille">
<center><span>Für<br>Wolfgang<br>Für seine tolle<br>Arbeit und Unterstützung</span></center>
</div>
 

/* CSS-Überschreibungen */
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }
/* Mittelabzeichen für Demo */
body {
  display: grid;
  place-items: center;
  min-height: 100vh;
}
 

.medaille {
  --badge-size: 8rem;
  height: var(--badge-size);
  width: var(--badge-size);
  position: relative;
}
/* Bänder hinzufügen */
.medaille::before,
.medaille::after {
  content: '';
  position: absolute;
  top: 50%;
  width: calc(var(--badge-size) / 4);
  height: calc(var(--badge-size) * 0.75);
  background: #ff0000;
  border-width: 0 calc(var(--badge-size) / 16);
  border-color: #140037;
  border-style: solid;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 90%, 0% 100%);
}
.medaille::before {
  left: 0; transform: translateX(100%) rotate(25deg);
}
.medaille::after {
  right: 0; transform: translateX(-100%) rotate(-25deg);
  z-index: -1;
}
/* text */
.medaille span {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: var(--badge-size);
  height: var(--badge-size);
  font-size: calc(var(--badge-size) / 10);
  font-weight: bold;
  color: black;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #f0c808;
  box-shadow: 0.025em 0.025em 0.1em #303030;
  border-radius: 50%;
}
/* text area */
.medaille span::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 85%; height: 85%;
  background: #c4a408;
  box-shadow: 0.025em 0.025em 0.1em #303030 inset;
  border-radius: 50%;
  z-index: -1;
}