<article class="explore">
  <section class="explore__content">
    <p>
      <iframe src="https://player.vimeo.com/video/73504274" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    </p>
  </section>
</article>

<article class="explore">
  <section class="explore__content">
    <p>
      <iframe width="560" height="315" src="https://www.youtube.com/embed/aQ27iS1mkuo" frameborder="0" allowfullscreen></iframe>
    </p>
  </section>
</article>

<section class="section pad--vertical">
  <div class="content__wrapper">
    <div class="cards__g1111">
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302913"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302914"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302915"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302916"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
    </div>
  </div>
</section>

<section class="section">
  <div class="content__wrapper">
    <div class="cards__g112">
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302913"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302914"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302915"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
    </div>
  </div>
</section>

<section class="section">
  <div class="content__wrapper">
    <div class="cards__g121">
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302913"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302914"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302915"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
    </div>
  </div>
</section>

<section class="section">
  <div class="content__wrapper">
    <div class="cards__g211">
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302913"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302914"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302915"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
    </div>
  </div>
</section>

<section class="section">
  <div class="content__wrapper">
    <div class="cards__g22">
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302913"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302914"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
    </div>
  </div>
</section>

<section class="section">
  <div class="content__wrapper">
    <div class="cards__g112">
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302913"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href=""><img src="https://placeimg.com/728/280/any?cache=7493302914"/></a>
        </div>
        <h2 class="card__header"><a href="">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card qotd">
        <p class="title">Question of the Day</p>
        <time>Tuesday, June 2, 2015</time>
        <p>How can I connect to mobile app publishers and marketers for customer development and usability
          interviews about app store optimization?</p>
        <a class="button" href="">View Answers</a>
      </div>
    </div>
  </div>
</section>

<section class="discover-block">
  <div class="content__wrapper">
    <div class="discover-block__image">
      <a href=""><img src="/assets/images/docs/kara_thrace.jpg"/></a>
    </div>
    <div class="discover-block__detail">
      <p class="discover-block__detail__type">Discovery of the Week</p>
      <h2 class="discover-block__detail__header"><a href="">Kara Thrace</a></h2>
      <p class="discover-block__detail__excerpt">There's a hole in the bucket, dear Liza, dear Liza, there's a hole in the bucket.</p>
      <a class="button discover-block__detail__button" href="">Read Review</a>
    </div>
  </div>
</section>
<section class="discover-block discover-block--flipped">
  <div class="content__wrapper">
    <div class="discover-block__image discover-block__image--flipped">
      <a href=""><img src="/assets/images/docs/sam_anders.jpg"/></a>
    </div>
    <div class="discover-block__detail discover-block__detail--flipped">
      <p class="discover-block__detail__type">Last Week's Discovery</p>
      <h2 class="discover-block__detail__header"><a href="">Samuel Anders</a></h2>
      <p class="discover-block__detail__excerpt">Spins and turns, angles and curves. The shape of dreams, half remembered.</p>
      <a class="button discover-block__detail__button" href="">Read Review</a>
    </div>
  </div>
</section>

<article id="article-123" class="explore">
  <header class="explore__header">
    <div class="explore__header__image">
      <a href=""><img src="/assets/images/docs/kara-thrace.jpg"/></a>
    </div>
    <div class="explore__header__detail">
      <p class="explore__header__detail__type"><a href="">Marketing</a></p>
      <h2 class="explore__header__detail__header"><a href="">A closed system lacks the ability to renew itself</a></h2>
      <p class="explore__header__detail__byline">by <strong>Kara Thrace</strong></p>
      <ul class="explore__header__detail__share-list">
        <li><a href="" class="facebook">
          <svg class="svg-social-icon facebook">
            <use xlink:href="#social-icon-facebook"></use>
          </svg>
          <span id="article-123-share-count-facebook">256</span>
        </a>
        </li>
        <li><a href="" class="twitter">
          <svg class="svg-social-icon twitter">
            <use xlink:href="#social-icon-twitter"></use>
          </svg>
          <span id="article-123-share-count-twitter">141</span>
        </a>
        </li>
        <li><a href="" class="linkedin">
          <svg class="svg-social-icon linkedin">
            <use xlink:href="#social-icon-linkedin"></use>
          </svg>
          <span id="article-123-share-count-linkedin">6</span>
        </a>
        </li>
      </ul>
    </div>
  </header>
</article>

<section class="section">
  <div class="content__wrapper">
    <header class="cards__title cards__title--bordered">
      <h3 class="cards__title__header">
        <a href="/pages/explore/section.html">Section Title
          <svg class="cards__title__arrow svg-ui-icon rarr">
            <use xlink:href="#ui-icon-rarr"></use>
          </svg>
        </a>
      </h3>
    </header>
    <div class="cards__g211">
      <div class="card">
        <div class="card__image">
          <a href="/pages/explore/article.html"><img src="https://placeimg.com/728/280/any?cache=7493302913"/></a>
        </div>
        <h2 class="card__header"><a href="/pages/explore/article.html">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href="/pages/explore/article.html"><img src="https://placeimg.com/728/280/any?cache=7493302914"/></a>
        </div>
        <h2 class="card__header"><a href="/pages/explore/article.html">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
      <div class="card">
        <div class="card__image">
          <a href="/pages/explore/article.html"><img src="https://placeimg.com/728/280/any?cache=7493302915"/></a>
        </div>
        <h2 class="card__header"><a href="/pages/explore/article.html">The particle is oddly mysterious</a></h2>
        <p class="card__detail">When the vogon warps for starfleet headquarters, all phenomenons outweigh crazy, vital creatures. Seismic creatures, to the port.</p>
      </div>
    </div>
  </div>
</section>

<footer>
  <div class="footer--site">
    <section class="footer__content">
      <nav>
        <h4>Get Started</h4>
        <ul>
          <li><a href="">Start a Fundraise</a></li>
          <li><a href="">Investor Signup</a></li>
          <li><a href="">Account Login</a></li>
        </ul>
      </nav>
      <nav>
        <h4>Browse</h4>
        <ul>
          <li><a href="">Trending</a></li>
          <li><a href="">Recently Funded</a></li>
          <li><a href="">New &amp; Noteworthy</a></li>
        </ul>
      </nav>
      <nav>
        <h4>Resources</h4>
        <ul>
          <li><a href="">FAQ</a></li>
          <li><a href="">Guidelines</a></li>
          <li><a href="">Contact Us</a></li>
        </ul>
      </nav>
      <nav>
        <h4>Legal</h4>
        <ul>
          <li><a href="">Terms of Service</a></li>
          <li><a href="">Privacy Policy</a></li>
        </ul>
      </nav>
      <nav class="social">
        <h4>Follow</h4>
        <ul>
          <li><a href="">
            <svg class="svg-social-icon twitter">
              <use xlink:href="#social-icon-twitter"></use>
            </svg>
          </a></li>
          <li><a href="">
            <svg class="svg-social-icon facebook">
              <use xlink:href="#social-icon-facebook"></use>
            </svg>
          </a></li>
          <li><a href="">
            <svg class="svg-social-icon instagram">
              <use xlink:href="#social-icon-instagram"></use>
            </svg>
          </a></li>
          <li><a href="">
            <svg class="svg-social-icon linkedin">
              <use xlink:href="#social-icon-linkedin"></use>
            </svg>
          </a></li>
        </ul>
      </nav>
    </section>
  </div>
  <div class="footer--platform">
    <section class="footer__content">
      <div class="col">
        <a href="https://www.startups.co">
          <img src="/assets/images/logos/logo_startups_footer.svg" alt="the startups.co platform"/>
        </a>
        <p>A Startup Launch Platform to help you find customers, funding, press, and mentors.</p>
      </div>
      <div class="col">
        <a href="https://www.launchrock.com">
          <img src="/assets/images/logos/logo_launchrock_white.svg" alt="Launchrock"/>
          <p>Reach Customers</p>
        </a>
      </div>
      <div class="col">
        <a href="https://www.fundable.com">
          <img src="/assets/images/logos/logo_fundable_white.svg" alt="Fundable"/>
          <p>Secure Funding</p>
        </a>
      </div>
      <div class="col">
        <a href="https://www.clarity.fm">
          <img src="/assets/images/logos/logo_clarity_white.svg" alt="Clarity"/>
          <p>Access Mentors</p>
        </a>
      </div>
      <div class="col">
        <a href="https://www.killerstartups.com">
          <img src="/assets/images/logos/logo_killerstartups_white.svg" alt="KillerStartups"/>
          <p>Get Discovered</p>
        </a>
      </div>
      <div class="col">
        <a href="https://www.bizplan.com">
          <img src="/assets/images/logos/logo_bizplan_white.svg" alt="Bizplan"/>
          <p>Business Planning</p>
        </a>
      </div>
    </section>
    <section class="footer__content">
      <div class="footer--platform__colophon">
        <p>&copy; 2016 Startups.co LLC</p>
      </div>
    </section>
  </div>
</footer>

<section class="section--fp-feature">
  <div class="section--fp-feature__content">
    <div class="section--fp-feature__content__image">
      <a href=""><img src="/assets/images/docs/kara-thrace.jpg"/></a>
    </div>
    <div class="section--fp-feature__content__detail">
      <p class="section--fp-feature__content__detail__type">Feature</p>
      <h2 class="section--fp-feature__content__detail__header"><a href="">A closed system lacks the ability to renew itself</a></h2>
      <p class="section--fp-feature__content__detail__excerpt">The neuroanatomy of fear and faith share common afferent pathways. You are the harbinger of death Kara Thrace, you will lead them all to their end.</p>
    </div>
  </div>
</section>

<section class="section--fp-feature">
  <div class="section--fp-feature__content">
    <div class="section--fp-feature__content__image">
      <a href=""><img src="/assets/images/docs/kara-thrace.jpg"/></a>
    </div>
    <div class="section--fp-feature__content__detail">
      <p class="section--fp-feature__content__detail__type">Feature</p>
      <h2 class="section--fp-feature__content__detail__header"><a href="">A closed system lacks the ability to renew itself</a></h2>
      <p class="section--fp-feature__content__detail__excerpt">The neuroanatomy of fear and faith share common afferent pathways. You are the harbinger of death Kara Thrace, you will lead them all to their end.</p>
    </div>
  </div>
</section>

<nav class="site-header__main-nav pad--vertical">
  <div class="content__wrapper">
    <ul class="site-header__main-nav__list">
      <li class="site-header__main-nav__list-item">
        <a href="/pages/explore">
          Learn</a>
      </li>
      <li class="site-header__main-nav__list-item">
        <a href="/pages/discover">
          Reviews</a>
      </li>
      <li class="site-header__main-nav__list-item">
        <a href="/pages/answers">
          Answers</a>
      </li>
      <li class="site-header__main-nav__list-item--utility no-margin--right">
        <div class="site-header__main-nav__search">
          <form action="/pages/search">
            <label for="search-box" class="site-header__main__search__icon--search">
              <svg class="svg-search">
                <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-search"></use>
              </svg>
            </label>
          </form>
        </div>
      </li>
      <li class="site-header__main-nav__list-item--utility">
        <a href="/pages/explore">
          newsletter</a>
      </li>
      <li class="site-header__main-nav__list-item--utility">
        <a href="/pages/explore">
          about</a>
      </li>
    </ul>
    <div class="menu-open" data-type="modal-opener"></div>
    <div class="site-header__main-nav__branding">
      <a href="/pages" title="startups.co">
        <img class="site-header__main-nav__logo" src="/assets/images/logos/sco_logo__boxed__white.svg" alt="startups.co"/>
      </a>
    </div>
  </div>
</nav>

<section class="hero--texture-waveform">
  <div class="intrinsic">
    <div class="element">
      <header class="page-header pad--vertical">
        <div class="content__wrapper">
          <h1 class="page-header__title">
            Page Title
          </h1>
          <h3 class="page-header__summary">
            Actionable advice from the leaders of today's most successful startups
          </h3>
        </div>
      </header>
    </div>
  </div>
</section>

<section class="section">
  <div class="content__wrapper">
    <p class="loadmore"><a class="loadmore__link" href="">Load more articles</a></p>
  </div>
</section>

<section>
  <div class="content__wrapper">
    <a class="button" data-type="modal-opener">Open Modal</a>
    <div id="page-modal" class="modal__source">
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam aut beatae doloremque doloribus eius illum itaque iusto minima, minus natus obcaecati odio perspiciatis quaerat quod similique ut vero voluptatem voluptatum.</p>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid dignissimos doloremque est illo labore nam non odio, praesentium quae quaerat rem reprehenderit saepe sunt vero vitae? Autem ipsam nihil voluptatum.</p>
    </div>
  </div>
</section>

<header class="page-header">
  <div class="content__wrapper">
    <h1 class="page-header__title">
      Page Title
    </h1>
    <h3 class="page-header__summary">
      Actionable advice from the leaders of today's most successful startups
    </h3>
  </div>
</header>

<header id="site-header" class="site-header">
  <section class="site-header__platform">
    <div class="content__wrapper">
      <span id="site-header__platform__toggle" class="site-header__platform__logo">the <strong>startups.co</strong> platform <span class="arrow"></span></span>
      <span class="site-header__platform__links"><a href="/pages/about">about startups.co</a><a href="/pages/account">my account</a></span>
      <span class="site-header__platform__news"><a href="http://techcrunch.com/2015/02/03/fundable-acquires-clarity-fm/" target="_blank">We've acquired Clarity.fm! Learn all about it on TechCrunch</a></span>
    </div>
  </section>
  <section id="site-header__platform__nav" class="site-header__platform-nav">
    <div class="content__wrapper">
      <div class="col">
        <a href="">
          <img src="/assets/images/logos/logo_launchrock_white.svg" alt="Launchrock"/>
          <p>Reach Customers</p>
        </a>
      </div>
      <div class="col">
        <a href="">
          <img src="/assets/images/logos/logo_fundable_white.svg" alt="Fundable"/>
          <p>Secure Funding</p>
        </a>
      </div>
      <div class="col">
        <a href="">
          <img src="/assets/images/logos/logo_clarity_white.svg" alt="Clarity"/>
          <p>Access Mentors</p>
        </a>
      </div>
      <div class="col">
        <a href="">
          <img src="/assets/images/logos/logo_killerstartups_white.svg" alt="KillerStartups"/>
          <p>Get Discovered</p>
        </a>
      </div>
      <div class="col">
        <a href="">
          <img src="/assets/images/logos/logo_bizplan_white.svg" alt="Bizplan"/>
          <p>Business Planning</p>
        </a>
      </div>
    </div>
  </section>
</header>

<section class="section">
  <div class="content__wrapper">
    <div class="tout">
      <img class="tout__avatar" src="/assets/images/mock/user-images/.jpg" alt=" "/>
      <div class="tout__content">
        <p class="tout__content__title">  <span class="tout__content__title__detail">, </span></p>
        <p class="tout__content__content"></p>
      </div>
      <div class="tout__cta">
        <a class="button button__small">Request a Call</a><br/>
        <img src="/assets/images/ui/powered_by_clarity.svg" alt="Powered by Clarity" class="tout__cta__image"/>
      </div>
    </div>
  </div>
</section>