/** @jsx React.createElement */

function Standards() {
  const logos = [
    { src: 'assets/hl7.png', alt: 'HL7', href: 'https://www.hl7.org' },
    { src: 'assets/dicom.png', alt: 'DICOM', href: 'http://dicom.nema.org/' },
    { src: 'assets/hipaa.png', alt: 'HIPAA', href: 'https://www.hhs.gov/hipaa/' },
    { src: 'assets/ihe.jpg', alt: 'IHE', href: 'http://www.ihe.net/' },
  ];
  return (
    <section id="standards" className="section section-alt">
      <div className="container">
        <div className="eyebrow section-eyebrow">Cumplimos y trabajamos con</div>
        <h2 className="section-title"><span className="accent">NUESTROS</span> ESTÁNDARES</h2>
        <div className="logo-grid logo-grid-4">
          {logos.map(l => (
            <a key={l.alt} className="logo-tile" href={l.href} target="_blank" rel="noopener">
              <img src={l.src} alt={l.alt} />
            </a>
          ))}
        </div>
      </div>
    </section>
  );
}

window.Standards = Standards;