TailwindsCSS Responsive Card

<div>
<div class="pl-5 pr-5 pt-5 justify-center">

  <div>


<div class="max-w-sm w-full lg:max-w-full lg:flex md:max-w-full md:flex bg-black bg-opacity-70 rounded">
  <div class="h-60 lg:h-auto lg:w-60 md:h-auto md:w-60 flex-none bg-cover rounded lg:rounded-t-none lg:rounded-l text-center overflow-hidden" style="background-image: url('YOURIMAGEURLHERE')">
  </div>
  <div class="justify-between rounded-b lg:rounded lg:rounded-r p-4 flex  leading-normal flex-col ">
    <div>
      <div class="text-xl mb-2 pl-1 text-white"><i class="fas fa-user text-2xl mr-5"></i>

TITLE

</div>
      <div class="bg-black bg-opacity-30 text-gray-200 pt-2 pb-2 pl-1 pr-1 text-xs"><p>

Subtitle

</p></div>
<hr>
      <p class="text-gray-200 font-light tracking-normal text-sm mt-3">

        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec porta arcu eu eros efficitur, eget tempus nibh vulputate. Duis eros enim, semper eu luctus in, gravida non dui. Aliquam consectetur, quam id faucibus efficitur, metus justo varius enim, ac fermentum ipsum justo vitae nulla. Maecenas ac nunc metus. Praesent aliquam nec erat eu rhoncus.

        </p>
        <hr>
        <div class="flex flex-row justify-evenly text-2xl">
                <a href="https://twitter.com/" class="h:opacity-80 hover:text-white" rel="nofollow"><i class="fab fa-twitter-square text-2xl"></i></a>
                <a href="https://tumblr.com" class="h:opacity-80 hover:text-white" rel="nofollow"><i class="fab fa-tumblr-square text-2xl"></i></a>
                <a href="https://reddit.com/" class="h:opacity-80 hover:text-white" rel="nofollow"><i class="fab fa-reddit-square text-2xl"></i></a>
                <a href="https://youtube.com/" class="h:opacity-80 hover:text-white" rel="nofollow"><i class="fab fa-youtube-square text-2xl"></i></a>
            </div>
    </div>
  </div>
</div>






</div>
</div>
</div>

    <p class="ml-5 mb-5">
<a href="https://buzzly.art/~Voskhod" rel="nofollow"><i class="fas fa-code text-sm pt-5"></i></a>
    </p>