add github link & teet btn

diff --git a/compare.html b/compare.html
index 030731b..b7d3c44 100644
--- a/compare.html
+++ b/compare.html
@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta http-equiv="X-UA-Compatible" content="ie=edge" />
-    <title>Destyle.css - Compare to other resets</title>
+    <title>Destyle.css - Compared to other resets</title>
     <link rel="stylesheet" href="destyle.css" />
     <link rel="stylesheet" href="style.css" />
   </head>
diff --git a/github.svg b/github.svg
new file mode 100644
index 0000000..1231683
--- /dev/null
+++ b/github.svg
@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="26px" height="26px" viewBox="0 0 26 26" enable-background="new 0 0 26 26" xml:space="preserve">
+<path fill-rule="evenodd" clip-rule="evenodd" fill="#333333" d="M12.999,0C5.821,0,0,5.82,0,13c0,5.744,3.725,10.617,8.891,12.335
+	c0.65,0.119,0.888-0.283,0.888-0.627c0-0.309-0.011-1.127-0.018-2.211c-3.616,0.785-4.379-1.744-4.379-1.744
+	c-0.591-1.5-1.443-1.9-1.443-1.9c-1.18-0.807,0.089-0.791,0.089-0.791c1.305,0.092,1.991,1.342,1.991,1.342
+	c1.16,1.984,3.042,1.412,3.783,1.08c0.118-0.842,0.454-1.414,0.826-1.738c-2.887-0.33-5.922-1.443-5.922-6.426
+	c0-1.419,0.507-2.58,1.338-3.488c-0.134-0.329-0.58-1.651,0.127-3.44c0,0,1.091-0.35,3.575,1.333
+	c1.037-0.289,2.149-0.433,3.255-0.438c1.104,0.005,2.216,0.149,3.255,0.438c2.482-1.682,3.57-1.333,3.57-1.333
+	c0.711,1.79,0.264,3.111,0.131,3.44c0.832,0.909,1.336,2.069,1.336,3.488c0,4.994-3.041,6.094-5.936,6.414
+	c0.467,0.402,0.881,1.195,0.881,2.408c0,1.738-0.015,3.139-0.015,3.566c0,0.348,0.233,0.752,0.894,0.625
+	C22.279,23.611,26,18.742,26,13C26,5.82,20.18,0,12.999,0z"/>
+</svg>
diff --git a/index.html b/index.html
index dd0e402..4a9aa05 100644
--- a/index.html
+++ b/index.html
@@ -38,15 +38,39 @@
         </li>
       </ul>

-      <a class="btn" href="https://github.com/nicolas-cusan/destyle.css">
-        Docs / Github
+      <a
+        class="btn"
+        href="https://github.com/nicolas-cusan/destyle.css/blob/master/Readme.md"
+      >
+        Docs
       </a>
       <a class="btn" href="compare.html">Test & Compare</a>
+
+      <div class="social">
+        <a href="https://github.com/nicolas-cusan/destyle.css/">
+          <img src="github.svg" alt="View on Github" />
+        </a>
+        <a
+          href="https://twitter.com/share?ref_src=twsrc%5Etfw"
+          class="twitter-share-button"
+          data-size="large"
+          data-text="Destyle.css - a clean slate for writing CSS without user agent styles"
+          data-url="https://nicolas-cusan.github.io/destyle.css/"
+          data-show-count="false"
+          >Tweet</a
+        >
+      </div>
     </main>

     <footer class="footer">
       ©2019 — Made with love by
       <a href="https://twitter.com/n_cusan">Nicolas Cusan</a>
     </footer>
+
+    <script
+      async
+      src="https://platform.twitter.com/widgets.js"
+      charset="utf-8"
+    ></script>
   </body>
 </html>
diff --git a/style.css b/style.css
index 991514c..b4aef69 100644
--- a/style.css
+++ b/style.css
@@ -39,20 +39,6 @@ body {
   margin-bottom: 50px;
 }

-.btn {
-  background-color: dodgerblue;
-  color: #fff;
-  padding: 0.8em 1.4em;
-  font-weight: 600;
-  border-radius: 3px;
-  display: inline-block;
-  vertical-align: middle;
-}
-
-.btn + .btn {
-  margin-left: 10px;
-}
-
 .features {
   margin-bottom: 60px;
 }
@@ -74,6 +60,41 @@ body {
   text-decoration: underline;
 }

+.btn {
+  background-color: dodgerblue;
+  color: #fff;
+  padding: 0.8em 1.4em;
+  font-weight: 600;
+  border-radius: 3px;
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.btn + .btn {
+  margin-left: 10px;
+}
+
+.social {
+  padding-top: 20px;
+}
+
+.social a {
+  display: inline-block;
+  vertical-align: middle;
+}
+.social a:not(:last-child) {
+  margin-right: 10px;
+}
+
+@media (min-width: 500px) {
+  .social {
+    display: inline-block;
+    vertical-align: middle;
+    margin-left: 50px;
+    padding-top: 0;
+  }
+}
+
 /* Footer
   ========================================================== */

compare.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta http-equiv="X-UA-Compatible" content="ie=edge" />
-    <title>Destyle.css - Compare to other resets</title>
+    <title>Destyle.css - Compared to other resets</title>
     <link rel="stylesheet" href="destyle.css" />
     <link rel="stylesheet" href="style.css" />
   </head>