{% load static %}

<footer class="footer pb-6 bg-primary text-white pt-9 mt-n9">
  <div class="container">
      <div class="row mt-6">
          <div class="col-md-4">
              <p><strong>Pixel</strong> is a large User Interface Kit that will help you prototype and design beautiful, creative and modern websites.</p>
              <ul class="social-buttons mb-5 mb-lg-0">
                  <li>
                      <a href="https://twitter.com/themesberg" aria-label="twitter social link" class="icon icon-xs icon-white"
                          data-toggle="tooltip" data-placement="top" title="Follow us on Twitter">
                          <span class="fab fa-twitter"></span>
                      </a>
                  </li>
                  <li>
                      <a href="https://www.facebook.com/Themesberg-214738555737136/"
                          class="icon icon-xs icon-white" aria-label="facebook social link" data-toggle="tooltip"
                          data-placement="top" title="Like us on Facebook">
                          <span class="fab fa-facebook"></span>
                      </a>
                  </li>
                  <li>
                      <a href="https://github.com/themesberg" aria-label="github social link" class="icon icon-xs icon-white"
                          data-toggle="tooltip" data-placement="top" title="Star us on Github">
                          <span class="fab fa-github"></span>
                      </a>
                  </li>
                  <li>
                      <a href="https://dribbble.com/themesberg"
                          class="icon icon-xs icon-white" aria-label="dribbble social link" data-toggle="tooltip"
                          data-placement="top" title="Like us on Dribbble">
                          <span class="fab fa-dribbble"></span>
                      </a>
                  </li>
              </ul>
          </div>
          <div class="col-6 col-md-2 mb-5 mb-lg-0">
              <h3 class="h5">Themesberg</h3>
              <ul class="links-vertical">
                  <li><a target="_blank" href="https://themesberg.com/blog">Blog</a></li>
                  <li><a target="_blank" href="https://themesberg.com/themes">Themes</a></li>
                  <li><a target="_blank" href="https://themesberg.com/about">About Us</a>
                  </li>
                  <li><a target="_blank" href="https://themesberg.com/contact">Contact Us</a></li>
              </ul>
          </div>
          <div class="col-6 col-md-2 mb-5 mb-lg-0">
              <h3 class="h5">Other</h3>
              <ul class="links-vertical">
                  <li><a href="https://themesberg.com/docs/bootstrap-5/pixel/getting-started/quick-start/" target="_blank">Docs
                          <span class="badge badge-sm badge-secondary me-2">v3.0</span></a></li>
                  <li><a href="https://themesberg.com/docs/pixel-bootstrap/getting-started/changelog" target="_blank">Changelog</a></li>
                  <li><a target="_blank" href="https://themesberg.com/licensing">License</a>
                  </li>
                  <li><a target="_blank" href="https://github.com/themesberg/pixel-bootstrap-ui-kit/issues">Support</a></li>
              </ul>
          </div>
          <div class="col-12 col-md-4 mb-5 mb-lg-0">
              <span class="h5">Subscribe</span>
              <p class="text-muted font-small mt-2">Join our mailing list. We write rarely, but only the best content.
              </p>
              <form action="#">
                  <div class="form-row mb-2">
                      <div class="col-12">
                          <label class="h6 fw-normal text-muted d-none" for="exampleInputEmail3">Email address</label>
                          <input type="email" class="form-control mb-2" placeholder="example@company.com" name="email"
                              aria-label="Subscribe form" id="exampleInputEmail3" required>
                      </div>
                      <div class="col-12 d-grid">
                          <button type="submit" class="btn btn-tertiary" data-loading-text="Sending">
                              <span>Subscribe</span>
                          </button>
                      </div>
                  </div>
              </form>
              <p class="text-muted font-small m-0">We’ll never share your details. See our <a class="text-white"
                      href="#">Privacy Policy</a></p>
          </div>
      </div>
      <hr class="my-5">
      <div class="row">
          <div class="col mb-md-0">
              <a href="https://themesberg.com" target="_blank" class="d-flex justify-content-center">
                  <img src="{% static 'assets/img/themesberg.svg' %}" height="25" class="mb-3" alt="Themesberg Logo">
              </a>
          <div class="d-flex text-center justify-content-center align-items-center" role="contentinfo">
              <p class="font-weight-normal font-small mb-0">Copyright © Themesberg
                  <span class="current-year">2020</span>. All rights reserved.</p>
              </div>
          </div>
      </div>
  </div>
</footer>