/* global React */
function B2BBanner() {
  return (
    <section className="dp-section" id="haendler">
      <div className="dp-container">
        <div className="dp-b2b">
          <div>
            <span className="dp-eyebrow dp-eyebrow--on-dark">Für Händler</span>
            <h2 className="dp-h2" style={{ color: '#fff', marginTop: 12, marginBottom: 14 }}>
              B2B-Konditionen,<br/>die rechnen.
            </h2>
            <p className="dp-lead" style={{ color: 'rgba(255,255,255,.78)' }}>
              Sie führen einen Sonderpostenmarkt, Drogerie, oder Online-Shop? Lassen Sie sich auf unseren B2B-Bereich freischalten.
            </p>
            <ul>
              <li>Mengenrabatte ab 1 Palette</li>
              <li>Sammelrechnung &amp; Zahlungsziel auf Anfrage</li>
              <li>Persönliche Betreuung durch festen Ansprechpartner</li>
              <li>Vorab-Info zu neuen Posten per E-Mail</li>
            </ul>
            <div style={{ display: 'flex', gap: 12, flexWrap: 'wrap' }}>
              <button className="dp-btn dp-btn--primary dp-btn--lg">Händler werden</button>
              <button className="dp-btn dp-btn--outline dp-btn--on-dark dp-btn--lg">Konditionen ansehen</button>
            </div>
          </div>
          <div className="dp-b2b__fox">
            <img src="assets/OkFuchs.png" alt="OkFuchs" />
          </div>
        </div>
      </div>
    </section>
  );
}
window.B2BBanner = B2BBanner;