| author | Eugen Sawin <sawine@me73.com> |
| Tue, 16 Nov 2010 20:05:52 +0100 | |
| changeset 21 | 32923d84e8fb |
| parent 20 | ea66b23342a3 |
| child 22 | 38931aca0bff |
| permissions | -rw-r--r-- |
1 *
2 {
3 margin: 0;
4 padding: 0;
5 border: 0;
6 }
8 ul, ol
9 {
10 list-style-type: none;
11 }
13 body
14 {
15 background: #fafafa;
16 font: 15px/15px sans-serif;
17 margin: 30px 80px;
18 color: #333;
19 text-align: center;
20 }
22 #container
23 {
24 margin-left: auto;
25 margin-right: auto;
26 width: 1000px;
27 text-align: left;
28 }
30 .red
31 {
32 /*color: #b22;*/
33 color: #aaa;
34 }
36 a
37 {
38 text-decoration: none;
39 color: #777;
40 }
42 p
43 {
44 padding-bottom: 10px;
45 }
47 a:hover
48 {
49 color: #333;
50 }
52 span.link
53 {
54 border-bottom: dashed 1px #aaa;
55 position: relative;
56 color: #777;
57 }
59 .menu > span.link
60 {
61 border-bottom: 0;
62 font-size: 60px;
63 font-weight: bold;
64 letter-spacing: 0.2px;
65 line-height: 80%;
66 text-transform: uppercase;
67 color: #333;
68 }
70 span.missinglink
71 {
72 border-bottom: dashed 1px #aaa;
73 position: relative:
74 color: #aaa;
75 text-decoration: line-through;
76 }
78 h3
79 {
81 padding-bottom: 5px;
82 font-weight: bold;
83 text-transform: uppercase;
84 }
86 .menu > a
87 {
88 font-size: 60px;/*72px;*/
89 font-weight: bold;
90 letter-spacing: 0.2px;
91 line-height: 80%;
92 text-transform: uppercase;
93 color: #bbb;
94 }
96 .menu > a:hover
97 {
98 color: #333;
99 }
101 a > span
102 {
103 display: none;
104 }
106 a:hover > span
107 {
108 display: inline;
109 color: red;
110 font-weight: bold;
111 }
113 .menu > a .content
114 {
115 display: none;
116 font: 12px/15px sans-serif;
117 width: 50%;
118 height: 400px;
119 color: #555;
120 position: fixed;
121 margin: 30px 80px;
122 left: 0;
123 top: 0;
124 text-transform: none;
125 z-index: 100;
126 background: #fafafa;
127 }
129 .menu > a:hover .content
130 {
131 display: block;
132 }
134 body > #container > .content
135 {
136 font: 12px/15px sans-serif;
137 width: 50%;
138 height: 400px;
139 color: #555;
140 position: absolute;
141 margin-left: auto;
142 margin-right: auto;
143 text-transform: none;
144 z-index: 1;
145 }
147 .content a
148 {
149 border-bottom: dashed 1px red;
150 position: relative;
151 }
153 .content a:hover
154 {
155 border-bottom: 0;
156 }
158 .content .entry
159 {
160 padding-bottom: 20px;
161 width: 400px;
162 }
164 .content .entry .details
165 {
166 display: none;
167 font: 12px/15px sans-serif;
168 width: 400px;
169 height: 400px;
170 color: #333;
171 position: absolute;
172 margin-left: 500px;
173 margin-right: auto;
174 top: 0;
175 text-transform: none;
176 background: #fafafa;
177 }
179 .content .entry:hover .details
180 {
181 display: block;
182 }
184 .content .entry:hover .red
185 {
186 color: #d22;
187 }
190 div.universe1
191 {
192 background: #fafafa;
193 position: absolute;
194 width: 50%;
195 height: 50%;
196 left: 0;
197 top: 0;
198 text-align: center;
199 color: #fff;
200 }
202 div.universe1:hover
203 {
204 }
206 div.universe2
207 {
208 background: #fafafa;
209 position: fixed;
210 margin: 30px 80px;
211 left: 50%;
212 width: 50%;
213 height: 50%;
214 top: 0;
215 font-size: 60px;
216 font-weight: bold;
217 letter-spacing: 0.2px;
218 line-height: 80%;
219 text-align: left;
220 color: #fff;
221 }
223 div.universe2:hover
224 {
225 }
228 div.universe3
229 {
230 background: #fafafa;
231 position: absolute;
232 width: 50%;
233 height: 50%;
234 left: 0;
235 top: 50%;
236 text-transform: uppercase;
237 text-align: center;
238 color: #fafafa;
239 }
241 div.universe3:hover
242 {
243 background: #eee;
244 color: #aaa;
245 }
248 div.universe4
249 {
250 background: #fafafa;
251 position: absolute;
252 width: 50%;
253 height: 50%;
254 left: 50%;
255 top: 50%;
256 text-transform: uppercase;
257 text-align: center;
258 color: #fafafa;
259 }
261 div.universe4:hover
262 {
263 background: #eee;
264 color: #aaa;
265 }
267 div.menu
268 {
269 position: absolute;
270 bottom: 150px;
272 }
274 #menu1
275 {
276 width: 400px;
277 }
279 #menu2
280 {
281 margin-left: 500px;
282 margin-right: auto;
283 width: 400px;
284 }
286 #info
287 {
288 position: absolute;
289 bottom: 30px;
290 width: 400px;
291 color: #aaa;
292 }
294 #info:hover
295 {
296 color: #333;
297 }
299 #info li.name
300 {
301 font-weight: bold;
302 }
304 #info li.misc
305 {
306 font-weight: normal;
307 }
309 #container #copy
310 {
311 position: absolute;
312 bottom: 30px;
313 margin-left: 812px;
314 margin-right: auto;
315 color: #aaa;
316 }
318 #copy:hover
319 {
320 color: #333;
321 }