<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>{{ r.name }}</title>
    <link href='https://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
    {{ headFragment }}
    <style>
    {{{ cssInfo.data }}}
    </style>
  </head>
  <body class="pdf">
    <main id="main">
      <div id="container">
      <header>
        <h1>{{{ r.name }}}</h1>
        <div id="contact">
          {{#has r.contact.email}}<div class="email"><a href="mailto:{{{ RAW.contact.email }}}">{{ RAW.contact.email }}</a></div>{{/has}}
          {{#has r.contact.phone}}<div class="phone">{{ RAW.contact.phone }}</div>{{/has}}
          {{#has r.contact.website}}<div class="website"><a href="{{{ RAW.contact.website }}}">{{ RAW.contact.website }}</a></div>{{/has}}
        </div>
      </header>


{{#if r.info.brief}}
<hr>
<section id="summary">
  <h2>{{{sectionTitle "info" "About"}}}</h2>
  <span class="fa fa-lg fa-user"></span>
  {{{ r.info.brief }}}
</section>
{{/if}}

{{!<!-- A custom skills section with colored skill bars. -->}}

{{#section 'skills' }}
      <hr>
      <section id="skills">
        <header>
        <h2>{{{sectionTitle "Skills"}}}</h2>
        </header>
        <span class="fa fa-lg fa-code"></span>
        <ul class="list-unstyled">
          {{#each r.skills.sets}}
            <li class="card card-nested card-skills">
              <div class="skill-level" rel="tooltip" title="{{ level }}" data-placement="left">
                <div class="skill-progress {{toLower level }}"></div>
              </div>
              <div class="skill-info">
                <strong>{{ name }}</strong>
                <div class="space-top labels">
                  {{#if skills}}
                    {{#each skills}}
                      <span class="label label-keyword">{{ this }}</span>
                    {{/each}}
                  {{/if}}
                </div>
              </div>
            </li>
          {{/each}}
        </ul>
      </section>
{{/section}}

{{!<!--
  Use predefined global partials for the other sections.

  The "inline" bit before each section allows us to pass a custom heading
  icon into the global partial. For this theme, we're using Font Awesome.
-->}}

{{#*inline "icon-employment"}}<span class="fa fa-lg fa-building"></span>{{/inline}}
{{> section/employment }}

{{#*inline "icon-projects"}}<span class="fa fa-lg fa-star"></span>{{/inline}}
{{> section/projects }}

{{#*inline "icon-education"}}<span class="fa fa-lg fa-mortar-board"></span>{{/inline}}
{{> section/education }}

{{#*inline "icon-service"}}<span class="fa fa-lg fa-child"></span>{{/inline}}
{{> section/service }}

{{#*inline "icon-samples"}}<span class="fa fa-lg fa-share"></span>{{/inline}}
{{> section/samples }}

{{#*inline "icon-writing"}}<span class="fa fa-lg fa-pencil"></span>{{/inline}}
{{> section/writing }}

{{#*inline "icon-recognition"}}<span class="fa fa-lg fa-trophy"></span>{{/inline}}
{{> section/recognition }}

{{#*inline "icon-speaking"}}<span class="fa fa-lg fa-users"></span>{{/inline}}
{{> section/speaking }}

{{#*inline "icon-testimonials"}}<span class="fa fa-lg fa-thumbs-o-up"></span>{{/inline}}
{{> section/testimonials }}

{{#*inline "icon-references"}}<span class="fa fa-lg fa-thumbs-o-up"></span>{{/inline}}
{{> section/references }}

      </div>
    </main>
  </body>
</html>
