1 files changed, 39 insertions, 21 deletions
diff --git a/clams-server/src/main/resources/public/css/common.css b/clams-server/src/main/resources/public/css/common.css
index ffed73f..f5f6d2a 100644
--- a/clams-server/src/main/resources/public/css/common.css
+++ b/clams-server/src/main/resources/public/css/common.css
@@ -1,10 +1,19 @@
 * { box-sizing: border-box; }
 
 :root {
-    --bg-color: #efefeb;
-    --text-color: #373838;
+    --bg-color: #f4f4f0;
+    --text-color: #363737;
     --border-color: #ccc;
-    --font-serif: "Times New Roman", serif;
+    --font-serif: "Spectral", Georgia, serif;
+    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+}
+
+h1, h2 {
+    font-family: var(--font-sans), serif;
+}
+
+html {
+    scrollbar-gutter: stable;
 }
 
 html, body {
@@ -43,20 +52,9 @@ h2 {
     border-bottom: 1px solid var(--border-color);
     margin-bottom: 20px;
     padding-bottom: 5px;
-    text-transform: uppercase;
     letter-spacing: 1px;
 }
 
-.content-grid {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    gap: 60px;
-    margin-top: 30px;
-}
-
-.left-column { text-align: right; }
-.right-column { text-align: left; }
-
 .main-container ul {
     list-style-type: none;
     padding: 0;
@@ -106,13 +104,7 @@ footer p {
     opacity: 0.5;
 }
 
-@media (max-width: 600px) {
-    .content-grid {
-        grid-template-columns: 1fr;
-        gap: 40px;
-    }
-    .left-column, .right-column { text-align: center; }
-
+@media (max-width: 768px) {
     footer p {
         flex-direction: column;
         gap: 10px;
@@ -148,3 +140,29 @@ footer p {
     scrollbar-width: thin;
     scrollbar-color: #d1d1cd var(--bg-color);
 }
+
+.back-link-top {
+    position: absolute;
+    top: 20px;
+    left: 20px;
+    font-size: 0.85rem;
+    text-decoration: none;
+    font-weight: bold;
+    opacity: 0.7;
+    transition: opacity 0.2s;
+}
+
+.back-link-top:hover {
+    opacity: 1;
+}
+
+@media (max-width: 768px) {
+    .back-link-top {
+        position: static;
+        display: block;
+        margin-top: 10px;
+        margin-bottom: 20px;
+        text-align: left;
+    }
+}
+