import React from "react";

const PaymentMethods = () => {
  return (
    <div className="vtex-menu-2-x-FooterRightBlock">
      <span className="vtex-menu-2-x-SpanTitleBig">Formas de pagamento</span>
      <ul className="vtex-menu-2-x-UlGroup">
        <ul className="vtex-menu-2-x-UlSecondary">
          <li>
            <img
              className="vtex-menu-2-x-ImgCard"
              src="https://agenciamagma.vteximg.com.br/arquivos/mastercard-icon-m3academy-anacarolinaduartecavalcante.svg"
              alt="ícone mastercard"
            />
          </li>
          <li>
            <img
              className="vtex-menu-2-x-ImgCard"
              src="https://agenciamagma.vteximg.com.br/arquivos/diners-icon-m3academy-anacarolinaduartecavalcante.svg"
              alt="ícone diners"
            />
          </li>
          <li>
            <img
              className="vtex-menu-2-x-ImgCard"
              src="https://agenciamagma.vteximg.com.br/arquivos/boleto-icon-m3academy-anacarolinaduartecavalcante.svg"
              alt="ícone boleto"
            />
          </li>
          <li>
            <img
              className="vtex-menu-2-x-ImgCard"
              src="https://agenciamagma.vteximg.com.br/arquivos/pix-icon-m3academy-anacarolinaduartecavalcante.svg"
              alt="ícone pix"
            />
          </li>
        </ul>
        <ul className="vtex-menu-2-x-UlSecondary">
          <li>
            <img
              className="vtex-menu-2-x-ImgCard"
              src="https://agenciamagma.vteximg.com.br/arquivos/elo-icon-m3academy-anacarolinaduartecavalcante.svg"
              alt="ícone elo"
            />
          </li>
          <li>
            <img
              className="vtex-menu-2-x-ImgCard"
              src="https://agenciamagma.vteximg.com.br/arquivos/hipercard-icon-m3academy-anacarolinaduartecavalcante.svg"
              alt="ícone hipercard"
            />
          </li>
          <li>
            <img
              className="vtex-menu-2-x-ImgCard"
              src="https://agenciamagma.vteximg.com.br/arquivos/visa-icon-m3academy-anacarolinaduartecavalcante.svg"
              alt="ícone visa"
            />
          </li>
          <li>
            <img
              className="vtex-menu-2-x-ImgCard"
              src="https://agenciamagma.vteximg.com.br/arquivos/amex-icon-m3academy-anacarolinaduartecavalcante.svg"
              alt="ícone amex"
            />
          </li>
        </ul>
      </ul>
    </div>
  );
};

export default PaymentMethods;
