<div class="w-full">
   <section class="relative block h-500-px">
      <div class="absolute top-0 w-full h-full bg-center bg-cover" style="background-image: url(&quot;https://images.unsplash.com/photo-1499336315816-097655dcfbda?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=crop&amp;w=2710&amp;q=80&quot;);"><span class="w-full h-full absolute opacity-50 bg-black"></span></div>
      <div class="w-full absolute top-auto bottom-0">
         <div class="w-full pointer-events-none overflow-hidden h-70-px" style="transform: translateZ(0px);">
            <svg class="absolute bottom-0 overflow-hidden" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" version="1.1" viewBox="0 0 2560 100" x="0" y="0">
               <polygon class="text-blueGray-100 fill-current" points="2560 0 2560 100 0 100"></polygon>
            </svg>
         </div>
      </div>
   </section>
</div>

<div class="w-full">
    <section class="flex relative items-center p-0 min-h-screen-60 max-h-440-px">
       <div class="absolute w-full h-full block bg-black opacity-75 z-1 left-0 top-0"></div>
       <div class="bg-blueGray-800 w-full h-full absolute bg-cover bg-50 z-0" style="background-image: url('../../assets/img/pages/product-cover.jpg');"></div>
       <div class="relative h-full text-left text-white container mx-auto px-4 z-2">
          <div class="justify-start flex flex-wrap -mx-4">
             <div class="px-12 px-4 relative w-full md:w-8/12">
                <h1 class="text-4xl font-bold leading-tight mt-0">Not just clothes, but a lifestyle</h1>
                <p class="text-xl mt-1 leading-relaxed opacity-75">This is the best way to find your favorite stuff. Don't forget all these items are unique pieces hand-crafted by people.</p>
             </div>
          </div>
       </div>
       <div class="w-full bottom-0 absolute z-2">
          <div class="w-full pointer-events-none overflow-hidden h-70-px" style="transform: translateZ(0px);">
             <svg class="absolute bottom-0 overflow-hidden" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" version="1.1" viewBox="0 0 2560 100" x="0" y="0">
                <polygon class="text-white fill-current" points="2560 0 2560 100 0 100"></polygon>
             </svg>
          </div>
       </div>
    </section>
 </div>

<div class="w-full">
    <div class="p-0 flex items-center overflow-hidden relative min-h-screen-75">
       <div class="absolute w-full h-full bg-cover bg-50 z-2" style="background-image: url('../../assets/img/illustrations/bg-presentation.png');"></div>
       <div class="absolute w-full h-full bg-blueGray-900 z-1"></div>
       <div class="container mx-auto px-4 z-3 pt-20 relative w-6/12">
          <div class="justify-center flex flex-wrap -mx-4 text-center">
             <h1 class="text-5xl font-bold text-white leading-tight mt-0 mb-24">Our tools help you save 3 weeks of development...</h1>
          </div>
       </div>
       <div class="w-full absolute text-white bottom-0 z-3">
          <div class="w-full pointer-events-none overflow-hidden h-70-px" style="transform: translateZ(0px);">
             <svg class="absolute bottom-0 overflow-hidden" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" version="1.1" viewBox="0 0 2560 100" x="0" y="0">
                <polygon class="text-blueGray-100 fill-current" points="2560 0 2560 100 0 100"></polygon>
             </svg>
          </div>
       </div>
    </div>
    <div class="container mx-auto px-4 z-3 -mt-64 pt-20 relative w-8/12">
       <div class="justify-center flex flex-wrap -mx-4">
          <div class="bg-white rounded-lg shadow-lg">
             <div class="text-center -mt-6">
                <div class="bg-emerald-500 rounded-full h-16 w-16 inline-flex items-center justify-center"><i class="text-xl text-white fas fa-rocket"></i></div>
             </div>
             <p class="pt-6 pb-12 px-12 text-lg leading-relaxed text-center">We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.</p>
          </div>
       </div>
    </div>
 </div>

<div class="w-full">
    <section class="flex relative items-center p-0 min-h-screen-75 z-0">
       <div class="absolute w-full h-full block bg-black opacity-50 z-1 left-0 top-0"></div>
       <div class="bg-blueGray-800 w-full h-full absolute bg-cover bg-50" style="background-image: url('../../assets/img/pages/fashion-show.jpg');"></div>
       <div class="relative h-full text-center text-white container mx-auto px-4 z-2 mb-24">
          <div class="justify-center flex flex-wrap -mx-4">
             <div class="px-12 px-4 relative w-full md:w-8/12">
                <h1 class="text-5xl font-bold leading-tight mt-0 mb-2">Check our latest items!</h1>
                <p class="text-xl leading-relaxed opacity-75 mt-1 mb-4">Shop now and find your special suits, t-shirts and trousers. Many designers just launched their Autumn/Winter 2021 Collection!</p>
                <button class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2  text-white bg-red-500 border-red-500 active:bg-red-600 active:border-red-600 text-sm px-6 py-2 shadow hover:shadow-lg rounded-md"><i class="fas fa-shopping-cart mr-1"></i> Start shopping</button>
             </div>
          </div>
       </div>
       <div class="w-full bottom-0 absolute z-2">
          <div class="w-full pointer-events-none overflow-hidden h-70-px" style="transform: translateZ(0px);">
             <svg class="absolute bottom-0 overflow-hidden" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" version="1.1" viewBox="0 0 2560 100" x="0" y="0">
                <polygon class="text-white fill-current" points="2560 0 2560 100 0 100"></polygon>
             </svg>
          </div>
       </div>
    </section>
 </div>