How can I overlay an image on a background using taiwind?

Question

Vue.js

I have a background image and an image that I need to overlay on the background. I can't figure out how I can do this, I'm using tailwind css.
It turns out that you need to overlay an image with the first-img-1 class on the image with the bg-screen class . Component

<template>
  <div class="v-manufacturers font-montserrat">
    <h2
      class="inline-flex border-lime border-b-3 font-montserrat font-semibold text-white text-3xl mb-6"
    >
      Производители
    </h2>
    <div class="manufacturers-item flex">
      <div class="first-img ">
        
        <img
          class="bg-screen"
          src="@/assets\images\manufactures/screen.png"
          alt="screen"
        />

          <img
            class="first-img-1 "
            src="@/assets\images\manufactures\1.png"
            alt="first"
          />

      </div>
      <div class="second-img ">
        <img
          class="bg-screen"
          src="@/assets\images\manufactures/screen.png"
          alt="screen"
        />
      </div>
      <div class="third-img">
        <img
          class="bg-screen"
          src="@/assets\images\manufactures/screen.png"
          alt="screen"
        />
      </div>
      <div class="fourth-img">
        <img
          class="bg-screen"
          src="@/assets\images\manufactures/screen.png"
          alt="screen"
        />
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "v-manufacturers",
};
</script>


<style lang="scss" scoped>

</style>