import CounterUp from "../components/elements/CounterUp"
import VideoPopup from "../components/elements/VidepPopup"
import Layout from "../components/layout/Layout"
import BrandSlider2 from "../components/slider/BrandSlider2"
import Link from "next/link"
import MermsRecentBlog from "../components/sections/MermsRecentBlog";
import MermsWhyChooseUs from "../components/sections/MermsWhyChooseUs";
import MermsDedicatedTeam from "../components/sections/MermsDedicatedTeam";
import MermsAboutFeautures from "../components/sections/MermsAboutFeautures";
export default function Home() {

    return (
        <>
            <Layout headerStyle={1} footerStyle={3} headerCls="navbar-dark inner-page-header">
                <div>
                    {/* ABOUT-2
			============================================= */}
                    <section id="about-2" className="rel inner-page-hero about-section division">
                        {/* ABOUT-2 TITLE */}
                        <div className="container">
                            <div className="row">
                                <div className="col-md-11 col-lg-10 col-xl-9">
                                    <div className="about-2-title mb-60">
                                        {/* Title */}
                                        <h2 className="s-52 w-700 mb-30">We provide solutions for your creative ideas</h2>
                                        {/* Text */}
                                        <p className="mb-0">An enim nullam tempor sapien gravida donec pretium ipsum porta justo
                                            integer and purus velna vitae auctor integer undo congue diam purus pretium and ligula
                                            tempor primis libero at tempus, blandit and cursus varius magnis at sapien egestas
                                            purus vitae purus an ipsum
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>	  {/* END ABOUT-2 TITLE */}
                        {/* ABOUT-2 IMAGES */}
                        <div className="container-fluid">
                            <div className="row">
                                {/* IMAGES-1 */}
                                <div className="col-md-5">
                                    <div className="text-end">
                                        {/* IMAGE-1 */}
                                        <div className="about-2-img a-2-1 r-12">
                                            <img className="img-fluid" src="/images/a2-1.jpg" alt="about-image" />
                                        </div>
                                        {/* IMAGE-2 */}
                                        <div className="about-2-img a-2-2 r-12">
                                            <img className="img-fluid" src="/images/a2-2.jpg" alt="about-image" />
                                        </div>
                                    </div>
                                </div>	{/* END IMAGES-1 */}
                                {/* IMAGES-2 */}
                                <div className="col-md-7">
                                    {/* IMAGE-3 */}
                                    <div className="about-2-img a-2-3 r-12">
                                        <img className="img-fluid" src="/images/a2-3.jpg" alt="about-image" />
                                    </div>
                                    <div className="row">
                                        {/* TEXT */}
                                        <div className="col-md-7 col-lg-6">
                                            <div className="a2-txt bg--black-400 pattern-01 bg--fixed color--white r-12">
                                                {/* Icon */}
                                                <div className="a2-txt-quote ico-40 o-20">
                                                    <span className="flaticon-quote" />
                                                </div>
                                                {/* Text */}
                                                <p>As a healthcare provider, you must stay up-to-date on the latest trends and technologies to connect with your patients and provide them with top-notch care. We offer a variety of products that are specifically designed to help you meet the growing online needs of your practice
                                                </p>
                                                {/* Author */}
                                                {/* <p className="a2-txt-author">Charlie Cheever <span>CEO &amp; CO-FOUNDER</span></p> */}
                                            </div>
                                        </div>
                                        {/* IMAGE-4 */}
                                        <div className="col-md-5 col-lg-6">
                                            <div className="about-2-img a-2-4 r-12">
                                                <img className="img-fluid" src="/images/a2-4.jpg" alt="about-image" />
                                            </div>
                                        </div>
                                    </div>	 {/* End row */}
                                </div>	{/* END IMAGES-2 */}
                            </div>	 {/* End row */}
                        </div>	  {/* END ABOUT-2 IMAGES */}
                    </section>	{/* END ABOUT-2 */}


                    <MermsDedicatedTeam />
                    <MermsAboutFeautures />
                    <hr className="divider" />
                    <MermsWhyChooseUs />
                    <MermsRecentBlog />
                    <hr className="divider" />
                </div>

            </Layout>
        </>
    )
}