import propTypes from 'prop-types';

export default function WhyUsCard(props) {
  return (
    <div className="card-no-hover w-fit h-full flex flex-col text-center justify-between group">
      <img
        src={props.image}
        alt="Card's Icon"
        className="ml-auto mr-auto block w-2/5 bg-baby-blue text-dark-gray rounded-full"
      />
      <h3 className="mt-6 font-semibold text-title">{props.heading}</h3>
      <p className="mt-6 text-sm">{props.paragraph}</p>
    </div>
  );
}

WhyUsCard.propTypes = {
  image: propTypes.string,
  heading: propTypes.string,
  paragraph: propTypes.string,
};
