Images

<div class="w-1/4 sm:w-2/12 md:w-1/12">
    <img alt="..." class="rounded-full w-full" src="https://demos.creative-tim.com/notus-pro-react/static/media/team-1.26905a67.jpg">
    <div class="hidden " data-popper-placement="top" style="position: absolute; inset: auto auto 0px 0px; margin: 0px; transform: translate(708px, -793px);">
       <div class="border-0 mb-3 block z-50 font-normal leading-normal text-sm text-left no-underline break-words rounded">
          <div class="py-1 px-2 text-center rounded text-white bg-black">Ray Tompson</div>
       </div>
    </div>
 </div>

<div class="ml-8">
    <div class="flex items-center">
       <div>
          <a class="text-white bg-blueGray-500 inline-flex items-center justify-center shadow-lg rounded rounded-full relative border-2 border-white -ml-4 hover:z-1 w-6 h-6" href="javascript:;">
             <img alt="..." class="rounded-full w-full" src="https://demos.creative-tim.com/notus-pro-react/static/media/team-1.26905a67.jpg">
             <div class="hidden ">
                <div class="border-0 mb-3 block z-50 font-normal leading-normal text-sm text-left no-underline break-words rounded">
                   <div class="py-1 px-2 text-center rounded text-white bg-black">Ray Tompson</div>
                </div>
             </div>
          </a>
          <a class="text-white bg-blueGray-500 inline-flex items-center justify-center shadow-lg rounded rounded-full relative border-2 border-white -ml-4 hover:z-1 w-6 h-6" href="javascript:;">
             <img alt="..." class="rounded-full w-full" src="https://demos.creative-tim.com/notus-pro-react/static/media/team-2.b81557ef.jpg">
             <div class="hidden ">
                <div class="border-0 mb-3 block z-50 font-normal leading-normal text-sm text-left no-underline break-words rounded">
                   <div class="py-1 px-2 text-center rounded text-white bg-black">Romina Hadid</div>
                </div>
             </div>
          </a>
          <a class="text-white bg-blueGray-500 inline-flex items-center justify-center shadow-lg rounded rounded-full relative border-2 border-white -ml-4 hover:z-1 w-6 h-6" href="javascript:;">
             <img alt="..." class="rounded-full w-full" src="https://demos.creative-tim.com/notus-pro-react/static/media/team-3.c5d0c11c.jpg">
             <div class="hidden ">
                <div class="border-0 mb-3 block z-50 font-normal leading-normal text-sm text-left no-underline break-words rounded">
                   <div class="py-1 px-2 text-center rounded text-white bg-black">Alexander Smith</div>
                </div>
             </div>
          </a>
       </div>
       <small class="pl-2 font-bold mb-1">and 30+ more</small>
    </div>
 </div>

<div class="w-full"><img src="https://demos.creative-tim.com/notus-pro-react/static/media/new-york-city.d7a444b7.jpg" alt="..." class="rounded-lg shadow-lg w-850-px"></div>