index.html

---
layout: master
---
    <section class="landing-page">
      <h1 class="is-size-1 is-size-3-mobile">Stephanie Slater is a UX, branding and <br>web <span class="bold-blue">designer</span> from London</h1></b>
      <a href="#services" class="button is-medium">tell me more</a>
    </section>

    <section class="section" id="services">
      <div class="container">
        <ul class="columns is-variable is-8">

          <li class="column">
            <div class="service">
              <div class="service-icon">
                <img src="images/uiux.png">
              </div>
              <h3 class="is-size-3">UI, UX and Web Design</h3>
              <p class="is-size-5">I design beautiful websites, apps and interfaces informed by an understanding of human experience</p>
            </div>
          </li>

          <li class="column">
            <div class="service">
              <div class="service-icon">
                <img src="images/branding-icon.png">
              </div>
              <h3 class="is-size-3">Branding and Identity</h3>
              <p class="is-size-5">I have a wealth of experience in creating and evolving branding
and logo design from a wide range of sectors</p>
            </div>
          </li>

          <li class="column">
            <div class="service">
              <div class="service-icon">
                <img src="images/graphics-icon.png">
              </div>
              <h3 class="is-size-3">Digital and Social <br>Design</h3>
              <p class="is-size-5">From social media graphics to digital brochures, my extensive design services offer solutions to all your business’ marketing needs</p>
            </div>
          </li>

        </ul>
      </div>

    </section>

    <section class="section" id="projects">
      <div class="container">

        <div class="columns">
          <a href="/team-up" class="column is-5"><figure class="project-cover team-up"></figure></a>
          <a href="/sjk-photographical" class="column is-4"><figure class="project-cover sjk"></figure></a>
          <a href="/incase" class="column"><figure class="project-cover incase"></figure></a>
        </div>

        <div class="columns">
          <a href="/bungalows-and-bears" class="column"><figure class="project-cover bungalows"></figure></a>
          <a href="/reebok" class="column"><figure class="project-cover reebok"></figure></a>
          <a href="/human-appeal" class="column"><figure class="project-cover human-appeal"></figure></a>
        </div>

        <div class="columns">
          <a href="/little-lentil" class="column is-5"><figure class="project-cover little-lentil"></figure></a>
          <a href="/grade" class="column"><figure class="project-cover grade"></figure></a>
        </div>

      </div>
    </section>

    {% include quotes.html %}