diff --git a/style/logo3.svg b/style/logo3.svg
new file mode 100644
index 0000000..fb36c6a
--- /dev/null
+++ b/style/logo3.svg
@@ -0,0 +1,120 @@
+
+
+
+
diff --git a/style/luga.css b/style/luga.css
new file mode 100644
index 0000000..3421f1c
--- /dev/null
+++ b/style/luga.css
@@ -0,0 +1,342 @@
+.partouter {
+ border-style: solid;
+ border-width: 1px;
+ border-color: #0000FF;
+}
+
+.partinner {
+ border-style: dotted;
+ border-width: 1px;
+ border-color: #0000FF;
+}
+
+.partheader {
+ background-color: #0000FF;
+ color: #FFFFFF;
+ font-size: 70%;
+}
+
+th {
+ text-align: left;
+}
+
+.subject {
+ font-size: 1.2em;
+ color: #000088;
+}
+
+.text-enriched {
+ font-family: monospace;
+ white-space: pre-wrap;
+ max-width: 60em;
+}
+
+.signature {
+ font-size: 0.8rem;
+}
+
+.dubious {
+ background-color: #888800;
+}
+
+.partinner.html {
+ max-width: 40rem;
+}
+
+p.fixed {
+ font-family: monospace;
+ white-space: pre;
+ margin: 0.2em;
+ font-size: 1rem;
+ font-size-adjust: 0.5625;
+}
+
+p.flowed {
+ font-family: monospace;
+ white-space: pre-wrap;
+ max-width: 60em;
+ margin: 0.2em;
+ font-size: 1rem;
+ font-size-adjust: 0.5625;
+}
+
+.text_plain_flowed blockquote {
+ border-left: solid 0.2em #004;
+ padding-left: 0.8em;
+ margin: 0em;
+ background: #EEF;
+}
+
+body {
+ --color-accent-light: #fecc04;
+ --color-accent-dark: #feb204;
+ --width-column-left: auto
+}
+
+@font-face {
+ font-family: "Linux Biolinum O";
+ font-style: normal;
+ src: url(LinBiolinum_R.otf);
+}
+
+@font-face {
+ font-family: "Linux Biolinum O";
+ font-style: italic;
+ src: url(LinBiolinum_RI.otf);
+}
+
+header {
+ background-color: var(--color-accent-light);
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ align-items: flex-start;
+ border-radius: 0em 1em 0em 0em;
+}
+
+@media only screen and (min-width: 65rem) {
+ body {
+ display: grid;
+ grid-template-columns: var(--width-column-left) auto 20rem;
+ grid-template-rows: 3rem auto auto auto;
+ }
+
+ #logo {
+ grid-column: 1;
+ grid-row: 1 / span 2;
+ }
+
+ header {
+ grid-column: 2 / span 2;
+ grid-row: 1;
+ }
+
+ nav {
+ grid-column: 1;
+ grid-row: 3;
+ overflow: hidden;
+ }
+
+ article {
+ grid-column: 2;
+ grid-row: 2 / span 3;
+ }
+
+ footer {
+ grid-column: 3;
+ grid-row: 2 / span 3;
+ text-align: right;
+ }
+
+}
+
+@media only screen and (min-width: 40rem) and (max-width: 65rem) {
+ body {
+ display: grid;
+ grid-template-columns: var(--width-column-left) auto;
+ grid-template-rows: auto auto auto auto auto;
+ }
+
+ #logo {
+ grid-column: 1;
+ grid-row: 1 / span 2;
+ }
+
+ header {
+ grid-column: 2;
+ grid-row: 1;
+ }
+
+ nav {
+ grid-column: 1;
+ grid-row: 3;
+ }
+
+ article {
+ grid-column: 2;
+ grid-row: 2 / span 3;
+ }
+
+ footer {
+ grid-column: 1 / span 2;
+ grid-row: 5;
+ text-align: left;
+ }
+
+}
+
+@media only screen and (max-width: 40rem) {
+ body {
+ display: grid;
+ grid-template-columns: var(--width-column-left) auto;
+ grid-template-rows: auto auto auto auto auto;
+ }
+
+ #logo {
+ grid-column: 1;
+ grid-row: 1 / span 2;
+ width: 3rem;
+ }
+
+ header {
+ grid-column: 2;
+ grid-row: 1;
+ }
+
+ nav {
+ grid-column: 1;
+ grid-row: 3;
+ overflow: hidden;
+ width: 3em;
+ }
+
+ nav:hover {
+ overflow: visible;
+ z-index: 1;
+ width: auto;
+ }
+
+ article {
+ grid-column: 2;
+ grid-row: 2 / span 3;
+ }
+
+ footer {
+ grid-column: 1 / span 2;
+ grid-row: 5;
+ text-align: left;
+ }
+
+}
+
+nav a {
+ color: #008;
+ text-decoration: none;
+ padding-left: 0.5rem;
+ padding-right: 0.5rem;
+}
+
+nav a:focus {
+ border: 1px dotted #CCF;
+}
+
+nav a:hover {
+ text-decoration: underline;
+}
+
+nav a.current {
+ background-color: var(--color-accent-dark);
+}
+
+input.leftfield {
+ border: 1px black solid;
+ border-radius: 0.5rem 0px 0px 0.5rem;
+ padding: 0.3rem 0.5rem;
+ height: 1.0rem;
+}
+
+label.rightbutton {
+ border: 1px black solid;
+ border-radius: 0px 0.5rem 0.5rem 0px;
+ padding: 0.1rem;
+ background-color: #EEE;
+ position: relative;
+ top: 0.1em;
+ height: 1.4rem;
+}
+
+header form {
+ margin: 0.5em;
+}
+
+header button {
+ margin: 0.6em;
+}
+
+body {
+ font-family: "Linux Biolinum O";
+ font-size-adjust: 0.5625;
+}
+
+h1 {
+ margin: 0px;
+ padding-left: 0.5rem;
+ font-weight: normal;
+}
+
+footer {
+ /* background-color: var(--color-accent-dark); */
+ color: #888;
+}
+nav {
+ background-color: var(--color-accent-light);
+ border-radius: 0em 0em 0em 1em;
+ margin-right: 1rem;
+ margin-top: 1rem;
+}
+
+nav ul {
+ list-style-type: none;
+ padding-left: 0.7em;
+ background-color: var(--color-accent-light);
+}
+
+footer ul {
+ list-style-type: none;
+ padding-left: 1em;
+}
+
+p, h2, h3, dl {
+ max-width: 40rem;
+ padding-left: 0.5rem;
+}
+
+h2 {
+ border-top: solid 2px var(--color-accent-dark);
+ font-weight: normal;
+ font-size: 1.7rem;
+}
+
+h3 {
+ border-top: solid 1px var(--color-accent-light);
+ font-weight: normal;
+ font-size: 1.5rem;
+}
+
+.oneline {
+ white-space: nowrap;
+}
+
+nav input {
+ width: 8rem;
+}
+nav form {
+ padding: 0.5em;
+}
+
+a {
+ text-decoration: none;
+}
+
+a:hover {
+ text-decoration: underline;
+}
+
+.event dl dt {
+ font-size: 0.8em;
+ margin-top: 0.5em;
+}
+
+dd p:first-child {
+ margin-top: 0;
+}
+
+table.thread {
+ white-space: nowrap;
+}
+
+pre {
+ font-size: monospace;
+ font-size: 1rem;
+ font-size-adjust: 0.5625;
+}
diff --git a/templates/message.html b/templates/message.html
index 03c8d69..10d089f 100644
--- a/templates/message.html
+++ b/templates/message.html
@@ -5,20 +5,25 @@
{{list}}: {{subject}}
-
+
- {{subject}}
+ 
+
-
+
+
| Message-Id | {{message_id}} |
| From | {{from}} |
| Date | {{date}} |
-
-
- {{bodyhtml}}
-
+
+
+ {{bodyhtml}}
+
+