Featured Listing

<div class="max-w-6xl mx-auto shadow-lg text-gray-700">

    <div class="border-b-2 border-gray-300">
        <div class="border-b-4 border-green-500 py-2 px-4 bg-gray-800">
            <p class="text-xl text-white font-hairline">Blackstone Mountain Lodge</p>
        </div>
        <div class="w-full py-4">
            <div class="text-center flex flex-row">
                <a class="hover:text-green-500 transition duration-200 sm:mx-8 w-1/4" href="">
                    <i class="text-3xl fas fa-phone-alt"></i>
                    <p class="text-sm sm:text-base">Phone</p>           
                </a>
                <a class="hover:text-green-500 transition duration-200 sm:mx-8 w-1/4" href="">
                    <i class="text-3xl fas fa-map-marker-alt"></i>
                    <p class="text-sm sm:text-base">Map</p>
                </a>
                <a class="hover:text-green-500 transition duration-200 sm:mx-8 w-1/4" href="">
                    <i class="text-3xl fas fa-globe-americas"></i>
                    <p class="text-sm sm:text-base">Website</p>
                </a>
                <a class="hover:text-green-500 transition duration-200 sm:mx-8 w-1/4" href="">
                    <i class="text-3xl fas fa-dollar-sign"></i>
                    <p class="text-sm sm:text-base">Specials</p>
                </a>
            </div>
        </div>
    </div>

    <div class="flex flex-col md:flex-row-reverse">

        <div class="flex flex-wrap px-2 pb-4 pt-4">
                <a class="w-1/4 md:w-1/2 px-1" href="">
                    <img class="md:hidden" src="https://via.placeholder.com/120x90" alt="">
                    <img class="hidden md:block md:py-1" src="https://via.placeholder.com/160x110" alt="">
                </a>
                <a class="w-1/4 md:w-1/2 px-1" href="">
                    <img class="md:hidden" src="https://via.placeholder.com/120x90" alt="">
                    <img class="hidden md:block md:py-1" src="https://via.placeholder.com/160x110" alt="">
                </a>
                <a class="w-1/4 md:w-1/2 px-1" href="">
                    <img class="md:hidden" src="https://via.placeholder.com/120x90" alt="">
                    <img class="hidden md:block md:py-1" src="https://via.placeholder.com/160x110" alt="">
                </a>
                <a class="w-1/4 md:w-1/2 px-1" href="">
                    <img class="md:hidden" src="https://via.placeholder.com/120x90" alt="">
                    <img class="hidden md:block md:py-1" src="https://via.placeholder.com/160x110" alt="">
                </a>
        </div>

        <div class="px-6 font-light pt-4">

            <div>
                <p>
                    A luxurious Rocky Mountain retreat awaits you at Blackstone Mountain Lodge– Canmore’s premier condo-style hotel. Our spacious fully equipped suites… read more
                </p>
            </div>

            <div class="mt-4">
                <p class="mb-2">
                    170 Kananaskis Way, Canmore, Alberta 
                </p>
                <a href="tel:403-609-8098">403.609.8098</a>
            </div>

            <div class="mt-4 font-hairline">
                <button class="transition-all duration-200 ease-in-out bg-green-500 hover:bg-green-700 text-white py-2 px-4 rounded">
                    Visit Website
                </button>
            </div>

            <div class="text-xl py-4 text-gray-500">
                <a class="mx-2" href="">
                    <i class="fab fa-facebook-f"></i>
                </a>
                <a class="mx-2" href="">
                    <i class="fab fa-tripadvisor"></i>
                </a>
                <a class="mx-2" href="">
                    <i class="fab fa-instagram"></i>
                </a>
            </div>

        </div>

    </div>

</div>