JSFiddle - React, Tailwind, and code Playground

HTML

<body>

  <div id="shoulders">

    <div id="face">
      <div class="eyebrow" id="lefteyebrow"> </div>

      <div class="eyebrow" id="righteyebrow"> </div>

      <div class="eye" id="lefteye"> </div>

      <div class="eye" id="righteye"> </div>

      <div id="mouth"></div>

    </div>

  </div>
</body>

CSS

#shoulders {
  background: url('http://i.imgur.com/7YneEPb.png') no-repeat;
  background-position: center;
  position: relative;
  height: 612px;
  width: 100%;
}

#face {
  background: url('http://i.imgur.com/81PBjTQ.png') no-repeat;
  height: 571px;
  width: 100%;
  position: absolute;
  background-position: center top;
}

#mouth {
  background: url('http://i.imgur.com/QsqjZNK.png') no-repeat;
  background-size: contain;
  height: 39px;
  width: 100%;
  margin-top: 438px;
  background-position: 53%;
  position: absolute;
}