.partouter { border-style: solid; border-width: 1px; border-color: #CCCCCC; } .partinner { border-style: dotted; border-width: 1px; border-color: #CCCCCC; } .partheader { background-color: #CCCCCC; 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; position: relative; /* to establish formatting context */ } 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; } .month { text-align: right; } .threadmarker { width: 1000px; height: 32px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)); }