<div class="py-8">
    <p class="uppercase text-4xl text-center tracking-widest text-purple-900">compare RoOm tYPEs</p>

    <div class="font-normal mx-auto max-w-3xl py-8 text-gray-800">
        <table class="table-auto">
            <thead>
                <tr class="bg-gray-100">
                    <th class="px-12">  </th>
                    <th class="px-8 py-2">Studio Suite</th>
                    <th class="px-8">One Bedroom Suite</th>
                    <th class="px-8">Two Bedroom Suite</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td class="px-2 py-2">Private Bedroom</td>
                    <td class="text-center"> - </td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                </tr>
                <tr class="bg-gray-100">
                    <td class="px-2 py-2">Two Bathrooms</td>
                    <td class="text-center"> - </td>
                    <td class="text-center"> - </td>
                    <td class="text-center">some rooms</td>
                </tr>
                <tr>
                    <td class="px-2 py-2">Sofa Pull-out Bed</td>
                    <td class="text-center">some rooms</td>
                    <td class="text-center">some rooms</td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                </tr>
                <tr class="bg-gray-100">
                    <td class="px-2 py-2">Full Kitchen</td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                </tr>
                <tr>
                    <td class="px-2 py-2">Seating Area</td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                </tr>
                <tr class="bg-gray-100">
                    <td class="px-2 py-2">Fireplace</td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                    <td class="text-center"><i class="fas fa-check"></i></td>
                </tr>
            </tbody>
        </table>
    </div>

    <div>
        <p class="italic text-center text-md text-gray-700">Balconies are included in partial and lake view suites.</p>
    </div>

</div>