.paragraph--type--header-bereich article { height: 730px; width: 960px; position: absolute; z-index: -1; margin-left: 1160px; margin-top: 0px; }
.paragraph--type--header-bereich article .media--background{
    background-blend-mode: multiply;
}

.headerbild-bg {
  position: absolute; z-index: -2; top: 0px;
  width: 100%; height: calc(879px - 160px);
  background: #f4f4f4;
  transform: skewY(-3deg);
  display: none;
}

@media only screen and (min-width: 1921px) and (max-width: 2400px) {
.paragraph--type--header-bereich article { height: 730px; width: 960px;  margin-left: 920px; }
}

@media only screen and (min-width: 1441px) and (max-width: 1920px) {
.paragraph--type--header-bereich article { height: 660px; width: 868px; margin-left: 770px; margin-top: 20px; }
.headerbild-bg { height: calc(703px - 160px); }
}

@media only screen and (max-width: 1440px) {
.paragraph--type--header-bereich article { height: 400px; width: 680px; margin-left: 660px; margin-top: 25px;  }
.headerbild-bg { height: 480px; }
}

@media only screen and (max-width: 1200px) {
.paragraph--type--header-bereich article { margin-left: 600px; }
}

@media only screen and (max-width: 1024px) {
.paragraph--type--header-bereich article { height: 400px; width: 526px; margin-left: 520px; }
.headerbild-bg { height: 770px; }
  .headerbild-bg { height: 440px; }
}

@media only screen and (max-width: 800px) {
  .paragraph--type--header-bereich article { height: 300px; width: 394px;  margin-left: 420px; margin-top: 40px; }
  .headerbild-bg { height: 400px; }
  }

@media only screen and (max-width: 600px) {
  .paragraph--type--header-bereich article {  height: 290px; width: 400px; margin-left: 0px; right: 0px; margin-right: -160px; }
  }

  @media only screen and (max-width: 480px) {

    .paragraph--type--header-bereich article { position: relative; height: 237px; width: 340px; margin: 40px auto 40px auto; right: 0px; }
    .headerbild-bg { height: 450px; }
    }