import Image from "next/image";
import React from "react";

export default function Nearby() {
  return (
    <>
      <section className="my-3 Nearby">
        <h2 className="mb-5 text-center">Palm Jebel ali Nearby Atractions</h2>
        <div className="container">
          <div className="row text-center">
            <div className="col-lg-3 col-md-6 col-sm-6">
              <div className="d-flex align-items-center justify-content-center">
                <div>
                  <Image
                    src="/images/near/downtown.svg"
                    width={70}
                    height={70}
                  />
                  <h3>40 Minutes</h3>
                  <p>Downtown Dubai</p>
                </div>
              </div>
            </div>
            <div className="col-lg-3 col-md-6 col-sm-6">
              <div className="d-flex align-items-center justify-content-center">
                <div>
                  <Image src="/images/near/marina.svg" width={70} height={70} />
                  <h3>30 Minutes</h3>
                  <p>Dubai Marina</p>
                </div>
              </div>
            </div>
            <div className="col-lg-3 col-md-6 col-sm-6">
              <div className="d-flex align-items-center justify-content-center">
                <div>
                  <Image src="/images/near/dxb.svg" width={70} height={70} />
                  <h3>45 Minutes</h3>
                  <p>DXB Airport</p>
                </div>
              </div>
            </div>
            <div className="col-lg-3 col-md-6 col-sm-6">
              <div className="d-flex align-items-center justify-content-center">
                <div>
                  <Image src="/images/near/dwc.svg" width={70} height={70} />
                  <h3>30 Minutes</h3>
                  <p>DWC Airport</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
    </>
  );
}
