diff --git a/_data/networks.json b/_data/networks.json
index ce48c58..bf552ff 100644
--- a/_data/networks.json
+++ b/_data/networks.json
@@ -1,5 +1,11 @@
 [
   {
+    "icon": "fas fa-phone",
+    "url": "tel:1-405-274-5060"
+  },{
+    "icon": "fas fa-envelope",
+    "url": "mailto:joe@techwonderful.com"
+  },{
     "icon": "fab fa-github",
     "url": "https://github.com/joematthews"
   },{
diff --git a/_data/schools.json b/_data/schools.json
index ab52cf6..0042ab8 100644
--- a/_data/schools.json
+++ b/_data/schools.json
@@ -12,7 +12,7 @@
     "image": "/assets/images/schools/ou.jpg",
     "url": "http://www.ou.edu/web/about_ou.html",
     "points": [
-      "Completed 5 semesters"
+      "Sociology - Completed 5 semesters"
     ]
   },{
     "name": "Talihina High School",
diff --git a/assets/images/joe.jpg b/assets/images/joe.jpg
new file mode 100644
index 0000000..99eccb6
Binary files /dev/null and b/assets/images/joe.jpg differ
diff --git a/index.html b/index.html
index 427798f..f159947 100644
--- a/index.html
+++ b/index.html
@@ -1,32 +1,40 @@
 ---
 layout: default
 title: Resume
+portrait: assets/images/joe.jpg
 author: Joe Matthews
 subtitle: Father, Friend & Programmer.
 phone: 1-405-274-5060
 email: joe@techwonderful.com
 source: https://github.com/joematthews/resume
+summary: >-
+  Hello, I'm a software engineer with a passion for developing applications and
+  tools that provide an amazing user experience and developer experience.
 ---
 <div class="container">
   <!-- Header -->
-  <div class="row align-items-center">
-    <div class="col-lg-12 col-md-24 order-lg-2">
+  <div class="row">
+    <div class="col">
       <h1 class="my-accent-font display-1 text-center text-nowrap d-none d-sm-none d-md-block d-lg-block d-xl-block">{{ page.author }}</h1>
       <h1 class="my-accent-font display-3 text-center text-nowrap d-none d-sm-block d-md-none d-lg-none d-xl-none">{{ page.author }}</h1>
       <h1 class="my-accent-font text-center text-nowrap d-block d-sm-none d-md-none d-lg-none d-xl-none" style="font-size: 3.4em;">{{ page.author }}</h1>
       <h4 class="my-accent-font text-center text-muted text-nowrap" style="margin-top: -0.5em;">{{ page.subtitle }}</h4>
-      <hr/>
     </div>
-    <div class="col-lg-6 col-sm-12 order-lg-1">
-      <p class="text-center"><a href="tel:{{ page.phone }}">{{ page.phone }}</a></p>
+  </div>
+  <div class="row">
+    <div class="col-6 offset-9 col-sm-4 offset-sm-10">
+      <img src="{{ page.portrait }}" class="rounded img-responsive mx-auto d-block" style="width:100%;"/>
     </div>
-    <div class="col-lg-6 col-sm-12 order-lg-3">
-      <p class="text-center"><a href="mailto:{{ page.email }}" target="_top">{{ page.email }}</a></p>
+  </div>
+  <div class="row">
+    <div class="col">
+      <hr/>
+      <h5 class="text-center">{{ page.summary }}</h5>
+      <br/>
     </div>
   </div>
   <div class="row">
-    <div class="col-lg-4">
-      <!-- Skills -->
+    <div class="col-24 col-lg-4">
       <div class="card">
         <div class="card-header text-center">
           <h2 class="my-accent-font">Skills</h2>
@@ -34,7 +42,7 @@ <h2 class="my-accent-font">Skills</h2>
         <div class="card-body">
           <div class="row">
           {% for skill in site.data.skills %}
-            <div class="col-lg-24 col-sm-4 col-6">
+            <div class="col-6 col-sm-4 col-lg-24">
               <p class="text-center">
                 <a href="{{ skill.url }}" target="_blank">
                   <img class="img-fluid rounded" src="{{ skill.image | relative_url }}">
@@ -50,43 +58,41 @@ <h2 class="my-accent-font">Skills</h2>
       </div>
       <br/>
     </div>
-    <div class="col">
-      <!-- Work History -->
+    <div class="col-24 col-lg">
       <div class="card">
         <div class="card-header text-center">
           <h2 class="my-accent-font">Work History</h2>
         </div>
         <div class="card-body">
-          <!-- Companies -->
           {% for company in site.data.companies %}
           <div class="row align-items-center">
-            <div class="col-md-4 col-sm-6 col-12 order-md-3">
+            <div class="col-6 order-1 col-sm-4 order-md-1">
               <a href="{{ company.url }}" target="_blank">
                 <img class="img-fluid rounded" src="{{ company.image | relative_url }}">
               </a>
             </div>
-            <div class="col-md-4 col-12 order-md-2">
-              <p class="text-muted text-center">{{ company.location }}</p>
+            <div class="col-24 order-3 col-md order-md-2">
+              <h3 class=""><strong>{{ company.name }}</strong></h3>
+            </div>
+            <div class="col-18 order-2 col-md-4 order-md-3">
+              <p class="text-muted text-right">{{ company.location }}</p>
             </div>
-            <div class="col-md col-sm-24 order-md-1"><h3 class=""><strong>{{ company.name }}</strong></h3></div>
           </div>
-          <!-- Positions -->
           {% for position in company.positions %}
           <div class="row align-items-center">
-            <div class="col-md-5">
-              <p class="text-muted text-center"><small>{{ position.dates }}</small></p>
-            </div>
-            <div class="col">
+            <div class="col-24 col-md-20 offset-md-4">
               <h4>{{ position.name }}</h4>
-              <!-- Points -->
+            </div>
+            <div class="col-24 col-md-20 offset-md-4 col-lg-16">
+              <p class="text-muted text-left"><small>{{ position.dates }}</small></p>
+            </div>
+            <div class="col-24 col-md-20 offset-md-4 col-lg-16">
               <ul>
                 {% for point in position.points %}
                 <li class="text-muted">{{ point }}</li>
                 {% endfor %}
               </ul>
             </div>
-            <div class="col-3">
-            </div>
           </div>
           {% endfor %}
           {% if company != site.data.companies.last %}
@@ -97,28 +103,29 @@ <h4>{{ position.name }}</h4>
       </div>
       <br/>
       <div class="card">
-        <!-- Education -->
         <div class="card-header text-center">
           <h2 class="my-accent-font">Education</h2>
         </div>
         <div class="card-body">
-          <!-- Schools -->
           {% for school in site.data.schools %}
           <div class="row align-items-center">
-            <div class="col-md-4 col-sm-8 col-12 order-md-2">
+            <div class="col-6 col-sm-4 order-md-2">
               <a href="{{ school.url }}" target="_blank">
                 <img class="img-fluid rounded" src="{{ school.image | relative_url }}">
               </a>
             </div>
-            <div class="col-md-4 col-sm-8 col-12 order-md-4">
-              <p class="text-center text-muted">{{ school.location }}</p>
-            </div>
-            <div class="col-md-5 col-sm-8 order-md-1">
-              <p class="text-muted text-center"><small>{{ school.dates }}</small></p>
+            <div class="col-18 col-md-4 order-md-4">
+              <p class="text-muted text-right">{{ school.location }}</p>
             </div>
-            <div class="col order-md-3">
+            <div class="col-24 col-md order-md-3">
               <h3 class="text-nowrap">{{ school.name }}</h3>
-              <!-- Points -->
+            </div>
+            <div class="col-24 col-md-5 order-md-1">
+              <p class="text-muted"><small>{{ school.dates }}</small></p>
+            </div>
+          </div>
+          <div class="row align-items-center">
+            <div class="col-24 col-md offset-md-9">
               <ul>
                 {% for point in school.points %}
                 <li>{{ point }}</li>
@@ -132,17 +139,17 @@ <h3 class="text-nowrap">{{ school.name }}</h3>
           {% endfor %}
         </div>
       </div>
+      <br/>
+      <p class="text-center" style="font-size: 2em;">
+        {% for network in site.data.networks %}
+        <a href="{{ network.url }}" target="_blank" style="text-decoration: none; color: black;">
+          <i class="{{ network.icon }}"></i>
+        </a>
+        {% endfor %}
+      </p>
+      <p class="text-center">&copy; {{ "now" | date: "%Y" }} {{ page.author }}.</p>
+      <p class="text-center">View page <a href="{{ page.source }}" target="_blank">source</a>.</p>
+      <br/>
     </div>
   </div>
-  <hr/>
-  <p class="text-center" style="font-size: 2em;">
-    {% for network in site.data.networks %}
-    <a href="{{ network.url }}" target="_blank" style="text-decoration: none; color: black;">
-      <i class="{{ network.icon }}"></i>
-    </a>
-    {% endfor %}
-  </p>
-  <p class="text-center">&copy; {{ "now" | date: "%Y" }} {{ page.author }}.</p>
-  <p class="text-center">View page <a href="{{ page.source }}" target="_blank">source</a>.</p>
-  <br/>
 </div><!-- container -->