import Image from "next/image";

export default function CardProduct() {
  return (
    <div>
      <article className="product-classic">
        <div className="product-classic-media">
          <div
            className="owl-carousel"
            data-items="1"
            data-nav="true"
            data-stage-padding="0"
            data-loop="false"
            data-margin="0"
            data-mouse-drag="false"
          >
            <Image src="/images/featured-properties-17-480x287.jpg" alt="" width="480" height="287" />
            <Image src="/images/featured-properties-17-480x287.jpg" alt="" width="480" height="287" />
            <Image src="/images/featured-properties-17-480x287.jpg" alt="" width="480" height="287" />
            <Image src="/images/featured-properties-17-480x287.jpg" alt="" width="480" height="287" />
          </div>
          <div className="product-classic-price">
            <span>$5000\mo</span>
          </div>
        </div>
        <h4 className="product-classic-title">
          <a href="single-property.html">401 Biscayne Boulevard, Miami</a>
        </h4>
        <div className="product-classic-divider"></div>
        <ul className="product-classic-list">
          <li>
            <span className="icon mdi mdi-vector-square"></span>
            <span>480 Sq Ft</span>
          </li>
          <li>
            <span className="icon hotel-icon-10"></span>
            <span>2 Bathrooms</span>
          </li>
          <li>
            <span className="icon hotel-icon-05"></span>
            <span>2 Bedrooms</span>
          </li>
          <li>
            <span className="icon hotel-icon-26"></span>
            <span>1 Garage</span>
          </li>
        </ul>
      </article>
    </div>
  );
}