.thin-strip {
  height: 30px;
  background-size: auto 30px;
  background-repeat: repeat-x;
  background-position: 0 0;
  filter: drop-shadow(0px 0px 3px rgba(0,0,0,0.1));
  position: relative;
}
.thin-strip-header {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 6px 18px;
  border-radius: 8px;
  white-space: nowrap;
}
.achilles {
  background-image: url('achilles.png');
}
.ameisenbaer {
  background-image: url('ameisenbaer.png');
}
.carl-krebs {
  background-image: url('carl-krebs.png');
}
.theo-schildkroete {
  background-image: url('theo-schildkroete.png');
}

html::before,
html::after {
  background-image: url('carl-krebs.png');
  content: '';
  position: fixed;
  width: 100%;
  height: 30px;
  background-size: auto 30px;
  background-repeat: repeat-x;
  filter: drop-shadow(0px 0px 3px rgba(0,0,0,0.1));
  z-index: 1000;
}

html::before {
  top: 0;
}

html::after {
  bottom: 0;
}