From fba096b8e2e73ac3006e375ac539e4aa1350baa5 Mon Sep 17 00:00:00 2001
From: "Dominik V. Salonen" <contact@quad.moe>
Date: Wed, 14 Mar 2018 14:36:34 +0100
Subject: [PATCH] Hopefully I remember this without testing

---
 pages/social.html |  4 ++++
 style.css         | 27 ++++++++++++++++++++++++++-
 2 files changed, 30 insertions(+), 1 deletion(-)
 create mode 100644 pages/social.html

diff --git a/pages/social.html b/pages/social.html
new file mode 100644
index 0000000..5a52b3a
--- /dev/null
+++ b/pages/social.html
@@ -0,0 +1,4 @@
+<div class="icon-container">
+    <a href="#"><i class="fab fa-twitter"></i></a>
+    <a href="#"><i class="fab fa-envelope"></i></a>
+</div>
diff --git a/style.css b/style.css
index 2964aa1..d0b28d4 100755
--- a/style.css
+++ b/style.css
@@ -7,7 +7,8 @@ html, body {
 h1, h2, h3, h4, h5, p {
   margin: 0;
 }
-  
+
+/* Main IDs forthe site */  
 #site {
   position: absolute;
   top: 0;
@@ -61,6 +62,7 @@ h1, h2, h3, h4, h5, p {
   padding: 15px 5px 8px 5px;
 }
 
+/* Core site components */
 .title {
   font-size: 32pt;
   font-weight: 300;
@@ -136,7 +138,30 @@ h1, h2, h3, h4, h5, p {
                                   supported by Chrome and Opera */
 }
 
+/* Animations */
 @keyframes spin {
   from { transform:rotate(0deg); }
   to   { transform:rotate(360deg); }
+}
+
+/* Social media icons */
+.icon-container {
+  display: block;
+  text-align: center;
+  width: 100%;
+  font-size: 0;
+}
+
+.icon-container a {
+  display: inline-block;
+  padding: 20px;
+  box-sizing: border-box;
+  font-size: 24pt;
+  color: #FFFFFF;
+  transition: color 0.25s ease-in-out;
+}
+
+.icon-container a:hover {
+  color: #FF5555;
+  transition: color 0.25s ease-in-out;
 }
\ No newline at end of file