<figure class="element"></figure>
body {
      background: #171616;
      padding: 40px;
}

.element {
      width: 100%;
      max-width: 700px;
      height: 400px;
      background: coral;
      border-radius: 20px;
      position: relative;
      background: url(http://ewigkeit.ucoz.club/codepen/poster-6.jpg);
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center center;
}

.element::before {
      position: absolute;
      transform: translate(-50%, -50%);
      top: 50%;
      left: 50%;
      width: 420px;
      height: 687px;
      background: url(http://ewigkeit.ucoz.club/codepen/anime-girl.png);
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center center;
      content: "";
      z-index: 20;
}

External CSS

  1. https://moonpresence.milanwake.site/moonpresence/foundation/moonpresence-base.css

External JavaScript

This Pen doesn't use any external JavaScript resources.