<div class="layout layout--two-columns">

    <div class="top-bar layout__nav">
        <button class="top-bar__menu-trigger"><i class="material-icons">menu</i></button>

        <nav class="top-bar__menu contextual-menu">
            <ul>

                <li class="contextual-menu__item">
                    <a class="contextual-menu__button contextual-menu--active" ref="#" title="Home">
                        Home

                    </a>

                </li>

                <li class="contextual-menu__item">
                    <a class="contextual-menu__button" ref="#" title="About">
                        About

                    </a>

                </li>

                <li class="contextual-menu__item submenu">
                    <a class="contextual-menu__button" ref="http://ccmdesign.ca" title="CCM Design" target="_blank">
                        CCM Design
                        <span class="screen-reader-only">(opens in a new tab)</span>
                    </a>

                    <ul class="submenu__list">

                        <li class="submenu__item">
                            <a class="submenu__button" href="#" title="Button Label longer">
                                Button Label longer

                            </a>

                        <li class="submenu__item">
                            <a class="submenu__button" href="#" title="Button Label longer">
                                Button Label longer

                            </a>

                        <li class="submenu__item">
                            <a class="submenu__button" href="http://ccmdesign.ca" title="CCM Design" target="_blank">
                                CCM Design
                                <span class="screen-reader-only">(opens in a new tab)</span>
                            </a>

                        <li class="submenu__item">
                            <a class="submenu__button" href="#" title="Button Label longer">
                                Button Label longer

                            </a>

                        <li class="submenu__item">
                            <a class="submenu__button" href="#" title="Button Label longer">
                                Button Label longer

                            </a>

                        <li class="submenu__item">
                            <a class="submenu__button" href="http://ccmdesign.ca" title="CCM Design" target="_blank">
                                CCM Design
                                <span class="screen-reader-only">(opens in a new tab)</span>
                            </a>

                        <li class="submenu__item">
                            <a class="submenu__button" href="#" title="Button Label longer">
                                Button Label longer

                            </a>

                        <li class="submenu__item">
                            <a class="submenu__button" href="#" title="Button Label longer">
                                Button Label longer

                            </a>

                        <li class="submenu__item">
                            <a class="submenu__button" href="http://ccmdesign.ca" title="CCM Design" target="_blank">
                                CCM Design
                                <span class="screen-reader-only">(opens in a new tab)</span>
                            </a>

                    </ul>

                </li>

                <li class="contextual-menu__item">
                    <a class="contextual-menu__button contextual-menu--disabled" ref="/about.html" title="About">
                        About

                    </a>

                </li>

                <li class="contextual-menu__item submenu">
                    <a class="contextual-menu__button" ref="http://ccm.design" title="Test" target="_blank">
                        Test
                        <span class="screen-reader-only">(opens in a new tab)</span>
                    </a>

                    <ul class="submenu__list">

                        <li class="submenu__item">
                            <a class="submenu__button" href="#" title="Button Lael longer">
                                Button Lael longer

                            </a>

                        <li class="submenu__item">
                            <a class="submenu__button" href="#" title="Button Label longer">
                                Button Label longer

                            </a>

                        <li class="submenu__item">
                            <a class="submenu__button" href="http://ccmdesign.ca" title="CCM Design" target="_blank">
                                CCM Design
                                <span class="screen-reader-only">(opens in a new tab)</span>
                            </a>

                    </ul>

                </li>

            </ul>
        </nav>

        <div class="off-canvas-menu" aria-hidden>
            <button class="off-canvas-menu__trigger"><i class="material-icons">close</i></button>

            <nav>
                <ul class="off-canvas-menu__contextual">

                    <li class="off-canvas-menu__item">
                        <a href="#" class=" off-canvas-menu--active" title="Home">
                            Home

                        </a>

                    </li>

                    <li class="off-canvas-menu__item">
                        <a href="#" class="" title="About">
                            About

                        </a>

                    </li>

                    <li class="off-canvas-menu__item off-canvas-menu__submenu">
                        <a href="http://ccmdesign.ca" class="" title="CCM Design" target="_blank">
                            CCM Design
                            <span class="screen-reader-only">(opens in a new tab)</span>
                        </a>

                        <ul class="submenu__list">

                            <li class="submenu__item">
                                <a class="" href="#" title="Button Label longer">
                                    Button Label longer

                                </a>

                            <li class="submenu__item">
                                <a class="" href="#" title="Button Label longer">
                                    Button Label longer

                                </a>

                            <li class="submenu__item">
                                <a class="" href="http://ccmdesign.ca" title="CCM Design" target="_blank">
                                    CCM Design
                                    <span class="screen-reader-only">(opens in a new tab)</span>
                                </a>

                            <li class="submenu__item">
                                <a class="" href="#" title="Button Label longer">
                                    Button Label longer

                                </a>

                            <li class="submenu__item">
                                <a class="" href="#" title="Button Label longer">
                                    Button Label longer

                                </a>

                            <li class="submenu__item">
                                <a class="" href="http://ccmdesign.ca" title="CCM Design" target="_blank">
                                    CCM Design
                                    <span class="screen-reader-only">(opens in a new tab)</span>
                                </a>

                            <li class="submenu__item">
                                <a class="" href="#" title="Button Label longer">
                                    Button Label longer

                                </a>

                            <li class="submenu__item">
                                <a class="" href="#" title="Button Label longer">
                                    Button Label longer

                                </a>

                            <li class="submenu__item">
                                <a class="" href="http://ccmdesign.ca" title="CCM Design" target="_blank">
                                    CCM Design
                                    <span class="screen-reader-only">(opens in a new tab)</span>
                                </a>

                        </ul>

                    </li>

                    <li class="off-canvas-menu__item">
                        <a href="/about.html" class=" off-canvas-menu--disabled" title="About">
                            About

                        </a>

                    </li>

                    <li class="off-canvas-menu__item off-canvas-menu__submenu">
                        <a href="http://ccm.design" class="" title="Test" target="_blank">
                            Test
                            <span class="screen-reader-only">(opens in a new tab)</span>
                        </a>

                        <ul class="submenu__list">

                            <li class="submenu__item">
                                <a class="" href="#" title="Button Lael longer">
                                    Button Lael longer

                                </a>

                            <li class="submenu__item">
                                <a class="" href="#" title="Button Label longer">
                                    Button Label longer

                                </a>

                            <li class="submenu__item">
                                <a class="" href="http://ccmdesign.ca" title="CCM Design" target="_blank">
                                    CCM Design
                                    <span class="screen-reader-only">(opens in a new tab)</span>
                                </a>

                        </ul>

                    </li>

                </ul>

                <ul class="off-canvas-menu__list">

                    <li class="off-canvas-menu__item off-canvas-menu--disabled">
                        <a href="http://ccm.design">
                            Test

                        </a>

                    </li>

                    <li class="off-canvas-menu__item">
                        <a href="http://ccm.design" target="_blank">
                            Test
                            <span class="screen-reader-only">(opens in a new tab)</span>
                        </a>

                    </li>

                    <li class="off-canvas-menu__item
          ">
                        <h3 class="off-canvas-menu__heading">Menu Group Title</h3>
                    </li>

                    <li class="off-canvas-menu__item">
                        <a href="http://ccm.design">
                            Test

                        </a>

                        <p>Lorem ipsum dolor sit amet, consectetur <a href="#">adipisicing elit</a>, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                        </p>

                    </li>

                    <li class="off-canvas-menu__item">
                        <a href="http://ccm.design">
                            Test

                        </a>

                    </li>

                    <li class="off-canvas-menu__item">
                        <a href="http://ccm.design">
                            Test

                        </a>

                    </li>

                    <li class="off-canvas-menu__item
          ">
                        <h3 class="off-canvas-menu__heading">Menu Group Title</h3>
                    </li>

                    <li class="off-canvas-menu__item">
                        <a href="http://ccm.design">
                            Test

                        </a>

                    </li>

                </ul>
            </nav>
        </div>
    </div>

    <header class="layout__header">

        <div class="hero-section">
            <div class="wrapper">
                <div class="hero hero--orange">
                    <!-- .hero--orange, .hero--yellow, .hero--red -->
                    <div class="hero__column hero__logo">

                        <a href="/"><img src="/images/360-logos/main/360giving-logo.svg" alt="360 Giving"></a>

                    </div>
                    <div class="hero__column hero__lead">
                        <h2 class="hero__title">
                            This is the title of the Hero
                        </h2>
                        <p class="hero__blurb">
                            360 Resources is a repository of resources to help Data Champions make better informed decisions by leveraging other people’s experiences.
                        </p>
                    </div>
                </div>
            </div>
        </div>
        <div class="search-breadcrumbs-section">
            <div class="wrapper search-breadcrumbs-section__panel">
                <div class="search-breadcrumbs-section__breadcrumbs">
                    <div class="breadcrumbs">
                        <a href="#" class="breadcrumbs__item">360Giving</a>
                        <i class="breadcrumbs__arrow">keyboard_arrow_right</i>
                        <a href="#" class="breadcrumbs__item breadcrumbs--active">Blog</a>
                    </div>
                </div>

                <div class="search-breadcrumbs-section__search">
                    <label for="search" class="screen-reader-only">Search</label>
                    <input id="search" class="search-field <!-- js-search-filter -->" placeholder="Search" />
                </div>
            </div>
        </div>

    </header>

    <main class="layout__content">

        <div class="layout__content-inner">
            <div class="wrapper">
                <section class="cards-section">
                    <ul class="card-list">
                        <li class="card-list__item">
                            <article class="media-card media-card--teal">
                                <div class="media-card__content">
                                    <div class="media-card__category-tags">
                                        <a class="media-card__category-tag" href="#">All Content</a><a class="media-card__category-tag" href="#">News</a>
                                    </div>
                                    <header class="media-card__header">
                                        <h3 class="media-card__heading">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quod vel voluptas recusandae dignissimos fugit deserunt</h3>
                                    </header>
                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quod vel voluptas recusandae dignissimos fugit deserunt molestiae, quae, blanditiis autem nesciunt odio consectetur error facilis. Ipsum, maiores cumque quo atque. Lorem ipsum Lorem ipsum dolor sit amet, consectetur adipisicing elit. Beatae magni </p>
                                    <div class="media-card__byline">Written by <a href="#">Rachel Rank</a> on October 30, 2019.</div>
                                </div>

                                <div class="media-card__image-wrapper">
                                    <img class="media-card__image" src="https://www.threesixtygiving.org/wp-content/uploads/47319360032_51d21156a2_c.jpg">
                                </div>
                            </article>
                        </li>
                        <li class="card-list__item">
                            <article class="media-card media-card--teal">
                                <div class="media-card__content">
                                    <div class="media-card__category-tags">
                                        <a class="media-card__category-tag" href="#">All Content</a><a class="media-card__category-tag" href="#">News</a>
                                    </div>
                                    <header class="media-card__header">
                                        <h3 class="media-card__heading">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quod vel voluptas recusandae dignissimos fugit deserunt</h3>
                                    </header>
                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quod vel voluptas recusandae dignissimos fugit deserunt molestiae, quae, blanditiis autem nesciunt odio consectetur error facilis. Ipsum, maiores cumque quo atque. Lorem ipsum Lorem ipsum dolor sit amet, consectetur adipisicing elit. Beatae magni </p>
                                    <div class="media-card__byline">Written by <a href="#">Rachel Rank</a> on October 30, 2019.</div>
                                </div>

                                <div class="media-card__image-wrapper">
                                    <img class="media-card__image" src="https://www.threesixtygiving.org/wp-content/uploads/47319360032_51d21156a2_c.jpg">
                                </div>
                            </article>
                        </li>
                        <li class="card-list__item">
                            <article class="media-card media-card--teal">
                                <div class="media-card__content">
                                    <div class="media-card__category-tags">
                                        <a class="media-card__category-tag" href="#">All Content</a><a class="media-card__category-tag" href="#">News</a>
                                    </div>
                                    <header class="media-card__header">
                                        <h3 class="media-card__heading">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quod vel voluptas recusandae dignissimos fugit deserunt</h3>
                                    </header>
                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quod vel voluptas recusandae dignissimos fugit deserunt molestiae, quae, blanditiis autem nesciunt odio consectetur error facilis. Ipsum, maiores cumque quo atque. Lorem ipsum Lorem ipsum dolor sit amet, consectetur adipisicing elit. Beatae magni </p>
                                    <div class="media-card__byline">Written by <a href="#">Rachel Rank</a> on October 30, 2019.</div>
                                </div>

                                <div class="media-card__image-wrapper">
                                    <img class="media-card__image" src="https://www.threesixtygiving.org/wp-content/uploads/47319360032_51d21156a2_c.jpg">
                                </div>
                            </article>
                        </li>
                        <li class="card-list__item">
                            <article class="media-card media-card--teal">
                                <div class="media-card__content">
                                    <div class="media-card__category-tags">
                                        <a class="media-card__category-tag" href="#">All Content</a><a class="media-card__category-tag" href="#">News</a>
                                    </div>
                                    <header class="media-card__header">
                                        <h3 class="media-card__heading">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quod vel voluptas recusandae dignissimos fugit deserunt</h3>
                                    </header>
                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quod vel voluptas recusandae dignissimos fugit deserunt molestiae, quae, blanditiis autem nesciunt odio consectetur error facilis. Ipsum, maiores cumque quo atque. Lorem ipsum Lorem ipsum dolor sit amet, consectetur adipisicing elit. Beatae magni </p>
                                    <div class="media-card__byline">Written by <a href="#">Rachel Rank</a> on October 30, 2019.</div>
                                </div>

                                <div class="media-card__image-wrapper">
                                    <img class="media-card__image" src="https://www.threesixtygiving.org/wp-content/uploads/47319360032_51d21156a2_c.jpg">
                                </div>
                            </article>
                        </li>
                        <li class="card-list__item">
                            <article class="media-card media-card--teal">
                                <div class="media-card__content">
                                    <div class="media-card__category-tags">
                                        <a class="media-card__category-tag" href="#">All Content</a><a class="media-card__category-tag" href="#">News</a>
                                    </div>
                                    <header class="media-card__header">
                                        <h3 class="media-card__heading">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quod vel voluptas recusandae dignissimos fugit deserunt</h3>
                                    </header>
                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum quod vel voluptas recusandae dignissimos fugit deserunt molestiae, quae, blanditiis autem nesciunt odio consectetur error facilis. Ipsum, maiores cumque quo atque. Lorem ipsum Lorem ipsum dolor sit amet, consectetur adipisicing elit. Beatae magni </p>
                                    <div class="media-card__byline">Written by <a href="#">Rachel Rank</a> on October 30, 2019.</div>
                                </div>

                                <div class="media-card__image-wrapper">
                                    <img class="media-card__image" src="https://www.threesixtygiving.org/wp-content/uploads/47319360032_51d21156a2_c.jpg">
                                </div>
                            </article>
                        </li>
                    </ul>
                </section>
            </div>
        </div>

    </main>
    <aside class="layout__sidebar">

        <div class="sidebar-section sidebar-section--orange sidebar-section--fixed">
            <div class="layout__content-inner">
                <div class="sidebar-section__item">
                    <div class="sidebar-blog">
                        <h2 class="sidebar-blog__heading">Categories</h2>
                        <ul class="sidebar-blog__content categories-list">
                            <li class="categories-list__item category"><a class="" href="#">How to</a></li>
                            <li class="categories-list__item category"><a class="" href="#">360 Insights blog</a></li>
                            <li class="categories-list__item category category--active">
                                <a class="" href="#">Technical blog</a>
                                <ul>
                                    <li><a href="#">Sub item 1</a></li>
                                    <li><a href="#">Sub item 2</a></li>
                                    <li><a href="#">Sub item 3</a></li>
                                    <li><a href="#">Sub item 4</a></li>
                                </ul>
                            </li>
                            <li class="categories-list__item category"><a class="" href="#">Government data</a></li>
                            <li class="categories-list__item category"><a class="" href="#">Innovation is grantmaking</a></li>
                            <li class="categories-list__item category"><a class="" href="#">Understanding civil society</a></li>
                            <li class="categories-list__item category"><a class="" href="#">Follow the funding</a></li>
                            <li class="categories-list__item category"><a class="" href="#">Data Champions</a></li>
                            <li class="categories-list__item category"><a class="" href="#">Events</a></li>
                            <li class="categories-list__item category"><a class="" href="#">360 Update</a></li>
                        </ul>
                    </div>

                </div>
            </div>
        </div>

    </aside>

    <footer class="layout__footer">

        <div class="subscribe-section">
            <div class="subscribe-section__wrapper">
                <form action="#" class="subscribe-section__form">
                    <label for="subscribe" class="screen-reader-only">Subscribe</label>
                    <input type="email" id="subscribe" placeholder="Subscribe to our newsletter">
                    <input type="submit" value="Send">
                </form>
            </div>
        </div>
        <footer class="footer">
            <div class="footer__row wrapper">
                <div class="footer__column-2 footer__branding">
                    <div class="footer__logo"><img src="/images/360-giving-logo-white.svg" alt="360Giving"></div>
                    <p class="footer__tagline">Open data for more effective grantmaking</p>
                </div>
                <div class="footer__column-1 footer__social hide-print">
                    <a href="#" class="github-icon"><img src="/images/github-logo.svg" alt="Check our Github"></a>
                    <a href="#" class="twitter-icon"><img src="/images/twitter-logo.svg" alt="Follow us on Twitter"></a>
                </div>
            </div>

            <div class="footer__row wrapper hide-print">
                <div class="footer__column-2 footer__section medium-up">
                    <h3 class="footer__heading">Products</h3>
                    <ul>
                        <li><a href="#">GrantNav</a></li>
                        <li><a href="#">Insights</a></li>
                        <li><a href="#">Resources</a></li>
                        <li><a href="#">Cove</a></li>
                    </ul>
                </div>

                <div class="footer__column-2 footer__section medium-up">
                    <h3 class="footer__heading">Other Products</h3>
                    <ul>
                        <li><a href="#">Data Registry</a></li>
                        <li><a href="#">Data Standard</a></li>
                        <li><a href="#">Data Challenge</a></li>
                        <li><a href="#">Data Champions</a></li>
                    </ul>
                </div>

                <div class="footer__column-3 footer__section">
                    <h3 class="footer__heading">360 Resources</h3>
                    <p>Data in JSON format is ideal for direct use by developers building visualisations and web apps. The JSON should conform to the 360Giving JSON Schemas. Anyone automating the publication of their data from their internal databases or via</p>
                </div>

                <div class="footer__column-3 footer__section">
                    <h3 class="footer__heading">360 Resources</h3>
                    <p>Data in JSON format is ideal for direct use by developers building visualisations and web apps. The JSON should conform to the 360Giving JSON Schemas. Anyone automating the publication of their data from their internal databases or via</p>

                </div>
            </div>

            <div class="wrapper footer__small-print">
                <p>
                    <strong>360 Giving</strong> (Trading as <strong>360Giving</strong>) is a registered charity <a href="https://register-of-charities.charitycommission.gov.uk/charity-details/?regId=1164883&subId=0">1164883</a> and a registered company <a href="https://beta.companieshouse.gov.uk/company/09668396">09668396</a>.
                    <br>Registered address: 360 Giving, c/o Sayer Vincent, 110 Golden Lane, London, EC1Y 0TG
                </p>
            </div>

            <div class="footer__row wrapper footer__small-print">

                <div class="footer__column-2">
                    <p>© Copyright 2021 360Giving.<br>Licensed under a <a href="#" target="_blank">Creative Commons Attribution 4.0 International License</a>.</p>
                </div>
                <div class="footer__column-2 footer__policy-links hide-print">
                    <p><a href="#">Privacy Notice</a> | <a href="#">Terms & Conditions</a> | <a href="#">Cookie Policy</a> | <a href="#">Take Down Policy</a> | <a href="#">License</a></p>
                </div>
            </div>
        </footer>

    </footer>
</div>
{% extends '@layout--two-columns' %}

{% block header %}
  {% render '@hero' %}
  {% render '@search-breadcrumbs' %}
{% endblock %}

{% block main_content %}
<div class="layout__content-inner">
  <div class="wrapper">
    <section class="cards-section">
      <ul class="card-list">
        <li class="card-list__item">{% render '@media-card--blog' %}</li>
        <li class="card-list__item">{% render '@media-card--blog' %}</li>
        <li class="card-list__item">{% render '@media-card--blog' %}</li>
        <li class="card-list__item">{% render '@media-card--blog' %}</li>
        <li class="card-list__item">{% render '@media-card--blog' %}</li>
      </ul>
    </section>
  </div>
</div>
{% endblock %}

{% block sidebar %}
  {% render '@sidebar-section--blog' %}
{% endblock %}
/* No context defined. */

No notes defined.