I think I got the social icons working in off canvas

diff --git a/scss/_left-off-canvas.scss b/scss/_left-off-canvas.scss
index 4713a7f..247e390 100644 (file)
--- a/scss/_left-off-canvas.scss
+++ b/scss/_left-off-canvas.scss
@@ -94,29 +94,39 @@ ul.social {
 .offcavas-social-list {
     @include inline-list;
     margin-left: auto;
-    a {
-        &.facebook {
-            background-position: 0 0;
-            &:hover {
-                background-position: 0 -97px;
+    li a.facebook, li a.insta, li a.twit, li a.tube {
+        background: url(../assets/social-icons.png) no-repeat;
+        width: 38px;
+        height: 38px;
+        display: block;
+    }
+    li {
+        display: inline-block;
+        padding: 5px;
+        a {
+            &.facebook {
+                background-position: 0 0;
+                &:hover {
+                    background-position: 0 -97px;
+                }
             }
-        }
-        &.insta {
-            background-position: -50px 0;
-            &:hover {
-                background-position: -50px -97px;
+            &.insta {
+                background-position: -50px 0;
+                &:hover {
+                    background-position: -50px -97px;
+                }
             }
-        }
-        &.twit {
-            background-position: 0 -50px;
-            &:hover {
-                background-position: 0 -147px;
+            &.twit {
+                background-position: 0 -50px;
+                &:hover {
+                    background-position: 0 -147px;
+                }
             }
-        }
-        &.tube {
-            background-position: -50px -50px;
-            &:hover {
-                background-position: -50px -147px;
+            &.tube {
+                background-position: -50px -50px;
+                &:hover {
+                    background-position: -50px -147px;
+                }
             }
         }
     }