<main role="main">
  <div class="page">
  <!-- 1. Header -->
  <header>
      <h1>Jared A. Pearce</h1>
      <h2>Front-End Web Developer</h2>
      <p>Front end web developer enthusiastic about delivering a holistic, scalable approach to web development that not only meets industry best practices but also provides rich, engaging experiences for the end user. Expert strategist prepared for content interpretation, process integration, and software implementation that conforms to customer requirements and specifications. Contemporary artisan determined to decrease markup, incorporate consistent structure and produce elegant quality code for long-term product stability. </p>
  </header>
  <!-- 2a. Resume Content -->
  <section class="resume_content">
    <article>
      <h2>Professional Experience</h2>
      <section>
          <h3>Front End Web Developer <span class="time">
            <time datetime="2013-05-20" class="start">2013</time>
            &#8211; Present
            </span></h3>
        <p><strong><!-- http://mathworks.com -->The MathWorks, Inc.</strong> <b>Natick, MA</b></p>
        <ul>
          <li>Reduced software development delays and increased code quality by adapting the peer-to-peer code review process to leverage existing version control system functionality.</li>
          <li>Provided energetic and meticulous feedback when evaluating visual design mocks and usability wireframes for feasibility of responsive HTML5/CSS3 conversion. </li>
          <li>Contributed to the in-house front end community by demonstrating how standard practices for CSS commenting and CSS rule-set structure generates high quality  reusable code.</li>
          <li>Worked with Quality Engineering to deliver true to specification web experiences that resolved cross browser discrepancies and compatibility issues. </li>
        </ul>
      </section>
      <section>
          <h3>Lead Multimedia Developer <span class="time">
            <time datetime="2007-05-29" class="start">2007</time> &#8211; 
            <time datetime="2013-05-14" class="end">2013</time>
            </span></h3>
        <p><strong><!-- http://sandia.gov/ -->Sandia National Laboratories</strong> <b>Albuquerque, NM</b></p>
        <p>Established, in the final design specifications, visual layouts that conformed to a graphical user interface (GUI) framework, instituted strong typography and implemented appropriate color theory. </p>
        <ul>
          <li>Scoped, designed and deployed standardized learning templates programmed in HTML, CSS and JavaScript for consistent delivery of web-based training.</li>
          <li>Presented high fidelity prototypes using HTML, CSS and JavaScript to engage customers in interactive feedback sessions, promote rapid design exploration and identify user patterns.  </li>
          <li>Partnered in negotiating cost, schedule, and performance expectations with project leads and customers.  </li>
          <li>Provided technical support for colleagues and clients; resolving 31 formal customer support tickets in the past year.</li>
        </ul>
        <p>Assisted in defining and promoting technical avenues of growth, direction, vision and planning for the E-Learning Services Team.</p>
        <ul>
            <li>Promoted a clean, holistic, and scalable approach to the team's template architecture by using the Adobe Creative Suite. </li>
            <li>Incorporated jQuery as part of the e-learning infrastructure for DOM manipulation within Sandia's Online Learning Generation Application (OLGA).</li>
            <Li>Validated (X)HTML and HTML5 markup to ensure W3C conformance and Section 508 compliance.</li>
            <li>Produced Sandia's first responsive mobile prototype for web-based training through the use of CSS media queries, HTML5 and jQuery. </li>
        </ul>
        <p>Researched and implemented clean coding practices and industry-touted methodologies within software development processes to ensure software quality, stability and graceful degradation. </p>
        <ul>
            <li>Used the Firefox Web Developer extension to iterate rapidly through the software development life cycle and to ensure pixel-perfect design implementation.</li>
            <li>Hand coded design specifications for accurate display in Firefox modifying, as needed, for other browsers.</li>
        </ul>
      </section>
      <section>
          <h3>Web Technician <span class="time">
            <time datetime="2003-10-20" class="start">2003</time>
            &#8211;
            <time datetime="2007-05-29" class="end">2007</time>
            </span></h3>
        <p>Contracted to Sandia National Laboratories by <strong><!-- http://www.excelstaff.com/ -->Tactical Staffing Resources, LLC</strong> <b>Albuquerque, NM</b> </p>
        <ul>
          <li>Senior member of the E-Learning Services team responsible for developing and maintaining over 70 online training courses. </li>
          <li>Reduced employee training time by 88%, from 4 hours to 30 minutes, by converting instructor led training materials to web-based courses;  saving Sandia $350 per employee per online course taken. </li>
          <li>Pioneered implementation of AICC/SCORM industry standards within Sandia's e-learning culture using HTML/CSS and ensured the overall architecture conformed to Section 508 Compliance.</li>
        </ul>
      </section>
      <section>
          <h2>Summer Internships</h2>
        <h3>Assistant Graphic Designer <span class="time">
          <time datetime="2003-07-04">Summer 2003</time>
          </span></h3>
        <p><strong><!-- http://www.simplifiedgraphics.com/ -->Simplified Graphics Studio </strong> <b>Albuquerque, NM</b></p>
        <h3>Assistant Web Designer <span class="time">
          <time datetime="2002-06-03">Summer 2002</time>
          </span></h3>
        <p><strong><!-- http://nau.edu/sbs/ihd/ -->Institute for Human Development <abbr title="Northern Arizona University">NAU</abbr> </strong> <b>Flagstaff, AZ</b></p>
      </section>
    </article>
  </section>
  <!-- 2b. Resume Technical Knowledge/Skills -->
  <div class="resume_skills">
    <aside>
      <section>
        <h2>Sample Work</h2>
        <ul>
          <li><a href="https://codepen.io/jaredpearce/full/iBdxb">HTML5 Resume</a></li>
          <li><a href="http://mathworks.com/examples" target="_blank">MATLAB Examples</a></li>
          <li><a href="http://coursework.mathworks.com" target="_blank">Cody Coursework</a></li>
          <li><a href="http://blogs.mathworks.com" target="_blank">MATLAB Central Blogs</a></li>
          <li><a href="https://www.behance.net/jaredpearce" target="_blank">Sandia National Laboratories</a></li>
          <!-- <li><a href="https://prod.sandia.gov/wbt/HW100/" target="_blank">Hot Work Training (HW100)</a></li>-->
        </ul>
      </section>
      <section>
        <h2>Software</h2>
        <ul class="technology">
          <li>Adobe CS <span class="exp">11 years</span></li>
          <li>Captivate <span class="exp">7 years</span></li>
          <li>CSS <span class="exp">9 years</span></li>
          <li>CSS3 <span class="exp">2 years</span></li>
          <li>HTML <span class="exp">11 years</span></li>
          <li>HTML5 <span class="exp">2 years</span></li>
          <li>(X)HTML <span class="exp">9 years</span></li>
          <li>JavaScript <span class="exp">6 years</span></li>
          <li>jQuery <span class="exp">6 years</span></li>
          <li>SASS (SCSS)<span class="exp">1 year</span></li>
          <li>SCRUM<span class="exp">2 years</span></li>
        </ul>
      </section>
      <section>
        <h2>Formal Education</h2>
        <h3>Northern Arizona University<span class="time">
          <time datetime="2003-05-17">5/2003</time>
          </span></h3>
        <p>B.F.A. Visual Communication &#8211; Emphasis Graphic Design,<br />
          Minor: Russian Area Studies <b>Flagstaff, AZ</b></p>
        <h3>Mesa Community College <span class="time">
          <time datetime="2000-05-20">5/2000</time>
          </span></h3>
        <p>A.A. General Studies <b>Mesa, AZ</b></p>
      </section>
    </aside>
  </div>
  <!-- 3. Contact Information -->
  <footer>
    <div id="hcard-Jared-Pearce" class="vcard">
        <h3>Contact Jared A. Pearce</h3>
        <p class="adr"><strong>Address:</strong> <a href="https://maps.google.com/maps?q=Cary,%20NC" title="View on Google Maps" rel="me"><span class="locality">Cary, NC</span></a></p>
        <p class="tel"><strong><span class="type">Home</span>:</strong> <a href="callto:+9192341272" rel="me">919-234-1272</a></p>
        <p class="email"><strong>Email:</strong> <a href="mailto:jared.a.pearce@gmail.com" title="Email Jared Pearce" rel="me">jared.a.pearce@gmail.com</a></p>
    </div>
  </footer>
</div>
</main>

/* Resume Typography */
html {font-size: 100.01%}
body {background-color: #DEDEDE; font: normal 0.75em/1.5 "Georgia", "Times New Roman", serif;} /*establish 12px font with verticle rhythm*/

/* =header font size */
h1, h2, h3, h4, h5, h6 {color: #111; font-family: "Tahoma", "Helvetica", "Droid Sans", sans-serif; letter-spacing: 1px;}
h1 {border-bottom: 0.07142855em double #444; color: #000; font: normal 3.5em/2 "Georgia", sans-serif; text-align: center;}
h2 {color: #000; font-size: 1.5em; letter-spacing: 0.07142855em; font-variant: small-caps;} /* 24px / 16px */
h3 {border-bottom: 0.07142855em solid #333; font-size: 1.25em; line-height: 1.42857em; margin-bottom: 0.375em; margin-top: 1.05357em; position: relative;}  /* 20px / 16px */
h4 {font-size: 1.1255em; line-height: 1.2857em; margin-bottom: 0.375em; margin-top: 1.0893em;}  /* 18px / 16px */

/* =p leading */
p {margin-bottom: 0.5em; margin-top: 1em;}
p + p {margin-top: 1.5em;}
p + ul {margin-top: 0.75em;}
footer p, footer p + p {margin: 0;}

/* Layout for Resume */
/* =header display */
header, footer {clear: both;}
header h2, header p {padding: 0 40px; width: 510px;}
header h1 {text-shadow: 2px 3px 2px #999;}

/* page holder */
.page {background: #fff; border: 0.07142855em solid #CECECE; margin: 0.35714286em auto 1em; padding-bottom: 1.5em; position: relative; width: 960px;}






/*h3 {display: inline-block; margin-top: 0; padding-top: 0;}*/
.time {font-size: 0.75em; font-weight: normal; float: right; margin-top: 0; padding-top: 0; position: absolute; right: 0;} /* 16 / 20 */

/* =ul style */
ul {margin: 0 2em 0.857em;}
ul li {list-style-type: square; position: relative;}
.technology li { }
.technology li > span {display: none;}


/* =a styles */
a:link, a:active, a:focus, a:visited, a:hover {color: #444; text-decoration: none;}

@media screen and (min-width: 320px) {
    html, body {margin: 0; padding: 0; text-shadow: none;}
	
    header, header h2, header p, .page, footer {background: #fff; margin: 0 auto; padding: 0; width: 93.75%;}
    header {margin-bottom: 1em;}
    header h2, header p {margin-left: 0; padding-left: 0;}
    .page .resume_content, .page .resume_skills {float: none; margin: 0; padding: 0; width: 100%;} 
    article, aside, .vcard {margin: 0 10px; padding: 0;}
    footer {font-size: inherit !important;}

	
    footer {margin-bottom: 1em;}
    .vcard {border: none; background-color: #fff; display: none; margin: 1em 10px 1em -3px !important; position: inherit; width: 100%;}
    .vcard p {padding: 0 10px 0 0; }
    .vcard h3 {display: block;}
    .vcard strong {display: inline-block;}
}

@media screen and (min-width: 767px) {
    html, body, .page {border: none !important; color: #444 !important; text-shadow: none !important; filter:none !important; margin: 0; padding: 0; -ms-filter: none !important;}
    body {background-color: rgb(110,110,110) !important;}
  
    /* page holder */
    .page {background: #fff; margin: 0.35714286em auto 1em; position: relative; width: 93.75%;} /* 960px / 1024px */
  /* 2 columm layout */
/* column 1: article */ .page .resume_content {float: left; margin-bottom: 0.35714286em; margin-top: 1em; width: 590px;}
/* column 2: aside */ .page .resume_skills {float: right; margin-top: 1em; width: 365px;}
/* layout padding*/
article {margin: 0 20px 0 40px; position: relative;}
aside {margin: 0 40px 0 20px; position: relative;}
aside h2 {margin-bottom: 1.05357em;}
  

    /* 2 columm layout */
    /* column 1: */ .page .resume_content {float: left; margin-bottom: 0.35714286em; width: 61.45833%;} /* 590px / 960px */
    /* column 2: */ .page .resume_skills {float: right; width: 34.375%;}  /* 270px / 960px */
    header p {width: 57.291667%}
      /* =footer placement */
    .vcard {
      background-color: #EAEAEA;
      border: 1px solid #DEDEDE;
      box-shadow: 2px 3px 6px #999;
      left: 66.145833%;
      margin: 10px;
      padding: 6px 10px;
      position: absolute;
      width: 26.666667%; 
      top:  9.0625em; 
    } /* 635px / 960px, 256px / 960px */
  .vcard h3, .vcard strong {display: none;}
b {font-weight: normal; margin-top: -2px; padding-top: 0; position: absolute; right: 0;}
      h3 + p { max-width: 75%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
@media print {
      
    @page { margin: 0.5cm; }
  
    body {
        font: 12pt Georgia, "Times New Roman", Times, serif;
        line-height: 1.3;
    }

    .page, .page .resume_content, .page .resume_skills, article, aside, header h2, header p {
		background-image: none;
		border: none;
		float: none !important;
		margin: 0 !important;
		padding: 0 !important;
		text-indent: inherit !important;
		width: auto !important;
    }
    .vcard {border: none; background-color: #fff; margin-left: 0; margin-top: 0; padding-left: 0; position: inherit !important; width: 100%;}
    .vcard h3, .vcard strong {display: inline-block;}
    
    header h1 {font-size: 30pt;}

    h1 {font-size: 24pt;}
    h2 {font-size: 14pt; margin-top: 25px;}
    
    a, a:visited { color: #444 !important; text-decoration: underline; }
    abbr[title]:after { content: " (" attr(title) ")"; }
    
    p a[href^="http://"]:after {
        content: " (" attr(href) ")";
        font-size: 90%;
    }

}
/* Jp_$NL_hwP3rm!t_@l */