Commit | Line | Data |
---|---|---|
048f206a JK |
1 | /* http://meyerweb.com/eric/tools/css/reset/ |
2 | v2.0 | 20110126 | |
3 | License: none (public domain) | |
4 | */ | |
5 | ||
6 | html, body, div, span, applet, object, iframe, | |
7 | h1, h2, h3, h4, h5, h6, p, blockquote, pre, | |
8 | a, abbr, acronym, address, big, cite, code, | |
9 | del, dfn, em, img, ins, kbd, q, s, samp, | |
10 | small, strike, strong, sub, sup, tt, var, | |
11 | b, u, i, center, | |
12 | dl, dt, dd, ol, ul, li, | |
13 | fieldset, form, label, legend, | |
14 | table, caption, tbody, tfoot, thead, tr, th, td, | |
15 | article, aside, canvas, details, embed, | |
16 | figure, figcaption, footer, header, hgroup, | |
17 | menu, nav, output, ruby, section, summary, | |
18 | time, mark, audio, video { | |
19 | margin: 0; | |
20 | padding: 0; | |
21 | border: 0; | |
22 | font-size: 100%; | |
23 | font: inherit; | |
24 | vertical-align: baseline; | |
25 | } | |
26 | /* HTML5 display-role reset for older browsers */ | |
27 | article, aside, details, figcaption, figure, | |
28 | footer, header, hgroup, menu, nav, section { | |
29 | display: block; | |
30 | } | |
31 | body { | |
32 | line-height: 1; | |
33 | } | |
34 | ol, ul { | |
35 | list-style: none; | |
36 | } | |
37 | blockquote, q { | |
38 | quotes: none; | |
39 | } | |
40 | blockquote:before, blockquote:after, | |
41 | q:before, q:after { | |
42 | content: ''; | |
43 | content: none; | |
44 | } | |
45 | table { | |
46 | border-collapse: collapse; | |
47 | border-spacing: 0; | |
48 | } | |
49 | ||
50 | /*** End reset.css ***/ | |
51 | ||
52 | ||
fc90a94a JK |
53 | body { |
54 | background: url(blackstars.png); | |
75da0d8d | 55 | background-color: #111; |
fc90a94a JK |
56 | color: #fefefe; |
57 | font-family: monospace; | |
58 | padding: 16px; | |
048f206a | 59 | margin: 8px; |
b0fbfd4f JK |
60 | } |
61 | ||
048f206a JK |
62 | |
63 | main { | |
64 | max-width: 700px; | |
fc90a94a | 65 | margin: 0 auto; |
4bbfb028 JK |
66 | } |
67 | ||
048f206a JK |
68 | a { |
69 | color: #f771fc; | |
70 | } | |
71 | ||
72 | a, p, h1, h2, h3, li { | |
73 | background-color: #111111; | |
74 | } | |
75 | ||
76 | em { | |
77 | font-style: italic; | |
78 | } | |
79 | ||
80 | em > em { | |
81 | font-style: normal; | |
82 | font-weight: bold; | |
83 | } | |
84 | ||
85 | ||
86 | /** Header **/ | |
87 | ||
fc90a94a JK |
88 | header h1 { |
89 | font-size: 2em; | |
048f206a | 90 | font-weight: bold; |
75da0d8d | 91 | margin: 0; |
e29d9cc4 JK |
92 | } |
93 | ||
048f206a JK |
94 | header h1 a { |
95 | color: inherit; | |
96 | text-decoration: none; | |
d7edfd55 JK |
97 | } |
98 | ||
9d04f7fb | 99 | header nav { |
048f206a JK |
100 | padding: 16px 0px 16px 0px; |
101 | line-height: 2em; | |
e29d9cc4 JK |
102 | } |
103 | ||
9d04f7fb | 104 | header nav ul { |
048f206a JK |
105 | display: flex; |
106 | flex-direction: row; | |
107 | flex-wrap: wrap; | |
4bbfb028 JK |
108 | } |
109 | ||
9d04f7fb | 110 | header nav ul li { |
048f206a JK |
111 | display: inline-block; |
112 | text-align: center; | |
75da0d8d | 113 | margin-right: 24px; |
048f206a | 114 | font-size: 1.25em; |
75da0d8d | 115 | background-color: inherit; |
d7edfd55 JK |
116 | } |
117 | ||
fc90a94a JK |
118 | header nav ul li::before { |
119 | font-size: .75em; | |
120 | line-height: .1em; | |
121 | content: "#"; | |
122 | } | |
123 | ||
9d04f7fb | 124 | header nav ul li a:link, header nav ul li a:visited { |
048f206a JK |
125 | text-decoration: none; |
126 | color: inherit; | |
d7edfd55 JK |
127 | } |
128 | ||
048f206a JK |
129 | header nav ul li a:hover { |
130 | text-decoration: underline; | |
4bbfb028 | 131 | } |
e29d9cc4 | 132 | |
048f206a JK |
133 | /** End Header **/ |
134 | ||
135 | ||
136 | /** Article **/ | |
e29d9cc4 | 137 | |
fc90a94a | 138 | article h2 { |
048f206a | 139 | margin: 1em 0 1em 0; |
fc90a94a | 140 | font-size: 1.2em; |
048f206a | 141 | font-weight: bold; |
e29d9cc4 JK |
142 | } |
143 | ||
048f206a JK |
144 | article p { |
145 | margin: 1em 0 1em 0; | |
146 | line-height: 1.25em; | |
9f0253f6 JK |
147 | } |
148 | ||
048f206a JK |
149 | article h3 { |
150 | display: inline-flex; | |
151 | width: 95%; | |
152 | margin: 8px 0px 8px 0px; | |
153 | font-weight: bold; | |
154 | padding: 0; | |
155 | font-size: 1em; | |
9f0253f6 JK |
156 | } |
157 | ||
048f206a JK |
158 | article h3 em { |
159 | text-align: right; | |
160 | flex-grow: 1; | |
9d04f7fb JK |
161 | } |
162 | ||
048f206a | 163 | article section { |
75da0d8d JK |
164 | margin: 16px 0px 16px 0px; |
165 | } | |
166 | ||
048f206a JK |
167 | article section ul, article section ol { |
168 | padding-left: 40px; | |
9d04f7fb JK |
169 | } |
170 | ||
048f206a | 171 | article section li { |
2bcca5c6 | 172 | margin: 8px 0px 8px 0px; |
048f206a | 173 | line-height: 1.25em; |
2bcca5c6 JK |
174 | } |
175 | ||
048f206a JK |
176 | article section ul li { |
177 | list-style-type: disc; | |
9d04f7fb | 178 | } |
75da0d8d | 179 | |
048f206a JK |
180 | article section ol li { |
181 | list-style-type: decimal; | |
c0a5b390 JK |
182 | } |
183 | ||
048f206a | 184 | /** End Article **/ |