<main class="py-2 text-lime-500">
    <div class="mb-2 text-center bg-transparent md:grid">
        <p class="font-mono text-2xl font-bold uppercase md:text-base">Pending Services</p>
    </div>
</main>

<!-- Services list -->
<section class="flex items-center justify-center p-12 px-3 pt-4 m-4">
    {{if .Services}}
    <div class="grid max-w-6xl grid-cols-1 gap-3 md:grid-cols-3 lg:grid-cols-3">
        {{range .Services}}
            {{partial "partials/service_card" .}}
        {{end}}
    </div>
    {{else}}
        <h2 class="my-8 text-xl font-bold text-center">No pending services.</h2>
    {{end}}
</section>