import React from 'react'

function Footer() {
  return (
    <footer id="site-footer" className="main-footer pt-60 pb-50 text-blue-900">
        <section className="lqd-section module-top">
            <div className="container">
                <div className="row">
                    <div className="col col-12 col-lg-4">
                        <div className="w-full flex flex-col mb-30">
                            <div className="lqd-imggrp-single mb-30">
                                <div className="lqd-imggrp-img-container">
                                    <figure>
                                        <img width="152" height="28" src="./assets/images/demo/insurance/logo/logo.svg" alt="Insorance Pro" />
                                    </figure>
                                </div>
                            </div>
                            <hr className="mb-30" />
                            <ul className="social-icon social-icon-border-none text-22">
                                <li>
                                    <a className="text-green-700" href={process.env.REACT_APP_FACEBOOK_LINK} target="_blank">
                                        <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512"><path d="M400 32H48A48 48 0 0 0 0 80v352a48 48 0 0 0 48 48h137.25V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.27c-30.81 0-40.42 19.12-40.42 38.73V256h68.78l-11 71.69h-57.78V480H400a48 48 0 0 0 48-48V80a48 48 0 0 0-48-48z"/></svg>
                                    </a>
                                </li>
                                <li>
                                    <a className="text-green-700" href={process.env.REACT_APP_TWITTER_LINK} target="_blank">
                                        <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"/></svg>
                                    </a>
                                </li>
                                <li>
                                    <a className="text-green-700" href={process.env.REACT_APP_LINKEDIN_LINK} target="_blank">
                                        <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512"><path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"/></svg>
                                    </a>
                                </li>
                            </ul>
                            <div className="ld-fancy-heading">
                                <p className="ld-fh-element mt-1/25em mr-10percent mb-2em leading-1/5em text-16">Their business to develop successful digital ideas and strategies that engage and convert</p>
                            </div>
                            <div className="ld-sf ld-sf--input-solid ld-sf--button-solid ld-sf--button-eql ld-sf--size-md ld-sf--circle ld-sf--border-none ld-sf--button-show ld-sf--button-inside button-shrinked mb-2em relative">
                                <form className="relative" method="post" action="#">
                                    <p className="ld_sf_paragraph">
                                        <input className="w-full block" type="email" name="email" placeholder="Enter your email address" />
                                    </p>
                                    <button type="submit" className="inline-flex items-center justify-center">
                                        <span className="submit-text hidden sm:block">Subscribe</span>
                                        <span className="submit-icon">
                                            <i className="lqd-icn-ess icon-md-arrow-forward"></i>
                                        </span>
                                        <span className="ld-sf-spinner absolute">
                                            <span>Sending </span>
                                        </span>
                                    </button>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div className="col col-12 col-lg-7 offset-lg-1">
                        <div className="row items-stretch">
                            <div className="col col-12 col-md-4 mb-30">
                                <div className="ld-fancy-heading">
                                    <h3 className="ld-fh-element mb-1/75em font-bold text-15">Insurance</h3>
                                </div>
                                <div className="lqd-fancy-menu lqd-custom-menu lqd-menu-td-none">
                                    <ul className="reset-ul">
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Investment Plans</a>
                                        </li>
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Life Insurance</a>
                                        </li>
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">
                                                <span>Contact Agent</span>
                                                <span className="link-badge text-green-700 bg-green-100">APPLY</span>
                                            </a>
                                        </li>
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Vehicle Insurance</a>
                                        </li>
                                        <li>
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Follow us</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div className="col col-12 col-md-4 mb-30">
                                <div className="ld-fancy-heading">
                                    <h3 className="ld-fh-element mb-1/75em font-bold text-15">About Hub</h3>
                                </div>
                                <div className="lqd-fancy-menu lqd-custom-menu lqd-menu-td-none">
                                    <ul className="reset-ul">
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Company</a>
                                        </li>
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">
                                                <span>Careers</span>
                                                <span className="link-badge text-green-700 bg-green-100">3</span>
                                            </a>
                                        </li>
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Press media</a>
                                        </li>
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Our Blog</a>
                                        </li>
                                        <li>
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Find an Office</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div className="col col-12 col-md-4 mb-30">
                                <div className="ld-fancy-heading">
                                    <h3 className="ld-fh-element mb-1/75em font-bold text-15">Contact</h3>
                                </div>
                                <div className="lqd-fancy-menu lqd-custom-menu lqd-menu-td-none">
                                    <ul className="reset-ul">
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Privacy Policy</a>
                                        </li>
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Report a Bug</a>
                                        </li>
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Contact Agent</a>
                                        </li>
                                        <li className="mb-15">
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">
                                                <span>Subscribe</span>
                                                <span className="link-badge text-green-700 bg-green-100">APPLY</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a className="text-green-700 text-16 leading-1/5em" href="#">Follow us</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section className="lqd-section module-bottom">
            <div className="container">
                <div className="row items-stretch">
                    <div className="col col-12 col-md-6 text-start">
                        <div className="lqd-fancy-menu lqd-simple-menu w-full h-full flex flex-col justify-center pt-35 border-top border-lightgray">
                            <ul className="lqd-simple-menu-ul reset-ul inline-nav">
                                <li>
                                    <a className="mr-20 text-green-700 text-12" href="#" target="_blank">Privacy Policy</a>
                                </li>
                                <li>
                                    <a className="text-green-700 text-12" href="#" target="_blank">Help Center</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div className="col col-12 col-md-6 text-end sm:text-start">
                        <div className="ld-fancy-heading pt-35 mb-20 border-top border-lightgray sm:pt-0 sm:border-top-0">
                            <p className="ld-fh-element mb-0 text-14 text-text">© 2021 Hub Insurance. All images are for demo purposes.</p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </footer>
  )
}

export default Footer