CodePen Embed - Hexagons

<div class="overlay" id="overlay">
  <span class="dev">
    <h2>a developer</h2>
    <p>The first computer I ever saw was a 1997 Gateway 2000 G6-300. Sporting a 266MHz processor, 128MB SDRAM, and a whopping 6.4GB hard drive, it was the most beautiful piece of hardware I’d ever seen, and, being 5 years old at the time, I was fairly certain it ran on magic. It was nearly 20 years later that I began my pursuit of a master’s in software programming, but learning to program, finally learning what made these machines tick – it was like finally receiving my Hogwarts acceptance letter in the mail. Programming is what I live for: writing code, building apps, creating functionality that wasn’t there before? It’s what I live for. The <!--examples below and my -->repos on <a href="" target="_blank">GitHub</a> are just the tip of the iceberg. </p>
  </span>
  <span class="des">
    <h2>a designer</h2>
    <p>My relationship with development and design is kind of a like a love triangle you’d find in a really nerdy, really weird young adult novel. I adore development. Making cool apps that do cool things – there’s nothing like it. However, that doesn’t mean I don’t love design. Creating attractive, intuitive interfaces, implementing cool visual effects – these are things that never get old, and I don’t ever want to stop doing them. And, because it’s the kind of person I am, I’m not going to. I’m going to ride this train to the end and see where I end up. Who knows – this may turn out to be one of those new age novels where we three get to live happily ever after. That’s what I’m banking on, since we make such amazing things together. Check out <!--my portfolio here or -->my doodles on <a href="" target="_blank">Codepen</a> to see what I mean.</p>
  </span>
  <span class="dab">
    <h2>a dabbler</h2>
    <p> “Don't look down, don't turn back, and don't run away.” I’d like to say these words are nuggets of wisdom passed on to me by a brilliant mentor, but the truth is they were spoken by a talking lizard in a dream I had about a decade ago. Nevertheless, they have become something of a motto for me, encouraging me to always keep moving forward, to continually push my limits, and to never, ever stop going after what I want. Being a person of many interests, my wants are quite numerous which results in dabbling… A lot of dabbling.</p>
  </span>
  <span id="bio">
    <h2>me</h2>
    <p>Hello, there. My name is Parker, and I am a programmer. I like, among other things, code, kittens, and Panic! at the Disco, and <span>I'm pretty cool once you get to know me <i class="fa fa-arrow-circle-down"></i></span></p>
    <div id="sm_drawer">
      <p>
        <a href="" target="_blank"><i class="fa fa-file-text"></i></a>
        <a href="" target="_blank"><i class="fa fa-linkedin"></i></a>
        <a href="" target="_blank"><i class="fa fa-github-alt"></i></a>
        <a href="" target="_blank"><i class="fa fa-codepen"></i></a>
      </p>   
    </div>
  </span>
</div>
<div id="logo">
  <svg xmlns="http://www.w3.org/2000/svg" height="98" width="581" viewBox="0 0 360.4 44.7"><path d="M0.5,19.8c-0.5,0.2-0.6,0.5-0.3,0.9c0.2,0.3,0.7,0.5,1,0.3c0.7-0.4,1.4-0.8,2.2-1.1
  c0.8-0.4,1.7-0.7,2.6-1c0.9-0.3,1.8-0.6,2.7-1c-0.2,0.7-0.5,1.5-0.7,2.4c-0.2,0.8-0.3,1.6-0.3,2.4c0,0.6,0.1,1.3,0.5,1.8
  C8.5,25,9.2,25.2,9.8,25c1-0.2,1.9-0.5,2.8-0.9c0.9-0.4,1.8-0.9,2.7-1.3c0.2-0.1,0.5-0.2,1.1-0.5c0.6-0.2,1.1-0.5,1.7-0.7
  c0.5-0.2,0.9-0.5,1.3-0.9c0.3-0.2,0.4-0.6,0.3-0.9c-0.2-0.3-0.6-0.3-1-0.2c-0.6,0.2-1.2,0.4-1.7,0.7c-0.6,0.3-1.2,0.6-1.8,0.9
  c-0.4,0.2-0.7,0.4-1.1,0.6c-0.7,0.2-1.4,0.5-2.2,0.7c-0.7,0.2-1.5,0.3-2.2,0.2c-0.4-0.5-0.4-1.2-0.2-1.9c0.2-0.7,0.4-1.3,0.7-1.9
  c0.1-0.4,0.3-0.8,0.6-1.1c0.2-0.3,0.4-0.7,0.5-1.1c0.1-0.6,0-1-0.4-1.1c-0.5-0.1-1-0.1-1.4,0c-0.6,0.1-1.2,0.3-1.7,0.5
  c-0.6,0.2-1,0.4-1.1,0.5L0.5,19.8z M13.9,6c0.4,0.3,0.9,0.3,1.3,0c0.3-0.2,0.6-0.6,0.7-1c0.2-0.4,0.5-0.7,0.8-1
  c1-0.7,2.2-1.1,3.4-1.1c1.2-0.1,2.4,0,3.6,0.3c0.2,0,0.4,0,0.5-0.2c0.2-0.1,0.3-0.3,0.3-0.5c0.1-0.3-0.1-0.6-0.4-0.7c0,0,0,0,0,0
  c-0.3-0.1-0.5-0.1-0.8-0.1c-1.4-0.2-2.8-0.3-4.3-0.2c-0.5,0.1-1.1,0.2-1.7,0.3c-0.6,0.1-1.1,0.3-1.7,0.6c-0.5,0.2-1,0.6-1.4,0.9
  c-0.4,0.4-0.7,0.8-0.9,1.3C13.3,5.3,13.5,5.8,13.9,6z M18.2,20.4c0,0.2,0,0.4,0.1,0.5c0.1,0.2,0.2,0.3,0.4,0.3
  c0.2,0.1,0.4,0,0.6-0.1c0.5-0.3,1.1-0.7,1.7-0.9c0.6-0.3,1.1-0.5,1.7-0.8c0.8-0.3,1.5-0.7,2.4-1c0.8-0.3,1.7-0.6,2.6-0.8
  c-0.7,1.7-1.6,3.3-2.7,4.8l-0.5,0.5c-0.2,0.2-0.4,0.4-0.5,0.6c-0.1,0.2-0.2,0.4-0.1,0.7c0.1,0.3,0.3,0.5,0.6,0.6
  c0.3,0.2,0.6,0.2,0.8,0.1c0.3-0.1,0.5-0.3,0.7-0.5c0.8-0.6,1.5-1.2,2.2-1.8c0.7-0.6,1.5-1.2,2.2-1.7c0.7-0.5,1.5-1,2.3-1.5
  c0.8-0.5,1.7-0.8,2.6-1.1c-0.1,0.4-0.2,0.7-0.3,1.1c-0.1,0.4-0.3,0.6-0.3,0.8c-0.1,0.3-0.3,0.5-0.4,0.7c-0.2,0.3-0.4,0.6-0.6,0.9
  c-0.2,0.3-0.3,0.6-0.5,0.9C33,22.7,33,23,33.1,23.2c0.1,0.4,0.5,0.6,0.8,0.5c0,0,0,0,0,0c0.5-0.1,0.9-0.3,1.3-0.5
  c0.4-0.3,0.9-0.6,1.3-0.9c0.4-0.3,0.7-0.6,0.8-0.7c1-0.7,2.1-1.4,3.2-2.2c1.1-0.7,2.3-1.3,3.5-1.7c0.3-0.2,0.8-0.4,1.3-0.6
  c0.5-0.2,1-0.3,1.5-0.1c0.1,0.4,0,0.8-0.2,1.2c-0.2,0.4-0.4,0.8-0.7,1.1c-0.3,0.4-0.6,0.7-1,1c-0.3,0.3-0.6,0.6-0.9,0.9
  c-0.3,0.3-0.5,0.6-0.7,0.9c-0.2,0.3-0.3,0.7-0.4,1c-0.1,0.3,0,0.7,0.1,1c0.2,0.4,0.5,0.6,0.8,0.8c0.8,0.4,1.8,0.4,2.6,0
  c0.9-0.4,1.8-0.7,2.5-1l1.7-0.7c0.6-0.2,1.1-0.5,1.7-0.8c0.2-0.1,0.5-0.2,0.9-0.4c0.5-0.2,0.9-0.4,1.3-0.7c0.4-0.2,0.7-0.5,0.9-0.8
  c0.2-0.3,0.1-0.5-0.3-0.7c-0.2-0.1-0.4-0.1-0.7,0c-0.3,0.1-0.5,0.2-0.8,0.3c-0.2,0.1-0.5,0.3-0.7,0.5c-0.2,0.1-0.4,0.3-0.6,0.4
  c-0.5,0.2-1,0.5-1.5,0.7c-0.5,0.2-1,0.4-1.6,0.6c-0.7,0.3-1.4,0.6-2.1,0.8c-0.7,0.3-1.5,0.3-2.2,0.2c0.4-0.8,0.9-1.6,1.4-2.3
  c0.5-0.7,1-1.5,1.6-2.4c0.2-0.4,0.4-0.8,0.5-1.3c0.1-0.4,0.1-0.9-0.1-1.3c-0.1-0.4-0.4-0.7-0.7-0.9c-0.4-0.2-1-0.3-1.4-0.2
  c-0.9,0.1-1.9,0.5-2.7,1c-0.9,0.5-1.7,1-2.4,1.5c-0.9,0.6-1.8,1.1-2.7,1.7c-0.9,0.5-1.8,1.1-2.6,1.6c0.3-0.5,0.5-1,0.7-1.5
  c0.2-0.5,0.3-1,0.4-1.6c0.2-0.6,0-1.3-0.6-1.5c-0.6-0.2-1.2-0.2-1.7,0c-0.5,0.2-1,0.4-1.5,0.7c-0.5,0.3-1.1,0.7-1.6,1
  c-0.6,0.4-1.2,0.9-1.9,1.4s-1.5,1.2-2.4,1.9c0.2-0.4,0.4-0.7,0.6-1.1s0.4-0.7,0.6-1c0.2-0.3,0.4-0.5,0.6-0.8c0.3-0.3,0.5-0.7,0.8-1
  c0.2-0.3,0.3-0.7,0.4-1c0-0.4-0.2-0.7-0.5-0.8c-0.4-0.2-0.8-0.2-1.3-0.1c-0.6,0.1-1.1,0.3-1.6,0.5c-0.6,0.2-1.1,0.5-1.6,0.8
  c-0.5,0.3-0.9,0.4-1.2,0.6l-2.8,1.3c-0.9,0.4-1.8,0.9-2.8,1.4C18.4,20,18.2,20.1,18.2,20.4z M54,20.3c0,0.2,0,0.3,0.1,0.5
  c0.1,0.1,0.3,0.3,0.4,0.3c0.2,0.1,0.4,0,0.6-0.1c0.7-0.4,1.5-0.8,2.4-1.2s1.7-0.8,2.5-1.2s1.5-0.7,2.1-1c0.4-0.2,0.9-0.4,1.3-0.5
  c-0.6,0.3-1.2,0.8-1.7,1.3c-0.6,0.6-1.2,1.2-1.7,1.8c-0.5,0.6-0.9,1.2-1.2,1.9c-0.3,0.5-0.4,1-0.5,1.5c0,0.7,0.3,1.3,0.9,1.7
  c0.6,0.4,1.2,0.5,1.9,0.5c0.8-0.1,1.6-0.3,2.3-0.8c0.7-0.4,1.4-0.8,2.1-1.2l1.6-1c-0.2,0.5-0.2,1.1-0.1,1.6c0.2,0.6,0.6,1,1.2,1.2
  c0.5,0.2,1.1,0.3,1.7,0.2c0.6-0.1,1.2-0.2,1.8-0.4c0.6-0.2,1.2-0.4,1.7-0.7c0.6-0.3,1.1-0.5,1.6-0.7c0.7-0.3,1.4-0.6,2.1-0.9
  c0.7-0.3,1.4-0.6,2-0.9c0.2-0.1,0.4-0.2,0.7-0.3s0.6-0.2,1-0.4c0.3-0.1,0.5-0.3,0.8-0.5c0.2-0.2,0.2-0.5,0-0.7
  c-0.1-0.2-0.3-0.4-0.6-0.4c-0.3,0-0.6,0.1-0.9,0.2c-0.3,0.1-0.6,0.3-0.9,0.5c-0.2,0.1-0.4,0.3-0.7,0.3c-0.6,0.3-1.4,0.7-2.3,1
  c-0.9,0.4-1.8,0.7-2.7,1c-0.9,0.3-1.7,0.5-2.6,0.7c-0.7,0.2-1.4,0.2-2.1,0.1c-0.2,0-0.3-0.1-0.4-0.3c-0.1-0.2,0-0.5,0.1-0.6
  c0.1-0.3,0.2-0.5,0.4-0.8l0.6-0.6c0.2-0.2,0.3-0.4,0.4-0.7c0.2-0.5,0-1-0.4-1.2c-0.3-0.3-0.8-0.2-1.1,0.1c0,0,0,0-0.1,0.1
  C68,20.5,67,21.2,66,21.9c-0.3,0.2-0.6,0.4-1,0.6c-0.5,0.3-1,0.5-1.6,0.8c-0.5,0.2-1.1,0.4-1.7,0.5c-0.4,0.1-0.8,0.1-1.2-0.1
  c-0.3-0.3-0.3-0.8,0-1.2c0.3-0.6,0.7-1.2,1.1-1.7c0.5-0.6,1-1.1,1.5-1.6c0.5-0.5,0.9-0.8,1.1-1c0.5-0.3,0.9-0.6,1.3-0.8
  c0.4-0.2,0.9-0.4,1.4-0.6l2.7-0.3c0.4-0.1,0.8-0.3,1.1-0.7c0.3-0.4,0.2-0.8-0.3-1.2c-0.5-0.2-1-0.3-1.5-0.2
  c-0.8,0.1-1.5,0.2-2.2,0.4c-0.8,0.2-1.6,0.4-2.3,0.7c-0.7,0.2-1.2,0.4-1.5,0.5c-0.5,0.2-1.2,0.5-1.9,0.8c-0.8,0.3-1.6,0.7-2.4,1
  c-0.8,0.4-1.6,0.7-2.4,1.1c-0.7,0.4-1.4,0.7-1.8,0.9C54.2,19.9,54.1,20.1,54,20.3L54,20.3z M80.5,20.6c0.1,0.3,0.4,0.6,0.7,0.5
  c0.3,0.1,0.6,0,0.9-0.2c0.3-0.2,0.7-0.4,1-0.6c-0.7,1.5-0.1,3.2,1.2,4.1c0.6,0.3,1.3,0.5,1.9,0.6c0.8,0.1,1.5,0.1,2.3,0
  c0.8-0.1,1.6-0.2,2.3-0.5l-2,5.8c-1.3,1.5-2.5,3.2-3.6,4.8c-1.1,1.7-2.1,3.4-2.8,5.2c-0.1,0.3-0.3,0.6-0.4,1.1
  c-0.1,0.4-0.2,0.9-0.3,1.3c-0.1,0.4,0,0.8,0.1,1.2c0.2,0.4,0.5,0.6,0.9,0.7c0.3,0,0.7,0,1-0.2c0.3-0.2,0.6-0.4,0.8-0.7
  c0.2-0.3,0.4-0.6,0.6-1c0.2-0.3,0.3-0.6,0.4-0.9c0.6-1.2,1.1-2.4,1.6-3.7s1-2.5,1.4-3.7l1.6-3.6c0.8-1.1,1.7-2.1,2.6-3.1
  c0.9-1,1.9-1.9,3-2.8c0.9-0.8,1.8-1.5,2.8-2.2c1-0.6,2-1.2,3-1.8c0.2-0.2,0.3-0.4,0.4-0.6c0.1-0.2-0.1-0.5-0.3-0.6
  c-0.2-0.1-0.4-0.2-0.6-0.1c-0.3,0.1-0.5,0.2-0.7,0.3c-0.2,0.1-0.5,0.3-0.7,0.5c-0.2,0.2-0.4,0.3-0.5,0.4c-1.4,0.8-2.6,1.7-3.8,2.7
  c-1.2,1-2.3,2.1-3.4,3.2l0.8-2c0.2-0.4,0.4-0.8,0.6-1.3c0.3-0.4,0.3-1,0-1.4c-0.2-0.2-0.5-0.3-0.8-0.3c-0.3,0.1-0.6,0.2-0.9,0.3
  l-1.1,0.5c-1.1,0.6-2.4,0.7-3.7,0.5c-0.8,0-1.5-0.5-1.8-1.2c-0.2-0.3-0.2-0.8-0.1-1.1c0.1-0.4,0.3-0.7,0.6-1c0.3-0.3,0.6-0.6,1-0.8
  c0.3-0.2,0.7-0.4,1-0.5c1-0.4,2-0.6,3-0.7c1-0.1,2.1-0.1,3.1,0c0.4,0,0.9-0.2,1.1-0.6c0.2-0.3,0.2-0.8-0.1-1.1
  c-0.3-0.2-0.7-0.4-1-0.3c-1.2,0-2.3,0.1-3.4,0.3c-1.1,0.2-2.2,0.5-3.3,0.9c-1,0.4-2.1,0.8-3.1,1.3c-1,0.5-2,1-3.1,1.5
  C80.6,20,80.4,20.3,80.5,20.6L80.5,20.6z M100.7,19.8c-0.5,0.2-0.6,0.5-0.3,0.9c0.2,0.3,0.7,0.5,1.1,0.3c0.7-0.4,1.4-0.8,2.2-1.1
  c0.8-0.4,1.7-0.7,2.6-1c0.9-0.3,1.8-0.6,2.7-1c-0.2,0.7-0.5,1.5-0.7,2.4c-0.2,0.8-0.3,1.6-0.3,2.4c0,0.6,0.1,1.3,0.5,1.8
  c0.4,0.5,1.1,0.7,1.7,0.5c1-0.2,1.9-0.5,2.8-0.9c0.9-0.4,1.8-0.9,2.7-1.3c0.2-0.1,0.5-0.2,1.1-0.5s1.1-0.5,1.6-0.7
  c0.5-0.2,0.9-0.5,1.4-0.9c0.3-0.2,0.4-0.6,0.3-0.9c-0.1-0.2-0.4-0.3-1-0.2c-0.6,0.2-1.2,0.4-1.7,0.7c-0.6,0.3-1.2,0.6-1.8,0.9
  c-0.4,0.2-0.7,0.4-1.1,0.6c-0.7,0.2-1.4,0.5-2.2,0.7c-0.7,0.2-1.5,0.3-2.2,0.2c-0.4-0.5-0.4-1.2-0.2-1.9c0.2-0.7,0.4-1.3,0.7-1.9
  c0.1-0.4,0.3-0.8,0.6-1.1c0.2-0.3,0.4-0.7,0.5-1.1c0.1-0.6,0-1-0.4-1.1c-0.5-0.1-1-0.1-1.4,0c-0.6,0.1-1.2,0.3-1.7,0.5
  c-0.6,0.2-0.9,0.4-1.1,0.5L100.7,19.8z M114.2,6c0.4,0.3,0.9,0.3,1.3,0c0.3-0.2,0.6-0.6,0.7-1c0.2-0.4,0.5-0.7,0.8-1
  c1-0.7,2.2-1.1,3.4-1.1c1.2-0.1,2.4,0,3.6,0.3c0.2,0,0.4,0,0.5-0.2c0.2-0.1,0.3-0.3,0.3-0.5c0.1-0.3-0.1-0.6-0.4-0.7c0,0,0,0,0,0
  c-0.3-0.1-0.5-0.1-0.8-0.1c-1.4-0.2-2.8-0.3-4.3-0.2c-0.5,0.1-1.1,0.2-1.6,0.3c-0.6,0.1-1.1,0.3-1.6,0.6c-0.5,0.2-1,0.6-1.4,0.9
  c-0.4,0.4-0.7,0.8-0.9,1.3C113.6,5.3,113.8,5.8,114.2,6L114.2,6z M118.4,20.3c0,0.2,0,0.3,0.1,0.5c0.1,0.1,0.3,0.2,0.5,0.3
  c0.2,0.1,0.5,0,0.7-0.1c0.3-0.1,0.6-0.3,0.9-0.4c0.3-0.2,0.6-0.3,0.9-0.5c0.6-0.3,1.1-0.5,1.7-0.8s1.1-0.5,1.7-0.7
  c0.2-0.1,0.6-0.2,1-0.4c0.4-0.2,0.9-0.3,1.3-0.4c0,0.3-0.1,0.6-0.2,0.9c-0.1,0.3-0.2,0.6-0.2,0.9c-0.2,0.2-0.3,0.5-0.4,0.8
  c-0.2,0.4-0.4,0.8-0.6,1.1c-0.4,0.2-0.7,0.5-0.9,1c-0.1,0.3-0.1,0.5,0,0.8c0.1,0.2,0.3,0.4,0.4,0.5c0.2,0.1,0.4,0.1,0.6,0.1
  c0.2,0,0.5-0.1,0.6-0.3c1-1,2-1.8,3.2-2.5c1.2-0.7,2.4-1.3,3.6-1.9c0.9-0.5,1.9-0.9,3-1.4c1-0.4,2.1-0.7,3.3-0.8
  c-0.2,0.7-0.6,1.3-1.1,1.8c-0.4,0.4-0.8,0.9-1.2,1.3c-0.2,0.2-0.5,0.5-0.8,0.8c-0.3,0.3-0.6,0.6-0.8,0.9c-0.3,0.3-0.5,0.6-0.7,0.9
  c-0.2,0.3-0.3,0.7-0.3,1.1c-0.1,0.6,0.2,1.2,0.8,1.5c0.6,0.2,1.2,0.2,1.8,0.1c0.7-0.1,1.4-0.4,2.1-0.7c0.7-0.3,1.2-0.5,1.5-0.7
  c0.6-0.3,1.1-0.5,1.6-0.8s1.1-0.5,1.6-0.8l1.3-0.6c0.4-0.2,0.8-0.4,1.1-0.6c0.3-0.2,0.5-0.5,0.5-0.8c0-0.3-0.1-0.5-0.4-0.5
  c0,0-0.1,0-0.1,0c-0.2,0-0.4,0.1-0.6,0.2c-0.3,0.1-0.5,0.3-0.8,0.4c-0.3,0.1-0.5,0.3-0.8,0.5c-0.3,0.2-0.5,0.3-0.6,0.4l-2.5,1.1
  c-0.2,0.1-0.5,0.2-0.9,0.4c-0.4,0.2-0.8,0.3-1.2,0.5c-0.4,0.1-0.8,0.2-1.3,0.3c-0.3,0.1-0.7,0.1-1,0c0.1-0.2,0.2-0.5,0.3-0.7
  c0.2-0.3,0.4-0.5,0.6-0.8c0.2-0.3,0.4-0.5,0.6-0.7c0.2-0.1,0.3-0.3,0.4-0.5c0.4-0.5,0.9-1,1.3-1.4c0.4-0.5,0.8-1,1.2-1.5
  c0.3-0.4,0.5-0.9,0.5-1.3c0-0.4-0.1-0.7-0.3-1c-0.2-0.3-0.6-0.5-0.9-0.5c-0.5-0.1-0.9-0.1-1.4,0c-1.4,0.4-2.8,1-4.1,1.7
  c-1.4,0.8-2.7,1.5-4,2.2l-1.6,0.7c-0.5,0.2-1.1,0.5-1.6,0.8l0.7-1.7c0.1-0.4,0.3-0.7,0.6-1c0.3-0.3,0.3-0.8,0.1-1.2
  c-0.2-0.5-0.8-0.7-1.8-0.5c-1.1,0.2-2.1,0.6-3.1,1.1c-1.1,0.5-2.3,1.1-3.3,1.7c-1.1,0.6-1.8,1-2.3,1.2
  C118.6,19.9,118.5,20.1,118.4,20.3L118.4,20.3z M145.9,20.4c0,0.3,0.1,0.5,0.3,0.7c0.3,0.2,0.7,0.2,1,0c0.2-0.2,0.5-0.3,0.8-0.5
  l1.1-0.7c0.4-0.3,0.8-0.5,1.3-0.7c-0.1,0.3-0.1,0.6,0,0.9c0.1,0.3,0.1,0.6,0.2,1c0.2,0.8,0.6,1.6,1.2,2.2c0.5,0.5,1.2,1,1.9,1.3
  c0.7,0.3,1.5,0.5,2.3,0.5c0.8,0.1,1.6,0,2.4-0.2c1.9-0.5,3.7-1.1,5.5-1.8l3-1.3c0.3-0.1,0.6-0.2,1-0.4c0.4-0.1,0.6-0.3,0.8-0.7
  c0.2-0.4,0.2-0.6-0.1-0.8c-0.3-0.2-0.6-0.2-0.9-0.1c-0.4,0.2-0.8,0.4-1.2,0.6c-0.4,0.2-0.8,0.4-1.2,0.6c-0.9,0.4-1.8,0.8-2.7,1
  c-0.9,0.3-1.9,0.6-2.8,0.8c-0.7,0.1-1.5,0.2-2.2,0.2c-0.8,0-1.6,0-2.4-0.3c-0.7-0.2-1.4-0.6-2-1c-0.6-0.5-1-1.3-1.1-2h0.2
  c0.9,0.1,1.8,0,2.6-0.2c0.8-0.2,1.6-0.5,2.4-1c0.2-0.1,0.5-0.3,0.9-0.6c0.4-0.3,0.8-0.5,1.1-0.9c0.3-0.3,0.6-0.6,0.7-1
  c0.1-0.4,0.1-0.8-0.2-1c-0.4-0.5-1-0.9-1.7-0.9c-0.6-0.1-1.3-0.1-2,0c-1.1,0.2-2.1,0.6-3.1,1.2c-0.9,0.5-1.7,1.3-2.2,2.2
  c-0.8,0.3-1.6,0.7-2.4,1.1c-0.8,0.4-1.5,0.8-2.2,1.2C146.1,19.9,145.9,20.1,145.9,20.4L145.9,20.4z M153.2,17
  c0.4-0.4,0.8-0.7,1.2-0.9c0.5-0.2,1-0.4,1.5-0.5c0.6-0.1,1.1,0,1.6,0.2c-0.7,0.7-1.5,1.3-2.4,1.7c-0.9,0.4-1.8,0.7-2.8,0.7
  C152.6,17.7,152.9,17.3,153.2,17L153.2,17z M184.6,20.6c0.1,0.3,0.3,0.5,0.7,0.5c0.3,0.1,0.7,0,1-0.2c0.3-0.2,0.6-0.4,0.8-0.6
  c1-0.6,1.9-1.1,2.7-1.7s1.7-1.1,2.6-1.7c0.8-0.6,1.5-1.1,2.3-1.7c0.8-0.5,1.5-1.1,2.3-1.7l-0.6,1c-0.5,0.9-1,1.8-1.5,2.6
  s-1,1.8-1.6,2.6l-1.9,2.7c-0.2,0.2-0.3,0.5-0.4,0.7c-0.1,0.2-0.1,0.5,0,0.7c0.2,0.7,0.5,1,0.8,0.9c0.4-0.1,0.7-0.3,1-0.6
  c0.2-0.2,0.4-0.4,0.5-0.5c0.1-0.2,0.3-0.3,0.4-0.5c0.3-0.4,0.7-0.8,1-1.2c0.4-0.4,0.7-0.8,1.1-1.1c0.3,0.5,0.7,1,1,1.4
  c0.4,0.5,0.8,0.9,1.2,1.3c0.7,0.7,1.6,1.3,2.6,1.5c0.9,0.2,1.8,0.3,2.6,0.2c0.9-0.1,1.8-0.4,2.6-0.8c0.9-0.4,1.8-0.8,2.6-1.3
  c0.6-0.2,1.1-0.5,1.7-0.8s1.1-0.6,1.7-0.9c0.2-0.1,0.3-0.1,0.4-0.2c0.2-0.1,0.3-0.2,0.5-0.3c0.2-0.1,0.4-0.4,0.3-0.6
  c0-0.2-0.1-0.4-0.3-0.6c-0.3-0.2-0.7-0.1-1,0.1c-0.3,0.2-0.6,0.4-0.8,0.5c-1.2,0.7-2.5,1.3-3.8,1.8c-1.3,0.5-2.7,0.9-4.1,1
  c-1,0.2-2.1,0-3-0.5c-0.9-0.5-1.7-1.2-2.4-2c1.5,0,3-0.2,4.4-0.7c1.4-0.4,2.7-1.1,3.9-2.1c0.2-0.2,0.5-0.5,0.7-0.8
  c0.2-0.3,0.3-0.6,0.4-0.9c0.1-0.3,0.1-0.6,0-0.9c-0.1-0.3-0.4-0.6-0.7-0.7c-0.6-0.4-1.3-0.5-2-0.5c-0.8,0.1-1.5,0.2-2.2,0.5
  c-0.7,0.3-1.4,0.6-2.1,1c-0.7,0.4-1.2,0.8-1.8,1.1c-0.4,0.2-0.9,0.5-1.3,0.8l-1.2,0.8l3.6-7.1c0.4-0.4,0.9-0.8,1.3-1.2
  s0.9-0.8,1.3-1.2c0.7-0.7,1.4-1.4,2.1-2c0.7-0.7,1.4-1.4,2.1-2c0.2-0.2,0.5-0.5,0.8-0.8c0.3-0.3,0.6-0.6,0.8-0.9
  c0.3-0.3,0.5-0.6,0.7-1c0.2-0.3,0.3-0.7,0.3-1c0.1-0.3,0-0.7-0.2-0.9c-0.2-0.2-0.4-0.3-0.7-0.4C207.6,0,207.3,0,207,0
  c-0.3,0-0.6,0.1-0.9,0.2c-0.8,0.4-1.5,0.9-2.1,1.5c-0.6,0.6-1.1,1.3-1.6,2c-0.8,1.1-1.5,2.2-2.1,3.4c-0.7,1.2-1.3,2.3-1.9,3.5
  l-1,0.9c-1.9,1.6-3.9,3.1-6,4.5c-2.1,1.4-4.2,2.7-6.4,3.8C184.7,20,184.5,20.3,184.6,20.6L184.6,20.6z M197.3,19.3
  c0.1,0,0.3-0.2,0.7-0.4s0.8-0.5,1.3-0.8s1-0.5,1.5-0.8c0.4-0.2,0.9-0.4,1.3-0.5c0.3-0.1,0.7-0.2,1-0.3c0.4-0.1,0.7-0.1,1.1-0.2
  c-0.8,0.9-1.8,1.6-2.9,2.1c-1.1,0.5-2.3,0.8-3.6,0.8L197.3,19.3L197.3,19.3z M201.3,8.1c0.6-1.1,1.3-2.2,2.1-3.2
  c0.7-0.9,1.7-1.7,2.7-2.3c-0.4,0.7-0.9,1.4-1.4,2c-0.6,0.6-1.1,1.2-1.6,1.7L201.3,8.1z M211.5,20.3c0,0.2,0,0.3,0.1,0.5
  c0.1,0.1,0.3,0.2,0.5,0.3c0.2,0.1,0.5,0,0.7-0.1c0.3-0.1,0.6-0.3,0.9-0.4c0.3-0.2,0.5-0.3,0.9-0.5c0.6-0.3,1.1-0.5,1.7-0.8
  c0.6-0.2,1.1-0.5,1.7-0.7c0.2-0.1,0.6-0.2,1-0.4s0.9-0.3,1.3-0.4c0,0.3-0.1,0.6-0.2,0.9c-0.1,0.3-0.2,0.6-0.2,0.9
  c-0.2,0.2-0.3,0.5-0.4,0.8c-0.2,0.4-0.4,0.8-0.6,1.1c-0.4,0.2-0.7,0.5-0.9,1c-0.1,0.3-0.1,0.5,0,0.8c0.1,0.2,0.3,0.4,0.5,0.5
  c0.2,0.1,0.4,0.1,0.6,0.1c0.2,0,0.5-0.1,0.6-0.3c1-1,2-1.8,3.2-2.5c1.2-0.7,2.4-1.3,3.6-1.9c1-0.5,2-1,3-1.4c1-0.4,2.1-0.7,3.3-0.8
  c-0.2,0.7-0.6,1.3-1.1,1.8c-0.4,0.4-0.8,0.9-1.2,1.3c-0.2,0.2-0.5,0.5-0.8,0.8c-0.3,0.3-0.6,0.6-0.8,0.9c-0.3,0.3-0.5,0.6-0.7,0.9
  c-0.2,0.3-0.3,0.7-0.3,1.1c-0.1,0.6,0.2,1.2,0.8,1.5c0.6,0.2,1.2,0.2,1.8,0.1c0.7-0.1,1.4-0.4,2.1-0.7c0.7-0.3,1.2-0.5,1.5-0.7
  c0.6-0.3,1.1-0.5,1.6-0.8c0.5-0.2,1.1-0.5,1.6-0.8c0.4-0.2,0.9-0.4,1.3-0.6c0.4-0.2,0.8-0.4,1.1-0.6c0.3-0.2,0.5-0.5,0.5-0.8
  c0-0.3-0.1-0.5-0.4-0.5c0,0-0.1,0-0.1,0c-0.2,0-0.4,0.1-0.6,0.2c-0.3,0.1-0.5,0.2-0.8,0.4c-0.3,0.1-0.5,0.3-0.8,0.5
  c-0.3,0.2-0.5,0.3-0.6,0.4l-2.5,1.1c-0.2,0.1-0.5,0.2-0.9,0.4c-0.4,0.2-0.8,0.3-1.2,0.5c-0.4,0.1-0.8,0.2-1.3,0.3
  c-0.3,0.1-0.7,0.1-1,0c0.1-0.2,0.2-0.5,0.3-0.7c0.2-0.3,0.4-0.5,0.6-0.8s0.4-0.5,0.6-0.7c0.2-0.1,0.3-0.3,0.4-0.5
  c0.4-0.5,0.9-1,1.3-1.4c0.4-0.5,0.8-1,1.2-1.5c0.3-0.4,0.5-0.9,0.5-1.3c0-0.4-0.1-0.7-0.3-1c-0.2-0.3-0.6-0.5-0.9-0.5
  c-0.5-0.1-0.9-0.1-1.4,0c-1.4,0.4-2.8,1-4.1,1.7c-1.4,0.8-2.7,1.5-4,2.2l-1.6,0.7c-0.5,0.2-1.1,0.5-1.6,0.8l0.7-1.7
  c0.1-0.4,0.3-0.7,0.6-1c0.3-0.3,0.3-0.8,0.1-1.2c-0.2-0.5-0.8-0.7-1.8-0.5c-1.1,0.2-2.1,0.6-3.1,1.1c-1.1,0.5-2.2,1.1-3.3,1.7
  c-1.1,0.6-1.8,1-2.3,1.2C211.7,19.9,211.6,20.1,211.5,20.3z M239.3,19.8c-0.2,0.1-0.4,0.3-0.4,0.6c0,0.4,0.3,0.8,0.7,0.8
  c0.1,0,0.1,0,0.2,0c0.2-0.1,0.5-0.2,0.7-0.3c0.2-0.1,0.5-0.2,0.7-0.4s0.4-0.2,0.6-0.3c0.9-0.4,1.8-0.9,2.6-1.3
  c0.9-0.4,1.8-0.8,2.7-1.1L246,19c-0.5,0.5-0.9,1-1.3,1.5c-0.4,0.6-0.8,1.2-1,1.9c-0.2,0.6-0.3,1.2-0.1,1.8c0.2,0.7,0.7,1.2,1.4,1.4
  c0.6,0.3,1.3,0.4,2,0.3c0.7-0.1,1.4-0.3,2.1-0.6c0.7-0.3,1.3-0.7,1.9-1.1c0.6-0.4,1.1-0.9,1.6-1.3l1.3-1.4c0.4,0.4,1,0.8,1.6,0.9
  c0.6,0.2,1.2,0.3,1.9,0.3c0.7,0,1.3-0.1,2-0.2c0.6-0.1,1.3-0.3,1.9-0.5l0.7-0.2c0.4-0.1,0.7-0.2,1-0.4c0.3-0.1,0.6-0.3,0.8-0.5
  c0.2-0.2,0.2-0.6,0.1-0.8c-0.1-0.3-0.4-0.4-0.7-0.3c-0.4,0.1-0.8,0.2-1.2,0.4c-0.4,0.2-0.8,0.4-1.2,0.6c-0.3,0.2-0.6,0.3-0.9,0.4
  c-0.7,0.2-1.4,0.3-2.2,0.4c-0.7,0-1.5-0.1-2.1-0.5c-0.3-0.2-0.5-0.4-0.7-0.6c0.4-0.6,0.7-1.4,0.9-2.1c0.2-0.7,0-1.4-0.5-1.9
  c-0.2-0.2-0.5-0.3-0.8-0.2c0.1-0.4-0.1-0.7-0.4-1c-0.5-0.3-1.2-0.4-1.7-0.2c-0.6,0.1-1.2,0.4-1.7,0.7c-0.8,0.2-1.6,0.5-2.5,0.7
  c-0.8,0.2-1.7,0.5-2.5,0.8L239.3,19.8z M250,17.7c1-0.4,2-0.7,3-0.7c-0.3,0.5-0.5,1-0.5,1.6c0,0.6,0.1,1.1,0.3,1.7
  c-0.2,0.4-0.4,0.7-0.7,1l-0.9,0.9c-0.7,0.7-1.6,1.1-2.5,1.4c-1,0.2-2,0.3-3,0.1c-0.6-0.1-0.8-0.3-0.8-0.8c0.1-0.5,0.3-0.9,0.6-1.3
  c0.3-0.5,0.7-1,1.1-1.4c0.4-0.4,0.7-0.7,0.9-0.9C248.3,18.6,249.2,18.1,250,17.7L250,17.7z M262.5,20.8c0.1,0.3,0.4,0.4,0.7,0.4
  c0.3-0.1,0.5-0.2,0.8-0.2c0.6-0.4,1.3-0.7,1.9-1c0.6-0.3,1.3-0.6,2-0.9c0.4-0.2,0.9-0.4,1.4-0.6c0.5-0.2,1-0.3,1.5-0.5
  c-0.3,0.4-0.7,0.9-1.1,1.4c-0.4,0.5-0.8,0.9-1.1,1.3c-0.4,0.5-0.9,1-1.3,1.6c-0.4,0.5-0.7,1.1-0.9,1.8c-0.1,0.4-0.1,0.9,0.1,1.3
  c0.2,0.3,0.4,0.5,0.8,0.7c0.3,0.1,0.7,0.2,1.1,0.2c0.4,0,0.8-0.1,1.1-0.2c1.1-0.3,2.1-0.8,3-1.4c0.9-0.6,1.8-1.2,2.7-1.8l1.3-1
  c0,0.8,0.1,1.5,0.4,2.2c0.3,0.7,1,1.1,1.7,1.1c1,0.1,2-0.2,2.8-0.8c0.9-0.6,1.8-1.3,2.6-2.1c0.3,0.3,0.8,0.5,1.3,0.6
  c1,0.2,2.1,0.2,3.1,0.1c1-0.2,2-0.4,3-0.7c0.5-0.2,1.1-0.3,1.6-0.5c0.5-0.1,1.1-0.4,1.5-0.6c0.2-0.1,0.3-0.3,0.3-0.5
  c0-0.2,0-0.4-0.1-0.5c-0.1-0.2-0.2-0.3-0.4-0.4c-0.2-0.1-0.4-0.1-0.5,0.1c-0.9,0.5-1.9,0.8-2.9,1.1c-1,0.3-2.1,0.5-3.1,0.6
  c-0.5,0.1-1,0.1-1.5,0.1c-0.5,0-1-0.1-1.4-0.5c0.3-0.2,0.6-0.5,0.8-0.8c0.4-0.4,0.8-0.8,1.2-1.3s0.8-0.9,1-1.3
  c0.2-0.3,0.4-0.6,0.4-1c-0.1-0.2-0.3-0.4-0.5-0.6c-0.2-0.2-0.5-0.3-0.8-0.3c-0.8,0-1.6,0.3-2.2,0.9c-0.6,0.5-1.1,1.2-1.5,1.9
  c-0.4,0.7-0.4,1.6-0.2,2.3c-0.8,0.5-1.6,1-2.4,1.5c-0.6,0.4-1.4,0.5-2.1,0.4c-0.4,0-0.8-0.3-0.8-0.8c0,0,0,0,0,0
  c0-0.5,0-0.9,0.1-1.4c0.4-0.4,0.9-0.7,1.3-1.1c0.4-0.3,0.8-0.8,1-1.2c0.3-0.3,0.4-0.8,0.2-1.1c-0.1-0.4-0.5-0.7-1-0.7
  c-0.3,0-0.6,0.1-0.9,0.3c-0.3,0.2-0.6,0.5-0.8,0.8c-0.2,0.3-0.4,0.6-0.6,0.9c-0.2,0.3-0.3,0.6-0.5,0.9c-1.1,1.2-2.4,2.2-3.8,3.1
  c-1.4,0.8-2.9,1.3-4.5,1.4c0.1-0.5,0.3-1,0.6-1.4c0.3-0.5,0.6-0.9,0.8-1.2c0.4-0.6,0.8-1.1,1.3-1.6c0.5-0.5,1-1,1.4-1.4
  c0.3-0.3,0.7-0.6,1.2-1c0.5-0.3,0.7-0.8,0.6-1.3c-0.1-0.5-0.5-0.8-1-0.8c-0.5,0-0.9,0.2-1.3,0.4c-0.7,0.5-1.5,0.9-2.3,1.2
  c-0.8,0.3-1.6,0.6-2.4,0.9c-0.8,0.3-1.6,0.7-2.3,1c-0.7,0.3-1.5,0.7-2.2,1C262.5,20,262.3,20.4,262.5,20.8
  C262.5,20.7,262.5,20.8,262.5,20.8L262.5,20.8L262.5,20.8z M293.9,19.8c-0.5,0.2-0.6,0.5-0.3,0.9c0.2,0.3,0.7,0.5,1,0.3
  c0.7-0.4,1.4-0.8,2.2-1.1c0.8-0.4,1.7-0.7,2.6-1c0.9-0.3,1.8-0.6,2.7-1c-0.2,0.7-0.5,1.5-0.7,2.4c-0.2,0.8-0.3,1.6-0.3,2.4
  c0,0.6,0.1,1.3,0.5,1.8c0.4,0.5,1.1,0.7,1.7,0.5c1-0.2,1.9-0.5,2.8-0.9c0.9-0.4,1.8-0.9,2.7-1.3c0.2-0.1,0.5-0.2,1.1-0.5
  s1.1-0.5,1.6-0.7c0.5-0.2,0.9-0.5,1.4-0.9c0.3-0.2,0.4-0.6,0.3-0.9c-0.1-0.2-0.4-0.3-1-0.2c-0.6,0.2-1.2,0.4-1.7,0.7
  c-0.6,0.3-1.2,0.6-1.8,0.9c-0.4,0.2-0.7,0.4-1.1,0.6c-0.7,0.2-1.4,0.5-2.2,0.7c-0.7,0.2-1.5,0.3-2.2,0.2c-0.4-0.5-0.4-1.2-0.2-1.9
  c0.2-0.7,0.4-1.3,0.7-1.9c0.1-0.4,0.3-0.8,0.6-1.1c0.2-0.3,0.4-0.7,0.5-1.1c0.1-0.6,0-1-0.4-1.1c-0.5-0.1-1-0.1-1.4,0
  c-0.6,0.1-1.2,0.3-1.7,0.5c-0.6,0.2-1,0.4-1.1,0.5L293.9,19.8z M307.3,6c0.4,0.3,0.9,0.3,1.3,0c0.3-0.2,0.6-0.6,0.7-1
  c0.2-0.4,0.5-0.7,0.8-1c1-0.7,2.2-1.1,3.4-1.1c1.2-0.1,2.4,0,3.6,0.3c0.2,0,0.4,0,0.5-0.2c0.2-0.1,0.3-0.3,0.3-0.5
  c0.1-0.3-0.1-0.6-0.4-0.7c0,0,0,0,0,0c-0.3-0.1-0.5-0.1-0.8-0.1c-1.4-0.2-2.8-0.3-4.3-0.2c-0.5,0.1-1.1,0.2-1.6,0.3
  c-0.6,0.1-1.1,0.3-1.6,0.6c-0.5,0.2-1,0.6-1.4,0.9c-0.4,0.4-0.7,0.8-0.9,1.3C306.7,5.3,306.9,5.8,307.3,6L307.3,6z M311.5,20.3
  c0,0.2,0,0.3,0.1,0.5c0.1,0.1,0.3,0.2,0.5,0.3c0.2,0.1,0.5,0,0.7-0.1c0.3-0.1,0.6-0.3,0.9-0.4c0.3-0.2,0.6-0.3,0.9-0.5
  c0.6-0.3,1.1-0.5,1.7-0.8c0.6-0.2,1.1-0.5,1.7-0.7c0.2-0.1,0.6-0.2,1-0.4s0.9-0.3,1.3-0.4c0,0.3-0.1,0.6-0.2,0.9
  c-0.1,0.3-0.2,0.6-0.2,0.9c-0.2,0.2-0.3,0.5-0.4,0.8c-0.2,0.4-0.4,0.8-0.6,1.1c-0.4,0.2-0.7,0.5-0.9,1c-0.1,0.3-0.1,0.5,0,0.8
  c0.1,0.2,0.3,0.4,0.5,0.5c0.2,0.1,0.4,0.1,0.6,0.1c0.2,0,0.5-0.1,0.6-0.3c1-1,2-1.8,3.2-2.5c1.2-0.7,2.4-1.3,3.6-1.9
  c0.9-0.5,1.9-0.9,3-1.4c1-0.4,2.1-0.7,3.3-0.8c-0.2,0.7-0.6,1.3-1.1,1.8c-0.4,0.4-0.8,0.9-1.2,1.3c-0.2,0.2-0.5,0.5-0.8,0.8
  c-0.3,0.3-0.6,0.6-0.8,0.9c-0.3,0.3-0.5,0.6-0.7,0.9c-0.2,0.3-0.3,0.7-0.3,1.1c-0.1,0.6,0.2,1.2,0.8,1.5c0.6,0.2,1.2,0.2,1.8,0.1
  c0.7-0.1,1.4-0.4,2.1-0.7c0.7-0.3,1.2-0.5,1.5-0.7c0.6-0.3,1.1-0.5,1.6-0.8c0.5-0.2,1.1-0.5,1.6-0.8l1.3-0.6
  c0.4-0.2,0.8-0.4,1.1-0.6c0.3-0.2,0.5-0.5,0.5-0.8c0-0.3-0.1-0.5-0.4-0.5c0,0-0.1,0-0.1,0c-0.2,0-0.4,0.1-0.6,0.2
  c-0.3,0.1-0.5,0.2-0.8,0.4s-0.6,0.3-0.8,0.5c-0.3,0.2-0.5,0.3-0.6,0.4l-2.5,1.1c-0.2,0.1-0.5,0.2-0.9,0.4s-0.8,0.3-1.2,0.5
  c-0.4,0.1-0.8,0.2-1.3,0.3c-0.3,0.1-0.7,0.1-1,0c0.1-0.2,0.2-0.5,0.3-0.7c0.2-0.3,0.4-0.5,0.6-0.8c0.2-0.3,0.4-0.5,0.6-0.7
  c0.2-0.1,0.3-0.3,0.4-0.5c0.4-0.5,0.9-1,1.3-1.4c0.4-0.5,0.8-1,1.2-1.5c0.3-0.4,0.5-0.9,0.5-1.3c0-0.4-0.1-0.7-0.3-1
  c-0.2-0.3-0.6-0.5-0.9-0.5c-0.5-0.1-0.9-0.1-1.4,0c-1.4,0.4-2.8,1-4.1,1.7c-1.4,0.8-2.7,1.5-4,2.2l-1.6,0.7
  c-0.5,0.2-1.1,0.5-1.6,0.8l0.7-1.7c0.1-0.4,0.3-0.7,0.6-1c0.3-0.3,0.3-0.8,0.1-1.2c-0.2-0.5-0.8-0.7-1.8-0.5
  c-1.1,0.2-2.1,0.6-3.1,1.1c-1.1,0.5-2.2,1.1-3.3,1.7c-1.1,0.6-1.8,1-2.3,1.2C311.8,19.9,311.6,20.1,311.5,20.3L311.5,20.3z
   M339,20.6c0.1,0.3,0.4,0.6,0.7,0.5c0.3,0.1,0.6,0,0.9-0.2c0.3-0.2,0.7-0.4,1-0.6c-0.7,1.5-0.1,3.2,1.2,4.1c0.6,0.3,1.3,0.5,2,0.6
  c0.8,0.1,1.5,0.1,2.3,0c0.8-0.1,1.6-0.2,2.3-0.5l-2,5.8c-1.3,1.5-2.5,3.2-3.6,4.8c-1.1,1.7-2.1,3.4-2.9,5.2
  c-0.1,0.3-0.2,0.6-0.4,1.1c-0.1,0.4-0.2,0.9-0.3,1.3c-0.1,0.4,0,0.8,0.1,1.2c0.2,0.4,0.5,0.6,0.9,0.7c0.3,0,0.7,0,1-0.2
  c0.3-0.2,0.6-0.4,0.8-0.7c0.2-0.3,0.4-0.6,0.6-1c0.2-0.3,0.3-0.6,0.5-0.9c0.6-1.2,1.1-2.4,1.6-3.7c0.5-1.2,1-2.5,1.4-3.7l1.6-3.6
  c0.8-1.1,1.7-2.1,2.6-3.1c0.9-1,1.9-1.9,3-2.8c0.9-0.8,1.8-1.5,2.8-2.2c1-0.6,2-1.2,3-1.8c0.2-0.2,0.3-0.4,0.4-0.6
  c0.1-0.2-0.1-0.5-0.3-0.6c-0.2-0.1-0.4-0.2-0.6-0.1c-0.3,0.1-0.5,0.2-0.7,0.3c-0.2,0.1-0.5,0.3-0.7,0.5c-0.2,0.2-0.4,0.3-0.5,0.4
  c-1.4,0.8-2.6,1.7-3.8,2.7c-1.2,1-2.3,2.1-3.4,3.2l0.8-2c0.2-0.4,0.4-0.8,0.6-1.3c0.3-0.4,0.3-1,0-1.4c-0.2-0.2-0.5-0.3-0.8-0.3
  c-0.3,0.1-0.6,0.2-0.9,0.3l-1.1,0.5c-1.1,0.6-2.4,0.7-3.7,0.5c-0.8,0-1.5-0.5-1.8-1.2c-0.2-0.3-0.2-0.8-0.1-1.1
  c0.1-0.4,0.3-0.7,0.6-1c0.3-0.3,0.6-0.6,1-0.8c0.3-0.2,0.7-0.4,1-0.5c1-0.4,2-0.6,3-0.7c1-0.1,2.1-0.1,3.1,0c0.4,0,0.9-0.2,1.1-0.6
  c0.2-0.3,0.2-0.8-0.1-1.1c-0.3-0.2-0.7-0.4-1-0.3c-1.2,0-2.3,0.1-3.5,0.3c-1.1,0.2-2.2,0.5-3.3,0.9c-1,0.4-2.1,0.8-3.1,1.3
  s-2,1-3.1,1.5C339,20,338.9,20.3,339,20.6L339,20.6z" stroke="#32A1D8" stroke-width="3" fill="none" style="transition:
  'all 3s ease-in-out"></path></svg>
</div>
<div class = "hex-row">
  <div class="hexagon">
    <div class = "hex-container"><i id="dev_icon" class="fa fa-code"></i>
      <svg class="svg-hexagon" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 280 300" width="100%" height="300" xmlns:xlink="http://www.w3.org/1999/xlink">
        <a xlink:href="http://viget.com">
          <polygon points="140,0 280,75 280,225 140,300 0,225 0,75"  ></polygon>
        </a> 
      </svg>
      <svg class="svg-hexagon" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 280 300" width="100%" height="300" xmlns:xlink="http://www.w3.org/1999/xlink">
        <a xlink:href="http://viget.com">
          <polygon points="140,0 280,75 280,225 140,300 0,225 0,75" stroke="#eee" fill-rule="nonzero" ></polygon>
        </a> 
      </svg>
  </div>
</div>
  <div class="hexagon">
    <div class = "hex-container"><i id="des_icon" class="fa fa-paint-brush"></i>
      <svg class="svg-hexagon" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 280 300" width="100%" height="300" xmlns:xlink="http://www.w3.org/1999/xlink">
        <a xlink:href="http://viget.com">
          <polygon points="140,0 280,75 280,225 140,300 0,225 0,75"  ></polygon>
        </a> 
      </svg>
      <svg class="svg-hexagon" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 280 300" width="100%" height="300" xmlns:xlink="http://www.w3.org/1999/xlink">
        <a xlink:href="http://viget.com">
          <polygon points="140,0 280,75 280,225 140,300 0,225 0,75" stroke="#eee" fill-rule="nonzero" ></polygon>
        </a> 
      </svg>
    </div>
  </div>
  <div class="hexagon">
    <div class = "hex-container"><i id="dab_icon" class="fa fa-wrench"></i>
      <svg class="svg-hexagon" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 280 300" width="100%" height="300" xmlns:xlink="http://www.w3.org/1999/xlink">
        <a xlink:href="http://viget.com">
          <polygon points="140,0 280,75 280,225 140,300 0,225 0,75"  ></polygon>
        </a> 
      </svg>
      <svg class="svg-hexagon" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 280 300" width="100%" height="300" xmlns:xlink="http://www.w3.org/1999/xlink">
        <a xlink:href="http://viget.com">
          <polygon points="140,0 280,75 280,225 140,300 0,225 0,75" stroke="#eee" fill-rule="nonzero" ></polygon>
        </a> 
      </svg>
  </div>
</div>
  <div class="hexagon">
    <div class = "hex-container"><i id="dab_icon" class="fa fa-wrench"></i>
      <svg class="svg-hexagon" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 280 300" width="100%" height="300" xmlns:xlink="http://www.w3.org/1999/xlink">
        <a xlink:href="http://viget.com">
          <polygon points="140,0 280,75 280,225 140,300 0,225 0,75"  ></polygon>
        </a> 
      </svg>
      <svg class="svg-hexagon" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 280 300" width="100%" height="300" xmlns:xlink="http://www.w3.org/1999/xlink">
        <a xlink:href="http://viget.com">
          <polygon points="140,0 280,75 280,225 140,300 0,225 0,75" stroke="#eee" fill-rule="nonzero" ></polygon>
        </a> 
      </svg>
  </div>
</div>  
  <div class="stretch"></div>
  <nav>
    <ul>
      <li><a href="#">a developer</a></li>
      <li><a href="#">a designer</a></li>
      <li><a href="#">dabbler extraordinare</a></li>
      <li class="stretch"></li>
    </ul>
  </nav>
</div>

/*************** Mixins ***************/
@mixin horizontal-distr() {
  margin-left: auto; 
  margin-right: auto;

  text-align: justify;
  -ms-text-justify: distribute-all-lines;
  text-justify: distribute-all-lines;
}

@mixin animate-transition($transition){
    -webkit-transition: $transition;
        -ms-transition: $transition;
         -o-transition:$transition;
            transition: $transition;
}

@mixin scale($integer){
      -webkit-transform:     scale($integer);
    -moz-transform: scale($integer);
    -o-transform: scale($integer);
    transform: scale($integer);
}

/*************************************/

$cell-width: 32%;
$site-blue: #32a1d8;
$primary-color: $site-blue;
$font: "Open Sans", sans-serif;
$font-awesome: "font-awesome";
$fade-animation: all .5s ease;

html {
  background-size: cover;
  background-repeat: no-repeat;
  font-family: $font;
  width:100%;
  height: 100%;
  overflow:hidden;
  color:#fff;  
}

body::before {
  content: "";
  background: url('http://mysite.du.edu/~lmcdade/media/laurenparker.jpg') no-repeat center center fixed;
  background-size:cover;
  opacity: 0.35;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;  
  -webkit-filter: grayscale(0.75); /* Old WebKit */
  filter: grayscale(0.75);
}

#logo{
  position:relative;
  z-index:2000;
  float:right;
  cursor:pointer; 
  display:none;
}

#bio {
  font-weight:normal;
  span {font-weight:bold; display:initial;
  display:none;
  }
}

#sm_drawer {
  font-size:250%;
  text-align:center;
  
  p {
    color:$site-blue;
    text-align:center;
   
    i {padding:5%}
    
  }
  
}

nav ul{
  
  position:relative;
  z-index:100; 
  right:10px;
  padding: 0; 
  width:100%;
  
  
  li {
    @include horizontal-distr();
    display: inline-block;
    width:$cell-width;
    text-align:center;
    vertical-align:top;
  
    a{
      color: white;
      text-decoration: none;
      display:inline-block;
      font-size:130%;
      color:#fff;
      
      &:hover, &.hover{
        font-weight:300;
        
        
        &:after{
          width:100%;
          display:inline-block;
        }
      }
      
      &:after{
          width:0%;
          content: "";
          float:left;
          margin-top:-5px;
          border-bottom:3px solid $site-blue;
        
          @include animate-transition(all .25s);
      }
      
      &:active, &:active:after{
        border-color:#fff;
        color:$site-blue;
      }
      
    }
    
  }
  
  .stretch {
    width: 100%;
    display: inline-block;
    font-size: 0;
    line-height: 0
  }
}

.hexagon {
  @include horizontal-distr();
  @include animate-transition($fade-animation);
  @include scale(1);
  
  opacity:0.6;
  width: $cell-width;
  min-width:150px;
  max-height:30%;
  display:inline-block;  
  
  * {
      fill:$site-blue;
  }
   
  &:nth-of-type(4){
    display:none;
    &.hover{display:inline-block;}
  }
  
  &:hover, &.hover {
    
    opacity:1;
    stroke-width:0;
    
    & ~ nav a.selected{
      color:$site-blue;
      font-weight:bold;
    }
    
    * {
      color:#fff;
    }
  }  
  
  i {
      
    font-size:10vw;
    color:#000;
    text-align:center;
    pointer-events:none;
    
    position:absolute;
    z-index:1000;
    top:35%;
    left:5%;
    width:90%;
    height:90%;
  }
  
  .hex-container {
    position: relative;
    height: 0;
    width: $cell-width*3;
    padding: 0;
    padding-bottom: 100%;
    
  }
  
  .svg-hexagon {
    
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    
    &:nth-of-type(2){
      position:absolute;
      top:5%;
      left:5%;
      width:90%;
      height:90%;
    }
  }
  
}

.hex-row {
  @include animate-transition( $fade-animation);
  @include horizontal-distr();
  width:100%;
  position:absolute;
  bottom:5%;
  text-align:center;
  
  .stretch {
    width: $cell-width*3;
    display: inline-block;
    font-size: 0;
    line-height: 0
  }
  
  &:not(.smaller) .hexagon:nth-of-type(4) {display:none;}
}

.overlay {
  @include animate-transition( $fade-animation);
  @include scale(1.8);
  opacity: 0;
  visibility: hidden;
  position: fixed;
  top:0;
  left:0;
  width: 100%;
  height: 100%;
  
  padding-top:95px;
  background: rgba(255,255,255,0.65);
  //z-index: 100;
  
  &.logo_off{
    &~#logo{
      pointer-events:none;
      cursor:initial;
    }
  }
  
  &.on {
    @include scale(1);
    opacity: 1;
    visibility: visible;
    
    span.selected{
      position:relative;
      display:block;
      
      p{
        max-height:300px;
        overflow-y:auto;
      }
      
      h2 {
        color:$site-blue;
        font-weight:normal;
      }
    }
  }
  
  a, a:visited{
    color:$site-blue;
    text-decoration:none;
  }
  
  > * {
    color: #333344;
    font-weight: bold;
    position:relative;
    width:75%;
    margin:auto;
    margin-top:10%;
  }
  
  span {   
    display:none;
  }
  
}

.smaller {
  @include animate-transition( $fade-animation);
  @include scale(0.2);
  bottom: 0;
  
  .hexagon:not(.hover){
    display:none;
  }
  nav a{visibility:hidden;}
  
  .selected {font-weight:bold;}
}

@media only screen and (max-width: 457px) {
  nav {
    display:none;
  }
  
  #dev_icon{
        
    &:after{
      text-align:center; 
      font-size:33%;
      vertical-align:middle;
      content:" developer";
    }
  }
  
  #des_icon{
        
    &:after{
      text-align:center; 
      font-size:33%;
      vertical-align:middle;
      content:" designer";
    }
  }
  
  #dab_icon{
        
    &:after{
      text-align:center; 
      font-size:33%;
      vertical-align:middle;
      content:" dabbler";
    }
  }
}

@media only screen and (max-width: 302px) {
  
  #dev_icon{
        
    top:60px;
    
    &:after{
      text-align:center; 
      font-size:55%;
      vertical-align:middle;
      content:" developer";
    }
  }
  
  #des_icon{
        
    top:60px;
    
    &:after{
      text-align:center; 
      font-size:55%;
      vertical-align:middle;
      content:" designer";
    }
  }
  
  #dab_icon{
        
    top:60px;
    
    &:after{
      text-align:center; 
      font-size:55%;
      vertical-align:middle;
      content:" dabbler";
    }
  }
}

View Compiled

var path = document.querySelector('#logo path');
var length = path.getTotalLength();
// Clear any previous transition
path.style.transition = path.style.WebkitTransition =
  'none';
// Set up the starting positions
path.style.strokeDasharray = length + ' ' + length;
path.style.strokeDashoffset = length;
// Trigger a layout so styles are calculated & the browser
// picks up the starting position before animating
path.getBoundingClientRect();
// Define our transition
path.style.transition =
  'all 3s ease-in-out';
// Go!
path.style.strokeDashoffset = '0';
path.style.strokeWidth = '0';
path.style.fill = '#32A1D8';

$('#logo').click(function(e){

  $(".hexagon:nth-of-type(4)").click();
  
});

$('.hexagon').each(function(i){
  
  var hex =  $(this);
  var icon = hex.find("i");
  var currIcon = icon.attr('class');
  var link = $("nav > ul > li").eq(i).find("a");
  var content = $("div.overlay > span").eq(i);
  var overlay = $("#overlay");
  
  hex.hover(
    function(){link.addClass("hover")},
    function(){link.removeClass("hover")}
  );
  
  link.hover(
    function(){hex.addClass("hover")},
    function(){hex.removeClass("hover")}
  );
  
  hex.on('click', function(e) {
    
    e.preventDefault();
    
    $('.overlay').toggleClass('on');
    $('.hex-row').toggleClass('smaller');
            
    link.toggleClass('selected');
    hex.toggleClass('hover');
    hex.find("i").toggleClass(currIcon);
    hex.find("i").toggleClass('fa fa-times');
    content.toggleClass('selected');
    
    if (i != 3) {
      overlay.toggleClass("logo_off");
    }
  });
  
});

$('nav ul li a').each(function(i){
  $(this).on("click", function(){
    $('.hexagon').eq(i).click();
  })
});

This Pen is owned by Parker McDade on CodePen.

See more by @imafeature on CodePen

External CSS

//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css

External JavaScript

//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js