Refine alignments with two widths

pages/assets/css/_base.css

@@ -152,8 +152,8 @@ body {
     align-items: center;
     flex-wrap: wrap;
     justify-content: space-between;
-    padding-right: 3rem;
-    padding-left: 3rem;
+    padding-left: 2rem;
+    padding-right: 2rem;
   }
 
   .header .menu a {
@@ -169,19 +169,15 @@ body {
     padding: 0.75rem;
     margin-left: auto;
   }
-
-  .header > nav {
-    max-width: 1440px;
-    margin: auto;
-    padding-right: 8vw;
-    padding-left: 8vw;
-  }
 }
 
-@media screen and (min-width: 1440px) {
+@media screen and (min-width: 1120px) {
   .header > nav {
-    padding-right: 10rem;
-    padding-left: 6.25rem;
+    max-width: 1120px;
+    margin-left: auto;
+    margin-right: auto;
+    padding-left: 1.5rem;
+    padding-right: 1.5rem;
   }
 }
 
@@ -209,8 +205,8 @@ header .logo > img {
     background-image: url("../img/dot-watermark.svg");
     background-repeat: repeat-y;
     background-origin: border-box;
-    padding-left: 3rem;
-    padding-right: 3rem;
+    padding-left: 2rem;
+    padding-right: 2rem;
   }
 }
 
@@ -437,10 +433,10 @@ section.about .columns {
   }
 }
 
-@media screen and (min-width: 1320px) {
+@media screen and (min-width: 1360px) {
   section.about {
-    max-width: 1320px;
-    padding-left: 124px;
+    max-width: 1360px;
+    padding-left: 144px;
   }
 }
 
@@ -1287,7 +1283,6 @@ section.docs a:hover {
   display: grid;
   column-gap: 5rem;
   row-gap: 2rem;
-  justify-content: center;
   padding-bottom: 3.125rem;
   padding-top: 3.375rem;
 }
@@ -1308,7 +1303,6 @@ section.docs a:hover {
   position: relative;
   background-color: var(--brand-color-900);
   display: grid;
-  justify-content: center;
   padding-top: 2rem;
   padding-bottom: 3rem;
 }
@@ -1316,6 +1310,7 @@ section.docs a:hover {
 .footer .eclipse,
 .footer .asciidoc {
   grid-template-columns: 250px 250px 250px 250px;
+  justify-content: start;
   padding-right: 2rem;
   padding-left: 2rem;
 }
@@ -1422,6 +1417,7 @@ section.docs a:hover {
   .footer .asciidoc {
     grid-template-columns: 200px 175px 175px 175px;
     column-gap: 4rem;
+    justify-content: center;
   }
 }