David A. Windham
david
/
dw
1
0
Fork 0
Files
Browse Source

clean

windhamdavid 2 years ago
parent
7bc61fab5f
commit
4ffe01b910
7 changed files with 702 additions and 761 deletions
Unified View Show Diff Stats
  1. 0 0
      app/css/dw.css
  2. 308 304
      app/index.html
  3. 0 0
      app/index.min.html/index.html
  4. 78 152
      css/style.css
  5. 7 1
      gulpfile.js
  6. 308 304
      index.html
  7. 1 0
      js/_init.js

File diff suppressed because it is too large
+ 0 - 0
app/css/dw.css


+ 308 - 304
app/index.html
View File 

@@ -3,13 +3,13 @@
 
 <head>
 
 <head>
 
 <meta charset="utf-8">
 
 <meta charset="utf-8">
 
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-<meta name="google-site-verification" content="kp06-RPhHu97jLQv5c7nl_jyj3wDwTBIpC_OogW-TFc" />
 
+<meta name="google-site-verification" content="kp06-RPhHu97jLQv5c7nl_jyj3wDwTBIpC_OogW-TFc">
 
 <meta name="description" content="David Windham">
 
 <meta name="description" content="David Windham">
 
 <meta name="author" content="David Windham">
 
 <meta name="author" content="David Windham">
 
 <title>David Windham</title>
 
 <title>David Windham</title>
 
-<meta property="og:title" content="David Windham"/>
 
-<meta property="og:description" content="Something Else"/>
 
-<meta property="og:type" content="website"/><meta property="og:url" content="https://davidwindham.com"/><meta property="og:site_name" content="David Windham"/><meta property="og:image" content="img/og_image.jpg"/><meta property="fb:app_id" content="203136806559589" /><meta name="twitter:site" content="@windhamdavid"><meta name="twitter:creator" content="@windhamdavid"><meta name="twitter:title" content="David Windham"><meta name="twitter:description" content="Something Else"><meta name="twitter:image" content="img/ogt_image.jpg"><meta name="twitter:card" content="summary_large_image"><link rel="apple-touch-icon" sizes="180x180" href="img/icons/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="img/icons/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="img/icons/favicon-16x16.png"><link rel="manifest" href="img/icons/site.webmanifest"><!--<link rel="mask-icon" href="img/icons/safari-pinned-tab.svg" color="#3f3f3f">--><meta name="msapplication-TileColor" content="#000000"><meta name="theme-color" content="#ffffff">
 
+<meta property="og:title" content="David Windham">
 
+<meta property="og:description" content="Something Else">
 
+<meta property="og:type" content="website"><meta property="og:url" content="https://davidwindham.com"><meta property="og:site_name" content="David Windham"><meta property="og:image" content="img/og_image.jpg"><meta property="fb:app_id" content="203136806559589"><meta name="twitter:site" content="@windhamdavid"><meta name="twitter:creator" content="@windhamdavid"><meta name="twitter:title" content="David Windham"><meta name="twitter:description" content="Something Else"><meta name="twitter:image" content="img/ogt_image.jpg"><meta name="twitter:card" content="summary_large_image"><link rel="apple-touch-icon" sizes="180x180" href="img/icons/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="img/icons/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="img/icons/favicon-16x16.png"><link rel="manifest" href="img/icons/site.webmanifest"><!--<link rel="mask-icon" href="img/icons/safari-pinned-tab.svg" color="#3f3f3f">--><meta name="msapplication-TileColor" content="#000000"><meta name="theme-color" content="#ffffff">
 
 <link rel="stylesheet" href="css/dw.css">
 
 <link rel="stylesheet" href="css/dw.css">
 
 <script type="application/ld+json">
 
 <script type="application/ld+json">
 
   {
 
   {
 
@@ -66,7 +66,7 @@
 
 <div id="backgroundsvg3"></div>
 
 <div id="backgroundsvg3"></div>
 
 
 
 <!-- ============================= ** HEADER ** ============================= -->
 
 <!-- ============================= ** HEADER ** ============================= -->
 
-<header id="header" class="header" role="banner">
 
+<header id="header" class="header">
 
   <div class="header-ui">
 
   <div class="header-ui">
 
     <div class="brand--nav text-end">
 
     <div class="brand--nav text-end">
 
       <h1 class="d-none ">David Windham</h1>
 
       <h1 class="d-none ">David Windham</h1>
 
@@ -75,8 +75,8 @@
 
 </header>
 
 </header>
 
 <header class="header-small">
 
 <header class="header-small">
 
   <a href="#header" class="brand">
 
   <a href="#header" class="brand">
 
-    <img class="light" src="img/dw-sm-white.svg" srcset="img/dw-sm-white.svg 2x" alt="David Windham logo"/>
 
-    <img class="dark" src="img/dw-sm.svg" srcset="img/dw-sm.svg 2x" alt="David Windham logo"/>
 
+    <img class="light" src="img/dw-light.svg" srcset="img/dw-light.svg 2x" alt="David Windham logo">
 
+    <img class="dark" src="img/dw-dark.svg" srcset="img/dw-dark.svg 2x" alt="David Windham logo">
 
   </a>
 
   </a>
 
   <button class="hamburger" type="button" aria-label="Open Close Menu">
 
   <button class="hamburger" type="button" aria-label="Open Close Menu">
 
     <span class="hamburger-box">
 
     <span class="hamburger-box">
 
@@ -98,22 +98,22 @@
 
 <main id="main" class="main">
 
 <main id="main" class="main">
 
  <!-- ============================= ** HELLO ** ============================= -->
 
  <!-- ============================= ** HELLO ** ============================= -->
 
   <div id="hello" class="background-color dark" data-dark-bg></div>
 
   <div id="hello" class="background-color dark" data-dark-bg></div>
 
-  <section class="page-view hello dw-header d-flex align-items-center">
 
+  <section class="page-view hello d-flex align-items-center">
 
     <div class="container">
 
     <div class="container">
 
       <div class="row">
 
       <div class="row">
 
 
 
-        <div class="col-lg-5 offset-lg-1">
 
-          <h1 class="mb-4">David A. Windham</h1>
 
+        <div class="col-lg-8 offset-lg-2">
 
+          <h2 class="mb-2">David A. Windham</h2>
 
           <p>( 1973 - )</p>
 
           <p>( 1973 - )</p>
 
-          <h3><i>Welcome Good People of the Internet</i> ✌🏼,</h3>
 
-          <p class="lead">I'm glad you dropped in. I like to create things.
 
-            It'll all started with...
 
+          <h3>Welcome Good People of the Internet,</h3>
 
+          <p class="lead">I'm glad you dropped in. 
+            I've got a computer and I'm fairly clever... 
+            so here you are on the website I made for my business. 
+            The web was inherently social long before the media part,
 
+            so please feel free to test it out.         
           </p>
 
           </p>
 
 
 
         </div>
 
         </div>
 
-        <div class="col col-lg-5 ">
 
-          <img class="float-start" width="100" src="img/ddog.svg" srcset="./img/ddog.svg 2x" alt="David Windham"/>
 
-        </div>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </section>
 
   </section>
 
@@ -123,19 +123,19 @@
 
   <section class="page-view who">
 
   <section class="page-view who">
 
     <div class="container">
 
     <div class="container">
 
       <div class="row">
 
       <div class="row">
 
-        <div class="col-lg-4">
 
-          <img width="400" src="img/dw.svg" srcset="img/dw.svg 2x" alt="David Windham"/>
 
+        <div class="col-lg-3 mt-5">
 
+          <img class="mt-5 float-end" width="100" src="img/ddog.svg" srcset="./img/ddog.svg 2x" alt="David Windham">
 
         </div>
 
         </div>
 
-        <div class="col-lg-7 ps-5 pt-5 mt-5">
 
-          <h1>Who?</h1>
 
+        <div class="col-lg-7 ps-5 pt-5">
 
+          <h2>Who?</h2>
 
           <p class="lead">
 
           <p class="lead">
 
             I've been a web developer for almost 20 years.
 
             I've been a web developer for almost 20 years.
 
-            I have a BA in Studio Art and a minor in Art History from The College of Charleston.
 
+            I have a BA in Studio Art from The College of Charleston.
 
             I've worked in advertising, publishing, education, and an assortment of businesses for clients.
 
             I've worked in advertising, publishing, education, and an assortment of businesses for clients.
 
             I focus on building custom web applications and I treat my development like mechanical works of art.
 
             I focus on building custom web applications and I treat my development like mechanical works of art.
 
-            I try to help folks make good use of the web by crafting custom sites and applications.
 
+            I try to help folks make good use of software and the web by crafting custom applications.
 
           </p>
 
           </p>
 
-          <svg id="signature" x="0px" y="0px" viewBox="0 0 1000 300" width="300">
 
+          <svg class="img-fluid"id="signature" x="0px" y="0px" viewBox="0 0 1000 300" width="300">
 
             <style type="text/css"> .st0{fill:none;stroke:#535763;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;} </style>
 
             <style type="text/css"> .st0{fill:none;stroke:#535763;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;} </style>
 
             <g id="daw">
 
             <g id="daw">
 
               <path class="st0" d="M188.28,63.54l25,148c0,0,4.98,30.96-2,33c-6.86,2-36.28-68.04-76-98c-28.32-21.36-111.67-55.04-112-76 C23,52.5,86.83,33.5,193,33.5c28,0,203.19,7.85,192.28,71.04c-18.28,105.96-251.24,177.92-266,164c-4.28-4.04,187-59,187-59 s20.28-6.22,37.08-11.57c11.16-3.55,14.63-0.47,20.92-5.43c4.87-3.85,4.48-10.62-1-8c-8.28,3.96,9.6,7.13,13,6c6-2,13.92,4.45,18,4 c9-1,8.72-7.96,14-8c5.72-0.04,4.06,4.87,10,5c4.6,0.1,22.6-5.11,28-10c2.65-2.4,3.74-9.43,4-13c0.47-6.31-1.1-18.96-3-25 c-2.25-7.17-11.77-36.08-14-36c-1.9,0.07,1.18,37.4,3,43c2.36,7.24,10.14,35.44,14,42c1.72,2.93,5.26,8.98,8,11c1.72,1.27,8,3,8,3" />
 
               <path class="st0" d="M188.28,63.54l25,148c0,0,4.98,30.96-2,33c-6.86,2-36.28-68.04-76-98c-28.32-21.36-111.67-55.04-112-76 C23,52.5,86.83,33.5,193,33.5c28,0,203.19,7.85,192.28,71.04c-18.28,105.96-251.24,177.92-266,164c-4.28-4.04,187-59,187-59 s20.28-6.22,37.08-11.57c11.16-3.55,14.63-0.47,20.92-5.43c4.87-3.85,4.48-10.62-1-8c-8.28,3.96,9.6,7.13,13,6c6-2,13.92,4.45,18,4 c9-1,8.72-7.96,14-8c5.72-0.04,4.06,4.87,10,5c4.6,0.1,22.6-5.11,28-10c2.65-2.4,3.74-9.43,4-13c0.47-6.31-1.1-18.96-3-25 c-2.25-7.17-11.77-36.08-14-36c-1.9,0.07,1.18,37.4,3,43c2.36,7.24,10.14,35.44,14,42c1.72,2.93,5.26,8.98,8,11c1.72,1.27,8,3,8,3" />
 
@@ -159,21 +159,22 @@
 
 
 
       <div class="col-lg-10 offset-lg-1">
 
       <div class="col-lg-10 offset-lg-1">
 
         <div class="row">
 
         <div class="row">
 
-          <h1 class="what">What?</h1>
 
-          <h2 class="what">My Capabilities</h2>
 
-          <p class="mt-3">
 
-            I like to tell everyone that the only real skill I have is searching for answers on the internet and reading the instructions.
 
-            Although there's certainly a bit of truth in that, I'd say that my two real superpowers are creative thinking and solving challenging technical puzzles.
 
+          <h2>What?</h2>
 
+          
+          <p class="lead">
 
+            Although solving challenging technical puzzles pays the bills,
 
+            I like to say that all I do is search for answers on the internet and read the instructions.
 
             Aside from the list below, I'm also open to booking my time for any sort of research, brain storming, or any other endeavors.
 
             Aside from the list below, I'm also open to booking my time for any sort of research, brain storming, or any other endeavors.
 
           </p>
 
           </p>
 
+          <h3>My Capabilities</h3>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
 
 
-      <div class="row capabilities-types">
 
+      <div class="row mt-2 capabilities">
 
         <div class="col-lg-10 offset-lg-1">
 
         <div class="col-lg-10 offset-lg-1">
 
           <div class="row">
 
           <div class="row">
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Strategy</h5>
 
+              <h5>Strategy</h5>
 
               <ul>
 
               <ul>
 
                 <li>Advertising</li>
 
                 <li>Advertising</li>
 
                 <li>Communication</li>
 
                 <li>Communication</li>
 
@@ -182,7 +183,7 @@
 
               </ul>
 
               </ul>
 
             </div>
 
             </div>
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Front End</h5>
 
+              <h5>Front End</h5>
 
               <ul>
 
               <ul>
 
                 <li>HTML / CSS</li>
 
                 <li>HTML / CSS</li>
 
                 <li>Javascript ES6 / ES5</li>
 
                 <li>Javascript ES6 / ES5</li>
 
@@ -191,7 +192,7 @@
 
               </ul>
 
               </ul>
 
             </div>
 
             </div>
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Dev-Ops</h5>
 
+              <h5>Dev-Ops</h5>
 
               <ul>
 
               <ul>
 
                 <li>Build Automation</li>
 
                 <li>Build Automation</li>
 
                 <li>Continuous Integration</li>
 
                 <li>Continuous Integration</li>
 
@@ -202,7 +203,7 @@
 
           </div>
 
           </div>
 
           <div class="row">
 
           <div class="row">
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Design</h5>
 
+              <h5>Design</h5>
 
               <ul>
 
               <ul>
 
                 <li>Graphic</li>
 
                 <li>Graphic</li>
 
                 <li>Illustration</li>
 
                 <li>Illustration</li>
 
@@ -212,7 +213,7 @@
 
               </ul>
 
               </ul>
 
             </div>
 
             </div>
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Back End</h5>
 
+              <h5>Back End</h5>
 
               <ul>
 
               <ul>
 
                 <li>Go / Gorilla / Dart / Flutter</li>
 
                 <li>Go / Gorilla / Dart / Flutter</li>
 
                 <li>Node / Express / Meteor</li>
 
                 <li>Node / Express / Meteor</li>
 
@@ -222,7 +223,7 @@
 
               </ul>
 
               </ul>
 
             </div>
 
             </div>
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Sys-Admin</h5>
 
+              <h5>Sys-Admin</h5>
 
               <ul>
 
               <ul>
 
                 <li>Amazon / Google Services</li>
 
                 <li>Amazon / Google Services</li>
 
                 <li>Ansible / Docker / Kubernetes</li>
 
                 <li>Ansible / Docker / Kubernetes</li>
 
@@ -240,136 +241,130 @@
 
 <!-- ============================= ** WHEN ** ============================= -->
 
 <!-- ============================= ** WHEN ** ============================= -->
 
 
 
   <div id="when" class="background-color light"></div>
 
   <div id="when" class="background-color light"></div>
 
-      <section class="page-view when">
 
-        <div class="container">
 
-          <div class="row">
 
-            <div class="col-lg-10 offset-lg-1">
 
-              <h1 class="when">When &amp; Where?</h1>
 
-            </div>
 
+  <section class="page-view when">
 
+    <div class="container">
 
+      <div class="row">
 
+        <div class="col-lg-10 offset-lg-1">
 
+          <h2 class="when">When &amp; Where?</h2>
 
+        </div>
 
+      </div>
 
+      <div class="row">
 
+        <div class="col-lg-3 offset-md-1">
 
+          <div class="row mt-5">
 
+            <h4 class="when">Request My Time</h4>
 
+            <p>I book hourly sessions regularly and I overlap projects in an effort to keep my schedule full.</p>
 
+            <br>
 
           </div>
 
           </div>
 
           <div class="row">
 
           <div class="row">
 
-            <div class="col-lg-3 offset-md-1">
 
-              <div class="row mt-5">
 
-                <h4 class="when">Request My Time</h4>
 
-                <p>I book hourly sessions regularly and I overlap projects in an effort to keep my schedule full.</p>
 
-                <br />
 
-              </div>
 
-              <div class="row">
 
-                <h4 class="when">I Work Anywhere</h4>
 
-                <p>Although video chats are nice, I enjoy meeting in person too. I travel out of the Greenville or Charlotte International Airports.</p>
 
-              </div>
 
-            </div>
 
-            <div class="col-lg-7">
 
-              <div id='calendar'></div>
 
-            </div>
 
+            <h4 class="when mt-2">I Work Anywhere</h4>
 
+            <p>Although video chats are nice, I enjoy meeting in person too. I travel out of the Greenville or Charlotte International Airports.</p>
 
           </div>
 
           </div>
 
         </div>
 
         </div>
 
+        <div class="col-lg-7">
 
+          <div id='calendar'></div>
 
+        </div>
 
       </div>
 
       </div>
 
-    </section>
 
+    </div>
 
+  </section>
 
 
 
 <!-- ============================= ** WHY ** ============================= -->
 
 <!-- ============================= ** WHY ** ============================= -->
 
   <div id="why" class="background-color dark" data-dark-bg></div>
 
   <div id="why" class="background-color dark" data-dark-bg></div>
 
-    <div class="page-view why testimonials-section">
 
-      <div class="container">
 
-        <div class="row">
 
-          <div class="col-lg-1 offset-md-1">
 
-            <h1 class="why">Why?</h1>
 
-          </div>
 
+  <section class="page-view why testimonials-section">
 
+    <div class="container">
 
+      <div class="row mb-3">
 
+        <div class="col-lg-1 offset-md-1">
 
+          <h2 class="why">Why?</h2>
 
         </div>
 
         </div>
 
-        <div class="row">
 
-          <div class="col-lg-1 offset-md-1">
 
-            <div class="indicators"></div>
 
-          </div>
 
-          <div class="col-lg-9">
 
-            <figure class="br-testimonial showing">
 
-                <h5>Selected Clients:</h5>
 
-                <div class="row">
 
-                  <div class="col-md-6">
 
-                    <ul>
 
-                      <li>Use All Five Inc. – Los Angeles, CA</li>
 
-                      <li>The Rivers Agency – Chapel Hill, NC</li>
 
-                      <li>Charleston Home Tour - Charleston, SC</li>
 
-                      <li>AJ Design Co. - Abbeville, SC</li>
 
-                      <li>Fuzzco - Charleston, SC &amp; Portland, OR</li>
 
-                      <li>Harbourtowne Real Estate - Charleston, SC</li>
 
-                      <li>Charleston Trident Association of Realtors</li>
 
-                      <li>The College of Charleston - Charleston, SC</li>
 
-                      <li>Blue Ridge Electric Cooperative – Pickens, SC;</li>
 
-                      <li>Self Regional Healthcare – Greenwood, SC</li>
 
-                      <li>Biotherm Solutions - Cotari, CA</li>
 
-                    </ul>
 
-                  </div>
 
-                  <div class="col-md-6">
 
-                    <ul>
 
-                      <li>Pennebaker & Hegedus Films – New York, NY</li>
 
-                      <li>Good and Plenty Records – New Orleans, LA</li>
 
-                      <li>Jerry Moran – New Orleans, LA</li>
 
-                      <li>Holy City Farms - Charleston, SC</li>
 
-                      <li>Harvard Kennedy School of Education – Boston, MA;</li>
 
-                      <li>Clemson University – Clemson, SC;</li>
 
-                      <li>The Chelcum Family Foundation – Madison, WI</li>
 
-                      <li>Morris Publishing – Augusta, GA</li>
 
-                      <li>The State Newspaper - Columbia, SC</li>
 
-                      <li>GMK Associates – Columbia, SC</li>
 
-                      <li>Nicholson, Meredith, & Anderson - Greenwood, SC</li>
 
-                    </ul>
 
-                  </div>
 
+      </div>
 
+      <div class="row">
 
+        <div class="col-lg-1 offset-md-1">
 
+          <div class="indicators"></div>
 
+        </div>
 
+        <div class="col-lg-9">
 
+          <figure class="br-testimonial showing">
 
+              <h5>Selected Clients:</h5>
 
+              <div class="row">
 
+                <div class="col-md-6">
 
+                  <ul>
 
+                    <li>Use All Five Inc. – Los Angeles, CA</li>
 
+                    <li>The Rivers Agency – Chapel Hill, NC</li>
 
+                    <li>Charleston Home Tour - Charleston, SC</li>
 
+                    <li>AJ Design Co. - Abbeville, SC</li>
 
+                    <li>Fuzzco - Charleston, SC &amp; Portland, OR</li>
 
+                    <li>Harbourtowne Real Estate - Charleston, SC</li>
 
+                    <li>Charleston Trident Association of Realtors</li>
 
+                    <li>The College of Charleston - Charleston, SC</li>
 
+                    <li>Blue Ridge Electric Cooperative – Pickens, SC;</li>
 
+                    <li>Self Regional Healthcare – Greenwood, SC</li>
 
+                    <li>Biotherm Solutions - Cotari, CA</li>
 
+                  </ul>
 
                 </div>
 
                 </div>
 
-            </figure>
 
-
 
-            <figure class="br-testimonial">
 
-              <blockquote>
 
-                "<strong>David has been a pleasure to work with</strong>.
 
-                His patient leadership on project made it very easy on us.
 
-                He has been very flexible in accomodating our requests.
 
-                In less than two months we had a product ready for launch. David's persistent
 
-                support throughout development and launch was fast and consistent; This
 
-                project would have been impossible without him"
 
-              </blockquote>
 
-              <figcaption>
 
-                <cite>pending approval</cite>
 
-                pending approval<br />
 
-                New York, NY
 
-              </figcaption>
 
-            </figure>
 
-
 
-            <figure class="br-testimonial">
 
-              <blockquote>
 
-                "David has always been creative.
 
-                I remember him taking apart all of the electronics in our house and never putting them back together.
 
-                <strong>It makes me very happy to see him doing something I know he enjoys!</strong>"
 
-              </blockquote>
 
-              <figcaption>
 
-                <cite>~ My Mom</cite>
 
-              </figcaption>
 
-            </figure>
 
-
 
-            <figure class="br-testimonial">
 
-              <blockquote>
 
-                "David worked remotely to help build and launch a client project and in less than three months we had a product ready for launch.
 
-                David's persistent support throughout development and launch was fast and consistent; <strong>This
 
-                project would have been impossible without him</strong>"
 
-              </blockquote>
 
-              <figcaption>
 
-                <cite>waiting on approval</cite>
 
-                Los Angeles, CA<br />
 
-              </figcaption>
 
-            </figure>
 
-
 
-            <figure class="br-testimonial">
 
-              <blockquote>
 
-                "Good developers can be difficult to find, but David is amazing! He’s an
 
-                <strong>expert developer who works quickly</strong> and ultimately delivered an app that
 
-                exceeded my expectations. I would definitely work with him again."
 
-              </blockquote>
 
-              <figcaption>
 
-                <cite>waiting on approval</cite>
 
-                Communications Director <br />
 
-                Greenwood, SC
 
-              </figcaption>
 
-            </figure>
 
+                <div class="col-md-6">
 
+                  <ul>
 
+                    <li>Pennebaker & Hegedus Films – New York, NY</li>
 
+                    <li>Good and Plenty Records – New Orleans, LA</li>
 
+                    <li>Jerry Moran – New Orleans, LA</li>
 
+                    <li>Holy City Farms - Charleston, SC</li>
 
+                    <li>Harvard Kennedy School of Education – Boston, MA;</li>
 
+                    <li>Clemson University – Clemson, SC;</li>
 
+                    <li>The Chelcum Family Foundation – Madison, WI</li>
 
+                    <li>Morris Publishing – Augusta, GA</li>
 
+                    <li>The State Newspaper - Columbia, SC</li>
 
+                    <li>GMK Associates – Columbia, SC</li>
 
+                    <li>Nicholson, Meredith, & Anderson - Greenwood, SC</li>
 
+                  </ul>
 
+                </div>
 
+              </div>
 
+          </figure>
 
+          <figure class="br-testimonial">
 
+            <blockquote>
 
+              "<strong>David has been a pleasure to work with</strong>.
 
+              His patient leadership on project made it very easy on us.
 
+              He has been very flexible in accomodating our requests.
 
+              In less than two months we had a product ready for launch. David's persistent
 
+              support throughout development and launch was fast and consistent; This
 
+              project would have been impossible without him"
 
+            </blockquote>
 
+            <figcaption>
 
+              <cite>pending approval</cite>
 
+              pending approval<br>
 
+              New York, NY
 
+            </figcaption>
 
+          </figure>
 
+          <figure class="br-testimonial">
 
+            <blockquote>
 
+              "David has always been creative.
 
+              I remember him taking apart all of the electronics in our house and never putting them back together.
 
+              <strong>It makes me very happy to see him doing something I know he enjoys!</strong>"
 
+            </blockquote>
 
+            <figcaption>
 
+              <cite>~ My Mom</cite>
 
+            </figcaption>
 
+          </figure>
 
+          <figure class="br-testimonial">
 
+            <blockquote>
 
+              "David worked remotely to help build and launch a client project and in less than three months we had a product ready for launch.
 
+              David's persistent support throughout development and launch was fast and consistent; <strong>This
 
+              project would have been impossible without him</strong>"
 
+            </blockquote>
 
+            <figcaption>
 
+              <cite>waiting on approval</cite>
 
+              Los Angeles, CA<br>
 
+            </figcaption>
 
+          </figure>
 
+          <figure class="br-testimonial">
 
+            <blockquote>
 
+              "Good developers can be difficult to find, but David is amazing! He’s an
 
+              <strong>expert developer who works quickly</strong> and ultimately delivered an app that
 
+              exceeded my expectations. I would definitely work with him again."
 
+            </blockquote>
 
+            <figcaption>
 
+              <cite>waiting on approval</cite>
 
+              Communications Director <br>
 
+              Greenwood, SC
 
+            </figcaption>
 
+          </figure>
 
         </div>
 
         </div>
 
-
 
         <div class="col-lg-1 next-wrapper">
 
         <div class="col-lg-1 next-wrapper">
 
           <div class="next-testimonial">
 
           <div class="next-testimonial">
 
             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 129 129" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 129 129">
 
             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 129 129" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 129 129">
 
@@ -379,183 +374,192 @@
 
           </div>
 
           </div>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
-
 
-
 
     </div>
 
     </div>
 
-  </div>
 
+  </section>
 
 
 
 <!-- ============================= ** HOW ** ============================= -->
 
 <!-- ============================= ** HOW ** ============================= -->
 
   <div id="how" class="background-color light"></div>
 
   <div id="how" class="background-color light"></div>
 
-    <section class="page-view services">
 
-      <div class="container">
 
+  <section class="page-view services">
 
+    <div class="container">
 
 
 
-        <div class="row services-title">
 
-          <div class="col-lg-5 offset-md-1">
 
-            <h1 class="how">&amp; How</h1>
 
-            <h2 class="how mb-5">Can I Help?</h2>
 
-            <p class="lead"></p>
 
-          </div>
 
+      <div class="row services-title">
 
+        <div class="col-lg-5 offset-md-1">
 
+          <h2 class="how">&amp; How</h2>
 
+          <h3 class="how mb-5">Can I Help?</h3>
 
+          <p class="lead"></p>
 
         </div>
 
         </div>
 
+      </div>
 
 
 
-        <div class="row">
 
-          <div class="col-lg-5 offset-md-1">
 
+      <div class="row">
 
+        <div class="col-lg-5 offset-md-1">
 
+          <div class="service">
 
+            <i class="pulse"><span></span></i>
 
+            <div class="numbering">01</div>
 
+            <h4 class="how">Create, Build, &amp; Host</h4>
 
+            <p>a new web site or application.</p>
 
+          </div>
 
+          <div class="service">
 
+            <i class="pulse">
 
+            <span></span>
 
+            <span></span>
 
+            </i>
 
+            <div class="numbering">02</div>
 
+              <h4 class="how">Audit, Improve, &amp; Repair</h4>
 
+              <p>an existing web site or application.</p>
 
+            </div>
 
             <div class="service">
 
             <div class="service">
 
-              <i class="pulse"><span></span></i>
 
-              <div class="numbering">01</div>
 
-              <h4 class="how">Create, Build, &amp; Host</h4>
 
-              <p>a new web site or application.</p>
 
+              <i class="pulse">
 
+                <span></span>
 
+                <span></span>
 
+                <span></span>
 
+              </i>
 
+              <div class="numbering">03</div>
 
+              <h4 class="how">Advise, Consult, &amp; Review</h4>
 
+              <p>on web site and application best practices.</p>
 
             </div>
 
             </div>
 
             <div class="service">
 
             <div class="service">
 
               <i class="pulse">
 
               <i class="pulse">
 
-              <span></span>
 
-              <span></span>
 
+                <span></span>
 
+                <span></span>
 
+                <span></span>
 
+                <span></span>
 
               </i>
 
               </i>
 
-              <div class="numbering">02</div>
 
-                <h4 class="how">Audit, Improve, &amp; Repair</h4>
 
-                <p>an existing web site or application.</p>
 
-              </div>
 
-              <div class="service">
 
-                <i class="pulse">
 
-                  <span></span>
 
-                  <span></span>
 
-                  <span></span>
 
-                </i>
 
-                <div class="numbering">03</div>
 
-                <h4 class="how">Advise, Consult, &amp; Review</h4>
 
-                <p>on web site and application best practices.</p>
 
-              </div>
 
-              <div class="service">
 
-                <i class="pulse">
 
-                  <span></span>
 
-                  <span></span>
 
-                  <span></span>
 
-                  <span></span>
 
-                </i>
 
-              </div>
 
             </div>
 
             </div>
 
-            <div class="col-lg-5 offset-lg-1">
 
-              <div class="row step">
 
-                <div class="approach-step">
 
-                  <h4 class="how">Tailored</h4>
 
-                  <p>
 
-                    I can help you succeed online because of my experience, enthusiasm, and commitment to personal service.
 
-                    I tailor my approach to the unique requirements of each project
 
-                    in an effort create sustainable and practical applications that work for you.
 
-                    Have a project in mind?
 
-                  </p>
 
-                  <button type="button" class="btn btn-dark mt-1" data-bs-toggle="modal" data-bs-target="#pricing-modal">
 
-                    Pricing &amp; Cost
 
-                  </button>
 
-                  <button type="button" class="btn btn-dark mt-1">
 
-                    <a class="text-light" href="mailto:&#100;&#097;&#118;&#105;&#100;&#064;&#100;&#097;&#118;&#105;&#100;&#119;&#105;&#110;&#100;&#104;&#097;&#109;&#046;&#099;&#111;&#109;">Email</a>
 
-                  </button>
 
-                </div>
 
+          </div>
 
+          <div class="col-lg-5">
 
+            <div class="row step">
 
+              <div class="approach-step">
 
+                <h4 class="how">Tailored</h4>
 
+                <p>
 
+                  I can help you succeed online because of my experience, enthusiasm, and commitment to personal service.
 
+                  I tailor my approach to the unique requirements of each project
 
+                  in an effort create sustainable and practical applications that work for you.
 
+                  Have a project in mind?
 
+                </p>
 
+                <a class="btn btn-outline-dark mt-1" data-bs-toggle="collapse" data-bs-target="#pricing" aria-expanded="true" aria-controls="collapseOne"">
 
+                  Pricing &amp; Cost
 
+                </a>
 
               </div>
 
               </div>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
 
+        </div>
 
 
 
-          <!-- Pricing Modal -->
 
-          <div class="modal fade" id="pricing-modal" tabindex="-1" role="dialog" aria-labelledby="pricing-modal" aria-hidden="true">
 
-            <div class="modal-dialog modal-lg" role="document">
 
-              <div class="modal-content">
 
-                <div class="modal-body">
 
-                  <div class="container-fluid">
 
-                    <button type="button" class="btn-close float-end" data-bs-dismiss="modal" aria-label="Close"></button>
 
-                    <h3 class="modal-title font-weight-bold">Pricing &amp; Costs</h3>
 
-                    <div class="row">
 
-                      <div class="col-md-12">
 
-                        <h6 class="font-weight-bold mt-4">Approach:</h6>
 
+        <!-- Pricing Modal -->
 
+
 
+                <div id="pricing" class="container accordion-collapse collapse">
 
+                <div class="col-lg-10 offset-md-1">
 
+                  
+                  <h3>Pricing &amp; Costs</h3>
 
+                  <div class="row">
 
+                    <div class="col-md-12">
 
+                      <div class="row">
 
+                        <div class="col-md-6">
 
+                        <h6 class="fw-bold mt-2">Approach:</h6>
 
                         <p class="mt-1">
 
                         <p class="mt-1">
 
                           I have a "take care of it" approach to client services.
 
                           I have a "take care of it" approach to client services.
 
                           I manage, host, and maintain everything I build or install for the lifespan of the project.
 
                           I manage, host, and maintain everything I build or install for the lifespan of the project.
 
                           I focus on my core competencies and will recommend other providers when the scope of your project falls outside of them.
 
                           I focus on my core competencies and will recommend other providers when the scope of your project falls outside of them.
 
                           I provide several basic levels of monthly support based on the scale and maintenance needs of your project.
 
                           I provide several basic levels of monthly support based on the scale and maintenance needs of your project.
 
                         </p>
 
                         </p>
 
-                        <h6 class="font-weight-bold mt-4">Advantages:</h6>
 
+                        </div>
 
+                        <div class="col-md-6">
 
+                        <h6 class="fw-bold mt-2">Advantages:</h6>
 
                         <p class="mt-1">
 
                         <p class="mt-1">
 
                           I take care of ALL of it for you so there are no confusing automated reminders, renewals, and upgrade emails coming from your software or upstream providers.
 
                           I take care of ALL of it for you so there are no confusing automated reminders, renewals, and upgrade emails coming from your software or upstream providers.
 
                           I offer sensible consulting based on your goals.
 
                           I offer sensible consulting based on your goals.
 
                           I provide a single point of contact for consolidated billing, development, and support.
 
                           I provide a single point of contact for consolidated billing, development, and support.
 
                         </p>
 
                         </p>
 
-                        <h6 class="font-weight-bold mt-4">Rates:</h6>
 
-                        <div class="row">
 
-                          <div class="col-md-4">
 
-                            <h6>Hourly: $50</h6>
 
-                            <ul class="pricing">
 
-                              <li>Design</li>
 
-                              <li>Development</li>
 
-                              <li>Consulting</li>
 
-                              <li>Auditing</li>
 
-                            </ul>
 
-                          </div>
 
-                          <div class="col-md-4">
 
-                            <h6>Monthly: $25 - $75</h6>
 
-                            <ul class="pricing">
 
-                              <li>Support</li>
 
-                              <li>Managed Hosting</li>
 
-                              <li>Regular Maintence</li>
 
-                              <li>Regular Upgrades</li>
 
-                            </ul>
 
-                          </div>
 
-                          <div class="col-md-4">
 
-                            <h6>Add-ons:(vendor pricing)</h6>
 
-                            <ul class="pricing">
 
-                              <li>G Suite</li>
 
-                              <li>Office 365</li>
 
-                              <li>SaaS Integration</li>
 
-                              <li>API Integration</li>
 
-                            </ul>
 
-                          </div>
 
                         </div>
 
                         </div>
 
-                        <h6 class="font-weight-bold mt-4">Vendors:</h6>
 
-                        <div class="row text-center">
 
-                          <div class="col-md-12">
 
-                            <div class="btn-group btn-group-toggle" data-toggle="buttons">
 
-                              <label class="btn btn-light">
 
-                                <a href="https://cloud.google.com" target="_blank" rel="noopener">
 
-                                  <img class="vendor-image" src="img/vendor-google.png">
 
-                                </a>
 
-                              </label>
 
-                              <label class="btn btn-light">
 
-                                <a href="https://linode.com" target="_blank" rel="noopener">
 
-                                <img class="vendor-image" src="img/vendor-linode.png">
 
-                                </a>
 
-                              </label>
 
-                              <label class="btn btn-light">
 
-                                <a href="https://kinsta.com" target="_blank" rel="noopener">
 
-                                <img class="vendor-image" src="img/vendor-kinsta.png">
 
-                                </a>
 
-                              </label>
 
-                              <label class="btn btn-light">
 
-                                <a href="https://aws.amazon.com" target="_blank" rel="noopener">
 
-                                <img class="vendor-image" src="img/vendor-amazon.png">
 
-                                </a>
 
-                              </label>
 
-                              <label class="btn btn-light">
 
-                                <a href="https://azure.microsoft.com/" target="_blank" rel="noopener">
 
-                                <img class="vendor-image" src="img/vendor-microsoft.png">
 
-                                </a>
 
-                              </label>
 
-                            </div>
 
+                      </div>
 
+
 
+                      <h6 class="fw-bold mt-2">Rates:</h6>
 
+                      <div class="row">
 
+                        <div class="col-md-4">
 
+                          <h6>Hourly: $50</h6>
 
+                          <ul class="pricing">
 
+                            <li>Design</li>
 
+                            <li>Development</li>
 
+                            <li>Consulting</li>
 
+                            <li>Auditing</li>
 
+                          </ul>
 
+                        </div>
 
+                        <div class="col-md-4">
 
+                          <h6>Monthly: $25 - $75</h6>
 
+                          <ul class="pricing">
 
+                            <li>Support</li>
 
+                            <li>Managed Hosting</li>
 
+                            <li>Regular Maintence</li>
 
+                            <li>Regular Upgrades</li>
 
+                          </ul>
 
+                        </div>
 
+                        <div class="col-md-4">
 
+                          <h6>Add-ons:(vendor pricing)</h6>
 
+                          <ul class="pricing">
 
+                            <li>G Suite</li>
 
+                            <li>Office 365</li>
 
+                            <li>SaaS Integration</li>
 
+                            <li>API Integration</li>
 
+                          </ul>
 
+                        </div>
 
+                      </div>
 
+                      <h6 class="fw-bold mt-4">Vendors:</h6>
 
+                      <div class="row">
 
+                        <div class="col-md-12">
 
+                          <p class="mt-1">
 
+                            I use one of these vendors for everything.
 
+                            Anything can be accomplished between them and
 
+                            I will recommend each based solely on your project requirements and existing IT infrastructure.
 
+                            Each vendor offers a marketplace of products which can be integrated into your project.
 
+                          </p>
 
+                          <div class="btn-group btn-group-toggle" data-toggle="buttons">
 
+                            <label class="btn btn-light">
 
+                              <a href="https://www.apple.com/business/" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Google Cloud" src="img/vendor-apple.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://azure.microsoft.com/" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Microsoft Azure" src="img/vendor-microsoft.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://cloud.google.com" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Google Cloud" src="img/vendor-google.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://aws.amazon.com" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Amazon Web Services" src="img/vendor-amazon.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://www.akamai.com/" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Google Cloud" src="img/vendor-akamai.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://linode.com" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Linode" src="img/vendor-linode.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://vercel.com" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Linode" src="img/vendor-vercel.svg">
 
+                              </a>
 
+                            </label>
 
+
 
+
 
                           </div>
 
                           </div>
 
                         </div>
 
                         </div>
 
-                        <p class="mt-3 text-small">
 
-                          <small>I use one of these five vendors for everything.
 
-                          Anything can be accomplished between them and
 
-                          I will recommend each based solely on your project requirements and existing IT infrastructure.
 
-                          Each vendor offers a marketplace of products which can be integrated into your project.</small>
 
-                        </p>
 
                       </div>
 
                       </div>
 
+
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
-              </div>
 
-            </div>
 
-          </div>
 
-          <!-- END:Pricing Modal -->
 
+                </div>
 
+
 
+        <!-- END:Pricing Modal -->
 
 
 
-        </div>
 
-      </div>
 
     </div>
 
     </div>
 
   </section>
 
   </section>
 
 
 
@@ -570,10 +574,10 @@
 
         <div class="br-widget">
 
         <div class="br-widget">
 
           <h5>David Windham</h5>
 
           <h5>David Windham</h5>
 
           <address class="mt-3">
 
           <address class="mt-3">
 
-            <a href="https://www.google.com/maps/place/102+Glenridge+Cir,+Greenwood,+SC+29646">102 Glenridge Circle</a><br/>
 
+            <a href="https://www.google.com/maps/place/102+Glenridge+Cir,+Greenwood,+SC+29646">102 Glenridge Circle</a><br>
 
             <a href="https://www.google.com/maps/place/102+Glenridge+Cir,+Greenwood,+SC+29646">Greenwood, South Carolina USA</a>
 
             <a href="https://www.google.com/maps/place/102+Glenridge+Cir,+Greenwood,+SC+29646">Greenwood, South Carolina USA</a>
 
-            <br/>
 
-            <a  target="_blank" href="mailto:&#100;&#097;&#118;&#105;&#100;&#064;&#100;&#097;&#118;&#105;&#100;&#119;&#105;&#110;&#100;&#104;&#097;&#109;&#046;&#099;&#111;&#109">&#100;&#097;&#118;&#105;&#100;&#064;&#100;&#097;&#118;&#105;&#100;&#119;&#105;&#110;&#100;&#104;&#097;&#109;&#046;&#099;&#111;&#109</a><br />
 
+            <br>
 
+            <a target="_blank" href="mailto:&#100;&#097;&#118;&#105;&#100;&#064;&#100;&#097;&#118;&#105;&#100;&#119;&#105;&#110;&#100;&#104;&#097;&#109;&#046;&#099;&#111;&#109;">&#100;&#097;&#118;&#105;&#100;&#064;&#100;&#097;&#118;&#105;&#100;&#119;&#105;&#110;&#100;&#104;&#097;&#109;&#046;&#099;&#111;&#109;</a><br>
 
             <a href="tel:8037123283">+1-803-712-3283</a>
 
             <a href="tel:8037123283">+1-803-712-3283</a>
 
           </address>
 
           </address>
 
         </div>
 
         </div>
 
@@ -584,7 +588,7 @@
 
           <ul class="footer-links">
 
           <ul class="footer-links">
 
             <li><a href="https://davidawindham.com/desk/" rel="me"><i class="bi bi-pencil"></i>&nbsp; Desk / Archive</a></li>          
             <li><a href="https://davidawindham.com/desk/" rel="me"><i class="bi bi-pencil"></i>&nbsp; Desk / Archive</a></li>          
             <li><a href="https://davidawindham.com/til/" rel="me"><i class="bi bi-journal-bookmark"></i>&nbsp; Today I Learned</a></li>
 
             <li><a href="https://davidawindham.com/til/" rel="me"><i class="bi bi-journal-bookmark"></i>&nbsp; Today I Learned</a></li>
 
-            <li><a href="https://davidawindham.com/about/bio" rel="me"><i class="bi bi-person-rolodex"></i>&nbsp; Biography</a></li>
 
+            <li><a href="https://davidawindham.com/about/bio" rel="me"><i class="bi bi-person-lines-fill"></i>&nbsp; Biography</a></li>
 
           </ul>
 
           </ul>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
@@ -592,9 +596,9 @@
 
       <div class="col-lg-2 col-xxs-4 mt-5">
 
       <div class="col-lg-2 col-xxs-4 mt-5">
 
         <div class="br-widget">
 
         <div class="br-widget">
 
           <ul class="footer-links text-lg-end">
 
           <ul class="footer-links text-lg-end">
 
-            <li><a href="https://davidawindham.com/cv/" rel="me"><i class="bi bi-file-earmark-person-fill"></i>&nbsp; CV</a></li>
 
-            <li><a href="https://code.davidawindham.com/" rel="me"><i class="bi bi-journal-code"></i>&nbsp; Code</a></li>
 
-            <li><a href="https://davidwindham.com/davidwindham.asc" rel="me"><i class="bi bi-key"></i>&nbsp; Key</a></li>
 
+            <li><a href="https://davidawindham.com/cv/" rel="me">CV &nbsp;<i class="bi bi-file-pdf"></i></a></li>
 
+            <li><a href="https://code.davidawindham.com/" rel="me">Code &nbsp;<i class="bi bi-file-code"></i></a></li>
 
+            <li><a href="https://davidwindham.com/davidwindham.asc" rel="me">Key &nbsp;<i class="bi bi-file-earmark-lock"></i></a></li>
 
           </ul>
 
           </ul>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
@@ -603,11 +607,11 @@
 
     <div class="footer-end">
 
     <div class="footer-end">
 
       <div class="row">
 
       <div class="row">
 
         <div class="col-md-6 text-md-left">
 
         <div class="col-md-6 text-md-left">
 
-          &copy; 2004-2023<br />
 
+          &copy; 2004-2023<br>
 
           <small>Updated: 11/28/22</small>
 
           <small>Updated: 11/28/22</small>
 
         </div>
 
         </div>
 
         <div class="col-md-6 text-end">
 
         <div class="col-md-6 text-end">
 
-          <ul class="footer-links footer-social list-inline">
 
+          <ul class="footer-links footer-social list-inline">    
             <li class="list-inline-item"><a href="https://en.wikipedia.org/wiki/User:Windhamdavid" class="wikipedia" rel="me"><i class="icon-wikipedia-w"></i></a></li>
 
             <li class="list-inline-item"><a href="https://en.wikipedia.org/wiki/User:Windhamdavid" class="wikipedia" rel="me"><i class="icon-wikipedia-w"></i></a></li>
 
             <li class="list-inline-item"><a href="https://twitter.com/windhamdavid" class="twitter" rel="me"><i class="bi bi-twitter"></i></a></li>
 
             <li class="list-inline-item"><a href="https://twitter.com/windhamdavid" class="twitter" rel="me"><i class="bi bi-twitter"></i></a></li>
 
             <li class="list-inline-item"><a href="https://github.com/windhamdavid" class="github" rel="me"><i class="bi bi-github"></i></a></li>
 
             <li class="list-inline-item"><a href="https://github.com/windhamdavid" class="github" rel="me"><i class="bi bi-github"></i></a></li>

File diff suppressed because it is too large
+ 0 - 0
app/index.min.html/index.html


+ 78 - 152
css/style.css
View File 

@@ -25,7 +25,6 @@ post - https://davidawindham.com/my-website
 
 #########################################*/
 
 #########################################*/
 
 
 
 body {
 
 body {
 
-  position: relative;
 
   margin: 0;
 
   margin: 0;
 
   padding: 0;
 
   padding: 0;
 
   min-height: 100%;
 
   min-height: 100%;
 
@@ -38,7 +37,43 @@ body {
 
   text-rendering: optimizeLegibility;
 
   text-rendering: optimizeLegibility;
 
 }
 
 }
 
      
      
-  
+#backgroundsvg {
 
+  background-image: url('/img/background.svg');
 
+  background-repeat: no-repeat;
 
+  background-position: 0% 0%;
 
+  background-size: cover;
 
+  position: fixed;
 
+  top: 0;
 
+  width: 100vw;
 
+  height: 100vw;
 
+  z-index: -1;
 
+  opacity: .75;
 
+}
 
+#backgroundsvg2 {
 
+  background-image: url('/img/background2.svg');
 
+  background-repeat: no-repeat;
 
+  background-position: 0% 0%;
 
+  background-size: cover;
 
+  position: fixed;
 
+  top: 0;
 
+  width: 100vw;
 
+  height: 100vw;
 
+  z-index: -2;
 
+  opacity: .75;
 
+}
 
+#backgroundsvg3 {
 
+  background-image: url('/img/background3.svg');
 
+  background-repeat: no-repeat;
 
+  background-position: 0% 0%;
 
+  background-size: cover;
 
+  position: fixed;
 
+  top: 0;
 
+  width: 100vw;
 
+  height: 100vw;
 
+  z-index: -3;
 
+  opacity: .75;
 
+}
 
+
 
 
 
 /*########################################
 
 /*########################################
 
 ############## Waypoints #################
 
 ############## Waypoints #################
 
@@ -105,11 +140,6 @@ body {
 
   z-index: 0;
 
   z-index: 0;
 
 }
 
 }
 
 
 
-
 
-/*########################################
 
-################# TYPE ###################
 
-#########################################*/
 
-
 
 /* purgecss start ignore */
 
 /* purgecss start ignore */
 
 [bg=dark-bg] {
 
 [bg=dark-bg] {
 
   color: #9c9ea5;
 
   color: #9c9ea5;
 
@@ -127,10 +157,14 @@ body {
 
 }
 
 }
 
 /* purgecss end ignore */
 
 /* purgecss end ignore */
 
 
 
+/*########################################
 
+################# TYPE ###################
 
+#########################################*/
 
+
 
 h1 {
 
 h1 {
 
   font-family: 'Playfair Display', serif;
 
   font-family: 'Playfair Display', serif;
 
   font-weight: 900;
 
   font-weight: 900;
 
-  font-size: 37px;
 
+  font-size: 2.5em;
 
   letter-spacing: .01em;
 
   letter-spacing: .01em;
 
 }
 
 }
 
 
 
@@ -140,19 +174,20 @@ h1 {
 
 
 
 h2 {
 
 h2 {
 
   font-family: 'Playfair Display', serif;
 
   font-family: 'Playfair Display', serif;
 
-  font-weight: 700;
 
-  font-size: 27px;
 
+  font-weight: 900;
 
+  font-size: 2.3em;
 
+  letter-spacing: .01em;
 
 }
 
 }
 
 
 
 h3 {
 
 h3 {
 
   font-family: 'Playfair Display', serif;
 
   font-family: 'Playfair Display', serif;
 
-  font-weight: 500;
 
-  font-size: 23px;
 
+  font-weight: 700;
 
+  font-size: 1.6em;
 
 }
 
 }
 
 
 
 p {
 
 p {
 
   font-family: 'Montserrat', sans-serif;
 
   font-family: 'Montserrat', sans-serif;
 
-  font-size: 17px;
 
+  font-size: 1.123em;
 
   line-height: 1.2;
 
   line-height: 1.2;
 
 }
 
 }
 
 
 
@@ -166,91 +201,60 @@ a {
 
 }
 
 }
 
 
 
 .lead {
 
 .lead {
 
-  font-size: 1.4rem;
 
+  font-size: 1.4em;
 
 }
 
 }
 
 
 
-.numbering {
 
-  display: inline-block;
 
-  margin-right: .5rem;
 
-  font-size: 12px;
 
-  vertical-align: super;
 
-}
 
-
 
-h5.modal-title {
 
-  color: #535763 !important;
 
-}
 
-
 
-h6.modal {
 
-  color: #535763 !important;
 
+h2.intro {
 
+  font-family: 'Playfair Display', serif;
 
+  font-weight: 900;
 
+  font-size: 37px;
 
+  letter-spacing: .01em;
 
 }
 
 }
 
 
 
-h1.who {
 
-  font-weight: 800;
 
-  margin: 0;
 
-}
 
 
 
-h2.who {
 
-  margin: 0;
 
-  font-size: 20px;
 
-}
 
 
 
-h1.what {
 
+h1.when {
 
   font-weight: 800;
 
   font-weight: 800;
 
   margin: 0;
 
   margin: 0;
 
 }
 
 }
 
 
 
-h2.what {
 
-  margin: 0;
 
-  font-size: 32px;
 
-}
 
-
 
-h1.when {
 
+h2.when {
 
   font-weight: 800;
 
   font-weight: 800;
 
   margin: 0;
 
   margin: 0;
 
+  font-size: 28px;
 
 }
 
 }
 
 
 
-h2.when {
 
+h3.when {
 
   margin: 0;
 
   margin: 0;
 
-  color: #e3e3e3 !important;
 
   font-size: 28px;
 
   font-size: 28px;
 
 }
 
 }
 
 
 
 h4.when {
 
 h4.when {
 
-  font-weight: 600;
 
-  color: #535763 !important;
 
-  font-size: 22px;
 
-}
 
-
 
-h1.why {
 
-  font-weight: 800;
 
-  margin: 0 0 40px 0;
 
+  font-weight: 700;
 
+  font-size: 17px;
 
 }
 
 }
 
 
 
-h2.why {
 
-  margin: 0;
 
-  font-size: 28px;
 
+h4.how {
 
+  color: #535763 !important;
 
 }
 
 }
 
 
 
-.why blockquote {}
 
-
 
-h1.how {
 
-  font-weight: 800;
 
+h5.how {
 
   color: #535763 !important;
 
   color: #535763 !important;
 
-  margin: 0;
 
 }
 
 }
 
 
 
-h2.how {
 
-  margin: 0;
 
+h5.modal-title {
 
   color: #535763 !important;
 
   color: #535763 !important;
 
-  font-size: 28px;
 
 }
 
 }
 
 
 
-h4.how {
 
+h6.modal {
 
   color: #535763 !important;
 
   color: #535763 !important;
 
 }
 
 }
 
 
 
-h5.how {
 
-  color: #535763 !important;
 
+.numbering {
 
+  display: inline-block;
 
+  margin-right: .5rem;
 
+  font-size: 12px;
 
+  vertical-align: super;
 
 }
 
 }
 
 
 
 .services .service .numbering,
 
 .services .service .numbering,
 
@@ -269,6 +273,8 @@ h5.how {
 
   font-size: 70%;
 
   font-size: 70%;
 
 }
 
 }
 
 
 
+
 
+
 
 /*########################################
 
 /*########################################
 
 ################# HEAD ###################
 
 ################# HEAD ###################
 
 #########################################*/
 
 #########################################*/
 
@@ -378,30 +384,6 @@ h5.how {
 
   }
 
   }
 
 }
 
 }
 
 
 
-.dw-header {
 
-  position: fixed;
 
-}
 
-
 
-.dw-header,
 
-.works-header {
 
-  background: #121212;
 
-}
 
-
 
-.dw-header h1 {
 
-  font-family: 'Playfair Display', serif;
 
-  letter-spacing: 0.01rem;
 
-  font-weight: 900;
 
-  font-size: 37px;
 
-  margin: 0;
 
-}
 
-
 
-.dw-header h2,
 
-.works-header h2 {
 
-  letter-spacing: 0.01rem;
 
-  font-weight: normal;
 
-  text-align: left;
 
-  margin: 0;
 
-}
 
 
 
 @media (min-width: 992px) {
 
 @media (min-width: 992px) {
 
   .dw-header h2,
 
   .dw-header h2,
 
@@ -448,7 +430,7 @@ h5.how {
 
 #header .header-ui .brand img {
 
 #header .header-ui .brand img {
 
   width: 200px;
 
   width: 200px;
 
 }
 
 }
 
-
 
+/* purgecss start ignore */
 
 .header-small {
 
 .header-small {
 
   width: 100%;
 
   width: 100%;
 
   position: fixed;
 
   position: fixed;
 
@@ -518,18 +500,16 @@ h5.how {
 
 
 
 .header-small img {
 
 .header-small img {
 
   margin-left: 0px;
 
   margin-left: 0px;
 
-  width: 22px;
 
+  width: 31px;
 
   transition: background-color 0.4s ease;
 
   transition: background-color 0.4s ease;
 
 }
 
 }
 
 
 
 .header-small .light {
 
 .header-small .light {
 
   display: none;
 
   display: none;
 
-  border: 1px solid #e3e3e3;
 
 }
 
 }
 
 
 
 .header-small .dark {
 
 .header-small .dark {
 
   display: inline-block;
 
   display: inline-block;
 
-  border: 1px solid #535763;
 
 }
 
 }
 
 
 
 [bg=dark-bg] .header-small .light {
 
 [bg=dark-bg] .header-small .light {
 
@@ -683,49 +663,12 @@ h5.how {
 
   display: block;
 
   display: block;
 
   margin-top: -2px;
 
   margin-top: -2px;
 
 }
 
 }
 
+/* purgecss end ignore */
 
 
 
 /*########################################
 
 /*########################################
 
 ################# LAYO ###################
 
 ################# LAYO ###################
 
 #########################################*/
 
 #########################################*/
 
 
 
-#backgroundsvg {
 
-  background-image: url('/img/background.svg');
 
-  background-repeat: no-repeat;
 
-  background-position: 0% 0%;
 
-  background-size: cover;
 
-  position: fixed;
 
-  top: 0;
 
-  width: 100vw;
 
-  height: 100vw;
 
-  z-index: -1;
 
-  opacity: .75;
 
-}
 
-#backgroundsvg2 {
 
-  background-image: url('/img/background2.svg');
 
-  background-repeat: no-repeat;
 
-  background-position: 0% 0%;
 
-  background-size: cover;
 
-  position: fixed;
 
-  top: 0;
 
-  width: 100vw;
 
-  height: 100vw;
 
-  z-index: -2;
 
-  opacity: .75;
 
-}
 
-#backgroundsvg3 {
 
-  background-image: url('/img/background3.svg');
 
-  background-repeat: no-repeat;
 
-  background-position: 0% 0%;
 
-  background-size: cover;
 
-  position: fixed;
 
-  top: 0;
 
-  width: 100vw;
 
-  height: 100vw;
 
-  z-index: -3;
 
-  opacity: .75;
 
-}
 
-
 
-
 
 /***************************************************
 
 /***************************************************
 
 .hello {
 
 .hello {
 
   background-image: url('/img/hello.svg') !important;
 
   background-image: url('/img/hello.svg') !important;
 
@@ -749,7 +692,7 @@ h5.how {
 
 
 
 .lead {
 
 .lead {
 
   font-weight: 400;
 
   font-weight: 400;
 
-  line-height: 1.6;
 
+  line-height: 1.5;
 
 }
 
 }
 
 
 
 .hello,
 
 .hello,
 
@@ -764,32 +707,14 @@ h5.how {
 
   position: relative;
 
   position: relative;
 
 }
 
 }
 
 
 
-
 
 .hello {
 
 .hello {
 
   height: 100vh;
 
   height: 100vh;
 
   min-height: 620px;
 
   min-height: 620px;
 
 }
 
 }
 
 
 
-.capabilities {
 
-  padding: 6rem 0;
 
-}
 
-
 
-.capabilities .capabilities-types {
 
-  padding-top: 3rem;
 
-}
 
-
 
 .capabilities ul {
 
 .capabilities ul {
 
   list-style: none;
 
   list-style: none;
 
-  margin: 0 0 3rem 0 !important;
 
-}
 
-
 
-.capabilities li {
 
-  margin: 0 !important;
 
-}
 
-
 
-.capabilities h5,
 
-.capabilities h6 {
 
-  margin-bottom: 0.5rem;
 
+  padding-left: 1rem;
 
 }
 
 }
 
 
 
 .services,
 
 .services,
 
@@ -918,6 +843,7 @@ ul.pricing {
 
 .vendor-image {
 
 .vendor-image {
 
   filter: grayscale(1);
 
   filter: grayscale(1);
 
   width: 100%;
 
   width: 100%;
 
+  height:100px;
 
 }
 
 }
 
 
 
 .vendor-image:hover {
 
 .vendor-image:hover {

+ 7 - 1
gulpfile.js
View File 

@@ -59,7 +59,13 @@ function build(cb) {
 
   gulp.src('index.html')
 
   gulp.src('index.html')
 
     .pipe(useref())
 
     .pipe(useref())
 
     .pipe(gulpif('*.js', terser({ output: {comments: false} })))
 
     .pipe(gulpif('*.js', terser({ output: {comments: false} })))
 
-    .pipe(gulpif('*.css', purgecss({content:['./app/index.html'],safelist:{deep:[/^fc/]}})))
 
+    .pipe(gulpif('*.css', purgecss({
 
+      content:['./app/index.html'],
 
+      safelist:{
 
+        deep:[/^fc/],
 
+        standard: [/accordian*/]
 
+      },
 
+    })))
 
     /* Used Regex here to identify the js elements from the calendar and waypoints */
 
     /* Used Regex here to identify the js elements from the calendar and waypoints */
 
     .pipe(gulpif('*.css', cleanCSS({level: {1: {specialComments: 0}}})))
 
     .pipe(gulpif('*.css', cleanCSS({level: {1: {specialComments: 0}}})))
 
     .pipe(gulp.dest('./app/'));
 
     .pipe(gulp.dest('./app/'));

+ 308 - 304
index.html
View File 

@@ -3,13 +3,13 @@
 
 <head>
 
 <head>
 
 <meta charset="utf-8">
 
 <meta charset="utf-8">
 
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-<meta name="google-site-verification" content="kp06-RPhHu97jLQv5c7nl_jyj3wDwTBIpC_OogW-TFc" />
 
+<meta name="google-site-verification" content="kp06-RPhHu97jLQv5c7nl_jyj3wDwTBIpC_OogW-TFc">
 
 <meta name="description" content="David Windham">
 
 <meta name="description" content="David Windham">
 
 <meta name="author" content="David Windham">
 
 <meta name="author" content="David Windham">
 
 <title>David Windham</title>
 
 <title>David Windham</title>
 
-<meta property="og:title" content="David Windham"/>
 
-<meta property="og:description" content="Something Else"/>
 
-<meta property="og:type" content="website"/><meta property="og:url" content="https://davidwindham.com"/><meta property="og:site_name" content="David Windham"/><meta property="og:image" content="img/og_image.jpg"/><meta property="fb:app_id" content="203136806559589" /><meta name="twitter:site" content="@windhamdavid"><meta name="twitter:creator" content="@windhamdavid"><meta name="twitter:title" content="David Windham"><meta name="twitter:description" content="Something Else"><meta name="twitter:image" content="img/ogt_image.jpg"><meta name="twitter:card" content="summary_large_image"><link rel="apple-touch-icon" sizes="180x180" href="img/icons/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="img/icons/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="img/icons/favicon-16x16.png"><link rel="manifest" href="img/icons/site.webmanifest"><!--<link rel="mask-icon" href="img/icons/safari-pinned-tab.svg" color="#3f3f3f">--><meta name="msapplication-TileColor" content="#000000"><meta name="theme-color" content="#ffffff">
 
+<meta property="og:title" content="David Windham">
 
+<meta property="og:description" content="Something Else">
 
+<meta property="og:type" content="website"><meta property="og:url" content="https://davidwindham.com"><meta property="og:site_name" content="David Windham"><meta property="og:image" content="img/og_image.jpg"><meta property="fb:app_id" content="203136806559589"><meta name="twitter:site" content="@windhamdavid"><meta name="twitter:creator" content="@windhamdavid"><meta name="twitter:title" content="David Windham"><meta name="twitter:description" content="Something Else"><meta name="twitter:image" content="img/ogt_image.jpg"><meta name="twitter:card" content="summary_large_image"><link rel="apple-touch-icon" sizes="180x180" href="img/icons/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="img/icons/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="img/icons/favicon-16x16.png"><link rel="manifest" href="img/icons/site.webmanifest"><!--<link rel="mask-icon" href="img/icons/safari-pinned-tab.svg" color="#3f3f3f">--><meta name="msapplication-TileColor" content="#000000"><meta name="theme-color" content="#ffffff">
 
 <!-- build:css css/dw.css -->
 
 <!-- build:css css/dw.css -->
 
 <link rel="stylesheet" href="css/fullcalendar.css">
 
 <link rel="stylesheet" href="css/fullcalendar.css">
 
 <link rel="stylesheet" href="css/styles.css">
 
 <link rel="stylesheet" href="css/styles.css">
 
@@ -70,7 +70,7 @@
 
 <div id="backgroundsvg3"></div>
 
 <div id="backgroundsvg3"></div>
 
 
 
 <!-- ============================= ** HEADER ** ============================= -->
 
 <!-- ============================= ** HEADER ** ============================= -->
 
-<header id="header" class="header" role="banner">
 
+<header id="header" class="header">
 
   <div class="header-ui">
 
   <div class="header-ui">
 
     <div class="brand--nav text-end">
 
     <div class="brand--nav text-end">
 
       <h1 class="d-none ">David Windham</h1>
 
       <h1 class="d-none ">David Windham</h1>
 
@@ -79,8 +79,8 @@
 
 </header>
 
 </header>
 
 <header class="header-small">
 
 <header class="header-small">
 
   <a href="#header" class="brand">
 
   <a href="#header" class="brand">
 
-    <img class="light" src="img/dw-sm-white.svg" srcset="img/dw-sm-white.svg 2x" alt="David Windham logo"/>
 
-    <img class="dark" src="img/dw-sm.svg" srcset="img/dw-sm.svg 2x" alt="David Windham logo"/>
 
+    <img class="light" src="img/dw-light.svg" srcset="img/dw-light.svg 2x" alt="David Windham logo">
 
+    <img class="dark" src="img/dw-dark.svg" srcset="img/dw-dark.svg 2x" alt="David Windham logo">
 
   </a>
 
   </a>
 
   <button class="hamburger" type="button" aria-label="Open Close Menu">
 
   <button class="hamburger" type="button" aria-label="Open Close Menu">
 
     <span class="hamburger-box">
 
     <span class="hamburger-box">
 
@@ -102,22 +102,22 @@
 
 <main id="main" class="main">
 
 <main id="main" class="main">
 
  <!-- ============================= ** HELLO ** ============================= -->
 
  <!-- ============================= ** HELLO ** ============================= -->
 
   <div id="hello" class="background-color dark" data-dark-bg></div>
 
   <div id="hello" class="background-color dark" data-dark-bg></div>
 
-  <section class="page-view hello dw-header d-flex align-items-center">
 
+  <section class="page-view hello d-flex align-items-center">
 
     <div class="container">
 
     <div class="container">
 
       <div class="row">
 
       <div class="row">
 
 
 
-        <div class="col-lg-5 offset-lg-1">
 
-          <h1 class="mb-4">David A. Windham</h1>
 
+        <div class="col-lg-8 offset-lg-2">
 
+          <h2 class="mb-2">David A. Windham</h2>
 
           <p>( 1973 - )</p>
 
           <p>( 1973 - )</p>
 
-          <h3><i>Welcome Good People of the Internet</i> ✌🏼,</h3>
 
-          <p class="lead">I'm glad you dropped in. I like to create things.
 
-            It'll all started with...
 
+          <h3>Welcome Good People of the Internet,</h3>
 
+          <p class="lead">I'm glad you dropped in. 
+            I've got a computer and I'm fairly clever... 
+            so here you are on the website I made for my business. 
+            The web was inherently social long before the media part,
 
+            so please feel free to test it out.         
           </p>
 
           </p>
 
 
 
         </div>
 
         </div>
 
-        <div class="col col-lg-5 ">
 
-          <img class="float-start" width="100" src="img/ddog.svg" srcset="./img/ddog.svg 2x" alt="David Windham"/>
 
-        </div>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </section>
 
   </section>
 
@@ -127,19 +127,19 @@
 
   <section class="page-view who">
 
   <section class="page-view who">
 
     <div class="container">
 
     <div class="container">
 
       <div class="row">
 
       <div class="row">
 
-        <div class="col-lg-4">
 
-          <img width="400" src="img/dw.svg" srcset="img/dw.svg 2x" alt="David Windham"/>
 
+        <div class="col-lg-3 mt-5">
 
+          <img class="mt-5 float-end" width="100" src="img/ddog.svg" srcset="./img/ddog.svg 2x" alt="David Windham">
 
         </div>
 
         </div>
 
-        <div class="col-lg-7 ps-5 pt-5 mt-5">
 
-          <h1>Who?</h1>
 
+        <div class="col-lg-7 ps-5 pt-5">
 
+          <h2>Who?</h2>
 
           <p class="lead">
 
           <p class="lead">
 
             I've been a web developer for almost 20 years.
 
             I've been a web developer for almost 20 years.
 
-            I have a BA in Studio Art and a minor in Art History from The College of Charleston.
 
+            I have a BA in Studio Art from The College of Charleston.
 
             I've worked in advertising, publishing, education, and an assortment of businesses for clients.
 
             I've worked in advertising, publishing, education, and an assortment of businesses for clients.
 
             I focus on building custom web applications and I treat my development like mechanical works of art.
 
             I focus on building custom web applications and I treat my development like mechanical works of art.
 
-            I try to help folks make good use of the web by crafting custom sites and applications.
 
+            I try to help folks make good use of software and the web by crafting custom applications.
 
           </p>
 
           </p>
 
-          <svg id="signature" x="0px" y="0px" viewBox="0 0 1000 300" width="300">
 
+          <svg class="img-fluid"id="signature" x="0px" y="0px" viewBox="0 0 1000 300" width="300">
 
             <style type="text/css"> .st0{fill:none;stroke:#535763;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;} </style>
 
             <style type="text/css"> .st0{fill:none;stroke:#535763;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;} </style>
 
             <g id="daw">
 
             <g id="daw">
 
               <path class="st0" d="M188.28,63.54l25,148c0,0,4.98,30.96-2,33c-6.86,2-36.28-68.04-76-98c-28.32-21.36-111.67-55.04-112-76 C23,52.5,86.83,33.5,193,33.5c28,0,203.19,7.85,192.28,71.04c-18.28,105.96-251.24,177.92-266,164c-4.28-4.04,187-59,187-59 s20.28-6.22,37.08-11.57c11.16-3.55,14.63-0.47,20.92-5.43c4.87-3.85,4.48-10.62-1-8c-8.28,3.96,9.6,7.13,13,6c6-2,13.92,4.45,18,4 c9-1,8.72-7.96,14-8c5.72-0.04,4.06,4.87,10,5c4.6,0.1,22.6-5.11,28-10c2.65-2.4,3.74-9.43,4-13c0.47-6.31-1.1-18.96-3-25 c-2.25-7.17-11.77-36.08-14-36c-1.9,0.07,1.18,37.4,3,43c2.36,7.24,10.14,35.44,14,42c1.72,2.93,5.26,8.98,8,11c1.72,1.27,8,3,8,3" />
 
               <path class="st0" d="M188.28,63.54l25,148c0,0,4.98,30.96-2,33c-6.86,2-36.28-68.04-76-98c-28.32-21.36-111.67-55.04-112-76 C23,52.5,86.83,33.5,193,33.5c28,0,203.19,7.85,192.28,71.04c-18.28,105.96-251.24,177.92-266,164c-4.28-4.04,187-59,187-59 s20.28-6.22,37.08-11.57c11.16-3.55,14.63-0.47,20.92-5.43c4.87-3.85,4.48-10.62-1-8c-8.28,3.96,9.6,7.13,13,6c6-2,13.92,4.45,18,4 c9-1,8.72-7.96,14-8c5.72-0.04,4.06,4.87,10,5c4.6,0.1,22.6-5.11,28-10c2.65-2.4,3.74-9.43,4-13c0.47-6.31-1.1-18.96-3-25 c-2.25-7.17-11.77-36.08-14-36c-1.9,0.07,1.18,37.4,3,43c2.36,7.24,10.14,35.44,14,42c1.72,2.93,5.26,8.98,8,11c1.72,1.27,8,3,8,3" />
 
@@ -163,21 +163,22 @@
 
 
 
       <div class="col-lg-10 offset-lg-1">
 
       <div class="col-lg-10 offset-lg-1">
 
         <div class="row">
 
         <div class="row">
 
-          <h1 class="what">What?</h1>
 
-          <h2 class="what">My Capabilities</h2>
 
-          <p class="mt-3">
 
-            I like to tell everyone that the only real skill I have is searching for answers on the internet and reading the instructions.
 
-            Although there's certainly a bit of truth in that, I'd say that my two real superpowers are creative thinking and solving challenging technical puzzles.
 
+          <h2>What?</h2>
 
+          
+          <p class="lead">
 
+            Although solving challenging technical puzzles pays the bills,
 
+            I like to say that all I do is search for answers on the internet and read the instructions.
 
             Aside from the list below, I'm also open to booking my time for any sort of research, brain storming, or any other endeavors.
 
             Aside from the list below, I'm also open to booking my time for any sort of research, brain storming, or any other endeavors.
 
           </p>
 
           </p>
 
+          <h3>My Capabilities</h3>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
 
 
-      <div class="row capabilities-types">
 
+      <div class="row mt-2 capabilities">
 
         <div class="col-lg-10 offset-lg-1">
 
         <div class="col-lg-10 offset-lg-1">
 
           <div class="row">
 
           <div class="row">
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Strategy</h5>
 
+              <h5>Strategy</h5>
 
               <ul>
 
               <ul>
 
                 <li>Advertising</li>
 
                 <li>Advertising</li>
 
                 <li>Communication</li>
 
                 <li>Communication</li>
 
@@ -186,7 +187,7 @@
 
               </ul>
 
               </ul>
 
             </div>
 
             </div>
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Front End</h5>
 
+              <h5>Front End</h5>
 
               <ul>
 
               <ul>
 
                 <li>HTML / CSS</li>
 
                 <li>HTML / CSS</li>
 
                 <li>Javascript ES6 / ES5</li>
 
                 <li>Javascript ES6 / ES5</li>
 
@@ -195,7 +196,7 @@
 
               </ul>
 
               </ul>
 
             </div>
 
             </div>
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Dev-Ops</h5>
 
+              <h5>Dev-Ops</h5>
 
               <ul>
 
               <ul>
 
                 <li>Build Automation</li>
 
                 <li>Build Automation</li>
 
                 <li>Continuous Integration</li>
 
                 <li>Continuous Integration</li>
 
@@ -206,7 +207,7 @@
 
           </div>
 
           </div>
 
           <div class="row">
 
           <div class="row">
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Design</h5>
 
+              <h5>Design</h5>
 
               <ul>
 
               <ul>
 
                 <li>Graphic</li>
 
                 <li>Graphic</li>
 
                 <li>Illustration</li>
 
                 <li>Illustration</li>
 
@@ -216,7 +217,7 @@
 
               </ul>
 
               </ul>
 
             </div>
 
             </div>
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Back End</h5>
 
+              <h5>Back End</h5>
 
               <ul>
 
               <ul>
 
                 <li>Go / Gorilla / Dart / Flutter</li>
 
                 <li>Go / Gorilla / Dart / Flutter</li>
 
                 <li>Node / Express / Meteor</li>
 
                 <li>Node / Express / Meteor</li>
 
@@ -226,7 +227,7 @@
 
               </ul>
 
               </ul>
 
             </div>
 
             </div>
 
             <div class="col-md-4">
 
             <div class="col-md-4">
 
-              <h5 class="text-decoration-underline">Sys-Admin</h5>
 
+              <h5>Sys-Admin</h5>
 
               <ul>
 
               <ul>
 
                 <li>Amazon / Google Services</li>
 
                 <li>Amazon / Google Services</li>
 
                 <li>Ansible / Docker / Kubernetes</li>
 
                 <li>Ansible / Docker / Kubernetes</li>
 
@@ -244,136 +245,130 @@
 
 <!-- ============================= ** WHEN ** ============================= -->
 
 <!-- ============================= ** WHEN ** ============================= -->
 
 
 
   <div id="when" class="background-color light"></div>
 
   <div id="when" class="background-color light"></div>
 
-      <section class="page-view when">
 
-        <div class="container">
 
-          <div class="row">
 
-            <div class="col-lg-10 offset-lg-1">
 
-              <h1 class="when">When &amp; Where?</h1>
 
-            </div>
 
+  <section class="page-view when">
 
+    <div class="container">
 
+      <div class="row">
 
+        <div class="col-lg-10 offset-lg-1">
 
+          <h2 class="when">When &amp; Where?</h2>
 
+        </div>
 
+      </div>
 
+      <div class="row">
 
+        <div class="col-lg-3 offset-md-1">
 
+          <div class="row mt-5">
 
+            <h4 class="when">Request My Time</h4>
 
+            <p>I book hourly sessions regularly and I overlap projects in an effort to keep my schedule full.</p>
 
+            <br>
 
           </div>
 
           </div>
 
           <div class="row">
 
           <div class="row">
 
-            <div class="col-lg-3 offset-md-1">
 
-              <div class="row mt-5">
 
-                <h4 class="when">Request My Time</h4>
 
-                <p>I book hourly sessions regularly and I overlap projects in an effort to keep my schedule full.</p>
 
-                <br />
 
-              </div>
 
-              <div class="row">
 
-                <h4 class="when">I Work Anywhere</h4>
 
-                <p>Although video chats are nice, I enjoy meeting in person too. I travel out of the Greenville or Charlotte International Airports.</p>
 
-              </div>
 
-            </div>
 
-            <div class="col-lg-7">
 
-              <div id='calendar'></div>
 
-            </div>
 
+            <h4 class="when mt-2">I Work Anywhere</h4>
 
+            <p>Although video chats are nice, I enjoy meeting in person too. I travel out of the Greenville or Charlotte International Airports.</p>
 
           </div>
 
           </div>
 
         </div>
 
         </div>
 
+        <div class="col-lg-7">
 
+          <div id='calendar'></div>
 
+        </div>
 
       </div>
 
       </div>
 
-    </section>
 
+    </div>
 
+  </section>
 
 
 
 <!-- ============================= ** WHY ** ============================= -->
 
 <!-- ============================= ** WHY ** ============================= -->
 
   <div id="why" class="background-color dark" data-dark-bg></div>
 
   <div id="why" class="background-color dark" data-dark-bg></div>
 
-    <div class="page-view why testimonials-section">
 
-      <div class="container">
 
-        <div class="row">
 
-          <div class="col-lg-1 offset-md-1">
 
-            <h1 class="why">Why?</h1>
 
-          </div>
 
+  <section class="page-view why testimonials-section">
 
+    <div class="container">
 
+      <div class="row mb-3">
 
+        <div class="col-lg-1 offset-md-1">
 
+          <h2 class="why">Why?</h2>
 
         </div>
 
         </div>
 
-        <div class="row">
 
-          <div class="col-lg-1 offset-md-1">
 
-            <div class="indicators"></div>
 
-          </div>
 
-          <div class="col-lg-9">
 
-            <figure class="br-testimonial showing">
 
-                <h5>Selected Clients:</h5>
 
-                <div class="row">
 
-                  <div class="col-md-6">
 
-                    <ul>
 
-                      <li>Use All Five Inc. – Los Angeles, CA</li>
 
-                      <li>The Rivers Agency – Chapel Hill, NC</li>
 
-                      <li>Charleston Home Tour - Charleston, SC</li>
 
-                      <li>AJ Design Co. - Abbeville, SC</li>
 
-                      <li>Fuzzco - Charleston, SC &amp; Portland, OR</li>
 
-                      <li>Harbourtowne Real Estate - Charleston, SC</li>
 
-                      <li>Charleston Trident Association of Realtors</li>
 
-                      <li>The College of Charleston - Charleston, SC</li>
 
-                      <li>Blue Ridge Electric Cooperative – Pickens, SC;</li>
 
-                      <li>Self Regional Healthcare – Greenwood, SC</li>
 
-                      <li>Biotherm Solutions - Cotari, CA</li>
 
-                    </ul>
 
-                  </div>
 
-                  <div class="col-md-6">
 
-                    <ul>
 
-                      <li>Pennebaker & Hegedus Films – New York, NY</li>
 
-                      <li>Good and Plenty Records – New Orleans, LA</li>
 
-                      <li>Jerry Moran – New Orleans, LA</li>
 
-                      <li>Holy City Farms - Charleston, SC</li>
 
-                      <li>Harvard Kennedy School of Education – Boston, MA;</li>
 
-                      <li>Clemson University – Clemson, SC;</li>
 
-                      <li>The Chelcum Family Foundation – Madison, WI</li>
 
-                      <li>Morris Publishing – Augusta, GA</li>
 
-                      <li>The State Newspaper - Columbia, SC</li>
 
-                      <li>GMK Associates – Columbia, SC</li>
 
-                      <li>Nicholson, Meredith, & Anderson - Greenwood, SC</li>
 
-                    </ul>
 
-                  </div>
 
+      </div>
 
+      <div class="row">
 
+        <div class="col-lg-1 offset-md-1">
 
+          <div class="indicators"></div>
 
+        </div>
 
+        <div class="col-lg-9">
 
+          <figure class="br-testimonial showing">
 
+              <h5>Selected Clients:</h5>
 
+              <div class="row">
 
+                <div class="col-md-6">
 
+                  <ul>
 
+                    <li>Use All Five Inc. – Los Angeles, CA</li>
 
+                    <li>The Rivers Agency – Chapel Hill, NC</li>
 
+                    <li>Charleston Home Tour - Charleston, SC</li>
 
+                    <li>AJ Design Co. - Abbeville, SC</li>
 
+                    <li>Fuzzco - Charleston, SC &amp; Portland, OR</li>
 
+                    <li>Harbourtowne Real Estate - Charleston, SC</li>
 
+                    <li>Charleston Trident Association of Realtors</li>
 
+                    <li>The College of Charleston - Charleston, SC</li>
 
+                    <li>Blue Ridge Electric Cooperative – Pickens, SC;</li>
 
+                    <li>Self Regional Healthcare – Greenwood, SC</li>
 
+                    <li>Biotherm Solutions - Cotari, CA</li>
 
+                  </ul>
 
                 </div>
 
                 </div>
 
-            </figure>
 
-
 
-            <figure class="br-testimonial">
 
-              <blockquote>
 
-                "<strong>David has been a pleasure to work with</strong>.
 
-                His patient leadership on project made it very easy on us.
 
-                He has been very flexible in accomodating our requests.
 
-                In less than two months we had a product ready for launch. David's persistent
 
-                support throughout development and launch was fast and consistent; This
 
-                project would have been impossible without him"
 
-              </blockquote>
 
-              <figcaption>
 
-                <cite>pending approval</cite>
 
-                pending approval<br />
 
-                New York, NY
 
-              </figcaption>
 
-            </figure>
 
-
 
-            <figure class="br-testimonial">
 
-              <blockquote>
 
-                "David has always been creative.
 
-                I remember him taking apart all of the electronics in our house and never putting them back together.
 
-                <strong>It makes me very happy to see him doing something I know he enjoys!</strong>"
 
-              </blockquote>
 
-              <figcaption>
 
-                <cite>~ My Mom</cite>
 
-              </figcaption>
 
-            </figure>
 
-
 
-            <figure class="br-testimonial">
 
-              <blockquote>
 
-                "David worked remotely to help build and launch a client project and in less than three months we had a product ready for launch.
 
-                David's persistent support throughout development and launch was fast and consistent; <strong>This
 
-                project would have been impossible without him</strong>"
 
-              </blockquote>
 
-              <figcaption>
 
-                <cite>waiting on approval</cite>
 
-                Los Angeles, CA<br />
 
-              </figcaption>
 
-            </figure>
 
-
 
-            <figure class="br-testimonial">
 
-              <blockquote>
 
-                "Good developers can be difficult to find, but David is amazing! He’s an
 
-                <strong>expert developer who works quickly</strong> and ultimately delivered an app that
 
-                exceeded my expectations. I would definitely work with him again."
 
-              </blockquote>
 
-              <figcaption>
 
-                <cite>waiting on approval</cite>
 
-                Communications Director <br />
 
-                Greenwood, SC
 
-              </figcaption>
 
-            </figure>
 
+                <div class="col-md-6">
 
+                  <ul>
 
+                    <li>Pennebaker & Hegedus Films – New York, NY</li>
 
+                    <li>Good and Plenty Records – New Orleans, LA</li>
 
+                    <li>Jerry Moran – New Orleans, LA</li>
 
+                    <li>Holy City Farms - Charleston, SC</li>
 
+                    <li>Harvard Kennedy School of Education – Boston, MA;</li>
 
+                    <li>Clemson University – Clemson, SC;</li>
 
+                    <li>The Chelcum Family Foundation – Madison, WI</li>
 
+                    <li>Morris Publishing – Augusta, GA</li>
 
+                    <li>The State Newspaper - Columbia, SC</li>
 
+                    <li>GMK Associates – Columbia, SC</li>
 
+                    <li>Nicholson, Meredith, & Anderson - Greenwood, SC</li>
 
+                  </ul>
 
+                </div>
 
+              </div>
 
+          </figure>
 
+          <figure class="br-testimonial">
 
+            <blockquote>
 
+              "<strong>David has been a pleasure to work with</strong>.
 
+              His patient leadership on project made it very easy on us.
 
+              He has been very flexible in accomodating our requests.
 
+              In less than two months we had a product ready for launch. David's persistent
 
+              support throughout development and launch was fast and consistent; This
 
+              project would have been impossible without him"
 
+            </blockquote>
 
+            <figcaption>
 
+              <cite>pending approval</cite>
 
+              pending approval<br>
 
+              New York, NY
 
+            </figcaption>
 
+          </figure>
 
+          <figure class="br-testimonial">
 
+            <blockquote>
 
+              "David has always been creative.
 
+              I remember him taking apart all of the electronics in our house and never putting them back together.
 
+              <strong>It makes me very happy to see him doing something I know he enjoys!</strong>"
 
+            </blockquote>
 
+            <figcaption>
 
+              <cite>~ My Mom</cite>
 
+            </figcaption>
 
+          </figure>
 
+          <figure class="br-testimonial">
 
+            <blockquote>
 
+              "David worked remotely to help build and launch a client project and in less than three months we had a product ready for launch.
 
+              David's persistent support throughout development and launch was fast and consistent; <strong>This
 
+              project would have been impossible without him</strong>"
 
+            </blockquote>
 
+            <figcaption>
 
+              <cite>waiting on approval</cite>
 
+              Los Angeles, CA<br>
 
+            </figcaption>
 
+          </figure>
 
+          <figure class="br-testimonial">
 
+            <blockquote>
 
+              "Good developers can be difficult to find, but David is amazing! He’s an
 
+              <strong>expert developer who works quickly</strong> and ultimately delivered an app that
 
+              exceeded my expectations. I would definitely work with him again."
 
+            </blockquote>
 
+            <figcaption>
 
+              <cite>waiting on approval</cite>
 
+              Communications Director <br>
 
+              Greenwood, SC
 
+            </figcaption>
 
+          </figure>
 
         </div>
 
         </div>
 
-
 
         <div class="col-lg-1 next-wrapper">
 
         <div class="col-lg-1 next-wrapper">
 
           <div class="next-testimonial">
 
           <div class="next-testimonial">
 
             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 129 129" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 129 129">
 
             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 129 129" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 129 129">
 
@@ -383,183 +378,192 @@
 
           </div>
 
           </div>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
-
 
-
 
     </div>
 
     </div>
 
-  </div>
 
+  </section>
 
 
 
 <!-- ============================= ** HOW ** ============================= -->
 
 <!-- ============================= ** HOW ** ============================= -->
 
   <div id="how" class="background-color light"></div>
 
   <div id="how" class="background-color light"></div>
 
-    <section class="page-view services">
 
-      <div class="container">
 
+  <section class="page-view services">
 
+    <div class="container">
 
 
 
-        <div class="row services-title">
 
-          <div class="col-lg-5 offset-md-1">
 
-            <h1 class="how">&amp; How</h1>
 
-            <h2 class="how mb-5">Can I Help?</h2>
 
-            <p class="lead"></p>
 
-          </div>
 
+      <div class="row services-title">
 
+        <div class="col-lg-5 offset-md-1">
 
+          <h2 class="how">&amp; How</h2>
 
+          <h3 class="how mb-5">Can I Help?</h3>
 
+          <p class="lead"></p>
 
         </div>
 
         </div>
 
+      </div>
 
 
 
-        <div class="row">
 
-          <div class="col-lg-5 offset-md-1">
 
+      <div class="row">
 
+        <div class="col-lg-5 offset-md-1">
 
+          <div class="service">
 
+            <i class="pulse"><span></span></i>
 
+            <div class="numbering">01</div>
 
+            <h4 class="how">Create, Build, &amp; Host</h4>
 
+            <p>a new web site or application.</p>
 
+          </div>
 
+          <div class="service">
 
+            <i class="pulse">
 
+            <span></span>
 
+            <span></span>
 
+            </i>
 
+            <div class="numbering">02</div>
 
+              <h4 class="how">Audit, Improve, &amp; Repair</h4>
 
+              <p>an existing web site or application.</p>
 
+            </div>
 
             <div class="service">
 
             <div class="service">
 
-              <i class="pulse"><span></span></i>
 
-              <div class="numbering">01</div>
 
-              <h4 class="how">Create, Build, &amp; Host</h4>
 
-              <p>a new web site or application.</p>
 
+              <i class="pulse">
 
+                <span></span>
 
+                <span></span>
 
+                <span></span>
 
+              </i>
 
+              <div class="numbering">03</div>
 
+              <h4 class="how">Advise, Consult, &amp; Review</h4>
 
+              <p>on web site and application best practices.</p>
 
             </div>
 
             </div>
 
             <div class="service">
 
             <div class="service">
 
               <i class="pulse">
 
               <i class="pulse">
 
-              <span></span>
 
-              <span></span>
 
+                <span></span>
 
+                <span></span>
 
+                <span></span>
 
+                <span></span>
 
               </i>
 
               </i>
 
-              <div class="numbering">02</div>
 
-                <h4 class="how">Audit, Improve, &amp; Repair</h4>
 
-                <p>an existing web site or application.</p>
 
-              </div>
 
-              <div class="service">
 
-                <i class="pulse">
 
-                  <span></span>
 
-                  <span></span>
 
-                  <span></span>
 
-                </i>
 
-                <div class="numbering">03</div>
 
-                <h4 class="how">Advise, Consult, &amp; Review</h4>
 
-                <p>on web site and application best practices.</p>
 
-              </div>
 
-              <div class="service">
 
-                <i class="pulse">
 
-                  <span></span>
 
-                  <span></span>
 
-                  <span></span>
 
-                  <span></span>
 
-                </i>
 
-              </div>
 
             </div>
 
             </div>
 
-            <div class="col-lg-5 offset-lg-1">
 
-              <div class="row step">
 
-                <div class="approach-step">
 
-                  <h4 class="how">Tailored</h4>
 
-                  <p>
 
-                    I can help you succeed online because of my experience, enthusiasm, and commitment to personal service.
 
-                    I tailor my approach to the unique requirements of each project
 
-                    in an effort create sustainable and practical applications that work for you.
 
-                    Have a project in mind?
 
-                  </p>
 
-                  <button type="button" class="btn btn-dark mt-1" data-bs-toggle="modal" data-bs-target="#pricing-modal">
 
-                    Pricing &amp; Cost
 
-                  </button>
 
-                  <button type="button" class="btn btn-dark mt-1">
 
-                    <a class="text-light" href="mailto:&#100;&#097;&#118;&#105;&#100;&#064;&#100;&#097;&#118;&#105;&#100;&#119;&#105;&#110;&#100;&#104;&#097;&#109;&#046;&#099;&#111;&#109;">Email</a>
 
-                  </button>
 
-                </div>
 
+          </div>
 
+          <div class="col-lg-5">
 
+            <div class="row step">
 
+              <div class="approach-step">
 
+                <h4 class="how">Tailored</h4>
 
+                <p>
 
+                  I can help you succeed online because of my experience, enthusiasm, and commitment to personal service.
 
+                  I tailor my approach to the unique requirements of each project
 
+                  in an effort create sustainable and practical applications that work for you.
 
+                  Have a project in mind?
 
+                </p>
 
+                <a class="btn btn-outline-dark mt-1" data-bs-toggle="collapse" data-bs-target="#pricing" aria-expanded="true" aria-controls="collapseOne"">
 
+                  Pricing &amp; Cost
 
+                </a>
 
               </div>
 
               </div>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
 
+        </div>
 
 
 
-          <!-- Pricing Modal -->
 
-          <div class="modal fade" id="pricing-modal" tabindex="-1" role="dialog" aria-labelledby="pricing-modal" aria-hidden="true">
 
-            <div class="modal-dialog modal-lg" role="document">
 
-              <div class="modal-content">
 
-                <div class="modal-body">
 
-                  <div class="container-fluid">
 
-                    <button type="button" class="btn-close float-end" data-bs-dismiss="modal" aria-label="Close"></button>
 
-                    <h3 class="modal-title font-weight-bold">Pricing &amp; Costs</h3>
 
-                    <div class="row">
 
-                      <div class="col-md-12">
 
-                        <h6 class="font-weight-bold mt-4">Approach:</h6>
 
+        <!-- Pricing Modal -->
 
+
 
+                <div id="pricing" class="container accordion-collapse collapse">
 
+                <div class="col-lg-10 offset-md-1">
 
+                  
+                  <h3>Pricing &amp; Costs</h3>
 
+                  <div class="row">
 
+                    <div class="col-md-12">
 
+                      <div class="row">
 
+                        <div class="col-md-6">
 
+                        <h6 class="fw-bold mt-2">Approach:</h6>
 
                         <p class="mt-1">
 
                         <p class="mt-1">
 
                           I have a "take care of it" approach to client services.
 
                           I have a "take care of it" approach to client services.
 
                           I manage, host, and maintain everything I build or install for the lifespan of the project.
 
                           I manage, host, and maintain everything I build or install for the lifespan of the project.
 
                           I focus on my core competencies and will recommend other providers when the scope of your project falls outside of them.
 
                           I focus on my core competencies and will recommend other providers when the scope of your project falls outside of them.
 
                           I provide several basic levels of monthly support based on the scale and maintenance needs of your project.
 
                           I provide several basic levels of monthly support based on the scale and maintenance needs of your project.
 
                         </p>
 
                         </p>
 
-                        <h6 class="font-weight-bold mt-4">Advantages:</h6>
 
+                        </div>
 
+                        <div class="col-md-6">
 
+                        <h6 class="fw-bold mt-2">Advantages:</h6>
 
                         <p class="mt-1">
 
                         <p class="mt-1">
 
                           I take care of ALL of it for you so there are no confusing automated reminders, renewals, and upgrade emails coming from your software or upstream providers.
 
                           I take care of ALL of it for you so there are no confusing automated reminders, renewals, and upgrade emails coming from your software or upstream providers.
 
                           I offer sensible consulting based on your goals.
 
                           I offer sensible consulting based on your goals.
 
                           I provide a single point of contact for consolidated billing, development, and support.
 
                           I provide a single point of contact for consolidated billing, development, and support.
 
                         </p>
 
                         </p>
 
-                        <h6 class="font-weight-bold mt-4">Rates:</h6>
 
-                        <div class="row">
 
-                          <div class="col-md-4">
 
-                            <h6>Hourly: $50</h6>
 
-                            <ul class="pricing">
 
-                              <li>Design</li>
 
-                              <li>Development</li>
 
-                              <li>Consulting</li>
 
-                              <li>Auditing</li>
 
-                            </ul>
 
-                          </div>
 
-                          <div class="col-md-4">
 
-                            <h6>Monthly: $25 - $75</h6>
 
-                            <ul class="pricing">
 
-                              <li>Support</li>
 
-                              <li>Managed Hosting</li>
 
-                              <li>Regular Maintence</li>
 
-                              <li>Regular Upgrades</li>
 
-                            </ul>
 
-                          </div>
 
-                          <div class="col-md-4">
 
-                            <h6>Add-ons:(vendor pricing)</h6>
 
-                            <ul class="pricing">
 
-                              <li>G Suite</li>
 
-                              <li>Office 365</li>
 
-                              <li>SaaS Integration</li>
 
-                              <li>API Integration</li>
 
-                            </ul>
 
-                          </div>
 
                         </div>
 
                         </div>
 
-                        <h6 class="font-weight-bold mt-4">Vendors:</h6>
 
-                        <div class="row text-center">
 
-                          <div class="col-md-12">
 
-                            <div class="btn-group btn-group-toggle" data-toggle="buttons">
 
-                              <label class="btn btn-light">
 
-                                <a href="https://cloud.google.com" target="_blank" rel="noopener">
 
-                                  <img class="vendor-image" src="img/vendor-google.png">
 
-                                </a>
 
-                              </label>
 
-                              <label class="btn btn-light">
 
-                                <a href="https://linode.com" target="_blank" rel="noopener">
 
-                                <img class="vendor-image" src="img/vendor-linode.png">
 
-                                </a>
 
-                              </label>
 
-                              <label class="btn btn-light">
 
-                                <a href="https://kinsta.com" target="_blank" rel="noopener">
 
-                                <img class="vendor-image" src="img/vendor-kinsta.png">
 
-                                </a>
 
-                              </label>
 
-                              <label class="btn btn-light">
 
-                                <a href="https://aws.amazon.com" target="_blank" rel="noopener">
 
-                                <img class="vendor-image" src="img/vendor-amazon.png">
 
-                                </a>
 
-                              </label>
 
-                              <label class="btn btn-light">
 
-                                <a href="https://azure.microsoft.com/" target="_blank" rel="noopener">
 
-                                <img class="vendor-image" src="img/vendor-microsoft.png">
 
-                                </a>
 
-                              </label>
 
-                            </div>
 
+                      </div>
 
+
 
+                      <h6 class="fw-bold mt-2">Rates:</h6>
 
+                      <div class="row">
 
+                        <div class="col-md-4">
 
+                          <h6>Hourly: $50</h6>
 
+                          <ul class="pricing">
 
+                            <li>Design</li>
 
+                            <li>Development</li>
 
+                            <li>Consulting</li>
 
+                            <li>Auditing</li>
 
+                          </ul>
 
+                        </div>
 
+                        <div class="col-md-4">
 
+                          <h6>Monthly: $25 - $75</h6>
 
+                          <ul class="pricing">
 
+                            <li>Support</li>
 
+                            <li>Managed Hosting</li>
 
+                            <li>Regular Maintence</li>
 
+                            <li>Regular Upgrades</li>
 
+                          </ul>
 
+                        </div>
 
+                        <div class="col-md-4">
 
+                          <h6>Add-ons:(vendor pricing)</h6>
 
+                          <ul class="pricing">
 
+                            <li>G Suite</li>
 
+                            <li>Office 365</li>
 
+                            <li>SaaS Integration</li>
 
+                            <li>API Integration</li>
 
+                          </ul>
 
+                        </div>
 
+                      </div>
 
+                      <h6 class="fw-bold mt-4">Vendors:</h6>
 
+                      <div class="row">
 
+                        <div class="col-md-12">
 
+                          <p class="mt-1">
 
+                            I use one of these vendors for everything.
 
+                            Anything can be accomplished between them and
 
+                            I will recommend each based solely on your project requirements and existing IT infrastructure.
 
+                            Each vendor offers a marketplace of products which can be integrated into your project.
 
+                          </p>
 
+                          <div class="btn-group btn-group-toggle" data-toggle="buttons">
 
+                            <label class="btn btn-light">
 
+                              <a href="https://www.apple.com/business/" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Google Cloud" src="img/vendor-apple.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://azure.microsoft.com/" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Microsoft Azure" src="img/vendor-microsoft.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://cloud.google.com" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Google Cloud" src="img/vendor-google.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://aws.amazon.com" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Amazon Web Services" src="img/vendor-amazon.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://www.akamai.com/" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Google Cloud" src="img/vendor-akamai.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://linode.com" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Linode" src="img/vendor-linode.svg">
 
+                              </a>
 
+                            </label>
 
+                            <label class="btn btn-light">
 
+                              <a href="https://vercel.com" target="_blank" rel="noopener">
 
+                                <img class="vendor-image" alt="Linode" src="img/vendor-vercel.svg">
 
+                              </a>
 
+                            </label>
 
+
 
+
 
                           </div>
 
                           </div>
 
                         </div>
 
                         </div>
 
-                        <p class="mt-3 text-small">
 
-                          <small>I use one of these five vendors for everything.
 
-                          Anything can be accomplished between them and
 
-                          I will recommend each based solely on your project requirements and existing IT infrastructure.
 
-                          Each vendor offers a marketplace of products which can be integrated into your project.</small>
 
-                        </p>
 
                       </div>
 
                       </div>
 
+
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
-              </div>
 
-            </div>
 
-          </div>
 
-          <!-- END:Pricing Modal -->
 
+                </div>
 
+
 
+        <!-- END:Pricing Modal -->
 
 
 
-        </div>
 
-      </div>
 
     </div>
 
     </div>
 
   </section>
 
   </section>
 
 
 
@@ -574,10 +578,10 @@
 
         <div class="br-widget">
 
         <div class="br-widget">
 
           <h5>David Windham</h5>
 
           <h5>David Windham</h5>
 
           <address class="mt-3">
 
           <address class="mt-3">
 
-            <a href="https://www.google.com/maps/place/102+Glenridge+Cir,+Greenwood,+SC+29646">102 Glenridge Circle</a><br/>
 
+            <a href="https://www.google.com/maps/place/102+Glenridge+Cir,+Greenwood,+SC+29646">102 Glenridge Circle</a><br>
 
             <a href="https://www.google.com/maps/place/102+Glenridge+Cir,+Greenwood,+SC+29646">Greenwood, South Carolina USA</a>
 
             <a href="https://www.google.com/maps/place/102+Glenridge+Cir,+Greenwood,+SC+29646">Greenwood, South Carolina USA</a>
 
-            <br/>
 
-            <a  target="_blank" href="mailto:&#100;&#097;&#118;&#105;&#100;&#064;&#100;&#097;&#118;&#105;&#100;&#119;&#105;&#110;&#100;&#104;&#097;&#109;&#046;&#099;&#111;&#109">&#100;&#097;&#118;&#105;&#100;&#064;&#100;&#097;&#118;&#105;&#100;&#119;&#105;&#110;&#100;&#104;&#097;&#109;&#046;&#099;&#111;&#109</a><br />
 
+            <br>
 
+            <a target="_blank" href="mailto:&#100;&#097;&#118;&#105;&#100;&#064;&#100;&#097;&#118;&#105;&#100;&#119;&#105;&#110;&#100;&#104;&#097;&#109;&#046;&#099;&#111;&#109;">&#100;&#097;&#118;&#105;&#100;&#064;&#100;&#097;&#118;&#105;&#100;&#119;&#105;&#110;&#100;&#104;&#097;&#109;&#046;&#099;&#111;&#109;</a><br>
 
             <a href="tel:8037123283">+1-803-712-3283</a>
 
             <a href="tel:8037123283">+1-803-712-3283</a>
 
           </address>
 
           </address>
 
         </div>
 
         </div>
 
@@ -588,7 +592,7 @@
 
           <ul class="footer-links">
 
           <ul class="footer-links">
 
             <li><a href="https://davidawindham.com/desk/" rel="me"><i class="bi bi-pencil"></i>&nbsp; Desk / Archive</a></li>          
             <li><a href="https://davidawindham.com/desk/" rel="me"><i class="bi bi-pencil"></i>&nbsp; Desk / Archive</a></li>          
             <li><a href="https://davidawindham.com/til/" rel="me"><i class="bi bi-journal-bookmark"></i>&nbsp; Today I Learned</a></li>
 
             <li><a href="https://davidawindham.com/til/" rel="me"><i class="bi bi-journal-bookmark"></i>&nbsp; Today I Learned</a></li>
 
-            <li><a href="https://davidawindham.com/about/bio" rel="me"><i class="bi bi-person-rolodex"></i>&nbsp; Biography</a></li>
 
+            <li><a href="https://davidawindham.com/about/bio" rel="me"><i class="bi bi-person-lines-fill"></i>&nbsp; Biography</a></li>
 
           </ul>
 
           </ul>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
@@ -596,9 +600,9 @@
 
       <div class="col-lg-2 col-xxs-4 mt-5">
 
       <div class="col-lg-2 col-xxs-4 mt-5">
 
         <div class="br-widget">
 
         <div class="br-widget">
 
           <ul class="footer-links text-lg-end">
 
           <ul class="footer-links text-lg-end">
 
-            <li><a href="https://davidawindham.com/cv/" rel="me"><i class="bi bi-file-earmark-person-fill"></i>&nbsp; CV</a></li>
 
-            <li><a href="https://code.davidawindham.com/" rel="me"><i class="bi bi-journal-code"></i>&nbsp; Code</a></li>
 
-            <li><a href="https://davidwindham.com/davidwindham.asc" rel="me"><i class="bi bi-key"></i>&nbsp; Key</a></li>
 
+            <li><a href="https://davidawindham.com/cv/" rel="me">CV &nbsp;<i class="bi bi-file-pdf"></i></a></li>
 
+            <li><a href="https://code.davidawindham.com/" rel="me">Code &nbsp;<i class="bi bi-file-code"></i></a></li>
 
+            <li><a href="https://davidwindham.com/davidwindham.asc" rel="me">Key &nbsp;<i class="bi bi-file-earmark-lock"></i></a></li>
 
           </ul>
 
           </ul>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
@@ -607,11 +611,11 @@
 
     <div class="footer-end">
 
     <div class="footer-end">
 
       <div class="row">
 
       <div class="row">
 
         <div class="col-md-6 text-md-left">
 
         <div class="col-md-6 text-md-left">
 
-          &copy; 2004-2023<br />
 
+          &copy; 2004-2023<br>
 
           <small>Updated: 11/28/22</small>
 
           <small>Updated: 11/28/22</small>
 
         </div>
 
         </div>
 
         <div class="col-md-6 text-end">
 
         <div class="col-md-6 text-end">
 
-          <ul class="footer-links footer-social list-inline">
 
+          <ul class="footer-links footer-social list-inline">    
             <li class="list-inline-item"><a href="https://en.wikipedia.org/wiki/User:Windhamdavid" class="wikipedia" rel="me"><i class="icon-wikipedia-w"></i></a></li>
 
             <li class="list-inline-item"><a href="https://en.wikipedia.org/wiki/User:Windhamdavid" class="wikipedia" rel="me"><i class="icon-wikipedia-w"></i></a></li>
 
             <li class="list-inline-item"><a href="https://twitter.com/windhamdavid" class="twitter" rel="me"><i class="bi bi-twitter"></i></a></li>
 
             <li class="list-inline-item"><a href="https://twitter.com/windhamdavid" class="twitter" rel="me"><i class="bi bi-twitter"></i></a></li>
 
             <li class="list-inline-item"><a href="https://github.com/windhamdavid" class="github" rel="me"><i class="bi bi-github"></i></a></li>
 
             <li class="list-inline-item"><a href="https://github.com/windhamdavid" class="github" rel="me"><i class="bi bi-github"></i></a></li>

+ 1 - 0
js/_init.js
View File 

@@ -33,6 +33,7 @@ window.onload = function () {
 
   why();
 
   why();
 
 };
 
 };
 
 
 
+
 
 function header() {
 
 function header() {
 
   var $window = $(window),
 
   var $window = $(window),
 
   $smallHeader = $('.header-small'),
 
   $smallHeader = $('.header-small'),

Some files were not shown because too many files changed in this diff