<div class="md:grid md:grid-cols-2 md:gap-9 lg:grid-cols-3">

    <div class="relative w-full ">
        <div class="h-full flex flex-col justify-end pt-60 px-6 pb-6 md:px-8 md:pb-8 xl:px-10 xl:pb-10">
            <div class="absolute top-0 left-0 w-full h-full">

                <div class="relative h-full w-full ">
                    <img class="w-full h-full object-cover" src="/image/placeholder.jpg" alt="" />

                </div>
            </div>

            <div class="relative flex flex-col z-10">

                <p class="text-white text-sm mb-2 text-white leading-customText">Mario Schmidt </p>

                <h5 class="h5 text-white text-left  text-white">
                    Noch Fragen? Gesprächsbedarf? Wir beraten Sie individuell.

                </h5>

                <div class="flex flex-col items-start">

                    <div class="flex flex-row flex-wrap">

                        <a class="btn cursor-pointer inline-flex items-center text-white font-bold mb-4 mr-6 flex-row-reverse justify-end  rounded-none transition-all active:scale-95 hover:rounded-sm hover:brightness-95">

                            <span class="shrink-0">
                                info@apa-gmbh.de
                            </span>

                            <span class="inline-flex items-center w-4 h-4    w-8 ">
                                <?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="18.93" height="18.94" viewBox="0 0 18.93 18.94">
                                    <path id="b" d="m8.22,10.72L.75,6.77C6.18,3.78,12.07,1.75,18.18.75c-1,6.11-3.03,12.01-6.01,17.44l-3.96-7.47h0Zm0,0l4.83-4.83" style="fill:none; stroke:#fff; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                                </svg>
                            </span>

                        </a>

                        <a class="btn cursor-pointer inline-flex items-center text-white font-bold mb-4 flex-row-reverse justify-end  rounded-none transition-all active:scale-95 hover:rounded-sm hover:brightness-95">

                            <span class="shrink-0">
                                +49 6023 9716 0
                            </span>

                            <span class="inline-flex items-center w-4 h-4    w-8 ">
                                <?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="13.5" height="22.5" viewBox="0 0 13.5 22.5">
                                    <path id="b" d="m5.25.75h-2.25C1.76.75.75,1.76.75,3v16.5c0,1.24,1.01,2.25,2.25,2.25h7.5c1.24,0,2.25-1.01,2.25-2.25V3c0-1.24-1.01-2.25-2.25-2.25h-2.25m-3,0v1.5h3V.75m-3,0h3m-3,18.75h3" style="fill:none; stroke:#fff; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                                </svg>
                            </span>

                        </a>
                    </div>

                    <a class="btn cursor-pointer inline-flex items-center text-white font-bold mb-4 flex-row-reverse justify-end  rounded-none transition-all active:scale-95 hover:rounded-sm hover:brightness-95">

                        <span class="shrink-0">
                            +49 6023 9716 11
                        </span>

                        <span class="inline-flex items-center w-4 h-4    w-8 ">
                            <?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="21.98" height="23.69" viewBox="0 0 21.98 23.69">
                                <path id="b" d="m4.98,13.92c-.27.03-.55.07-.82.11m.82-.11c3.99-.5,8.02-.5,12.01,0m-12.01,0l-.43,4.74m12.45-4.74c.27.03.55.07.82.11m-.82-.11l.43,4.74m0,0l.26,2.87c.07.7-.45,1.33-1.15,1.39-.04,0-.08,0-.12,0H5.56c-.71,0-1.28-.57-1.28-1.28,0-.04,0-.08,0-.12l.26-2.87m12.88,0h1.24c1.41,0,2.56-1.15,2.56-2.56h0v-7.16c.01-1.23-.88-2.28-2.09-2.47-.72-.11-1.45-.2-2.18-.28m-12.41,12.47h-1.24c-1.41,0-2.56-1.15-2.56-2.56v-7.16c-.01-1.23.88-2.28,2.09-2.47.72-.11,1.45-.2,2.18-.28m11.95,0c-3.97-.43-7.98-.43-11.94,0m11.94,0V2.03c0-.71-.57-1.28-1.28-1.28H6.3c-.71,0-1.28.57-1.28,1.28v4.16m12.8,3.94h0s0,0,0,0h0Zm-3.41,0h0s0,0,0,0h0Z" style="fill:none; stroke:#fff; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                            </svg>
                        </span>

                    </a>
                </div>

                <div class="flex items-center mb-6">

                    <span class="inline-flex items-center w-4 h-4  text-white  w-8 ">
                        <?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16.5 20.25">
                            <g id="b">
                                <path id="c" d="m11.25,8.25c0,1.66-1.34,3-3,3s-3-1.34-3-3,1.34-3,3-3,3,1.34,3,3Z" style="fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                                <path id="d" d="m15.75,8.25c0,7.14-7.5,11.25-7.5,11.25,0,0-7.5-4.11-7.5-11.25C.75,4.11,4.11.75,8.25.75s7.5,3.36,7.5,7.5Z" style="fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                            </g>
                        </svg>
                    </span>

                    <p class="text-white text-sm font-normal leading-customText">Am Neuen Berg 1 . 63755 Alzenau </p>

                </div>

                <p class="text-white text-sm text-white opacity-50 leading-customText">Sie erreichen uns Mo - Fr von 9 - 17 Uhr. </p>

            </div>
        </div>

        <div class="absolute bottom-0 left-0 w-full h-full bg-gradient-to-b from-transparent to-gray-700 opacity-90 pointer-events-none"></div>
    </div>

    <div class="relative w-full ">
        <div class="h-full flex flex-col justify-end pt-60 px-6 pb-6 md:px-8 md:pb-8 xl:px-10 xl:pb-10">
            <div class="absolute top-0 left-0 w-full h-full">

                <div class="relative h-full w-full ">
                    <img class="w-full h-full object-cover" src="/image/placeholder.jpg" alt="" />

                </div>
            </div>

            <div class="relative flex flex-col z-10">

                <p class="text-white text-sm mb-2 text-white leading-customText">Mario Schmidt </p>

                <h5 class="h5 text-white text-left  text-white">
                    Interesse? Fragen?<br />Wir sind gerne für Sie da.

                </h5>

                <div class="flex flex-col items-start">

                    <a href="/" class="btn cursor-pointer inline-flex items-center mb-4 bg-primary justify-between text-white py-2 px-4 rounded-none transition-all active:scale-95 hover:rounded-sm hover:brightness-95">

                        <span class="shrink-0">
                            Kontakt aufnehmen
                        </span>

                    </a>
                    <div class="flex flex-row flex-wrap">

                        <a href="/" class="btn cursor-pointer inline-flex items-center text-white font-bold mb-4 mr-6 flex-row-reverse justify-end  rounded-none transition-all active:scale-95 hover:rounded-sm hover:brightness-95">

                            <span class="shrink-0">
                                info@apa-gmbh.de
                            </span>

                            <span class="inline-flex items-center w-4 h-4    w-8 ">
                                <?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="18.93" height="18.94" viewBox="0 0 18.93 18.94">
                                    <path id="b" d="m8.22,10.72L.75,6.77C6.18,3.78,12.07,1.75,18.18.75c-1,6.11-3.03,12.01-6.01,17.44l-3.96-7.47h0Zm0,0l4.83-4.83" style="fill:none; stroke:#fff; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                                </svg>
                            </span>

                        </a>

                        <a href="/" class="btn cursor-pointer inline-flex items-center text-white font-bold mb-4 flex-row-reverse justify-end  rounded-none transition-all active:scale-95 hover:rounded-sm hover:brightness-95">

                            <span class="shrink-0">
                                +49 6023 9716 0
                            </span>

                            <span class="inline-flex items-center w-4 h-4    w-8 ">
                                <?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="13.5" height="22.5" viewBox="0 0 13.5 22.5">
                                    <path id="b" d="m5.25.75h-2.25C1.76.75.75,1.76.75,3v16.5c0,1.24,1.01,2.25,2.25,2.25h7.5c1.24,0,2.25-1.01,2.25-2.25V3c0-1.24-1.01-2.25-2.25-2.25h-2.25m-3,0v1.5h3V.75m-3,0h3m-3,18.75h3" style="fill:none; stroke:#fff; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                                </svg>
                            </span>

                        </a>
                    </div>

                </div>

                <div class="flex items-center mb-6">

                    <span class="inline-flex items-center w-4 h-4  text-white  w-8 ">
                        <?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16.5 20.25">
                            <g id="b">
                                <path id="c" d="m11.25,8.25c0,1.66-1.34,3-3,3s-3-1.34-3-3,1.34-3,3-3,3,1.34,3,3Z" style="fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                                <path id="d" d="m15.75,8.25c0,7.14-7.5,11.25-7.5,11.25,0,0-7.5-4.11-7.5-11.25C.75,4.11,4.11.75,8.25.75s7.5,3.36,7.5,7.5Z" style="fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                            </g>
                        </svg>
                    </span>

                    <p class="text-white text-sm font-normal leading-customText">Am Neuen Berg 1 . 63755 Alzenau </p>

                </div>

                <p class="text-white text-sm text-white opacity-50 leading-customText">Sie erreichen uns Mo - Fr von 9 - 17 Uhr. </p>

            </div>
        </div>

        <div class="absolute bottom-0 left-0 w-full h-full bg-gradient-to-b from-transparent to-gray-700 opacity-90 pointer-events-none"></div>
    </div>

    <div class="relative w-full ">
        <div class="h-full flex flex-col justify-end pt-60 px-6 pb-6 md:px-8 md:pb-8 xl:px-10 xl:pb-10">
            <div class="absolute top-0 left-0 w-full h-full">

                <div class="relative h-full w-full ">
                    <img class="w-full h-full object-cover" src="/image/placeholder.jpg" alt="" />

                </div>
            </div>

            <div class="relative flex flex-col z-10">

                <p class="text-white text-sm mb-2 text-white leading-customText">Mario Schmidt </p>

                <h5 class="h5 text-white text-left  text-white">
                    Interesse? Fragen?<br />Wir sind gerne für Sie da.

                </h5>

                <div class="flex flex-col items-start">

                    <div class="flex flex-row flex-wrap">

                        <a class="btn cursor-pointer inline-flex items-center text-white font-bold mb-4 mr-6 flex-row-reverse justify-end  rounded-none transition-all active:scale-95 hover:rounded-sm hover:brightness-95">

                            <span class="shrink-0">
                                info@apa-gmbh.de
                            </span>

                            <span class="inline-flex items-center w-4 h-4    w-8 ">
                                <?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="18.93" height="18.94" viewBox="0 0 18.93 18.94">
                                    <path id="b" d="m8.22,10.72L.75,6.77C6.18,3.78,12.07,1.75,18.18.75c-1,6.11-3.03,12.01-6.01,17.44l-3.96-7.47h0Zm0,0l4.83-4.83" style="fill:none; stroke:#fff; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                                </svg>
                            </span>

                        </a>

                        <a class="btn cursor-pointer inline-flex items-center text-white font-bold mb-4 flex-row-reverse justify-end  rounded-none transition-all active:scale-95 hover:rounded-sm hover:brightness-95">

                            <span class="shrink-0">
                                +49 6023 9716 0
                            </span>

                            <span class="inline-flex items-center w-4 h-4    w-8 ">
                                <?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="13.5" height="22.5" viewBox="0 0 13.5 22.5">
                                    <path id="b" d="m5.25.75h-2.25C1.76.75.75,1.76.75,3v16.5c0,1.24,1.01,2.25,2.25,2.25h7.5c1.24,0,2.25-1.01,2.25-2.25V3c0-1.24-1.01-2.25-2.25-2.25h-2.25m-3,0v1.5h3V.75m-3,0h3m-3,18.75h3" style="fill:none; stroke:#fff; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                                </svg>
                            </span>

                        </a>
                    </div>

                </div>

                <div class="flex items-center mb-6">

                    <span class="inline-flex items-center w-4 h-4  text-white  w-8 ">
                        <?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16.5 20.25">
                            <g id="b">
                                <path id="c" d="m11.25,8.25c0,1.66-1.34,3-3,3s-3-1.34-3-3,1.34-3,3-3,3,1.34,3,3Z" style="fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                                <path id="d" d="m15.75,8.25c0,7.14-7.5,11.25-7.5,11.25,0,0-7.5-4.11-7.5-11.25C.75,4.11,4.11.75,8.25.75s7.5,3.36,7.5,7.5Z" style="fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5px;" />
                            </g>
                        </svg>
                    </span>

                    <p class="text-white text-sm font-normal leading-customText">Am Neuen Berg 1 . 63755 Alzenau . Jetzt Route planen </p>

                </div>

                <p class="text-white text-sm text-white opacity-50 leading-customText">Sie erreichen uns Mo - Fr von 9 - 17 Uhr. </p>

            </div>
        </div>

        <div class="absolute bottom-0 left-0 w-full h-full bg-gradient-to-b from-transparent to-gray-700 opacity-90 pointer-events-none"></div>
    </div>
</div>
<div class="md:grid md:grid-cols-2 md:gap-9 lg:grid-cols-3">
    {% include '@contact-box' with {
            name: "Mario Schmidt",
            fax: "+49 6023 9716 11"
    } %}

    {% include '@contact-box' with {
            name: "Mario Schmidt",
            headline: "Interesse? Fragen?<br/>Wir sind gerne für Sie da.",
            linkLabel: "Kontakt aufnehmen",
            link: "/"
    } %}

     {% include '@contact-box' with {
            name: "Mario Schmidt",
            headline: "Interesse? Fragen?<br/>Wir sind gerne für Sie da.",
            address: "Am Neuen Berg 1   .   63755 Alzenau   .   Jetzt Route planen"
    } %}
</div>
{
  "name": "Mario Henzler",
  "headline": "Noch Fragen? Gesprächsbedarf? Wir beraten Sie individuell.",
  "email": "info@apa-gmbh.de",
  "phone": "+49 6023 9716 0",
  "text": "Sie erreichen uns Mo - Fr von 9 - 17 Uhr.",
  "color": "text-white",
  "address": "Am Neuen Berg 1 . 63755 Alzenau"
}

No notes defined.