<footer class="np-footer">
  <div class="np-footer-top np-max-width">
    {% if website_footer.show_navigation_links? %}
      <div class="np-footer-navigation">
        <div class="footer-navigation-links-group">
          <div class="footer-navigation-links-heading">Product</div>
          <div class="footer-navgiation-links-list">
            <a
              href="https://www.datasnipper.com/product/platform"
              class="footer-navigation-link"
              target="_blank">Platform</a>
            <a
              href="https://www.datasnipper.com/product/financial-statement-suite"
              class="footer-navigation-link"
              target="_blank">Financial Statement Suite</a>
          </div>
        </div>
        <div class="footer-navigation-links-group">
          <div class="footer-navigation-links-heading">Resources</div>
          <div class="footer-navgiation-links-list">
            <a
              href="https://knowledge.datasnipper.com/"
              class="footer-navigation-link"
              target="_blank">Knowledge Base</a>
            <a
              href="https://www.datasnipper.com/resources?type=Blog"
              class="footer-navigation-link"
              target="_blank">Blogs</a>
            <a
              href="https://www.datasnipper.com/customers"
              class="footer-navigation-link"
              target="_blank">Customer Stories</a>
          </div>
        </div>
        <div class="footer-navigation-links-group">
          <div class="footer-navigation-links-heading">Company</div>
          <div class="footer-navgiation-links-list">
            <a
              href="https://www.datasnipper.com/about-us"
              class="footer-navigation-link"
              target="_blank">About us</a>
            <a
              href="https://careers.datasnipper.com/"
              class="footer-navigation-link"
              target="_blank">Careers</a>
            <a
              href="https://www.datasnipper.com/privacy-policy"
              class="footer-navigation-link"
              target="_blank">Privacy Policy</a>
          </div>
        </div>
      </div>
    {% endif %}
    <div>
      <nav class="np-footer-social-links">
        {% if website_footer.show_social_media_links? %}
          <ul class="np-footer-social-links-list">
            {% for social_media_link in website_footer.social_media_links %}
              {% unless social_media_link.name == "twitter" %}
                <li class="np-footer-social-links-item">
                  <a
                    class="np-footer-social-links-link np-button-font-color"
                    href="{{ social_media_link.link }}"
                    target="_blank"
                    title="{{ social_media_link.name }}">
                    {% if social_media_link.name == "linkedin" %}
                      <i class="np-footer-social-links-icon np-button-font-color
                    fab fa-linkedin-in">
</i>
                    {% else %}
                      <i class="np-footer-social-links-icon np-button-font-color
                  fab fa-{{ social_media_link.name }}">
</i>
                    {% endif %}

                  </a>
                </li>
              {% endunless %}
            {% endfor %}
            {% for social_media_link in website_footer.social_media_links %}
              {% if social_media_link.name == "twitter" %}
                <li class="np-footer-social-links-item">
                  <a
                    class="np-footer-social-links-link np-button-font-color"
                    href="{{ social_media_link.link }}"
                    target="_blank"
                    title="{{ social_media_link.name }}">
                    <svg
                      width="1200"
                      height="1227"
                      viewBox="0 0 1200 1227"
                      fill="none"
                      xmlns="http://www.w3.org/2000/svg"
                      style="max-height:18px;position: relative;top: 3px;max-width:100%;">
                      <path d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z" fill="white" />
                    </svg>
                  </a>
                </li>
              {% endif %}
            {% endfor %}
          </ul>
        {% endif %}
      </nav>
      {% if current_school.logo_url %}
        <h2 class="np-footer-logo">
          <a href="https://www.datasnipper.com/resources/datasnipper-partners-1-percent-for-the-planet" target="_blank">
            <img
              alt="{{ current_school.name }}"
              class="np-footer-logo-image"
              src="https://s3.amazonaws.com/static.northpass.com/datasnipper/for-the-planet-logo.png" />
          </a>
          <a href="https://www.aicpa-cima.com/resources/landing/system-and-organization-controls-soc-suite-of-services" target="_blank">
            <img
              alt="{{ current_school.name }}"
              class="np-footer-logo-image"
              src="https://s3.amazonaws.com/static.northpass.com/datasnipper/soc-badge.png" />
          </a>
        </h2>
      {% else %}
        <div class="np-school-name np-header-font-color">
          {{ current_school.name }}
        </div>
      {% endif %}
    </div>

  </div>

  <div class="np-footer-bottom np-max-width">
    <div class="copyright-notice">©<span id="copyrightYear"></span>
      DataSnipper. All rights reserved.</div>

    {% if website_footer.show_customer_service_email? and website_footer.school_customer_service_email
    %}
      <div class="np-footer-support">
        <div class="np-footer-support-item np-footer-support-help">
          {% t.need_help %}
        </div>
        <div class="np-footer-support-item np-footer-support-email">
          {% t.email %}
        </div>
        <a class="np-footer-support-item np-footer-support-link np-button-color" href="mailto:{{ website_footer.school_customer_service_email }}">
          {{ website_footer.school_customer_service_email }}
        </a>
      </div>
    {% endif %}
  </div>
</footer>

<script>
  window.addEventListener("DOMContentLoaded", function() {
    const year = new Date().getFullYear()

    document.getElementById("copyrightYear").innerText = year
  })
</script>

<style>
  .np-footer {
    background-color: #011638;
    padding: 44px 16px;
    max-width: 1200px;
    margin: auto;
  }

  .np-footer-social-links-list {
    justify-content: center;
  }

  .np-footer-social-links-item {
    width: 48px;
    height: 48px;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    margin: 0 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    padding: 0;
  }

  .np-footer-social-links-link {
    font-size: 20px;
    line-height: 48px;
  }

  .np-footer-logo {
    text-align: center;
    margin-bottom: 16px;
  }

  .np-footer-logo > a {
    margin: 0 6px;
    text-decoration: none;
  }

  .np-footer-logo-image {
    opacity: 1;
    filter: contrast(1);
    height: auto;
    max-width: 190px;
  }

  .footer-navigation-links-group {
    margin-bottom: 20px;
    text-align: center;
  }

  .footer-navigation-links-heading {
    color: #fff;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    margin-bottom: 12px;
  }

  .footer-navigation-link {
    display: block;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 8px;
  }

  .np-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 32px;
  }

  .copyright-notice {
    color: rgba(255, 255, 255, 0.6);
    font-size: 14px;
    line-height: 24px;
    display: block;
    margin: auto;
  }

  @media (min-width: 768px) {
    .np-footer {
      padding: 100px 16px;
    }

    .np-footer-navigation {
      display: flex;
    }

    .footer-navigation-links-group {
      margin-right: 32px;
      text-align: left;
    }

    .np-footer-social-links-list {
      padding-left: 0;
      margin-bottom: 20px;
      margin-top: 0;
    }

    .footer-navigation-link {
      margin-bottom: 12px;
    }

    .np-footer-logo {
      margin-right: 0;
    }
  }

  @media (min-width: 1200px) {
    .footer-navigation-links-group {
      margin-right: 80px;
    }
  }
</style>

<script>

  const isInIframe = inIframe()
  if (isInIframe) {
    document.querySelector(".np-header").style.display = "none";
    document.querySelector(".np-footer").style.display = "none";
  } else {
    console.log("not iframed")
  }

  function inIframe () {
    try {
        return window.self !== window.top;
    } catch (e) {
        return true;
    }
  }
</script>