Fixing footer

assets/scss/common.scss

@@ -39,6 +39,11 @@ body {
     padding: 1em;
 }
 
+.padding-container-1 {
+    padding-left: 1em;
+    padding-right: 1em;
+}
+
 .padding-container-3 {
     padding-left: 3em;
     padding-right: 3em;

assets/scss/components/columns.scss

@@ -21,42 +21,40 @@
     display: flex;
 }
 
-.column {
+.col1 {
-    &.col1 {
+    &:not(.col1-fill) {
-        &:not(.col1-fill) {
-            width: 50%;
-            margin-right: auto !important;
-            margin-left: auto !important;
-        }
-        
-        &.col1-fill {
-            width: 100%;
-        }
-    }
-
-    &.col2 {
         width: 50%;
+        margin-right: auto !important;
+        margin-left: auto !important;
     }
+    
+    &.col1-fill {
+        width: 100%;
+    }
+}
 
-    &.col3 {
+.col2 {
-        width: 33%;
+    width: 50%;
-    }
+}
 
-    &.col2-3 {
+.col3 {
-        width: 66%;
+    width: 33%;
-    }
+}
 
-    &.col4 {
+.col2-3 {
-        width: 25%;
+    width: 66%;
-    }
+}
 
-    &.col3-4 {
+.col4 {
-        width: 75%;
+    width: 25%;
-    }
+}
 
-    &.col5 {
+.col3-4 {
-        width: 20%;
+    width: 75%;
-    }
+}
+
+.col5 {
+    width: 20%;
 }
 
 @media screen and (max-width: 700px) {

layouts/partials/footer.html

@@ -1,7 +1,7 @@
 <footer>
     <br><br>
     <div class="columns-container">
-        <div class="col3 footer-social-list grid padding-container-3">
+        <div class="col3 footer-social-list grid padding-container-1">
             {{ range .Site.Menus.social }}
                 <a role="button" alt="{{ .Name }}" title="{{ .Name }}" href={{ .URL }}>
                     {{ .Pre }}
@@ -11,7 +11,7 @@
         <div class="text-center col3">
             {{ .Site.Copyright }}
         </div>
-        <div class="col3 text-right padding-container-3">
+        <div class="col3 text-right padding-container-1">
             {{ .Site.Params.usingTheme }} <a href="/omegamma">Omegamma</a><br>
             {{ .Site.Params.poweredBy }} <a href="https://gohugo.io">Hugo</a>
         </div>