v1 of custom theme

css/layout.css

@@ -0,0 +1,106 @@
+body {
+  background-color: #F1E9DA; /* beige */
+  color: #1C1C1C; /* deep charcoal */
+  font-family: Arial;
+  line-height: 1;
+  padding-top: 10px;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  margin-top: 0;
+  margin-bottom: 0;
+  line-height: 1.1;
+}
+
+p {
+  margin-top: 2px;
+}
+
+blockquote {
+  border: 3px dashed #800020;
+/*  box-shadow: 6px 6px 0px #800020;*/
+  padding: 5px 40px 5px 40px;
+}
+
+.u-hidden {
+  display: none !important;
+}
+
+/* style for all boxes */
+.layout-header-contents,
+.region-primary-menu,
+.region-secondary-menu,
+.region-breadcrumb,
+.region-content {
+  background-color: #D7CEA3; /* dusty tan */
+  border: 6px solid #2E4D38; /* forest green */
+  border-style: double;
+  padding: 10px;
+/*  margin-bottom: 20px;*/
+  /*box-shadow: 6px 6px 0px #800020; */ /* maroon */
+}
+
+.node {
+  border: 2px solid #800020;
+  box-shadow: 4px 4px 0px #800020;
+  padding: 3px;
+}
+
+.layout-container {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  gap: 10px;
+  width: 90%;
+  max-width: 1400px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.layout-header-contents {
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  gap: 10px;
+}
+
+.layout-columns {
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  gap: 10px;
+}
+
+.layout-menus {
+  display:flex;
+  flex-direction: column;
+  gap: 10px;
+  width: 260px;
+}
+
+.layout-not-menus {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.region-header {
+}
+
+.region-primary-menu {
+}
+
+.layout-content {
+  flex: 1;
+  min-width: 0;
+}
+
+.node {
+  margin-bottom: 10px;
+}
+
+img {
+  max-width: 100%;
+  height: auto;
+  display: block; /* Removes the tiny gap at the bottom of images */
+}