class="modal-button w-40 h-10 bg-[#1d1d1d] text-white rounded-md text-xs cursor-pointer font-semibold text-center shadow-xs transition-all duration-500 hover:bg-indigo-700"
                    data-pd-overlay="#subscribe-form-modal" data-modal-target="subscribe-form-modal"
                    data-modal-toggle="subscribe-form-modal">
                    Add Agency
                </button><div class="relative w-full bg-black bg-opacity-80">





    <div id="subscribe-form-modal"
        class="pd-overlay  hidden w-full h-full fixed top-0 left-0 z-[100]  overflow-x-hidden overflow-y-auto bg-black bg-opacity-80">
        <div
            class="w-full p-10 transition-all ease-out opacity-0 md:w-1/2 sm:mx-auto modal-open:opacity-100 modal-open:duration-500">
            <div class="flex flex-col px-5 py-4 bg-white rounded-2xl">
                <div class="flex items-center justify-between pb-4 border-b border-gray-200">
                    <h4 class="text-sm font-medium text-gray-900">Create New Agency</h4>
                    <button class="block cursor-pointer close-modal-button" data-pd-overlay="#subscribe-form-modal"
                        data-modal-target="subscribe-form-modal">
                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                            xmlns="http://www.w3.org/2000/svg">
                            <path d="M7.75732 7.75739L16.2426 16.2427M16.2426 7.75739L7.75732 16.2427" stroke="black"
                                stroke-width="1.6" stroke-linecap="round" />
                        </svg>
                    </button>
                </div>
                <div class="w-full p-8 mx-auto my-10 bg-white border border-gray-200 rounded-lg shadow-md">

                           

                </div>
            </div>
        </div>
    </div>
</div>



  <link href="https://cdn.jsdelivr.net/npm/pagedone@1.2.2/src/css/pagedone.css" rel="stylesheet" />
    <script src="https://cdn.jsdelivr.net/npm/pagedone@1.2.2/src/js/pagedone.js"></script>