Merge pull request #62 from topcoder-platform/issues-630

Author: jmgasper

design/custom.css

@@ -18,7 +18,7 @@
       font-weight: 400;
       line-height: 21px;
 
-      @media (max-width: 767px) {
+      @media (max-width: 768px) {
         padding:  0px 30px 0px 30px;
       }
 
@@ -27,15 +27,15 @@
         padding: 0px 0px;
         margin: auto;
 
-        @media (max-width: 767px) {
-          margin-left: 0;
-          margin-right: 0;
-          padding:  0px 30px 0px 30px;
-        }
-
         @media (max-width: 1200px) {
           max-width: none;
         }
+
+        @media (max-width: 768px) {
+          margin-left: 0;
+          margin-right: 0;
+          padding:  0px;
+        }
       }
 
       .Footer-logo {
@@ -45,7 +45,7 @@
         padding: 30px 0px;
 
 
-        @media (max-width: 767px) {
+        @media (max-width: 768px) {
           padding-bottom: 30px;
           svg{
             width: 79px;
@@ -72,7 +72,7 @@
             }
           }
 
-          @media (max-width: 767px) {
+          @media (max-width: 768px) {
             flex-grow: 2;
             margin-top: 18px;
             &:first-child {
@@ -83,7 +83,7 @@
             }
           }
         }
-        @media (max-width: 767px) {
+        @media (max-width: 768px) {
           display: none;
         }
     }
@@ -111,12 +111,15 @@
 
       .Footer-Share-Container {
         li {
-          width: 26px;
-          height: 26px;
-          line-height: 26px;
+          width: 24px;
+          height: 24px;
+          line-height: 21px;
           border-radius: 100%;
           float: left;
-          margin-left: 5px;
+          margin-right: 5px;
+          &:last-child {
+            margin-right: 0;
+          }
 
           a {
             color: $global-grey-bg !important;
@@ -127,7 +130,7 @@
           }
         }
 
-        @media (max-width: 767px) {
+        @media (max-width: 768px) {
             display: flex;
             justify-content: center;
             order: 1;
@@ -157,7 +160,7 @@
                 color: $global-color_grey_dark;
               }
             }
-            @media (max-width: 767px) {
+            @media (max-width: 768px) {
               font-size: 11px;
               margin-right: 0;
               a {
@@ -168,24 +171,23 @@
           }
 
           @media (max-width: 768px) {
-            justify-content: space-between;
-            margin-top: 10px;
-            order: 2;
-            width: 100%;
+            margin-top: 0px;
           }
         }
 
-        @media (max-width: 767px) {
+        @media (max-width: 768px) {
           border-top: 0;
-          margin-top: 20px;
+          margin-top: 22px;
+          padding-top: 0px;
         }
       }
 
 
       .Footer-Mobile-Share-Container {
         display: none;
-        @media (max-width: 767px) {
+        @media (max-width: 768px) {
           display: flex;
+          margin-top: 15px;
           justify-content: center;
           a {
             margin-right: 5px;
@@ -195,27 +197,36 @@
             &:hover {
               color: $global-grey-bg
             }
+
+            &:last-child {
+              margin-right: 0;
+            }
           }
         }
       }
 
       .Footer-Mobile-Menu-Container{
         display: none;
-        @media (max-width: 767px) {
+        @media (max-width: 768px) {
           display: flex;
           justify-content: center;
           .Footer-Menu-Title {
             display: flex;
             flex-direction: column;
             margin-right: 43px;
+            margin-bottom: 0px;
             border-bottom: 0px;
+            &:last-child {
+              margin-right: 0px;
+            }
             a {
               color: #e9e9e9;
               font-size: 12px;
               font-weight: 500;
               line-height: 21px;
               text-decoration: none;
             }
+
           }
         }
       }