{"id":335,"date":"2024-08-27T07:52:38","date_gmt":"2024-08-27T07:52:38","guid":{"rendered":"https:\/\/devwp02.visibleone.io\/vowp\/?page_id=335"},"modified":"2024-11-26T07:33:20","modified_gmt":"2024-11-26T07:33:20","slug":"quotation","status":"publish","type":"page","link":"https:\/\/devwp02.visibleone.io\/vowp\/quotation\/","title":{"rendered":"Quotation"},"content":{"rendered":"\n<div id=\"\" class=\"VOHeroV2 module_container  pt-[43px] md:pt-[61px] xl:pt-[65px] 2xl:pt-[74px] text-primary\">\n    <div class=\" relative overflow-hidden px-4 md:px-8 lg:px-24 2xl:px-36  py-16 pb-8 xl:py-20  \">\n        <div class=\"absolute right-0 top-0\">\n            <img decoding=\"async\" width=\"100\" height=\"100\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/themes\/visibleone\/public\/images\/aboutus\/visible-one_68fd8708.svg\" alt=\"\" aria-hidden=\"true\" loading=\"lazy\" class=\"w-[100px] md:w-[150px] lg:w-[180px] xl:w-[200px]\"\/>\n        <\/div>\n        <div class=\"hidden xl:block absolute right-[180px] top-[160px]\">\n            <img decoding=\"async\" width=\"350\" height=\"100\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/themes\/visibleone\/public\/images\/aboutus\/line_4aa497fd.svg\" alt=\"\" aria-hidden=\"true\" loading=\"lazy\" class=\"w-[350px]\"\/>\n        <\/div>\n        <div class=\"w-full\">\n            <div class=\"w-full lg:w-[70%] xl:w-[60%] \">\n            <span class=\"uppercase tracking-widest font-medium fs-2xl\">QUOTATION<\/span>                <div class=\"font-semibold md:w-[80%] lg:w-[90%] mt-2 fs-6xl lg:leading-tight\">\n                    <h1>Request a Quote<\/h1>\n                                        \n                <\/div>\n                <div class=\"my-4 md:my-8 h-2 w-16 bg-themeSecondaryDark\"><\/div>\n                <div class=\"font-light text-secondary fs-lg\">\n                    <div class=\"mt-4 md:mt-8\"><p>We are a web design agency who creates bespoke solutions for you and your brand. So the more information you can give us, the more accurate the quotation will be.<\/p>\n<\/div>\n                    <div class=\"mt-4\"><p>If you\u2019d prefer to meet face-to-face, that\u2019s cool, fill in the form below and we\u2019ll be in touch as soon as possible or alternatively ring our Project Team (852) 3616 6069 or email us: info@visibleone.com.hk<\/p>\n<\/div>                <\/div>\n                            <\/div>\n            <button aria-label=\"go to bottom\" class=\"cursor-pointer relative z-10 float-right mt-4 arrow-button\">\n                <img decoding=\"async\" width=\"50\" height=\"66\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/themes\/visibleone\/public\/images\/aboutus\/downArrow_bc7cafe1.svg\" alt=\"go to below section\" loading=\"lazy\" class=\"w-[60%] md:w-[70%] xl:w-[80%] 2xl:w-[90%] mx-auto\"\/>\n            <\/button>\n        <\/div>\n    <\/div>\n    <\/div>\n\n<script>\n    document.addEventListener(\"DOMContentLoaded\", function() {\n        const heroElement = document.querySelector('.VOHeroV2'); \n\n        function arrowHandler() {\n        if (heroElement) {\n            window.scrollTo(0, heroElement.scrollHeight);\n        }\n        }\n        document.querySelector('.VOHeroV2 .arrow-button').addEventListener('click', arrowHandler);\n    });\n<\/script>\n\n\n<style>\n\t.g-recaptcha > div {\n\t\twidth: 100%!important;\n\t}\n\n\t@media(max-width: 420px) {\n\t\t.g-recaptcha iframe {\n\t\t\ttransform: scale(0.9);\n\t\t\ttransform-origin: left;\n\t\t}\n\t}\n<\/style>\n\n<div id=\"VOQuotation\" class=\"lg:py-16 md:py-12 py-8 px-4 relative main-layout\"\n    style=\"background-color: rgb(255, 255, 255);\">\n    <div class=\"mx-auto max-w-screen-2xl 3xl:max-w-screen-3xl\">\n        <div class=\"flex items-center justify-center xl:px-40 stepContainer\">\n            <div class=\"navStepItem flex items-center flex-1\">\n                            <span class=\"fs-2xl font-semibold xl:w-[61px] xl:h-[61px] md:w-[55px] md:h-[55px] sm:w-[50px] sm:h-[50px] w-[35px] h-[35px] navigate-steps\">1<\/span>\n                            <div class=\"relative flex-1\">\n                                <div class=\"h-[1px] w-full bg-gray-400\"><\/div>\n                                <div class=\"joint\" ><\/div>\n                            <\/div>\n                        <\/div><div class=\"navStepItem flex items-center flex-1\">\n                            <span class=\"fs-2xl font-semibold xl:w-[61px] xl:h-[61px] md:w-[55px] md:h-[55px] sm:w-[50px] sm:h-[50px] w-[35px] h-[35px] navigate-steps\">2<\/span>\n                            <div class=\"relative flex-1\">\n                                <div class=\"h-[1px] w-full bg-gray-400\"><\/div>\n                                <div class=\"joint\" ><\/div>\n                            <\/div>\n                        <\/div><div class=\"navStepItem flex items-center flex-1\">\n                            <span class=\"fs-2xl font-semibold xl:w-[61px] xl:h-[61px] md:w-[55px] md:h-[55px] sm:w-[50px] sm:h-[50px] w-[35px] h-[35px] navigate-steps\">3<\/span>\n                            <div class=\"relative flex-1\">\n                                <div class=\"h-[1px] w-full bg-gray-400\"><\/div>\n                                <div class=\"joint\" ><\/div>\n                            <\/div>\n                        <\/div><div class=\"navStepItem flex items-center flex-1\">\n                            <span class=\"fs-2xl font-semibold xl:w-[61px] xl:h-[61px] md:w-[55px] md:h-[55px] sm:w-[50px] sm:h-[50px] w-[35px] h-[35px] navigate-steps\">4<\/span>\n                            <div class=\"relative flex-1\">\n                                <div class=\"h-[1px] w-full bg-gray-400\"><\/div>\n                                <div class=\"joint\" ><\/div>\n                            <\/div>\n                        <\/div><div class=\"navStepItem flex items-center flex-1\">\n                            <span class=\"fs-2xl font-semibold xl:w-[61px] xl:h-[61px] md:w-[55px] md:h-[55px] sm:w-[50px] sm:h-[50px] w-[35px] h-[35px] navigate-steps\">5<\/span>\n                            <div class=\"relative flex-1\">\n                                <div class=\"h-[1px] w-full bg-gray-400\"><\/div>\n                                <div class=\"joint\" ><\/div>\n                            <\/div>\n                        <\/div><div class=\"navStepItem flex items-center \">\n                            <span class=\"fs-2xl font-semibold xl:w-[61px] xl:h-[61px] md:w-[55px] md:h-[55px] sm:w-[50px] sm:h-[50px] w-[35px] h-[35px] navigate-steps\">6<\/span>\n                            <div class=\"relative flex-1\">\n                                <div class=\"h-[1px] w-full bg-gray-400\"><\/div>\n                                <div class=\"joint\" ><\/div>\n                            <\/div>\n                        <\/div>        <\/div>\n        <div class=\"mt-8 md:mt-16 2xl:px-24 xl:px-14 FormContainer\">\n            <div id=\"FormStepOne\" class=\"flex sm:flex-row flex-col-reverse items-stretch form-one stepForm\">\n                <div class=\"md:flex-[3] flex-1 sm:mt-0 mt-6 textContainer\">\n                    <form class=\"flex-1\" data-hs-cf-bound=\"true\">\n                        <div class=\"sm:flex\">\n                            <div class=\"flex-1 mb-5 sm:mr-5\">\n                                <fieldset>\n                                    <legend class=\"w-full\">\n                                        <label for=\"firstname\" class=\"font-normal fs-lg\">First Name*<\/label>\n                                        <input id=\"firstname\" required type=\"text\" name=\"firstname\" placeholder=\"First Name\" class=\"px-3 py-3 font-normal fs-lg xl:px-4 xl:py-5\" value=\"\">\n                                    <\/legend>\n                                <\/fieldset>                                \n                                <p class=\"text-sm text-red-500 error\">This field is required.<\/p>\n                            <\/div>\n                            <div class=\"flex-1 mb-5\">\n                                <fieldset>\n                                    <legend class=\"w-full\">\n                                        <label for=\"lastname\" class=\"font-normal fs-lg\">Last Name*<\/label>\n                                        <input id=\"lastname\" type=\"text\" name=\"lastname\" placeholder=\"Last Name\" class=\"px-3 py-3 font-normal fs-lg xl:px-4 xl:py-5\" value=\"\">\n                                    <\/legend>\n                                <\/fieldset>  \n                                <p class=\"text-sm text-red-500 error\">This field is required.<\/p>\n                            <\/div>\n                        <\/div>\n                        <div class=\"flex-1 mb-5\">\n                            <fieldset>\n                                <legend class=\"w-full\">\n                                    <label for=\"erroremailInputExtra\" class=\"font-normal fs-lg\">Email*<\/label>\n                                    <input type=\"email\" id=\"erroremailInputExtra\" name=\"email\" placeholder=\"Email\" class=\"px-3 py-3 font-normal fs-lg xl:px-4 xl:py-5\" value=\"\">\n                                <\/legend>\n                            <\/fieldset>\n                            <p class=\"text-sm text-red-500 error\">This field is required.<\/p>\n                            <p class=\"text-sm text-red-500 validerror\" style=\"color: red; display: none;\"\n                                id=\"errormessagenotice\">Please provide valid email.<\/p>\n                        <\/div>\n                        <div class=\"flex-1 mb-5\">\n                            <fieldset>\n                                <legend class=\"w-full\">\n                                    <label for=\"phone\" class=\"font-normal fs-lg\">Phone Number*<\/label>\n                                    <input type=\"text\" id=\"phone_custom\" name=\"phone_custom\" placeholder=\"Phone Number\" class=\"px-3 py-3 font-normal fs-lg xl:px-4 xl:py-5\" value=\"\">\n                                    <input type=\"text\" id=\"phone\" name=\"phone\" placeholder=\"Phone Number\" class=\"px-3 py-3 font-normal fs-lg xl:px-4 xl:py-5 hidden\" value=\"\">\n                                <\/legend>\n                            <\/fieldset>\n                            <p class=\"text-sm text-red-500 error\">This field is required.<\/p>\n                        <\/div>\n                        <div class=\"flex-1 mb-5\">\n                            <fieldset>\n                                <legend class=\"w-full\">\n                                    <label for=\"existing_website\" class=\"font-normal fs-lg\">Your current website (if any)<\/label>\n                                    <input id=\"existing_website\" type=\"text\" name=\"existing_website\" placeholder=\"Website URL\" class=\"px-3 py-3 font-normal fs-lg xl:px-4 xl:py-5\" value=\"\">\n                                <\/legend>\n                            <\/fieldset>\n                        <\/div>\n                        <div class=\"flex-1 mb-5\">\n                            <fieldset>    \n                                <legend class=\"w-full\">      \n                                    <label for=\"main_competitor\" class=\"font-normal fs-lg\">Main Competitor (if any)<\/label>\n                                    <input id=\"main_competitor\" type=\"text\" name=\"main_competitor\" placeholder=\"Website URL\" class=\"px-3 py-3 font-normal fs-lg xl:px-4 xl:py-5\" value=\"\">                         \n                                <\/legend>\n                            <\/fieldset>   \n                        <\/div>  \n                        <div class=\"g-recaptcha\" data-sitekey=\"6Lf9zp0sAAAAAI1HmfhtGtP26mMU5n14ZJdNucjN\"><\/div>                        \n                        <div class=\"flex-1 flex items-center xl:mt-10 mt-5 justify-end\"><button class=\"xl:text-xl md:text-lg text-base font-semibold NavigationBtn submit-btn\">Next<\/button><\/div>\n                    <\/form>\n                <\/div>\n                <div class=\"md:flex-[2] flex-1 flex items-center justify-center xl:pl-10 md:pl-5 imgContaniner\">\n                    <div class=\"sm:w-full w-[180px]\"><img decoding=\"async\" width=\"610\" height=\"739\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/uploads\/2024\/09\/talking-bee_a8833473.webp\" alt=\"24-hour responsive service icon in visible one\" loading=\"lazy\" title=\"\"><\/div>                <\/div>\n            <\/div>\n            <div id=\"FormStepTwo\" class=\"flex sm:flex-row flex-col-reverse items-stretch stepForm\">\n                <div class=\"md:flex-[3] flex-1 sm:mt-0 mt-6 textContainer\">\n                    <h2 class=\"fs-2xl font-semibold mb-5\">Which services do you require?<\/h2>\n                    <p class=\"text-sm text-red-500 error\">Please select at least one <\/p>\n                    <form class=\"flex-1\" data-hs-cf-bound=\"true\">\n                        <div class=\"flex flex-wrap\">\n                            <div class=\"flex flex-wrap -mx-2 full\">\n                                <div class=\"serviceItem lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">CMS Ready Website<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"serviceItem lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">CMS eCommerce Website<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"serviceItem lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">Customized Website<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"serviceItem lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">360 Virtual Tour<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"serviceItem lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">Digital Marketing<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"serviceItem lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">Animation \/ Video<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"serviceItem lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">Website Maintanance<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"serviceItem lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">SSL<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"serviceItem lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">Others<\/p>\n                                                <\/div>\n                                            <\/div>                            <\/div>\n                        <\/div>\n                        <div class=\"flex-1 flex items-center xl:mt-10 mt-5 justify-between\">\n                            <div class=\"fs-xl text-dark\/75 flex items-center cursor-pointer backIcon\">\n                                <div class=\"mr-5\"><img decoding=\"async\"\n                                        src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/themes\/visibleone\/public\/images\/quotation\/quotation-form-back_4b983911.png\"\n                                        alt=\"\" aria-hidden=\"true\" loading=\"lazy\"><\/div>\n                                <div class=\"fs-xl font-normal \">Back<\/div>\n                            <\/div><button\n                                class=\"xl:text-xl md:text-lg text-base font-semibold NavigationBtn submit-btn \">Next<\/button>\n                        <\/div>\n                    <\/form>\n                <\/div>\n                <div class=\"md:flex-[2] flex-1 flex items-center justify-center xl:pl-10 md:pl-5 imgContaniner\">\n                    <div class=\"sm:w-full w-[180px]\"><img decoding=\"async\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/uploads\/2024\/09\/exploring-bee_0d58b30f.webp\" alt=\"24-hour responsive service icon in visible one\" loading=\"lazy\" title=\"\"><\/div>\n                <\/div>\n            <\/div>\n            <div id=\"FormStepThree\" class=\"flex sm:flex-row flex-col-reverse items-stretch stepForm \">\n                <div class=\"md:flex-[3] flex-1 sm:mt-0 mt-6 textContainer\">\n                    <h2 class=\"fs-2xl font-semibold mb-5\">A guide budget would help us advise on how best you can invest your money<\/h2>\n                    <p class=\"text-sm text-red-500 error\"><\/p>\n                    <form class=\"flex-1\" data-hs-cf-bound=\"true\">\n                        <div class=\"flex flex-wrap\">\n                            <div class=\"flex flex-wrap -mx-2 w-full\">\n                                <div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                            <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00\">\n                                                <div class=\"img-wrapper\">\n                                                <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                        <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                    <\/svg><\/div>\n                                                <p class=\"fs-lg name\"><5,000<\/p>\n                                            <\/div>\n                                        <\/div><div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                            <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00\">\n                                                <div class=\"img-wrapper\">\n                                                <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                        <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                    <\/svg><\/div>\n                                                <p class=\"fs-lg name\">5,000 &#8211; 15,000<\/p>\n                                            <\/div>\n                                        <\/div><div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                            <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00\">\n                                                <div class=\"img-wrapper\">\n                                                <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                        <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                    <\/svg><\/div>\n                                                <p class=\"fs-lg name\">15,000 &#8211; 30,000<\/p>\n                                            <\/div>\n                                        <\/div><div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                            <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00\">\n                                                <div class=\"img-wrapper\">\n                                                <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                        <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                    <\/svg><\/div>\n                                                <p class=\"fs-lg name\">30,001 &#8211; 50,000<\/p>\n                                            <\/div>\n                                        <\/div><div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                            <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00\">\n                                                <div class=\"img-wrapper\">\n                                                <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                        <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                    <\/svg><\/div>\n                                                <p class=\"fs-lg name\">50,001 &#8211; 100,000<\/p>\n                                            <\/div>\n                                        <\/div>                            <\/div>\n                        <\/div>\n                        <div class=\"flex-1 flex items-center xl:mt-10 mt-5 justify-between\">\n                            <div class=\"fs-xl text-dark\/75 flex items-center cursor-pointer backIcon\">\n                                <div class=\"mr-5\"><img decoding=\"async\"\n                                        src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/themes\/visibleone\/public\/images\/quotation\/quotation-form-back_4b983911.png\"\n                                        alt=\"\" aria-hidden=\"true\" loading=\"lazy\"><\/div>\n                                <div class=\"fs-xl font-normal \">Back<\/div>\n                            <\/div><button\n                                class=\"xl:text-xl md:text-lg text-base font-semibold NavigationBtn submit-btn\">Next<\/button>\n                        <\/div>\n                    <\/form>\n                <\/div>\n                <div class=\"md:flex-[2] flex-1 flex items-center justify-center xl:pl-10 md:pl-5 imgContaniner\">\n                    <div class=\"sm:w-full w-[180px]\"><img decoding=\"async\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/uploads\/2024\/09\/calculating-bee_083dab92.webp\" alt=\"24-hour responsive service icon in visible one\" loading=\"lazy\" title=\"\">                    <\/div>\n                <\/div>\n            <\/div>\n            <div id=\"FormStepFour\" class=\"flex sm:flex-row flex-col-reverse items-stretch stepForm form-four\">\n                <div class=\"md:flex-[3] flex-1 sm:mt-0 mt-6 textContainer\">\n                    <h2 class=\"fs-2xl font-semibold mb-5\">What&#8217;s your estimated timeline for this project?<\/h2>\n                    <form class=\"flex-1 pt-5\" data-hs-cf-bound=\"true\">\n                        <div class=\"sm:flex\">\n                            <div class=\"flex-1 mb-5 sm:mr-5\">\n                                <span class=\"2xl:text-lg md:text-base text-sm font-normal text-[#A2AABB]\">Start By<\/span>\n                                <div id=\"startDate\" class=\"relative w-full\">\n                                   <fieldset>\n                                    <legend>\n                                    <label for=\"startDate\" class=\"hidden\">startDate<\/label>\n                                    <input id=\"startDate\" type=\"date\" name=\"startDate\" placeholder=\"Start Date\" min=\"2024-09-22\">\n                                    <\/legend>\n                                   <\/fieldset>\n                                    <div class=\"2xl:text-lg md:text-base text-sm font-normal xl:px-4 xl:py-5 px-3 py-3 flex items-center date-box\">\n                                        <p class=\"flex-1 startDate\">2024-09-22<\/p><img decoding=\"async\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/themes\/visibleone\/public\/images\/quotation\/quotation-calender_0082e92e.png\" alt=\"\" aria-hidden=\"true\" loading=\"lazy\">\n                                    <\/div>\n                                    <p class=\"text-sm text-red-500 error\">This field is required.<\/p>\n                                <\/div>\n                            <\/div>\n                            <div class=\"flex-1 mb-5\"><span class=\"2xl:text-lg md:text-base text-sm font-normal text-[#A2AABB]\">End By<\/span>\n                                <div class=\"relative w-full\">\n                                <fieldset>\n                                    <legend>\n                                        <label for=\"endDate\" class=\"hidden\">endDate<\/label>\n                                        <input id=\"endDate\" type=\"date\" name=\"endDate\" placeholder=\"End Date\" min=\"2024-09-22\">\n                                    <\/legend>\n                                   <\/fieldset>\n                                    <div class=\"2xl:text-lg md:text-base text-sm font-normal xl:px-4 xl:py-5 px-3 py-3 flex items-center date-box\">\n                                        <p class=\"flex-1 endDate\">2024-09-22<\/p><img decoding=\"async\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/themes\/visibleone\/public\/images\/quotation\/quotation-calender_0082e92e.png\" alt=\"\" aria-hidden=\"true\" loading=\"lazy\">\n                                    <\/div>\n                                    <p class=\"text-sm text-red-500 error\">This field is required.<\/p>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                        <div class=\"flex-1 flex items-center xl:mt-10 mt-5 justify-between\">\n                            <div class=\"fs-xl text-dark\/75 flex items-center cursor-pointer backIcon\">\n                                <div class=\"mr-5\"><img decoding=\"async\"\n                                        src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/themes\/visibleone\/public\/images\/quotation\/quotation-form-back_4b983911.png\"\n                                        alt=\"\" aria-hidden=\"true\" loading=\"lazy\"><\/div>\n                                <div class=\"fs-xl font-normal \">Back<\/div>\n                            <\/div><button\n                                class=\"xl:text-xl md:text-lg text-base font-semibold NavigationBtn submit-btn\">Next<\/button>\n                        <\/div>\n                    <\/form>\n                <\/div>\n                <div class=\"md:flex-[2] flex-1 flex items-center justify-center xl:pl-10 md:pl-5 imgContaniner\">\n                    <div class=\"sm:w-full w-[180px]\"><img decoding=\"async\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/uploads\/2024\/09\/scheduling-bee_f531eed2.webp\" alt=\"24-hour responsive service icon in visible one\" loading=\"lazy\" title=\"\">                    <\/div>\n                <\/div>\n            <\/div>\n            <div id=\"FormStepFive\" class=\"flex sm:flex-row flex-col-reverse items-stretch stepForm form-five\">\n                <div class=\"md:flex-[3] flex-1 sm:mt-0 mt-6 textContainer\">\n                    <h2 class=\"fs-2xl font-semibold mb-5\">Project Summary<\/h2>\n                    <form class=\"flex-1\" data-hs-cf-bound=\"true\">\n                        <fieldset class=\"w-full\">\n                            <legend class=\"w-full\">\n                                <label for=\"message\" class=\"hidden\">Message<\/label>\n                                <textarea id=\"message\" name=\"message\" placeholder=\"eg: I would like to create an ecommerce website with amazing function especially helps....\" class=\"px-3 py-3 text-sm font-normal 2xl:text-lg md:text-base xl:px-4 xl:py-5\" rows=\"5\"><\/textarea>\n                            <\/legend>\n                        <\/fieldset>\n                        \n                        <div class=\"flex-1 flex items-center xl:mt-10 mt-5 justify-between\">\n                            <div class=\"fs-xl text-dark\/75 flex items-center cursor-pointer backIcon\">\n                                <div class=\"mr-5\"><img decoding=\"async\"\n                                        src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/themes\/visibleone\/public\/images\/quotation\/quotation-form-back_4b983911.png\"\n                                        alt=\"\" aria-hidden=\"true\" loading=\"lazy\"><\/div>\n                                <div class=\"fs-xl font-normal \">Back<\/div>\n                            <\/div><button\n                                class=\"fs-xl font-normal ml-auto mr-5 NavigationBtn skip-btn\">Skip<\/button><button\n                                class=\"xl:text-xl md:text-lg text-base font-semibold NavigationBtn submit-btn\">Next<\/button>\n                        <\/div>\n                    <\/form>\n                <\/div>\n                <div class=\"md:flex-[2] flex-1 flex items-center justify-center xl:pl-10 md:pl-5 imgContaniner\">\n                    <div class=\"sm:w-full w-[180px]\"><img decoding=\"async\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/uploads\/2024\/09\/writing-bee_17c47b79.webp\" alt=\"24-hour responsive service icon in visible one\" loading=\"lazy\" title=\"\">                    <\/div>\n                <\/div>\n            <\/div>\n            <div id=\"FormStepSix\" class=\"flex sm:flex-row flex-col-reverse items-stretch stepForm \">\n                <div class=\"md:flex-[3] flex-1 sm:mt-0 mt-6 textContainer\">\n                    <h2 class=\"fs-2xl font-semibold mb-5\">How did you hear about Visible One?<\/h2>\n                    <p class=\"text-sm text-red-500 error\">Please select at least one <\/p>\n                    <form class=\"flex-1\" data-hs-cf-bound=\"true\">\n                        <div class=\"flex flex-wrap\">\n                            <div class=\"flex flex-wrap -mx-2 w-full\">\n                                <div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">Facebook<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">Instagram<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">LinkedIn<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">Friends &#038; Family<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">Official Website<\/p>\n                                                <\/div>\n                                            <\/div><div class=\"lg:w-[33.3333%] w-[50%] px-2\">\n                                                <div class=\"flex py-3 px-4 mb-4 select-wrapper\" style=\"--hoverColor: #FFAE00;\">\n                                                    <div class=\"img-wrapper\">\n                                                    <svg width=\"89\" height=\"99\" viewBox=\"0 0 89 99\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                            <path d=\"M85.3861 66.022L75.4829 48.6417L85.6215 44.4196C86.7897 43.8111 87.6926 42.7864 88.1517 41.5479C88.6443 40.2754 88.6379 38.8665 88.1337 37.6079C87.6475 36.391 86.7153 35.4112 85.5279 34.8692C84.3432 34.3125 82.9903 34.2232 81.7348 34.6188L70.2704 39.4106L58.5046 18.7383C58.2622 18.3276 57.9164 17.9889 57.5015 17.7562C57.0986 17.5164 56.6383 17.3898 56.1681 17.3894L32.2236 17.5954L30.6319 5.11455C30.3934 3.78239 29.6541 2.59799 28.5667 1.80613C27.4793 1.01426 26.127 0.67543 24.7893 0.859703C23.4472 1.05233 22.2239 1.75119 21.3682 2.81403C20.517 3.893 20.113 5.25831 20.2413 6.62194L21.6557 17.6401L1.86103 17.824C1.38379 17.8275 0.914567 17.9559 0.499503 18.1966C0.0850405 18.4408 -0.261028 18.7875 -0.505438 19.2033L-27.9154 66.6787C-28.156 67.0964 -28.2837 67.5694 -28.2857 68.0501C-28.2877 68.5309 -28.1639 69.0026 -27.9267 69.4178L-1.02021 116.615C-0.789588 117.027 -0.453633 117.369 -0.0467617 117.605C0.367641 117.843 0.837489 117.966 1.31624 117.964L55.6622 117.678C56.1445 117.678 56.6198 117.553 57.0425 117.316C57.4533 117.069 57.7934 116.718 58.0287 116.299L85.4496 68.8043C85.6907 68.3755 85.8154 67.8914 85.8112 67.4009C85.7964 66.91 85.6494 66.4334 85.3861 66.022ZM58.5459 105.69L8.89092 102.211L-18.9309 60.959L-15.1133 54.3468L12.2613 96.3736L62.3261 99.0565L58.5459 105.69ZM68.7988 87.9318L19.0783 84.5661L-8.65932 43.2114L-4.84178 36.5992L22.5141 78.6151L72.5789 81.2981L68.7988 87.9318Z\" fill=\"#AFAFAF\" fill-opacity=\"0.2\"><\/path>\n                                                        <\/svg><\/div>\n                                                    <p class=\"fs-lg name\">Others<\/p>\n                                                <\/div>\n                                            <\/div>                            <\/div>\n                        <\/div>\n                        <div class=\"flex-1 flex items-center xl:mt-10 mt-5 justify-between\">\n                            <div class=\"fs-xl text-dark\/75 flex items-center cursor-pointer backIcon\">\n                                <div class=\"mr-5\"><img decoding=\"async\"\n                                        src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/themes\/visibleone\/public\/images\/quotation\/quotation-form-back_4b983911.png\"\n                                        alt=\"\" aria-hidden=\"true\" loading=\"lazy\"><\/div>\n                                <div class=\"fs-xl font-normal \">Back<\/div>\n                            <\/div><button\n                                class=\"xl:text-xl md:text-lg text-base font-semibold NavigationBtn submit-btn\">Done<\/button>\n                        <\/div>\n                    <\/form>\n                <\/div>\n                <div class=\"md:flex-[2] flex-1 flex items-center justify-center xl:pl-10 md:pl-5 imgContaniner\">\n                    <div class=\"sm:w-full w-[180px]\"><img decoding=\"async\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/uploads\/2024\/09\/Social-media-bee_a1d0ffc0.webp\" alt=\"24-hour responsive service icon in visible one\" loading=\"lazy\" title=\"\"><\/div>\n                <\/div>\n            <\/div>\n            <div id=\"FormResult\" class=\"flex flex-col-reverse items-stretch sm:flex-row stepForm\">\n                <div class=\"relative flex items-center justify-center flex-1\">\n                    <div class=\"xl:w-max md:w-[250px] w-[180px] bg-img\"><svg class=\"w-full h-full\" width=\"475\"\n                            height=\"397\" viewBox=\"0 0 475 397\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                            <g clip-path=\"url(#clip0_2848_46803)\">\n                                <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                                    d=\"M381 155C381 142.535 385.952 130.58 394.766 121.766C403.58 112.952 415.535 108 428 108C440.465 108 452.42 112.952 461.234 121.766C470.048 130.58 475 142.535 475 155C475 167.465 470.048 179.42 461.234 188.234C452.42 197.048 440.465 202 428 202C415.535 202 403.58 197.048 394.766 188.234C385.952 179.42 381 167.465 381 155V155ZM425.318 175.116L452.377 141.289L447.489 137.378L424.415 166.211L408.072 152.594L404.061 157.406L425.318 175.122V175.116Z\"\n                                    fill=\"#FFAE00\"><\/path>\n                            <\/g>\n                            <circle opacity=\"0.15\" cx=\"330.537\" cy=\"130.538\" r=\"106.583\"\n                                transform=\"rotate(-105 330.537 130.538)\" fill=\"#FFAE00\"><\/circle>\n                            <circle cx=\"243.5\" cy=\"346.5\" r=\"2.5\" transform=\"rotate(-90 243.5 346.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"243.5\" cy=\"330.5\" r=\"2.5\" transform=\"rotate(-90 243.5 330.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"243.5\" cy=\"314.5\" r=\"2.5\" transform=\"rotate(-90 243.5 314.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"243.5\" cy=\"298.5\" r=\"2.5\" transform=\"rotate(-90 243.5 298.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"337.5\" cy=\"346.5\" r=\"2.5\" transform=\"rotate(-90 337.5 346.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"337.5\" cy=\"330.5\" r=\"2.5\" transform=\"rotate(-90 337.5 330.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"337.5\" cy=\"314.5\" r=\"2.5\" transform=\"rotate(-90 337.5 314.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"337.5\" cy=\"298.5\" r=\"2.5\" transform=\"rotate(-90 337.5 298.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"337.5\" cy=\"282.5\" r=\"2.5\" transform=\"rotate(-90 337.5 282.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"337.5\" cy=\"269.5\" r=\"2.5\" transform=\"rotate(-90 337.5 269.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"337.5\" cy=\"253.5\" r=\"2.5\" transform=\"rotate(-90 337.5 253.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"337.5\" cy=\"362.5\" r=\"2.5\" transform=\"rotate(-90 337.5 362.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"337.5\" cy=\"378.5\" r=\"2.5\" transform=\"rotate(-90 337.5 378.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"337.5\" cy=\"394.5\" r=\"2.5\" transform=\"rotate(-90 337.5 394.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"291.5\" cy=\"346.5\" r=\"2.5\" transform=\"rotate(-90 291.5 346.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"291.5\" cy=\"330.5\" r=\"2.5\" transform=\"rotate(-90 291.5 330.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"291.5\" cy=\"314.5\" r=\"2.5\" transform=\"rotate(-90 291.5 314.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"291.5\" cy=\"298.5\" r=\"2.5\" transform=\"rotate(-90 291.5 298.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"291.5\" cy=\"282.5\" r=\"2.5\" transform=\"rotate(-90 291.5 282.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"291.5\" cy=\"269.5\" r=\"2.5\" transform=\"rotate(-90 291.5 269.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"291.5\" cy=\"253.5\" r=\"2.5\" transform=\"rotate(-90 291.5 253.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"291.5\" cy=\"362.5\" r=\"2.5\" transform=\"rotate(-90 291.5 362.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"291.5\" cy=\"378.5\" r=\"2.5\" transform=\"rotate(-90 291.5 378.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"291.5\" cy=\"394.5\" r=\"2.5\" transform=\"rotate(-90 291.5 394.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"385.5\" cy=\"346.5\" r=\"2.5\" transform=\"rotate(-90 385.5 346.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"385.5\" cy=\"330.5\" r=\"2.5\" transform=\"rotate(-90 385.5 330.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"385.5\" cy=\"314.5\" r=\"2.5\" transform=\"rotate(-90 385.5 314.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"385.5\" cy=\"298.5\" r=\"2.5\" transform=\"rotate(-90 385.5 298.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"347.5\" r=\"2.5\" transform=\"rotate(-90 259.5 347.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"331.5\" r=\"2.5\" transform=\"rotate(-90 259.5 331.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"315.5\" r=\"2.5\" transform=\"rotate(-90 259.5 315.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"299.5\" r=\"2.5\" transform=\"rotate(-90 259.5 299.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"283.5\" r=\"2.5\" transform=\"rotate(-90 259.5 283.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"270.5\" r=\"2.5\" transform=\"rotate(-90 259.5 270.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"363.5\" r=\"2.5\" transform=\"rotate(-90 259.5 363.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"379.5\" r=\"2.5\" transform=\"rotate(-90 259.5 379.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"346.5\" r=\"2.5\" transform=\"rotate(-90 259.5 346.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"330.5\" r=\"2.5\" transform=\"rotate(-90 259.5 330.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"314.5\" r=\"2.5\" transform=\"rotate(-90 259.5 314.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"298.5\" r=\"2.5\" transform=\"rotate(-90 259.5 298.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"282.5\" r=\"2.5\" transform=\"rotate(-90 259.5 282.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"259.5\" cy=\"362.5\" r=\"2.5\" transform=\"rotate(-90 259.5 362.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"353.5\" cy=\"346.5\" r=\"2.5\" transform=\"rotate(-90 353.5 346.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"353.5\" cy=\"330.5\" r=\"2.5\" transform=\"rotate(-90 353.5 330.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"353.5\" cy=\"314.5\" r=\"2.5\" transform=\"rotate(-90 353.5 314.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"353.5\" cy=\"298.5\" r=\"2.5\" transform=\"rotate(-90 353.5 298.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"353.5\" cy=\"282.5\" r=\"2.5\" transform=\"rotate(-90 353.5 282.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"353.5\" cy=\"269.5\" r=\"2.5\" transform=\"rotate(-90 353.5 269.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"353.5\" cy=\"362.5\" r=\"2.5\" transform=\"rotate(-90 353.5 362.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"353.5\" cy=\"378.5\" r=\"2.5\" transform=\"rotate(-90 353.5 378.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"307.5\" cy=\"346.5\" r=\"2.5\" transform=\"rotate(-90 307.5 346.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"307.5\" cy=\"330.5\" r=\"2.5\" transform=\"rotate(-90 307.5 330.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"307.5\" cy=\"314.5\" r=\"2.5\" transform=\"rotate(-90 307.5 314.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"307.5\" cy=\"298.5\" r=\"2.5\" transform=\"rotate(-90 307.5 298.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"307.5\" cy=\"282.5\" r=\"2.5\" transform=\"rotate(-90 307.5 282.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"307.5\" cy=\"269.5\" r=\"2.5\" transform=\"rotate(-90 307.5 269.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"307.5\" cy=\"253.5\" r=\"2.5\" transform=\"rotate(-90 307.5 253.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"307.5\" cy=\"362.5\" r=\"2.5\" transform=\"rotate(-90 307.5 362.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"307.5\" cy=\"378.5\" r=\"2.5\" transform=\"rotate(-90 307.5 378.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"307.5\" cy=\"394.5\" r=\"2.5\" transform=\"rotate(-90 307.5 394.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"275.5\" cy=\"346.5\" r=\"2.5\" transform=\"rotate(-90 275.5 346.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"275.5\" cy=\"330.5\" r=\"2.5\" transform=\"rotate(-90 275.5 330.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"275.5\" cy=\"314.5\" r=\"2.5\" transform=\"rotate(-90 275.5 314.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"275.5\" cy=\"298.5\" r=\"2.5\" transform=\"rotate(-90 275.5 298.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"275.5\" cy=\"282.5\" r=\"2.5\" transform=\"rotate(-90 275.5 282.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"275.5\" cy=\"269.5\" r=\"2.5\" transform=\"rotate(-90 275.5 269.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"275.5\" cy=\"362.5\" r=\"2.5\" transform=\"rotate(-90 275.5 362.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"275.5\" cy=\"378.5\" r=\"2.5\" transform=\"rotate(-90 275.5 378.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"369.5\" cy=\"346.5\" r=\"2.5\" transform=\"rotate(-90 369.5 346.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"369.5\" cy=\"330.5\" r=\"2.5\" transform=\"rotate(-90 369.5 330.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"369.5\" cy=\"314.5\" r=\"2.5\" transform=\"rotate(-90 369.5 314.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"369.5\" cy=\"298.5\" r=\"2.5\" transform=\"rotate(-90 369.5 298.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"369.5\" cy=\"282.5\" r=\"2.5\" transform=\"rotate(-90 369.5 282.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"369.5\" cy=\"269.5\" r=\"2.5\" transform=\"rotate(-90 369.5 269.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"369.5\" cy=\"362.5\" r=\"2.5\" transform=\"rotate(-90 369.5 362.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"369.5\" cy=\"378.5\" r=\"2.5\" transform=\"rotate(-90 369.5 378.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"323.5\" cy=\"346.5\" r=\"2.5\" transform=\"rotate(-90 323.5 346.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"323.5\" cy=\"330.5\" r=\"2.5\" transform=\"rotate(-90 323.5 330.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"323.5\" cy=\"314.5\" r=\"2.5\" transform=\"rotate(-90 323.5 314.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"323.5\" cy=\"298.5\" r=\"2.5\" transform=\"rotate(-90 323.5 298.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"323.5\" cy=\"282.5\" r=\"2.5\" transform=\"rotate(-90 323.5 282.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"323.5\" cy=\"269.5\" r=\"2.5\" transform=\"rotate(-90 323.5 269.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"323.5\" cy=\"253.5\" r=\"2.5\" transform=\"rotate(-90 323.5 253.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"323.5\" cy=\"362.5\" r=\"2.5\" transform=\"rotate(-90 323.5 362.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"323.5\" cy=\"378.5\" r=\"2.5\" transform=\"rotate(-90 323.5 378.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <circle cx=\"323.5\" cy=\"394.5\" r=\"2.5\" transform=\"rotate(-90 323.5 394.5)\" fill=\"#3E5560\">\n                            <\/circle>\n                            <path\n                                d=\"M41.5 383C39.0147 383 37 380.985 37 378.5C37 376.015 39.0147 374 41.5 374C43.9853 374 46 376.015 46 378.5C46 380.985 43.9853 383 41.5 383Z\"\n                                fill=\"#FFCB5D\"><\/path>\n                            <path\n                                d=\"M247.5 387C245.015 387 243 384.985 243 382.5C243 380.015 245.015 378 247.5 378C249.985 378 252 380.015 252 382.5C252 384.985 249.985 387 247.5 387Z\"\n                                fill=\"#00DB92\"><\/path>\n                            <path\n                                d=\"M276 251C283.367 251 289 245.15 289 237.5C289 229.85 283.367 224 276 224C268.633 224 263 229.85 263 237.5C263 245.15 268.633 251 276 251ZM276 233C278.6 233 280.333 234.8 280.333 237.5C280.333 240.2 278.6 242 276 242C273.4 242 271.667 240.2 271.667 237.5C271.667 234.8 273.4 233 276 233Z\"\n                                fill=\"#FFAE00\"><\/path>\n                            <path\n                                d=\"M13 352C20.3667 352 26 346.367 26 339C26 331.633 20.3667 326 13 326C5.63333 326 0 331.633 0 339C0 346.367 5.63333 352 13 352ZM13 334.667C15.6 334.667 17.3333 336.4 17.3333 339C17.3333 341.6 15.6 343.333 13 343.333C10.4 343.333 8.66667 341.6 8.66667 339C8.66667 336.4 10.4 334.667 13 334.667Z\"\n                                fill=\"#00DB92\"><\/path>\n                            <path\n                                d=\"M225.84 140L222.32 136.48C220.56 134.72 220.56 132.08 222.32 130.32C224.08 128.56 226.72 128.56 228.48 130.32L232 133.84L235.52 130.32C237.28 128.56 239.92 128.56 241.68 130.32C243.44 132.08 243.44 134.72 241.68 136.48L238.16 140L241.68 143.52C243.44 145.28 243.44 147.92 241.68 149.68C240.8 150.56 239.48 151 238.6 151C237.72 151 236.4 150.56 235.52 149.68L232 146.16L228.48 149.68C227.6 150.56 226.28 151 225.4 151C224.52 151 223.2 150.56 222.32 149.68C220.56 147.92 220.56 145.28 222.32 143.52L225.84 140Z\"\n                                fill=\"#00DB92\"><\/path>\n                            <defs>\n                                <clipPath id=\"clip0_2848_46803\">\n                                    <rect width=\"94\" height=\"94\" fill=\"white\" transform=\"translate(381 108)\"><\/rect>\n                                <\/clipPath>\n                            <\/defs>\n                        <\/svg><\/div>\n                    <div class=\"relative mt-6 2xl:pl-20 sm:mt-0\">\n                        <h2 class=\"fs-2xl font-semibold mb-5\">Submitted!<\/h2>\n                        <p class=\"text-sm font-normal 2xl:text-lg md:text-base text-grey\" data-gtm-vis-recent-on-screen9695562_371=\"44160158\" data-gtm-vis-first-on-screen9695562_371=\"44160158\" data-gtm-vis-total-visible-time9695562_371=\"100\" data-gtm-vis-has-fired9695562_371=\"1\" data-gtm-vis-recent-on-screen9695562_417=\"44160227\" data-gtm-vis-first-on-screen9695562_417=\"44160228\" data-gtm-vis-total-visible-time9695562_417=\"100\" data-gtm-vis-has-fired9695562_417=\"1\" data-gtm-vis-recent-on-screen9695562_418=\"44160232\" data-gtm-vis-first-on-screen9695562_418=\"44160232\" data-gtm-vis-total-visible-time9695562_418=\"100\" data-gtm-vis-has-fired9695562_418=\"1\">We&#8217;ve received your form! We will get back<\/p>\n                        <p class=\"text-sm font-normal 2xl:text-lg md:text-base text-grey\">to you ASAP! Stay tuned~<\/p>\n                    <\/div>\n                <\/div>\n                <div class=\"flex items-center justify-center flex-1 xl:pl-10 md:pl-5\">\n                    <div class=\"sm:w-full w-[180px]\"><img decoding=\"async\" src=\"https:\/\/devwp02.visibleone.io\/vowp\/wp-content\/uploads\/2024\/09\/polite-bee_dcd07d45.webp\" alt=\"24-hour responsive service icon in visible one\" loading=\"lazy\" title=\"\">                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", function() {\n\n    var formOneSate = {},\n        formFourSate = {},\n        formFiveSate = {};\n    var formTwoServiceSate = [],\n        formThreeBudgetSate = [],\n        formSixKnownSate = [];\n\n    let navigateSteps = document.querySelectorAll(\"#VOQuotation .navStepItem\");\n    let stepForms = document.querySelectorAll(\".FormContainer .stepForm\");\n\n    function handleNavigateSteps(stepIndex) {\n        navigateSteps &&\n            navigateSteps.forEach((stepItem, index) => {\n                if (stepIndex > index) stepItem.classList.add(\"complete\");\n                stepItem.classList.remove('active');\n                console.log(stepIndex)\n            });\n        if (navigateSteps[stepIndex]) navigateSteps[stepIndex].classList.add(\"active\");\n    }\n\n    function handleStepForms(stepIndex) {\n        stepForms &&\n            stepForms.forEach((stepForm, index) => {\n                stepForm.classList.remove('active');\n            });\n        if (stepForms[stepIndex]) stepForms[stepIndex].classList.add(\"active\");\n    }\n\n    function handleSteps(index) {\n        handleNavigateSteps(index);\n        handleStepForms(index);\n    }\n    handleSteps(0);\n\n    \/\/ Start FormOne \n    const emailInput = document.getElementById(\"erroremailInputExtra\");\n    const emailerrorMessage = document.getElementById(\"errormessagenotice\");\n\n    emailInput.addEventListener(\"input\", function() {\n        const emailPattern = \/^[\\w-\\.]+@([\\w-]+\\.)+[\\w-]{2,4}$\/g;\n\n        if (!emailPattern.test(emailInput.value)) {\n            emailerrorMessage.style.display = \"inline\";\n        } else {\n            emailerrorMessage.style.display = \"none\";\n        }\n    });\n    const requireFieldMsg = \"This field is required.\";\n    const invalidEmailMsg = document.getElementById(\"errormessagenotice\");\n    const formOne = document.querySelector(\"#FormStepOne form\");\n    formOne.addEventListener(\"submit\", function(event) {\n        event.preventDefault();\n\n        const recaptchaResponse = grecaptcha.getResponse();\n\t\tif (!recaptchaResponse) {\n\t\t\talert(\"Please complete the reCAPTCHA\");\n\t\t\treturn;\n\t\t}\n\n        const formData = new FormData(event.target);\n        const formState = {\n            firstname: formData.get('firstname'),\n            lastname: formData.get('lastname'),\n            email: formData.get('email'),\n            phone: formData.get('phone'),\n            existing_website: formData.get('existing_website'),\n            main_competitor: formData.get('main_competitor')\n        };\n\n        const errors = {};\n        if (!formState.firstname) {\n            errors.firstname = {\n                message: requireFieldMsg\n            };\n        }\n\n        if (!formState.lastname) {\n            validerror.lastname = {\n                message: invalidEmailMsg.style.display = \"inline\"\n            };\n        }\n\n        if (!formState.email) {\n            errors.email = {\n                message: requireFieldMsg\n            };\n        } else if (!formState.email.match(\/^[\\w-\\.]+@([\\w-]+\\.)+[\\w-]{2,4}$\/g)) {\n            error.email = {\n                message: invalidEmailMsg\n            };\n        }\n\n        if (!formState.phone) {\n            errors.phone = {\n                message: requireFieldMsg\n            };\n        }\n\n        \/\/ If there are errors, display them\n        if (Object.keys(errors).length > 0) {\n            displayErrors(errors);\n        } else {\n            formOneSate = formState;\n            handleSteps(1);\n        }\n    });\n\n    function displayErrors(errors) {\n        for (let field in errors) {\n            const errorCls = document.querySelector(`input[name=${field}] ~ .error`);\n            if (errorCls) errorCls.style.display = \"block\";\n            console.error(`${field}: ${errors[field].message}`);\n        }\n    }\n\n    function hideErrorOnInput() {\n        const fields = formOne.querySelectorAll('input');\n\n        fields.forEach(field => {\n            field.addEventListener('input', function() {\n                const errorElement = field.nextElementSibling;\n                if (errorElement && errorElement.classList.contains('error')) {\n                    errorElement.style.display = \"none\";\n                }\n            });\n        });\n    }\n    hideErrorOnInput();\n    \/\/ End FormOne \n\n    \/\/ Start FormTwo \n    let serviceItemList = document.querySelectorAll(\"#FormStepTwo .select-wrapper\");\n    let backIconTwo = document.querySelector(\"#FormStepTwo .backIcon\");\n    backIconTwo && backIconTwo.addEventListener(\"click\", function() {\n        handleSteps(0);\n    });\n    serviceItemList && serviceItemList.forEach((serviceItem, index) => {\n        serviceItem.addEventListener('click', function() {\n            const dataValue = this.querySelector(\".name\").innerText;\n            if (this.classList.contains(\"active\")) {\n                this.classList.remove('active');\n                formTwoServiceSate = formTwoServiceSate.filter(service =>\n                    service.trim().toLowerCase() !== dataValue.trim().toLowerCase()\n                );\n            } else {\n                this.classList.add('active');\n                formTwoServiceSate.push(dataValue);\n            }\n            if (formTwoServiceSate && formTwoServiceSate.length > 0) {\n                document.querySelector(\"#FormStepTwo .error\").style.display = \"none\";\n            }\n        });\n    });\n\n    const formTwo = document.querySelector(\"#FormStepTwo form\");\n    formTwo.addEventListener(\"submit\", function(event) {\n        event.preventDefault();\n        const formData = new FormData(event.target);\n\n        if (formTwoServiceSate && formTwoServiceSate.length > 0) {\n            handleSteps(2);\n        } else {\n            document.querySelector(\"#FormStepTwo .error\").style.display = \"block\";\n        }\n    });\n    \/\/ End FormTwo \n\n    \/\/ Start FormThree \n    let bugetItemList = document.querySelectorAll(\"#FormStepThree .select-wrapper\");\n    let backIconThree = document.querySelector(\"#FormStepThree .backIcon\");\n    backIconThree && backIconThree.addEventListener(\"click\", function() {\n        handleSteps(1);\n    });\n    bugetItemList && bugetItemList.forEach((bugetItem, index) => {\n        bugetItem.addEventListener('click', function() {\n            const dataValue = this.querySelector(\".name\").innerText;\n            bugetItemList.forEach((item, index) => {\n                item.classList.remove('active');\n            });\n            this.classList.add('active');\n            formThreeBudgetSate = [dataValue];\n            if (formThreeBudgetSate && formThreeBudgetSate.length > 0) {\n                document.querySelector(\"#FormStepThree .error\").style.display = \"none\";\n            }\n        });\n    });\n\n    const formThree = document.querySelector(\"#FormStepThree form\");\n    formThree.addEventListener(\"submit\", function(event) {\n        event.preventDefault();\n        const formData = new FormData(event.target);\n\n        if (formThreeBudgetSate && formThreeBudgetSate.length > 0) {\n            handleSteps(3);\n        } else {\n            document.querySelector(\"#FormStepThree .error\").style.display = \"block\";\n        }\n    });\n    \/\/ End FormThree \n\n    \/\/ Start FormFour \n    let backIconFour = document.querySelector(\"#FormStepFour .backIcon\");\n    backIconFour && backIconFour.addEventListener(\"click\", function() {\n        handleSteps(2);\n    });\n\n    function handleInitailDate() {\n        const today = new Date();\n        const year = today.getFullYear();\n        const month = String(today.getMonth() + 1).padStart(2, '0');\n        const day = String(today.getDate()).padStart(2, '0');\n        const formattedDate = `${year}-${month}-${day}`;\n\n        let startDateInput = document.querySelector(\"#FormStepFour input[name='startDate']\");\n        let endDateInput = document.querySelector(\"#FormStepFour input[name='endDate']\");\n        if (startDateInput) {\n            startDateInput.value = formattedDate;\n            startDateInput.min = formattedDate;\n            document.querySelector(\"#FormStepFour p.startDate\").innerText = formattedDate;\n        }\n        if (endDateInput) {\n            endDateInput.value = formattedDate;\n            endDateInput.min = formattedDate;\n            document.querySelector(\"#FormStepFour p.endDate\").innerText = formattedDate;\n        }\n    }\n    handleInitailDate();\n    const formFour = document.querySelector(\"#FormStepFour form\");\n    formFour.addEventListener(\"submit\", function(event) {\n        event.preventDefault();\n        const formData = new FormData(event.target);\n        const formState = {\n            startDate: formData.get('startDate'),\n            endDate: formData.get('endDate')\n        };\n\n        const errors = {};\n        if (!formState.startDate) {\n            errors.startDate = {\n                message: requireFieldMsg\n            };\n        }\n        if (!formState.endDate) {\n            errors.endDate = {\n                message: requireFieldMsg\n            };\n        }\n\n        if (Object.keys(errors).length > 0) {\n            for (let field in errors) {\n                const errorCls = document.querySelector(`input[name=${field}] ~ .error`);\n                if (errorCls) errorCls.style.display = \"block\";\n                console.error(`${field}: ${errors[field].message}`);\n            }\n        } else {\n            formFourSate = formState;\n            handleSteps(4);\n        }\n    });\n\n    const fields = formFour.querySelectorAll('input[type=\"date\"]');\n    fields.forEach(field => {\n        field.addEventListener('input', function(event) {\n            if (event.target.name === 'startDate') {\n                document.querySelector(\"#FormStepFour p.startDate\").innerText = event.target\n                    .value;\n            } else if (event.target.name === 'endDate') {\n                document.querySelector(\"#FormStepFour p.endDate\").innerText = event.target\n                    .value;\n            }\n        });\n    });\n    \/\/ End FormFour\n\n\n    \/\/ Start FormFive \n    let backIconFive = document.querySelector(\"#FormStepFive .backIcon\");\n    let skipBtnFive = document.querySelector(\"#FormStepFive .skip-btn\");\n    backIconFive && backIconFive.addEventListener(\"click\", function() {\n        handleSteps(3);\n    });\n    skipBtnFive && skipBtnFive.addEventListener(\"click\", function() {\n        handleSteps(5);\n    });\n    const formFive = document.querySelector(\"#FormStepFive form\");\n    formFive.addEventListener(\"submit\", function(event) {\n        event.preventDefault();\n        const formData = new FormData(event.target);\n        const formState = {\n            message: formData.get('message')\n        };\n\n        const errors = {};\n        if (!formState.message) {\n            errors.message = {\n                message: requireFieldMsg\n            };\n        }\n\n        formFiveSate = formState;\n        handleSteps(5);\n    });\n    \/\/ End FormFive\n\n    \/\/ Start FormSix \n    let knownItemList = document.querySelectorAll(\"#FormStepSix .select-wrapper\");\n    let backIconSix = document.querySelector(\"#FormStepSix .backIcon\");\n    backIconSix && backIconSix.addEventListener(\"click\", function() {\n        handleSteps(4);\n    });\n    knownItemList && knownItemList.forEach((knownItem, index) => {\n        knownItem.addEventListener('click', function() {\n            const dataValue = this.querySelector(\".name\").innerText;\n            if (this.classList.contains(\"active\")) {\n                this.classList.remove('active');\n                formSixKnownSate = formSixKnownSate.filter(service =>\n                    service.trim().toLowerCase() !== dataValue.trim().toLowerCase()\n                );\n            } else {\n                this.classList.add('active');\n                formSixKnownSate.push(dataValue);\n            }\n            if (formSixKnownSate && formSixKnownSate.length > 0) {\n                document.querySelector(\"#FormStepSix .error\").style.display = \"none\";\n            }\n        });\n    });\n\n    const formSix = document.querySelector(\"#FormStepSix form\");\n    formSix.addEventListener(\"submit\", function(event) {\n        event.preventDefault();\n        const formData = new FormData(event.target);\n\n        if (formSixKnownSate && formSixKnownSate.length > 0) {\n            let data = JSON.stringify({\n                submittedAt: new Date().getTime(),\n                fields: generateHubspotField()\n            });\n            handleOnSubmit(data);\n        } else {\n            document.querySelector(\"#FormStepSix .error\").style.display = \"block\";\n        }\n    });\n    \/\/ End FormSix\n    const hsPortalId = \"5194436\";\n    const formId = \"cd1c3bc0-bf18-43b3-b4a0-1a7c06b4cf46\";\n    \/\/ const hsPortalId = \"5194436\";\n    \/\/ const formId = \"cd1c3bc0-bf18-43b3-b4a0-1a7c06b4cf46\";\n    function submitToHubSpot(data) {\n        return new Promise(function(resolve, reject) {\n            const xhr = new XMLHttpRequest();\n            const url =\n                `https:\/\/api.hsforms.com\/submissions\/v3\/integration\/submit\/${hsPortalId}\/${formId}`;\n\n            xhr.open(\"POST\", url);\n            xhr.setRequestHeader(\"Content-Type\", \"application\/json\");\n\n            xhr.onreadystatechange = function() {\n                if (xhr.readyState === 4) {\n                    if (xhr.status === 200) {\n                        resolve(); \/\/ Success\n                    } else {\n                        reject(xhr.responseText); \/\/ Handle various error statuses\n                    }\n                }\n            };\n\n            xhr.send(data);\n        });\n    }\n\n    function handleOnSubmit(data) {\n        console.log(\"handleOnSubmit \", data)\n        submitToHubSpot(data)\n            .then(function(response) {\n\n        \/\/ GA4 Enhanced Conversion Tracking\n        try {\n            console.log(\"Sending Enhanced Conversions \u2192\");\n            console.log(\"Email:\", formOneSate.email);\n            console.log(\"Phone:\", formOneSate.phone);\n\n            gtag(\"set\", \"user_data\", {\n                email: formOneSate.email,\n                phone_number: formOneSate.phone\n            });\n        } catch (e) {\n            console.error(\"EC Error:\", e);\n        }\n\n        \/\/ Show result step\n        handleSteps(6); \/\/ show result page\n            })\n            .catch(function(e) {\n                let _error = JSON.parse(e);\n                let msg = `Error, ${_error.message}!`;\n\n                if (_error.errors) {\n                    _error.errors.forEach(function(err) {\n                        msg += `\\r\\n${err.message}!`;\n                    });\n                }\n                console.error(msg);\n                alert(\"Something went wrong. Please try again later.\");\n            });\n    }\n\n\n    function generateHubspotField() {\n        let _fields = [];\n        if (formOneSate) {\n            for (let key in formOneSate) {\n                if (formOneSate.hasOwnProperty(key)) {\n                    _fields.push({\n                        objectTypeId: \"0-1\",\n                        name: key,\n                        value: formOneSate[key]\n                    });\n                }\n            }\n        }\n        if (formTwoServiceSate.length > 0) {\n            _fields.push({\n                objectTypeId: \"0-1\",\n                name: \"services_required\",\n                value: formTwoServiceSate.join(\";\")\n            });\n        }\n        if (formThreeBudgetSate.length > 0) {\n            formThreeBudgetSate.forEach(budget => {\n                _fields.push({\n                    objectTypeId: \"0-1\",\n                    name: \"budget_sg\",\n                    value: budget\n                });\n            });\n        }\n        if (formFourSate) {\n            _fields.push({\n                objectTypeId: \"0-1\",\n                name: \"ideal_start_date\",\n                value: formFourSate.startDate\n            });\n            _fields.push({\n                objectTypeId: \"0-1\",\n                name: \"ideal_end_date\",\n                value: formFourSate.endDate\n            });\n        }\n        if (formFiveSate) {\n            _fields.push({\n                objectTypeId: \"0-1\",\n                name: \"project_summary\",\n                value: formFiveSate.message\n            });\n        }\n        if (formSixKnownSate.length > 0) {\n            _fields.push({\n                objectTypeId: \"0-1\",\n                name: \"how_did_you_hear_about_us\",\n                value: formSixKnownSate.join(\";\")\n            });\n        }\n        return _fields;\n    }\n\n});\n\/\/connet hubspot form\n\/\/ Replace these with your own HubSpot portal ID and form GUID\n\n\n\/\/ Call the function to submit the form\n\/\/ submitHubspotForm();\n<\/script>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-335","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/devwp02.visibleone.io\/vowp\/wp-json\/wp\/v2\/pages\/335","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devwp02.visibleone.io\/vowp\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/devwp02.visibleone.io\/vowp\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/devwp02.visibleone.io\/vowp\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/devwp02.visibleone.io\/vowp\/wp-json\/wp\/v2\/comments?post=335"}],"version-history":[{"count":18,"href":"https:\/\/devwp02.visibleone.io\/vowp\/wp-json\/wp\/v2\/pages\/335\/revisions"}],"predecessor-version":[{"id":9344,"href":"https:\/\/devwp02.visibleone.io\/vowp\/wp-json\/wp\/v2\/pages\/335\/revisions\/9344"}],"wp:attachment":[{"href":"https:\/\/devwp02.visibleone.io\/vowp\/wp-json\/wp\/v2\/media?parent=335"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}