155
|
1 /* Styles for the mapWOC Website */ |
|
2 |
|
3 body { |
|
4 font-family: arial, helvetica, sans-serif; |
|
5 font-size: 13px; |
|
6 background: #FFFFFF url('img/page_bg.png') repeat-x; |
|
7 color: #333333; |
|
8 margin: 0px; |
|
9 padding:0px; |
|
10 } |
|
11 |
|
12 a { |
|
13 color: #b51a22; |
|
14 text-decoration: none; |
|
15 } |
|
16 |
|
17 a:hover { |
|
18 text-decoration: underline; |
|
19 } |
|
20 |
|
21 img { |
|
22 border: 0px; |
|
23 } |
|
24 |
|
25 .imageframe { |
|
26 border-color: #DEDEDE #AAAAAA #888888 #CECECE; |
|
27 border-style: double; |
|
28 border-width: 1px; |
|
29 padding: 5px; |
|
30 } |
|
31 |
|
32 .imgfloatleft { |
|
33 float: left; |
|
34 margin: 0px 20px 30px 0px; |
|
35 } |
|
36 |
|
37 td { |
|
38 vertical-align: top; |
|
39 } |
|
40 |
|
41 .odd td { |
|
42 background: #E6E6E6; |
|
43 } |
|
44 |
|
45 .wrapper { |
|
46 width: 900px; |
|
47 margin: 0 auto; |
|
48 text-align: left; |
|
49 } |
|
50 |
|
51 .language_select { |
|
52 float:right; |
|
53 height: 100%; |
|
54 } |
|
55 |
|
56 .logo { |
|
57 margin-top: 20px; |
|
58 margin-left: 15px; |
|
59 } |
|
60 |
|
61 .header { |
|
62 padding: 6px 0 6px 0; |
|
63 margin-bottom: 0px; |
|
64 height: 1em; |
|
65 } |
|
66 |
|
67 .fancy_intro { |
|
68 background: url('img/logo_wide.png') no-repeat; |
|
69 background-position: 350px 17px; |
|
70 height:125px; |
|
71 margin: 30px 20px 25px 20px; |
|
72 border-bottom:1px solid gray; |
|
73 overflow: hidden; |
|
74 width:860px; |
|
75 padding-bottom: 15px; |
|
76 } |
|
77 |
|
78 .mini_intro { |
|
79 clear: both; |
|
80 font-size: 12px; |
|
81 line-height: 38px; |
|
82 margin-top: 8px; |
|
83 } |
|
84 |
|
85 #download_button { |
|
86 position: relative; |
|
87 width: 250px; |
|
88 z-index: 0; |
|
89 } |
|
90 |
|
91 #download_button a { |
|
92 background: url('img/download_button.png'); |
|
93 background-repeat: no-repeat; |
|
94 display: block; |
|
95 height: 116px; |
|
96 width: 260px; |
|
97 color: #FFFFFF; |
|
98 font-weight: bold; |
|
99 text-decoration: none; |
|
100 font-size: 19px; |
|
101 } |
|
102 |
|
103 #download_button a:hover { |
|
104 background-position: 0px -116px; |
|
105 } |
|
106 |
|
107 #download_button .text { |
|
108 position: relative; |
|
109 top: 23px; |
|
110 left: 25px; |
|
111 } |
|
112 |
|
113 #breadcrum { |
|
114 float:left; |
|
115 } |
|
116 |
|
117 #download_button_mini { |
|
118 float:right; |
|
119 text-align:right; |
|
120 width: 189px; |
|
121 line-height: 100%; |
|
122 } |
|
123 |
|
124 #download_button_mini .links { |
|
125 position: relative; |
|
126 top: -13px; |
|
127 font-size: 10px; |
|
128 text-align: right; |
|
129 } |
|
130 |
|
131 #download_button_mini .dmini_button { |
|
132 background: url('img/download_button_mini.png'); |
|
133 background-repeat: no-repeat; |
|
134 display: block; |
|
135 height: 50px; |
|
136 width: 189px; |
|
137 text-align:left; |
|
138 font-size: 11px; |
|
139 line-height:50px; |
|
140 color: #FFFFFF; |
|
141 font-weight:bold; |
|
142 text-decoration:none; |
|
143 } |
|
144 |
|
145 #download_button_mini .dmini_button:hover { |
|
146 background-position: 0px -50px; |
|
147 } |
|
148 |
|
149 #download_button_mini .text { |
|
150 position: relative; |
|
151 left: 12px; |
|
152 } |
|
153 |
|
154 .download_button_links { |
|
155 font-size:11px; |
|
156 position: relative; |
|
157 left: 25px; |
|
158 top: 43px; |
|
159 width: 250px; |
|
160 } |
|
161 |
|
162 #donate_button { |
|
163 position: relative; |
|
164 left: 695px; |
|
165 top: 85px; |
|
166 width: 200px; |
|
167 } |
|
168 |
|
169 #donate_button a { |
|
170 background: url('img/donate_button.png'); |
|
171 background-repeat: no-repeat; |
|
172 display: block; |
|
173 height: 79px; |
|
174 width: 200px; |
|
175 color: #FFFFFF; |
|
176 font-weight: bold; |
|
177 text-decoration: none; |
|
178 font-size: 14px; |
|
179 } |
|
180 |
|
181 #donate_button a:hover { |
|
182 background-position: 0px -79px; |
|
183 } |
|
184 |
|
185 #donate_button .text { |
|
186 position:relative; |
|
187 top:20px; |
|
188 left:10px; |
|
189 } |
|
190 |
|
191 .h_text { |
|
192 position: relative; |
|
193 top: -125px; |
|
194 left: 669px; |
|
195 width: 180px; |
|
196 font-size: 11px; |
|
197 border-left: 1px solid #CCCCCC; |
|
198 padding-left: 10px; |
|
199 margin-top: 12px; |
|
200 height: 220px; |
|
201 } |
|
202 |
|
203 .h_text .heading { |
|
204 font-size: 23px; |
|
205 font-family: georgia, times, serif; |
|
206 padding-bottom: 9px; |
|
207 } |
|
208 |
|
209 .h_text .serif_word { |
|
210 font-size: 13px; |
|
211 font-weight: bold; |
|
212 } |
|
213 |
|
214 |
|
215 |
|
216 .h_text .limiter { |
|
217 border-bottom: 3px dotted #CCCCCC; |
|
218 width: 190px; |
|
219 height: 10px; |
|
220 margin-bottom: 3px; |
|
221 } |
|
222 .center { |
|
223 text-align: center; |
|
224 } |
|
225 |
|
226 .content { |
|
227 width: 100%; |
|
228 margin-top: 40px; |
|
229 } |
|
230 |
|
231 #intro { |
|
232 padding: 0px 250px 20px 20px; |
|
233 } |
|
234 |
|
235 /*#intro span { |
|
236 background: url('img/logo.png') no-repeat scroll 50px 0px transparent; |
|
237 height: 56px; |
|
238 margin: 0px; |
|
239 width: 250px; |
|
240 float: right; |
|
241 margin: 0px; |
|
242 line-height: 24px; |
|
243 margin: 10px 200px 0 0; |
|
244 }*/ |
|
245 |
|
246 #intro h2 { |
|
247 font-family: georgia, times, serif; |
|
248 font-size: 30px; |
|
249 font-weight: normal; |
|
250 color: #333333; |
|
251 margin: 0px; |
|
252 } |
|
253 |
|
254 #intro p { |
|
255 color: #555555; |
|
256 font-size: 14px; |
|
257 font-weight: normal; |
|
258 line-height: 26px; |
|
259 margin: 10px 0 0; |
|
260 padding: 0; |
|
261 } |
|
262 |
|
263 .column1, .column2, .column3 { |
|
264 display: inline; |
|
265 float: left; |
|
266 margin-right: 25px; |
|
267 position: relative; |
|
268 width: 270px; |
|
269 } |
|
270 |
|
271 .column3 { |
|
272 margin-right: 0px; |
|
273 } |
|
274 |
|
275 .column1 img, .column2 img, .column3 img { |
|
276 width: 270px; |
|
277 } |
|
278 |
|
279 |
|
280 #main { |
|
281 float: left; |
|
282 padding: 0px 0px 0px 20px; |
|
283 width: 600px; |
|
284 } |
|
285 |
|
286 #full { |
|
287 float: left; |
|
288 padding: 0px 20px 0px 20px; |
|
289 width: 860px; |
|
290 } |
|
291 |
|
292 #main h2, #full h2 { |
|
293 font-size: 22px; |
|
294 font-weight: normal; |
|
295 color: #333333; |
|
296 margin: 30px 0px 10px 0px; |
|
297 padding: 0px; |
|
298 clear: both; |
|
299 } |
|
300 |
|
301 #main h4, #full h4 { |
|
302 font-size: 18px; |
|
303 color: #333333; |
|
304 font-family: georgia, serif; |
|
305 font-style: italic; |
|
306 font-weight: normal; |
|
307 } |
|
308 |
|
309 #main p, #full p, #main li, #full li{ |
|
310 color: #444444; |
|
311 line-height: 20px; |
|
312 margin: 0px 0px 10px; |
|
313 } |
|
314 |
|
315 .cleanlist li { |
|
316 font-size: 13px; |
|
317 list-style: none; |
|
318 padding: 0px; |
|
319 clear: both; |
|
320 } |
|
321 |
|
322 .screenshots img { |
|
323 width: 250px; |
|
324 } |
|
325 |
|
326 #sidebar { |
|
327 -moz-border-radius: 10px 10px 10px 10px; |
|
328 background: #FDF1CD; |
|
329 border: 1px solid #CCCCCC; |
|
330 float: right; |
|
331 margin-top: 34px; |
|
332 padding: 20px 20px 15px; |
|
333 width: 220px; |
|
334 } |
|
335 |
|
336 #sidebar h3 { |
|
337 color: #333333; |
|
338 margin: 1px 0px 10px 0px; |
|
339 } |
|
340 |
|
341 #sidebarsimple { |
|
342 float: right; |
|
343 margin-top: 34px; |
|
344 } |
|
345 |
|
346 .newslist { |
|
347 margin: 0px; |
|
348 padding: 0px; |
|
349 } |
|
350 |
|
351 .newslist li { |
|
352 font-size: 13px; |
|
353 list-style: none; |
|
354 padding: 0; |
|
355 } |
|
356 |
|
357 .newslist li a { |
|
358 /*color: #555555;*/ |
|
359 display: block; |
|
360 font-size: 12px; |
|
361 font-weight: bold; |
|
362 list-style: none; |
|
363 margin: 0px; |
|
364 padding: 10px 0px 10px 0px; |
|
365 text-decoration: none; |
|
366 border-bottom: 1px solid #EFEFEF; |
|
367 } |
|
368 |
|
369 .newslist li p { |
|
370 color: #777777; |
|
371 font-size: 10px; |
|
372 font-weight: normal; |
|
373 margin: 4px 0px 0px; |
|
374 padding: 0px; |
|
375 } |
|
376 |
|
377 #menu { |
|
378 height:45px; |
|
379 z-index: 1; |
|
380 } |
|
381 |
|
382 #menu .active a { |
|
383 background-position: 0px -180px; |
|
384 } |
|
385 |
|
386 #menu ul { |
|
387 list-style: none; |
|
388 padding: 0px; |
|
389 margin: 0px; |
|
390 } |
|
391 |
|
392 #menu li { |
|
393 float: left; |
|
394 margin-right: 0px; |
|
395 margin-left:0px; |
|
396 padding: 0px; |
|
397 text-align: center; |
|
398 } |
|
399 |
|
400 #menu .mlogo { |
|
401 border:0px; |
|
402 } |
|
403 |
|
404 #menu .mlogo a { |
|
405 display:block; |
|
406 width: 198px; |
|
407 height: 52px; |
|
408 position: relative; |
|
409 top: -4px; |
|
410 background: url('img/inmenulogo.png'); |
|
411 } |
|
412 |
|
413 #menu .mlogo a:hover { |
|
414 background: url('img/inmenulogo.png'); |
|
415 background-position: 0px -52px; |
|
416 } |
|
417 |
|
418 #menu .last { |
|
419 width:40px; |
|
420 height: 45px; |
|
421 background: url('img/last.png'); |
|
422 } |
|
423 |
|
424 #menu .mdonate a { |
|
425 display: block; |
|
426 width: 110px; |
|
427 height: 45px; |
|
428 float:right; |
|
429 background: url('img/inmenudonate.png'); |
|
430 color: #FFFFFF; |
|
431 text-indent: -23px; |
|
432 } |
|
433 |
|
434 #menu .mdonate a:hover { |
|
435 background: url('img/inmenudonate.png'); |
|
436 background-position: 0px -45px; |
|
437 } |
|
438 |
|
439 #menu li a { |
|
440 background: #CCCCCC url('img/menubar.png') 0px -90px; |
|
441 color: #2A2A2A; |
|
442 line-height: 45px; |
|
443 width: 148px; |
|
444 display: block; |
|
445 text-decoration: none; |
|
446 font-weight: bold; |
|
447 font-size: 11px; |
|
448 height: 45px; |
|
449 overflow: hidden; |
|
450 } |
|
451 |
|
452 #menu li a:hover { |
|
453 background: #FFFFFF url('img/menubar.png') 0px -135px; |
|
454 color:#FFFFFF; |
|
455 } |
|
456 |
|
457 #menu ul li ul { |
|
458 width: 201px; |
|
459 list-style: none; |
|
460 position: absolute; |
|
461 display: none; |
|
462 } |
|
463 |
|
464 #menu ul li ul li, |
|
465 #menu .active ul li ul li { |
|
466 width: 148px; |
|
467 } |
|
468 |
|
469 #menu ul li .subcap { |
|
470 background: url('img/sub_tail.png'); |
|
471 display: block; |
|
472 width: 149px; |
|
473 height: 5px; |
|
474 } |
|
475 |
|
476 #menu ul li ul li a, |
|
477 #menu .active ul li ul li a { |
|
478 background: url('img/sub_bg.png'); |
|
479 line-height: 25px; |
|
480 width: 142px; |
|
481 height: 22px; |
|
482 font-weight: normal; |
|
483 color: #2A2A2A; |
|
484 text-align: left; |
|
485 display: block; |
|
486 padding-left: 5px; |
|
487 border-left: 1px solid #8B7E57; |
|
488 border-right: 1px solid #8B7E57; |
|
489 } |
|
490 |
|
491 #menu ul li ul li a:hover, |
|
492 #menu .active ul li a:hover { |
|
493 background: #FBCA4C; |
|
494 color: #2A2A2A; |
|
495 text-decoration: none; |
|
496 font-weight: bold; |
|
497 } |
|
498 |
|
499 #menu li:hover ul ul, |
|
500 #menu li:hover ul ul ul { |
|
501 display: none; |
|
502 } |
|
503 |
|
504 #menu li:hover ul, |
|
505 #menu li li:hover ul, |
|
506 #menu li li li:hover ul { |
|
507 display: block; |
|
508 z-index:3; |
|
509 } |
|
510 |
|
511 .donate_header { |
|
512 display: block; |
|
513 position: relative; |
|
514 top: -40px; |
|
515 height: 170px; |
|
516 background: url('img/heart.png') no-repeat; |
|
517 background-position: 550px 10px; |
|
518 font-size: 26px; |
|
519 border-bottom: 1px solid #CCCCCC; |
|
520 margin-bottom: 0px; |
|
521 z-index: -100; |
|
522 } |
|
523 |
|
524 .donate_header .text { |
|
525 position:relative; |
|
526 left: 180px; |
|
527 top: 40px; |
|
528 text-align:center; |
|
529 } |
|
530 |
|
531 .donate_header b { |
|
532 color: #D50D35; |
|
533 } |
|
534 |
|
535 .download_header { |
|
536 height:160px; |
|
537 background: url('img/download_bg.png') no-repeat; |
|
538 background-position: 690px 10px; |
|
539 font-size:26px; |
|
540 border-bottom: 1px solid #CCCCCC; |
|
541 margin-bottom:8px; |
|
542 } |
|
543 |
|
544 .download_header .text { |
|
545 position:relative; |
|
546 left: 120px; |
|
547 top: 40px; |
|
548 text-align:center; |
|
549 } |
|
550 |
|
551 .download_header b { |
|
552 color: #D50D35; |
|
553 } |
|
554 |
|
555 .dlbutton2 a { |
|
556 background-color: #6AC221; |
|
557 -moz-border-radius: 10px 10px 10px 10px; |
|
558 display: block; |
|
559 font-size: 150%; |
|
560 font-weight: bold; |
|
561 margin: 10px 20px 20px; |
|
562 padding: 10px; |
|
563 text-align: center; |
|
564 color: #FFFFFF; |
|
565 } |
|
566 |
|
567 .dlbutton2 a:hover { |
|
568 background: #81C72B; |
|
569 text-decoration: none; |
|
570 } |
|
571 |
|
572 .dlbutton2 img { |
|
573 float:right; |
|
574 position: relative; |
|
575 right: 45px; |
|
576 top: 8px; |
|
577 } |
|
578 |
|
579 .version { |
|
580 color: #FFFFFF; |
|
581 font-size: 75%; |
|
582 font-weight: normal; |
|
583 } |
|
584 |
|
585 #footer { |
|
586 background: #EBEBEB; |
|
587 font-size: 11px; |
|
588 padding-bottom: 20px; |
|
589 color: #333333; |
|
590 text-align: center; |
|
591 margin-top: 30px; |
|
592 height: 15em; |
|
593 width: 100%; |
|
594 } |
|
595 |
|
596 #sitemap { |
|
597 margin: auto; |
|
598 width: 900px; |
|
599 text-align: left; |
|
600 } |
|
601 |
|
602 #sitemap ul { |
|
603 list-style:none; |
|
604 float: left; |
|
605 width: 130px; |
|
606 margin-left: 20px; |
|
607 padding: 0px; |
|
608 } |
|
609 |
|
610 #sitemap li { |
|
611 font-size: 12px; |
|
612 line-height: 19px; |
|
613 padding: 0px; |
|
614 } |
|
615 |
|
616 #sitemap li { |
|
617 font-size: 12px; |
|
618 line-height: 19px; |
|
619 padding: 0px; |
|
620 } |
|
621 |
|
622 #sitemap ul li a { |
|
623 color: #555555; |
|
624 text-decoration: none; |
|
625 } |
|
626 |
|
627 #sitemap ul li a:hover { |
|
628 text-decoration: underline; |
|
629 } |