<div class="overflow-hidden py-12 sm:py-16">
    <div class="mx-auto max-w-7xl px-6 lg:px-8">
      <div class="mx-auto grid max-w-2xl grid-cols-1 gap-x-8 gap-y-16 sm:gap-y-20 lg:mx-0 lg:max-w-none lg:grid-cols-2">
        <div class="relative lg:col-span-1">
          <img src="images/mesh2.png" alt="Product screenshot" class="w-full h-full object-cover rounded-xl shadow-xl lg:absolute lg:inset-y-0 lg:right-0 lg:w-[50%] lg:max-w-none lg:rounded-l-none">
        </div>
        <div class="lg:pr-8 lg:pt-4">
          <div class="lg:max-w-lg">
            <h2 class="text-base font-semibold leading-7 text-indigo-400">CONCEPT</h2>
            <p class="mt-2 text-3xl font-bold tracking-tight text-white sm:text-4xl">A digital Mesh that Comes Together by Simply Connecting the Dots.</p>
            <dl class="mt-10 max-w-xl space-y-4 text-base leading-7 text-gray-300 lg:max-w-none">
              <div class="relative pl-6">
                <dt class="inline font-semibold text-white text-3xl">
                  A Mesh.
                </dt>
                <dd class="inline">A network of interconnected elements.</dd>
              </div>
              <div class="relative pl-6">
                <dt class="inline font-semibold text-white text-3xl">
                  Come together
                </dt>
                <dd class="inline"> to gather or assemble in one place.</dd>
              </div>
              <div class="relative pl-6">
                <dt class="inline font-semibold text-white text-3xl">
                    Simply 
                </dt>
                <dd class="inline">in a straight forward or uncomplicated way</dd>
              </div>
            </dl>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
