<div class="flex items-center justify-center"> <div class="m-2 max-w-5xl items-center"> <div class="flex flex-col items-center"> <img class="flex m-1" src="https://dummyimage.com/150x50" /> <div class="m-2"> <a href="#" class="w-9 h-10 text-center border-current border-2 text-violet-600 hover:text-black pt-1 inline-block"><i class="fa fa-facebook m-2"></i></a> <a href="#" class="w-9 h-10 text-center border-current border-2 text-blue-600 hover:text-black pt-1 inline-block"><i class="fa fa-twitter m-2"></i></a> <a href="#" class="w-9 h-10 text-center border-current border-2 text-rose-600 hover:text-black pt-1 inline-block"><i class="fa fa-reddit m-2"></i></a> <a href="#" class="w-9 h-10 text-center border-current border-2 text-red-600 hover:text-black pt-1 inline-block"><i class="fa fa-pinterest m-2"></i></a> <a href="#" class="w-9 h-10 text-center border-current border-2 text-orange-600 hover:text-black pt-1 inline-block"><i class="fa fa-quora m-2"></i></a> </div> <div class="flex md:flex-row flex-col"> <p class="hover:text-blue-600 text-gray-500 font-medium m-2"> <a href="#">Home</a> </p> <p class="hover:text-blue-600 text-gray-500 font-medium m-2"> <a href="#">About us </a> </p> <p class="hover:text-blue-600 text-gray-500 font-medium m-2"> <a href="#">Services </a> </p> <p class="hover:text-blue-600 text-gray-500 font-medium m-2"> <a href="#">Contact Us </a> </p> <p class="hover:text-blue-600 text-gray-500 font-medium m-2"> <a href="#"> Privacy Policy </a> </p> </div> <div class="text-gray-500 font-medium mt-4 text-xs"> Copyright 2022. All rights reserved by <a href="#" class="text-blue-600">Tailwind CSS</a> </div> </div> </div> </div> <script src="https://use.fontawesome.com/03f8a0ebd4.js"></script> <script src="https://cdn.tailwindcss.com"></script>