projects.html

---
layout: page
title: Projects
permalink: /projects/
---
<!-- projects-4 -->
      <section class="projects-4">
        <div class="container-fluid">
          <h3>Udacity Front-End Nanodegree</h3>
          <div class="projects row">
            <div class="project-wrapper col-xs-4">
              <div class="project">
                <div class="photo-wrapper hover-opacify bg-sun-flower">
                  <div class="photo"></div>
                  <a href="{{ site.url }}/udacity-intro-html-css" target="_blank" class="overlay"><span class="project-name">Website Mockup</span></a>
                </div>
                <div class="info">
                  <a href="{{ site.url }}/udacity-intro-html-css" target="_blank" class="name color-asbestos">Project One</a>
                </div>
              </div>
            </div>

            <div class="project-wrapper col-xs-4">
              <div class="project">
                <div class="photo-wrapper hover-opacify bg-carrot ">
                  <div class="photo"></div>
                  <a href="{{ site.url }}/udacity-resume" target="_blank" class="overlay"><span class="project-name">Interactive Resume</span></a>
                </div>
                <div class="info">
                  <a href="{{ site.url }}/udacity-resume" target="_blank" class="name color-asbestos">Project Two</a>
                </div>
              </div>
            </div>

            <div class="project-wrapper col-xs-4">
              <div class="project">
                <div class="photo-wrapper hover-opacify bg-alizarin">
                  <div class="photo"></div>
                  <a href="{{ site.url }}/udacity-arcade-game" target="_blank" class="overlay"><span class="project-name">Arcade Game</span></a>
                </div>
                <div class="info">
                  <a href="{{ site.url }}/udacity-arcade-game" target="_blank" class="name color-asbestos">Project Three</a>
                </div>
              </div>
            </div>

            <div class="project-wrapper col-xs-4">
              <div class="project">
                <div class="photo-wrapper hover-opacify bg-turquoise">
                  <div class="photo"></div>
                  <a href="{{ site.url }}/udacity-website-optimization" target="_blank" class="overlay"><span class="project-name">Website Optimization</span></a>
                </div>
                <div class="info">
                  <a href="{{ site.url }}/udacity-website-optimization" target="_blank" class="name color-asbestos">Project Four</a href="#">
                </div>
              </div>
            </div>

            <div class="project-wrapper col-xs-4">
              <div class="project">
                <div class="photo-wrapper hover-opacify bg-emerland">
                  <div class="photo"></div>
                  <a href="{{ site.url }}/udacity-maps-api" target="_blank" class="overlay"><span class="project-name">APIs</span></a>
                </div>
                <div class="info">
                  <a href="{{ site.url }}/udacity-maps-api" target="_blank" class="name color-asbestos">Project Five</a href="#">
                </div>
              </div>
            </div>

            <div class="project-wrapper col-xs-4">
              <div class="project">
                <div class="photo-wrapper hover-opacify bg-peter-river">
                  <div class="photo"></div>
                  <a href="{{ site.url }}/udacity-jasmine" target="_blank" class="overlay"><span class="project-name">Test-driven Development</span></a>
                </div>
                <div class="info">
                  <a href="{{ site.url }}/udacity-jasmine" target="_blank" class="name color-asbestos">Project Six</a href="#">
                </div>
              </div>
            </div>
          </div>
        </div>
        <!--/.container-->
      </section>-