diff --git a/ws/static/styles.css b/ws/static/styles.css
index 6e35ff08bb4bf651f02871dc874d5eee9795f70c..dac4cedcf1aa97b2f919b1f10d2579b10f29b313 100644
--- a/ws/static/styles.css
+++ b/ws/static/styles.css
@@ -54,7 +54,7 @@ a:visited {
.two_column {
display: flex;
- gap: 30px;
+/* gap: 30px;*/
flex-direction: row;
margin: auto auto;
max-width: 1040px;
@@ -112,9 +112,50 @@ a:visited {
margin: auto auto;
}
-header > h1 > span {
- font-size: 12px;
- float: right;
+header {
+ width: 100%;
+ max-width: 1040px;
+ margin: 0 auto;
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: space-between;
+ align-content: center;
+}
+
+header h1 {
+ margin-block: 1.2rem;
+}
+
+header nav {
+ display: flex;
+ justify-content: flex-end;
+ align-content: baseline;
+ flex: 1 1 auto;
+ margin-block: 1.2rem;
+}
+
+header nav a,
+header nav a:visited {
+ display: block;
+ text-decoration: none;
+ font-size: 1.2rem;
+ line-height: 1;
+ color: hsl(100, 95%, 30%);
+ border: 1px solid hsl(100, 95%, 30%);
+ background-color: transparent;
+ border-radius: 0.5rem;
+ padding: 0.6rem 0.5rem 0.4rem;
+}
+
+header nav a + a {
+ margin-inline-start: 0.5rem;
+}
+
+header nav a:last-of-type,
+header nav a:last-of-type:visited {
+ color: hsl(350, 100%, 65%);
+ border-color: hsl(350, 100%, 65%);
+ background-color: transparent;
}
@media (prefers-color-scheme: dark) {