diff options
Diffstat (limited to 'docroot/application.css')
-rwxr-xr-x | docroot/application.css | 463 |
1 files changed, 463 insertions, 0 deletions
diff --git a/docroot/application.css b/docroot/application.css new file mode 100755 index 0000000..cd0c540 --- /dev/null +++ b/docroot/application.css | |||
@@ -0,0 +1,463 @@ | |||
1 | /* | ||
2 | * Material Experience - Site Stylesheet | ||
3 | * | ||
4 | * EYEMG - Interactive Media Group | ||
5 | * Created by Mike Crute (mcrute@eyemg.com) | ||
6 | * Updated by Mike Crute (mcrute@eyemg.com) on 9/26/07 | ||
7 | * | ||
8 | * Site stylesheet the covers most of the look and feel of the site. | ||
9 | * Some of the CSS is also in the application logic so if you can't | ||
10 | * find what your looking for here go there. | ||
11 | */ | ||
12 | |||
13 | /* | ||
14 | * General Application Styles | ||
15 | */ | ||
16 | html | ||
17 | { | ||
18 | overflow: hidden; | ||
19 | } | ||
20 | |||
21 | body | ||
22 | { | ||
23 | font: 10px Verdana,sans-serif; | ||
24 | margin: 0px; | ||
25 | overflow: hidden; | ||
26 | } | ||
27 | |||
28 | a | ||
29 | { | ||
30 | color: blue; | ||
31 | text-decoration: underline; | ||
32 | } | ||
33 | |||
34 | a img | ||
35 | { | ||
36 | border: 0px; | ||
37 | } | ||
38 | |||
39 | h1 | ||
40 | { | ||
41 | font-size: 1.7em; | ||
42 | } | ||
43 | |||
44 | h2 | ||
45 | { | ||
46 | font-size: 1.6em; | ||
47 | } | ||
48 | |||
49 | img | ||
50 | { | ||
51 | /* The infamous PNG fix */ | ||
52 | behavior: url('pngbehavior.htc'); | ||
53 | } | ||
54 | |||
55 | /* | ||
56 | * Application Header Styles | ||
57 | */ | ||
58 | img#tagline | ||
59 | { | ||
60 | position: absolute; | ||
61 | top: 0px; | ||
62 | right: 0px; | ||
63 | } | ||
64 | |||
65 | div#header, div#footer | ||
66 | { | ||
67 | background: white; | ||
68 | height: 60px; | ||
69 | width: 100%; | ||
70 | position: relative; | ||
71 | z-index: 99; | ||
72 | } | ||
73 | |||
74 | div#header | ||
75 | { | ||
76 | height: 80px; | ||
77 | } | ||
78 | |||
79 | p#version | ||
80 | { | ||
81 | position: absolute; | ||
82 | bottom: 0px; | ||
83 | right: 7px; | ||
84 | z-index: 100; | ||
85 | color: red; | ||
86 | } | ||
87 | |||
88 | img#logo | ||
89 | { | ||
90 | position: absolute; | ||
91 | z-index: 9999999999; | ||
92 | cursor: pointer; | ||
93 | padding: 10px 0px 0px 10px; | ||
94 | } | ||
95 | |||
96 | /* | ||
97 | * Table and Chip Element Styles | ||
98 | */ | ||
99 | div.appDecorator | ||
100 | { | ||
101 | height: 21px; | ||
102 | width: 6px; | ||
103 | } | ||
104 | |||
105 | div.table | ||
106 | { | ||
107 | position: absolute; | ||
108 | top: 60px; | ||
109 | left: 0px; | ||
110 | width: 100%; | ||
111 | } | ||
112 | |||
113 | img.chip | ||
114 | { | ||
115 | position: absolute; | ||
116 | cursor: pointer; | ||
117 | } | ||
118 | |||
119 | /* | ||
120 | * Application Footer Styles | ||
121 | */ | ||
122 | p#copyright, div#footer p#copyright a | ||
123 | { | ||
124 | color: rgb(190,190,190); | ||
125 | font-size: 10px; | ||
126 | margin-right: 0px; | ||
127 | text-transform: none; | ||
128 | } | ||
129 | |||
130 | div#footer p#copyright a | ||
131 | { | ||
132 | text-decoration: underline; | ||
133 | } | ||
134 | |||
135 | p#copyright | ||
136 | { | ||
137 | width: 100%; | ||
138 | display: block; | ||
139 | position: absolute; | ||
140 | bottom: 0px; | ||
141 | left: 0px; | ||
142 | text-align: center; | ||
143 | z-index: 100; | ||
144 | } | ||
145 | |||
146 | div#footer | ||
147 | { | ||
148 | position: absolute; | ||
149 | bottom: -1px; | ||
150 | height: 40px; | ||
151 | text-align: center; | ||
152 | padding: 5px 0px 10px 0px; | ||
153 | } | ||
154 | |||
155 | div#footer img | ||
156 | { | ||
157 | position: relative; | ||
158 | top: 6px; | ||
159 | margin-right: 5px; | ||
160 | } | ||
161 | |||
162 | div#footer a | ||
163 | { | ||
164 | font-size: 1.2em; | ||
165 | text-transform: uppercase; | ||
166 | text-decoration: none; | ||
167 | margin-right: 25px; | ||
168 | } | ||
169 | |||
170 | /* | ||
171 | * History Menu Styles | ||
172 | */ | ||
173 | div.history | ||
174 | { | ||
175 | position: absolute; | ||
176 | right: 20px; | ||
177 | top: 20px; | ||
178 | padding: 3px 10px; | ||
179 | cursor: pointer; | ||
180 | background: none; | ||
181 | text-align: right; | ||
182 | } | ||
183 | |||
184 | ul#history:hover, ul#history.hovered | ||
185 | { | ||
186 | display: block; | ||
187 | } | ||
188 | |||
189 | ul#history | ||
190 | { | ||
191 | position: absolute; | ||
192 | z-index: 100; | ||
193 | display: none; | ||
194 | margin: 0px; | ||
195 | padding: 10px 0px 0px 0px; | ||
196 | color: rgb(255, 255, 255); | ||
197 | text-decoration: none; | ||
198 | width: 200px; | ||
199 | } | ||
200 | |||
201 | ul#history li | ||
202 | { | ||
203 | background: rgb(145, 145, 145); | ||
204 | list-style: none; | ||
205 | padding: 5px 10px; | ||
206 | margin: 0px; | ||
207 | border-bottom: 1px solid white; | ||
208 | text-align: left; | ||
209 | color: white; | ||
210 | text-decoration: none; | ||
211 | } | ||
212 | |||
213 | ul#history li a | ||
214 | { | ||
215 | color: white; | ||
216 | text-decoration: none; | ||
217 | border: 0px; | ||
218 | display: block; | ||
219 | width: 100%; | ||
220 | height: 100%; | ||
221 | } | ||
222 | |||
223 | ul#history li:last-child | ||
224 | { | ||
225 | border-bottom: 0px; | ||
226 | } | ||
227 | |||
228 | /* | ||
229 | * Rounded Corner Styles | ||
230 | */ | ||
231 | .round { display: block; } | ||
232 | .round * { display:block; height: 1px; overflow: hidden; } | ||
233 | .rcSlice_1 { margin: 0 10px; } | ||
234 | .rcSlice_2 { margin: 0 8px; } | ||
235 | .rcSlice_3 { margin: 0 6px; } | ||
236 | .rcSlice_4 { margin: 0 5px; } | ||
237 | .rcSlice_5 { margin: 0 4px; } | ||
238 | .rcSlice_6 { margin: 0 3px; } | ||
239 | .rcSlice_7 { margin: 0 3px; } | ||
240 | .rcSlice_8 { margin: 0 2px; height: 1px; } | ||
241 | .rcSlice_9 { margin: 0 2px; height: 2px; } | ||
242 | .rcSlice_10 { margin: 0 1px; height: 3px; } | ||
243 | |||
244 | /* | ||
245 | * Card Frame Styles (Card Class) | ||
246 | */ | ||
247 | img.commandbtn | ||
248 | { | ||
249 | height: 11px; | ||
250 | width: 11px; | ||
251 | display: inline; | ||
252 | margin: 0px 2px; | ||
253 | cursor: pointer; | ||
254 | } | ||
255 | |||
256 | span.commandlabel | ||
257 | { | ||
258 | height: auto; | ||
259 | z-index: 9; | ||
260 | display: inline; | ||
261 | position: relative; | ||
262 | top: -2px; | ||
263 | font-size: 1.1em; | ||
264 | } | ||
265 | |||
266 | span.commandlabel * | ||
267 | { | ||
268 | height: auto; | ||
269 | display: inline; | ||
270 | font-size: 1.1em; | ||
271 | } | ||
272 | |||
273 | span.cardTitle | ||
274 | { | ||
275 | font-size: 1.1em; | ||
276 | } | ||
277 | |||
278 | .cardTitle | ||
279 | { | ||
280 | position: absolute; | ||
281 | color: white; | ||
282 | z-index: 1; | ||
283 | height: auto; | ||
284 | top: 4px; | ||
285 | left: 15px; | ||
286 | } | ||
287 | |||
288 | .buttonbox | ||
289 | { | ||
290 | position: absolute; | ||
291 | right: 15px; | ||
292 | top: 6px; | ||
293 | z-index: 100; | ||
294 | height: auto; | ||
295 | color: white; | ||
296 | font-size: 0.8em; | ||
297 | } | ||
298 | |||
299 | /* | ||
300 | * Card Resource List Styles (Card Layout) | ||
301 | */ | ||
302 | .resourceList | ||
303 | { | ||
304 | margin: 0px; | ||
305 | padding: 0px; | ||
306 | } | ||
307 | |||
308 | .resourceList li | ||
309 | { | ||
310 | list-style: none; | ||
311 | padding-bottom: 7px; | ||
312 | } | ||
313 | |||
314 | /* | ||
315 | * Card Thumbnail Styles (Card Layout) | ||
316 | */ | ||
317 | .mediaThumb | ||
318 | { | ||
319 | width: 50px; | ||
320 | height: 50px; | ||
321 | padding: 10px 10px 0px 0px; | ||
322 | cursor: pointer; | ||
323 | } | ||
324 | |||
325 | .thumbStrip | ||
326 | { | ||
327 | text-align: center; | ||
328 | } | ||
329 | |||
330 | .thumbStrip img | ||
331 | { | ||
332 | width: 50px; | ||
333 | height: 50px; | ||
334 | cursor: pointer; | ||
335 | } | ||
336 | |||
337 | /* | ||
338 | * Sketchbook Trash Can Styles | ||
339 | */ | ||
340 | #sbTrash | ||
341 | { | ||
342 | position: absolute; | ||
343 | bottom: 20px; | ||
344 | right: 10px; | ||
345 | } | ||
346 | |||
347 | .trashHi | ||
348 | { | ||
349 | background-color: lightyellow; | ||
350 | } | ||
351 | |||
352 | /* | ||
353 | * Skip Link Styles (Intro Card) | ||
354 | */ | ||
355 | .skiplink | ||
356 | { | ||
357 | color: rgb(145, 145, 145); | ||
358 | text-decoration: none; | ||
359 | font-size: 1.1em; | ||
360 | position: relative; | ||
361 | z-index: 99; | ||
362 | } | ||
363 | |||
364 | .skipimg | ||
365 | { | ||
366 | vertical-align: bottom; | ||
367 | margin-left: 3px; | ||
368 | } | ||
369 | |||
370 | .skipbox | ||
371 | { | ||
372 | text-align: center; | ||
373 | margin-top: -50px; | ||
374 | } | ||
375 | |||
376 | /* | ||
377 | * Custom Content Styles | ||
378 | */ | ||
379 | ul#navigation | ||
380 | { | ||
381 | margin: 0px; | ||
382 | padding: 0px; | ||
383 | } | ||
384 | |||
385 | ul#navigation li | ||
386 | { | ||
387 | margin: 5px 30px 0px 0px; | ||
388 | list-style: none; | ||
389 | border: 1px solid white; | ||
390 | } | ||
391 | |||
392 | ul#navigation li a | ||
393 | { | ||
394 | display: block; | ||
395 | text-decoration: none; | ||
396 | padding: 2px; | ||
397 | border: 3px solid black; | ||
398 | } | ||
399 | |||
400 | ul#navigation li ul li a | ||
401 | { | ||
402 | margin: 0px -60px 0px -30px; | ||
403 | } | ||
404 | |||
405 | .selected | ||
406 | { | ||
407 | background: black; | ||
408 | color: white; | ||
409 | padding: 5px; | ||
410 | } | ||
411 | /* | ||
412 | .narrowCol, .wideCol | ||
413 | { | ||
414 | float: left; | ||
415 | height: 460px; | ||
416 | overflow: hidden; | ||
417 | } | ||
418 | |||
419 | .narrowCol | ||
420 | { | ||
421 | width: 290px; | ||
422 | margin-right: 20px; | ||
423 | } | ||
424 | |||
425 | .wideCol | ||
426 | { | ||
427 | width: 569px; | ||
428 | } | ||
429 | */ | ||
430 | |||
431 | /* | ||
432 | * Custom Content Color Styles | ||
433 | */ | ||
434 | ul#navigation li a | ||
435 | { | ||
436 | color: white; | ||
437 | background: rgb(100, 100, 100); | ||
438 | border: 3px solid rgb(100, 100, 100); | ||
439 | } | ||
440 | |||
441 | ul#navigation li ul li a | ||
442 | { | ||
443 | background: white; | ||
444 | color: rgb(100, 100, 100); | ||
445 | } | ||
446 | |||
447 | .selected | ||
448 | { | ||
449 | background: #ccc; | ||
450 | color: #000; | ||
451 | padding: 0px; | ||
452 | } | ||
453 | |||
454 | span.glossterm | ||
455 | { | ||
456 | text-transform: uppercase; | ||
457 | } | ||
458 | |||
459 | span.anchor | ||
460 | { | ||
461 | text-transform: uppercase; | ||
462 | font-weight: bold; | ||
463 | } | ||