make social icons darken on hover

_includes/header.html

@@ -8,14 +8,14 @@
 
     <div class="four columns">
       <div class="social">
-        <a>RSS/Social:</a>
-        <a href="{{ 'feed.xml' | relative_url }}">
+        <span class="spaced">RSS/Social:</span>
+        <a class="spaced" href="{{ 'feed.xml' | relative_url }}">
           <i class="fas fa-rss"></i>
         </a>
-        <a href="https://github.com/{{ site.github_username }}">
+        <a class="spaced" href="https://github.com/{{ site.github_username }}">
           <i class="fab fa-github"></i>
         </a>
-        <a href="https://twitter.com/{{ site.twitter_username }}">
+        <a class="spaced" href="https://twitter.com/{{ site.twitter_username }}">
           <i class="fab fa-twitter"></i>
         </a>
       </div>

assets/main.css

@@ -22,12 +22,16 @@ ul {
     margin-top: 1rem;
 }
 
-#title-header .social a {
+#title-header .social .spaced {
     color: #AAA;
     text-decoration: none;
     margin-right: 1em;
 }
 
+#title-header .social a:hover {
+    color: #222;
+}
+
 #posts-list {
     margin-top: 3rem;
     list-style: none;