<div class="banner">
  <input id="trigger" type="checkbox" title="{{ _('Close banner') }}" />
  <label for="trigger" class="banner-close text-white">
      <div class="d-flex h-100">
        <img src="{{ '/static/images/yec-2023/x.png'|asseturl }}" class="m-auto h-100 w-100 p-1 img-svg">
      </div>
  </label>
  <span class="eoy-sr-only text-white">{{ _('Close banner') }}</span>
  
  <div id="banner-header">
    <div class="banner-content">
      <div class="banner-content-spacer py-5 h-100">
        <div class="banner-content-container d-flex">
          <div class="banner-main-graphics h-100">
            <img class="yec-illo img-svg" src="{{ '/static/images/yec-2023/main-illo.png'|asseturl }}">
          </div>
          <div id="banner-text-container" class="d-flex flex-column {{ bag('alternatives', this.alt, 'direction') }}">
            <div id="banner-text" class="d-flex flex-column">
              <p id="match-text">{{ _('The Friends of Tor match has been reached.') }}</p>
              <h1>{{ _('Right now, Tor is protecting the privacy of millions of people like you!') }}</h1>
              <p>
              <strong>{{ _('This is possible because of donations from our community.') }}</strong> {{ _("If you value the privacy that Tor offers yourself and others, please make a donation today. You’ll ensure Tor continues to provide online privacy to everyone who needs it.") }}
              </p>
            </div>
            <div id="yec-donate-button-container">
              <a class="btn" id="yec-donate-button" href="https://donate.torproject.org/">
                <span>{{ _('Donate now') }}</span>
                <img src="{{ '/static/images/yec-2023/heart.png'|asseturl }}" class="donate-heart img-svg">
              </a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
