author | Eugen Sawin <sawine@me73.com> |
Tue, 16 Nov 2010 15:01:40 +0100 | |
changeset 19 | 36c26564cd18 |
parent 17 | 2eb0d8ba4a9c |
child 20 | ea66b23342a3 |
permissions | -rw-r--r-- |
1 * {
2 margin: 0;
3 padding: 0;
4 border: 0;
5 }
6 ul, ol {
7 list-style-type: none;
8 }
9 body {
10 background: #fafafa;
11 font: 15px/15px sans-serif;
12 margin: 30px 80px;
13 color: #333;
14 }
16 .red
17 {
18 color: #b22;
19 }
21 a
22 {
23 text-decoration: none;
24 color: #aaa;
25 }
27 p
28 {
29 padding-bottom: 10px;
30 }
32 a:hover
33 {
34 color: #333;
35 }
37 span.link
38 {
39 border-bottom: dashed 1px #aaa;
40 position: relative;
41 color: #aaa;
42 }
44 .menu > span.link
45 {
46 border-bottom: 0;
47 font-size: 60px;/*72px;*/
48 font-weight: bold;
49 letter-spacing: 0.2px;
50 line-height: 80%;
51 text-transform: uppercase;
52 color: #333;
53 }
55 span.missinglink
56 {
57 border-bottom: dashed 1px #aaa;
58 position: relative:
59 color: #aaa;
60 text-decoration: line-through;
61 }
63 h3
64 {
66 padding-bottom: 5px;
67 font-weight: bold;
68 text-transform: uppercase;
69 }
71 .menu > a
72 {
73 font-size: 60px;/*72px;*/
74 font-weight: bold;
75 letter-spacing: 0.2px;
76 line-height: 80%;
77 text-transform: uppercase;
78 color: #bbb;
79 }
81 .menu > a:hover
82 {
83 color: #333;
84 }
86 a > span
87 {
88 display: none;
89 }
91 a:hover > span
92 {
93 display: inline;
94 color: red;
95 font-weight: bold;
96 }
98 .menu > a .content
99 {
100 display: none;
101 font: 12px/15px sans-serif;
102 width: 50%;
103 height: 400px;
104 color: #333;
105 position: fixed;
106 margin: 30px 80px;
107 left: 0;
108 top: 0;
109 text-transform: none;
110 z-index: 100;
111 background: #fafafa;
112 }
114 .menu > a:hover .content
115 {
116 display: block;
117 }
119 body > .content
120 {
121 font: 12px/15px sans-serif;
122 width: 50%;
123 height: 400px;
124 color: #333;
125 position: fixed;
126 margin: 30px 80px;
127 left: 0;
128 top: 0;
129 text-transform: none;
130 z-index: 1;
131 }
133 .content a
134 {
135 border-bottom: dashed 1px #699;
136 position: relative;
137 }
139 .content a:hover
140 {
141 border-bottom: 0;
142 }
144 .content .entry
145 {
146 padding-bottom: 20px;
147 width: 400px;
148 }
150 .content .entry .details
151 {
152 display: none;
153 font: 12px/15px sans-serif;
154 width: 400px;
155 height: 400px;
156 color: #333;
157 position: fixed;
158 margin: 30px 80px;
159 left: 50%;
160 top: 0;
161 text-transform: none;
162 background: #fafafa;
163 }
165 .content .entry:hover .details
166 {
167 display: block;
168 }
171 div.universe1
172 {
173 background: #fafafa;
174 position: absolute;
175 width: 50%;
176 height: 50%;
177 left: 0;
178 top: 0;
179 text-align: center;
180 color: #fff;
181 }
183 div.universe1:hover
184 {
185 }
187 div.universe2
188 {
189 background: #fafafa;
190 position: fixed;
191 margin: 30px 80px;
192 left: 50%;
193 width: 50%;
194 height: 50%;
195 top: 0;
196 font-size: 60px;
197 font-weight: bold;
198 letter-spacing: 0.2px;
199 line-height: 80%;
200 text-align: left;
201 color: #fff;
202 }
204 div.universe2:hover
205 {
206 }
209 div.universe3
210 {
211 background: #fafafa;
212 position: absolute;
213 width: 50%;
214 height: 50%;
215 left: 0;
216 top: 50%;
217 text-transform: uppercase;
218 text-align: center;
219 color: #fafafa;
220 }
222 div.universe3:hover
223 {
224 background: #eee;
225 color: #aaa;
226 }
229 div.universe4
230 {
231 background: #fafafa;
232 position: absolute;
233 width: 50%;
234 height: 50%;
235 left: 50%;
236 top: 50%;
237 text-transform: uppercase;
238 text-align: center;
239 color: #fafafa;
240 }
242 div.universe4:hover
243 {
244 background: #eee;
245 color: #aaa;
246 }
248 div.menu
249 {
250 position: absolute;
251 bottom: 20%;
252 margin: 0 80px;
253 }
255 #menu1
256 {
257 left: 0;
258 width: 400px;
259 }
261 #menu2
262 {
263 left: 50%;
264 width: 400px;
265 }
267 div.info {
268 position: absolute;
269 bottom: 30px;
270 color: #aaa;
271 }
273 div.info:hover
274 {
275 color: #333;
276 }
278 div.info li.name
279 {
280 font-weight: bold;
281 }
283 div.info li.misc
284 {
285 font-weight: normal;
286 }
288 #copy
289 {
290 position: absolute;
291 bottom: 30px;
292 right: 80px;
293 color: #aaa;
294 }
296 #copy:hover
297 {
298 color: #333;
299 }