added logo

css/base/base.css

@@ -27,9 +27,10 @@ html {
 body {
   margin: 0;
   color: var(--color-text-neutral-medium);
-  background-color: var(--color--gray-100);
+  /*background-color: var(--color--gray-100);*/
-  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='50' height='84' viewBox='0 0 50 84'%3e  %3cpath opacity='0.05' fill='%230e6ba6' d='M25,61.7C25,68.5,19.4,74,12.5,74S0,68.5,0,61.7c0-5.7,3.9-9.6,7.4-12.9c2.3-2.2,4.5-4.4,5.1-6.8c0.7,2.4,2.8,4.6,5.1,6.8C21.1,52.2,25,56,25,61.7z M42.6,6.8c-2.3-2.2-4.5-4.4-5.1-6.8c-0.7,2.4-2.9,4.6-5.1,6.8C28.9,10.2,25,14,25,19.7C25,26.5,30.6,32,37.5,32S50,26.5,50,19.7C50,14,46.1,10.2,42.6,6.8z'/%3e%3c/svg%3e");
+  background-color: #ece8e3;
-  background-position: top left; /* LTR */
+  /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='50' height='84' viewBox='0 0 50 84'%3e  %3cpath opacity='0.05' fill='%230e6ba6' d='M25,61.7C25,68.5,19.4,74,12.5,74S0,68.5,0,61.7c0-5.7,3.9-9.6,7.4-12.9c2.3-2.2,4.5-4.4,5.1-6.8c0.7,2.4,2.8,4.6,5.1,6.8C21.1,52.2,25,56,25,61.7z M42.6,6.8c-2.3-2.2-4.5-4.4-5.1-6.8c-0.7,2.4-2.9,4.6-5.1,6.8C28.9,10.2,25,14,25,19.7C25,26.5,30.6,32,37.5,32S50,26.5,50,19.7C50,14,46.1,10.2,42.6,6.8z'/%3e%3c/svg%3e");*/
+  /*background-position: top left; [> LTR <]*/
 }
 
 body.is-fixed {

css/components/footer.css

@@ -13,7 +13,8 @@
 .site-footer {
   position: relative; /* stack above left social bar */
   color: var(--color--gray-65);
-  background: linear-gradient(180deg, var(--color--gray-5) 0%, var(--color--gray-10) 100%);
+  /*background: linear-gradient(180deg, var(--color--gray-5) 0%, var(--color--gray-10) 100%);*/
+  background: #33210D;
 }
 
 .site-footer .menu {

css/components/header-site-branding.css

@@ -14,13 +14,20 @@
   display: flex;
   flex-shrink: 1;
   align-items: flex-end;
-  min-width: calc((2 * var(--grid-col-width)) + (2 * var(--grid-gap)) + var(--container-padding)); /* Span minimum of 2 column widths. */
+  min-width: calc(
+    (2 * var(--grid-col-width)) + (2 * var(--grid-gap)) +
+      var(--container-padding)
+  ); /* Span minimum of 2 column widths. */
   min-height: var(--sp3);
   margin-inline: calc(-1 * var(--container-padding)) var(--sp); /* Negative margin to break out of .container element. */
   padding-block: 0 var(--sp0-5);
   padding-inline-start: var(--container-padding);
   padding-inline-end: var(--container-padding);
-  background-image: linear-gradient(160deg, var(--color--primary-50) 0%, var(--color--primary-40) 78.66%);
+  background-image: linear-gradient(
+    160deg,
+    var(--color--primary-50) 0%,
+    var(--color--primary-40) 78.66%
+  );
 }
 
 @media (min-width: 31.25rem) {
@@ -31,7 +38,10 @@
 
 @media (min-width: 43.75rem) {
   .site-branding {
-    min-width: calc((4 * var(--grid-col-width)) + (4 * var(--grid-gap)) + var(--container-padding)); /* Span minimum of 4 column widths. */
+    min-width: calc(
+      (4 * var(--grid-col-width)) + (4 * var(--grid-gap)) +
+        var(--container-padding)
+    ); /* Span minimum of 4 column widths. */
     min-height: var(--sp6);
     padding-block-end: var(--sp);
   }
@@ -39,7 +49,10 @@
 
 @media (min-width: 62.5rem) {
   .site-branding {
-    min-width: calc((2 * var(--grid-col-width)) + (2 * var(--grid-gap)) + var(--container-padding)); /* Span minimum of 2 column widths. */
+    min-width: calc(
+      (2 * var(--grid-col-width)) + (2 * var(--grid-gap)) +
+        var(--container-padding)
+    ); /* Span minimum of 2 column widths. */
   }
 }
 
@@ -51,8 +64,12 @@
   }
 }
 
-[dir="rtl"] .site-branding {
+[dir='rtl'] .site-branding {
-  background-image: linear-gradient(-160deg, var(--color--primary-50) 0%, var(--color--primary-40) 78.66%);
+  background-image: linear-gradient(
+    -160deg,
+    var(--color--primary-50) 0%,
+    var(--color--primary-40) 78.66%
+  );
 }
 
 .site-branding--bg-gray {
@@ -108,6 +125,9 @@
 @media (min-width: 75rem) {
   .site-branding__logo img {
     max-height: calc(var(--header-height-wide-when-fixed) - var(--sp));
+    width: 160px;
+    border-right: 2px solid #fff;
+    padding-right: 13px;
   }
 }