:root {
/* Standard colors for text. */
--text-fg-color: #333738;
+ --text-fg-color-max-contrast: black;
--text-bg-color: white;
--outside-page-bg-color: #333738;
/*\
|*|
-|*| Core elements: Sizing and padding
+|*| Core elements: Sizing, padding, and application of theme colors
|*|
\*/
body {
line-height: 1.25;
font-family: sans-serif;
+ color: var(--text-fg-color-max-contrast);
+}
+
+h1,h2 {
+ color: var(--text-fg-color);
+ font-weight: bold;
}
h1 {
font-size: 150%;
- font-weight: bold;
}
h2 {
font-size: 110%;
- font-weight: bold;
+}
+
+p,dl,dd,form {
+ margin-bottom: 1em;
+}
+
+ul li {
+ margin-left: 1em;
+ list-style-type: disc;
+ margin-bottom: 0.5em;
+}
+
+a:link {
+ color: var(--accent-color);
+}
+a:visited {
+ color: var(--accent-color);
+}
+a:hover {
+ color: var(--accent-color-bright);
+}
+a:active {
+ color: var(--accent-color-bright);
}
/*\
padding-right: 1em;
}
-@media screen and (min-width: 620px) and (max-width: 820px) {
+@media screen and (min-width: 720px) and (max-width: 820px) {
#page {
- padding-left: calc(1em + (100% - 820px)/2);
- padding-right: calc(1em + (100% - 820px)/2);
+ padding-left: calc(1em + (100% - 720px)/2);
+ padding-right: calc(1em + (100% - 720px)/2);
}
}
input {
box-sizing: border-box;
font-size: 125%;
+ height: 40px;
padding: 0.5em;
width: 100%;
border: 1px solid var(--accent-color);