body {
      margin: 0;
      background: #000;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }

    .game {
      position: relative;
      width: 900px;
      height: 500px;
      background: url("https://i0.wp.com/www.gameanim.com/wp-content/uploads/2014/04/Fighting_Background.gif?fit=800%2C336&ssl=1") no-repeat center/cover;
      border: 3px solid #fff;
      overflow: hidden;
    }

    .health-bar {
      position: absolute;
      top: 20px;
      height: 25px;
      background: green;
      border: 2px solid #fff;
      transition: width 0.2s linear;
    }

    .player-health {
      left: 20px;
      width: 300px;
    }

    .enemy-health {
      right: 20px;
      width: 300px;
    }

    .fighter {
      position: absolute;
      bottom: 0;
      width: 120px;
      height: 160px;
      background-size: cover;
      image-rendering: pixelated;
    }

    #player {
      left: 0px;
      background-image: url("https://fightersgeneration.com/characters2/iron-man-stance.gif");
    }

    #enemy {
      right: 50px;
      transform: scaleX(-1);
      background-image: url("https://i.ibb.co/6vggH7c/ken-idle.gif");
    }