FInalized Menu. Added first static Page...

HaWeb/wwwroot/css/output.css

@@ -475,7 +475,7 @@ body {
   line-height: 1.5rem;
 }
 
-@media (min-width: 1190px) {
+@media (min-width: 1440px) {
   body {
     font-size: 1.125rem;
     line-height: 1.75rem;
@@ -515,7 +515,7 @@ body {
 }
 
 .ha-topnav a {
-  margin-right: 1.25rem;
+  margin-right: 1.5rem;
   display: none;
   --tw-text-opacity: 1;
   color: rgb(55 65 81 / var(--tw-text-opacity));
@@ -534,10 +534,14 @@ body {
 
 @media (min-width: 1680px) {
   .ha-topnav a {
-    margin-right: 1.5rem;
+    margin-right: 1.75rem;
   }
 }
 
+.ha-topnav a:last-child {
+  margin-right: 0px;
+}
+
 .ha-topnav-dropdown {
   display: none;
 }
@@ -559,7 +563,7 @@ body {
   margin-right: 1.5rem;
   display: none;
   min-width: 130px;
-  border-bottom-width: 2px;
+  border-bottom-width: 1px;
   --tw-border-opacity: 1;
   border-color: rgb(156 163 175 / var(--tw-border-opacity));
   --tw-bg-opacity: 1;
@@ -594,25 +598,135 @@ body {
   background-color: rgb(243 244 246 / var(--tw-bg-opacity));
 }
 
-/* TODO INLINE .ha-container {
-        @apply max-w-[1280px]
-    } 
-    
+.ha-footer {
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: 1rem;
+  height: 100%;
+  width: 100%;
+  --tw-bg-opacity: 1;
+  background-color: rgb(248 250 252 / var(--tw-bg-opacity));
+  padding: 0.5rem;
+  text-align: right;
+  font-family: Libertine, serif;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+}
+
+@media (min-width: 1024px) {
+  .ha-footer {
+    padding: 1rem;
+  }
+}
+
+@media (min-width: 1190px) {
+  .ha-footer {
+    max-width: 1190px;
+    padding: 2rem;
+  }
+}
+
+.ha-footer a {
+  -webkit-text-decoration-line: underline;
+          text-decoration-line: underline;
+  -webkit-text-decoration-style: dotted;
+          text-decoration-style: dotted;
+}
+
+.ha-footer a:hover {
+  -webkit-text-decoration-line: underline;
+          text-decoration-line: underline;
+  -webkit-text-decoration-style: solid;
+          text-decoration-style: solid;
+}
+
+/* TODO INLINE
+
     .ha-maincolumn {
         @apply bg-slate-50 mx-auto p-2 md:p-4 desktop:px-16 desktop:py-12 xl:pr-80 text-lg font-serif 
-    } 
-    
-    p {
-        @apply my-3
-    }
-
-    h1 {
-        @apply font-bold text-xl 2xl:font-normal 2xl:text-4xl
-    }
-
-    h2 {
-        @apply text-lg 2xl:text-2xl
-    } */
+    }  */
+
+.ha-static {
+  width: 100%;
+  --tw-bg-opacity: 1;
+  background-color: rgb(248 250 252 / var(--tw-bg-opacity));
+  padding-top: 3rem;
+  padding-bottom: 3rem;
+  padding-left: 4rem;
+  padding-right: 4rem;
+  font-family: Libertine, serif;
+  -webkit-hyphens: auto;
+      -ms-hyphens: auto;
+          hyphens: auto;
+}
+
+@media (min-width: 1024px) {
+  .ha-static {
+    padding-right: 20rem;
+  }
+}
+
+.ha-static h1 {
+  margin-bottom: 1rem;
+  font-size: 1.25rem;
+  line-height: 1.75rem;
+  font-weight: 700;
+}
+
+@media (min-width: 1680px) {
+  .ha-static h1 {
+    font-size: 2.25rem;
+    line-height: 2.5rem;
+    font-weight: 400;
+  }
+}
+
+.ha-static h2 {
+  margin-bottom: 0.75rem;
+  margin-top: 1rem;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+}
+
+@media (min-width: 1680px) {
+  .ha-static h2 {
+    font-size: 1.5rem;
+    line-height: 2rem;
+  }
+}
+
+.ha-static h3 {
+  margin-bottom: 0.75rem;
+  margin-top: 1rem;
+  font-style: italic;
+  --tw-text-opacity: 1;
+  color: rgb(216 0 0 / var(--tw-text-opacity));
+}
+
+.ha-static table {
+  margin-top: 0.75rem;
+  margin-bottom: 0.75rem;
+  width: 100%;
+}
+
+.ha-static p {
+  margin-top: 0.75rem;
+  margin-bottom: 0.75rem;
+}
+
+.ha-static a {
+  -webkit-text-decoration-line: underline;
+          text-decoration-line: underline;
+  -webkit-text-decoration-style: dotted;
+          text-decoration-style: dotted;
+}
+
+.ha-static a:hover {
+  -webkit-text-decoration-line: underline;
+          text-decoration-line: underline;
+  -webkit-text-decoration-style: solid;
+          text-decoration-style: solid;
+}
 
 /* Classes from .NET */
 
@@ -742,6 +856,10 @@ body {
   }
 }
 
+.pointer-events-none {
+  pointer-events: none;
+}
+
 .static {
   position: static;
 }
@@ -764,6 +882,10 @@ body {
   margin-right: 0.5rem;
 }
 
+.\!mr-0 {
+  margin-right: 0px !important;
+}
+
 .inline-block {
   display: inline-block;
 }
@@ -772,10 +894,18 @@ body {
   display: flex;
 }
 
+.table {
+  display: table;
+}
+
 .hidden {
   display: none;
 }
 
+.h-full {
+  height: 100%;
+}
+
 .h-8 {
   height: 2rem;
 }
@@ -816,6 +946,18 @@ body {
   flex-wrap: wrap;
 }
 
+.overflow-hidden {
+  overflow: hidden;
+}
+
+.text-ellipsis {
+  text-overflow: ellipsis;
+}
+
+.whitespace-nowrap {
+  white-space: nowrap;
+}
+
 .border {
   border-width: 1px;
 }
@@ -998,6 +1140,11 @@ body {
   font-style: normal;
 }
 
+* {
+  -webkit-text-decoration-skip-ink: all;
+          text-decoration-skip-ink: all;
+}
+
 body {
   background-image:url('../img/subtlenet2.png');
   background-repeat:repeat;
@@ -1007,6 +1154,12 @@ body {
     list-style-type:circle;
 } */
 
+.hyphenate {
+  -webkit-hyphens: auto;
+      -ms-hyphens: auto;
+          hyphens: auto;
+}
+
 .ha-menu-arrowsymbol::after {
   display: inline-block;
   margin-left: 0.2em;
@@ -1060,6 +1213,10 @@ body {
 }
 
 @media (min-width: 1190px) {
+  .desktop\:block {
+    display: block;
+  }
+
   .desktop\:hidden {
     display: none;
   }