{% extends "base.html" %}

{% block head %}
{{ super() }}
<link rel="stylesheet" type="text/css" href="{{SITEURL}}/theme/css/about-us.css">

{% endblock %}

{% block content %}
<div class="container-fluid">
    <div class="row">
        <div class="col-lg-6 col-md-12 col-sm-12">
            <div class="box-wrap">
                <h2 class="box-title">About Us</h2>
                <p class="box-words">Grassroots Economics is a non-profit foundation that seeks to empower marginalized communities to take charge of their own livelihoods and economic future. We focus on community development through economic empowerment, basic income and community currency programs. Beneficiaries of our programs include small businesses and people living in informal settlements as well as rural areas.</p>
                <p class="box-words">Our goal is to improve the lives of those who are most vulnerable. </p>
                <div class="inline-buttons">
                    <a class="a-button" href="{{SITEURL}}/pages/sarafu-network.html">Sarafu network</a>
                    <a class="a-button" href="#">History</a>
                    <a class="a-button" href="#">Team</a>
                    <a class="a-button" href="#">Sponsors</a>
                </div>
            </div>
        </div>
        <div class="col-lg-6 col-md-12 col-sm-12">
            <img src="{{SITEURL}}/theme/images/aboutus-imgs/aboutus-img1.webp" class="img-fluid">
        </div>
        <div class="col-lg-6 col-md-12 col-sm-12">
            <div class="box-wrap">
                <p class="box-words1">Our work builds on a rich history of community programs in Africa. We have implemented community currency programs in 45 locations across Kenya and assisted with 2 in South Africa and helped more than 40,000 small businesses, churches and schools take an active role in their own economy and development. We are currently developing programs all over Kenya and providing technical support for those outside Kenya.</p>
            </div>
        </div>
        <div class="col-lg-6 col-md-12 col-sm-12">
            <h2 class="box-title1">HISTORY</h2>
        </div>
    </div>
    <div class="row">
        <p>Photo grid missing!!</p>
        <div class="col-lg-3">

        </div>
        <div class="col-lg-3">

        </div>
        <div class="col-lg-3">

        </div>
        <div class="col-lg-3">

        </div>
    </div>
</div>
<div id="carouselExampleIndicators" class="carousel slide carousel-dark" data-bs-ride="carousel">
    <ol class="carousel-indicators">
        <li  data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active"></li>
        <li  data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1"></li>
        <li  data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2"></li>
    </ol>
    <div class="carousel-inner">
        <div class="carousel-item active">
          <div class="row pt-5">
              <div class="col-lg-6 col-md-12 col-sm-12 ps-5">
                  <div class="wrapper-carousel">
                      <h3 class="years">2010</h3>
                      <h2>ECO_PESA</h2>
                      <p>This program was launched as a backed currency model with 75 Businesses taking part in three informal settlements near Kongowea, Mombasa. The currency was backed by donor funds and accomplished some amazing community service and environmental goals in partnership with Green World Campaign while increasing local trade for a year period.</p>
                  </div>
              </div>
              <div class="col-lg-6 col-md-12 col-md-12 ps-5">
                <div class="wrapper-carousel">
                    <div class="iframe-container">
                        <iframe width="480" height="277" src="https://www.youtube.com/embed/UaspBGmsdLE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                    </div>
                </div>
              </div>
          </div>
        </div>
        <div class="carousel-item">
          <img src="..." class="d-block w-100" alt="...">
        </div>
        <div class="carousel-item">
          <img src="..." class="d-block w-100" alt="...">
        </div>
    </div>
    <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        <span class="visually-hidden">Previous</span>
    </button>
    <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="visually-hidden">Next</span>
    </button>
</div>


{% endblock %}