查看 | 历史 | 提交 | 提交对比
hjg
2024-07-09 30304784e82d4bba24121328da8eb8490aec4f4f
提交 | 用户 | 时间
58d006 1 /********************************************
A 2    AUTHOR:              Erwin Aligam 
3    WEBSITE:               http://www.styleshout.com/
4    TEMPLATE NAME:     Techmania 1.0
5     TEMPLATE CODE:     S-0003
6     VERSION:         1.1              
7  *******************************************/
8     /********************************************
9    HTML ELEMENTS
10 ********************************************/ /* Top elements */
11     /** { margin:0; padding: 0; }*/
12 body {
13     background-color: #000;
14     color: #555;
15     font: 78%/ 1.6 Verdana, 'Trebuchet MS', arial, sans-serif;
16     text-align: center;
17     margin: 15px 0;
18 }
19
20 /* links */
21 a {
22     color: #213540;
23     background: inherit;
24     text-decoration: none;
25 }
26
27 a:hover {
28     color: #3e4255;
29     text-decoration: underline;
30     background: inherit;
31 }
32
33 /* headers */
34 h1,h2,h3 {
35     font-family: 'Trebuchet MS', Arial, sans-serif;
36     font-weight: bold;
37 }
38
39 h1 {
40     font-size: 1.5em;
41     margin: 10px 15px;
42 }
43
44 h2 {
45     font-size: 1.3em;
46     text-transform: uppercase;
47     color: #339900;
48     margin: 10px 15px;
49 }
50
51 h3 {
52     font-size: 1.1em;
53     color: #333;
54     margin: 16px 0 0 18px;
55 }
56
57 h1,h2,h3 {
58     padding: 0;
59 }
60
61 p {
62     line-height: 1.4em;
63     padding: 0 15px;
64 }
65
66 p.error {
67     color: #CC0033;
68 }
69
70 ul,ol {
71     margin: 10px 6px;
72     padding: 0 15px;
73     color: #006699;
74 }
75
76 ul span,ol span {
77     color: #666666;
78 }
79
80 /* images */
81 img {
82     border: 2px solid #CCC;
83 }
84
85 img.float-right {
86     margin: 5px 0px 10px 10px;
87 }
88
89 img.float-left {
90     margin: 5px 10px 10px 0px;
91 }
92
93 code {
94     margin: 5px 0;
95     padding: 10px;
96     text-align: left;
97     display: block;
98     overflow: auto;
99     font: 500 1em/ 1.5em 'Lucida Console', 'courier new', monospace;
100     /* white-space: pre; */
101     background: #FAFAFA;
102     border: 1px solid #EAEAEA;
103     border-left: 5px solid #72A545;
104 }
105
106 acronym {
107     cursor: help;
108     border-bottom: 1px solid #777;
109 }
110
111 blockquote {
112     margin: 15px;
113     padding: 0 0 0 32px;
114     background: #FAFAFA url(quote.gif) no-repeat 5px 10px !important;
115     background-position: 8px 10px;
116     border: 1px solid #EAEAEA;
117     border-left: 5px solid #72A545;
118     font-weight: bold;
119 }
120
121 /* form elements */
122 fieldset {
123     margin: 12px 12px 18px;
124     padding-left: 6px;
125     border: 1px solid #004080;
126     color: #006699;
127 }
128
129 fieldset fieldset {
130     border: 1px solid #9ea190;
131     margin: 17px 14px;
132 }
133
134 form {
135     margin: 10px 15px;
136     padding: 0;
137 }
138
139 label {
140     font-weight: bold;
141     margin: 5px 3px 0 0;
142     width: 160px;
143     text-align: right;
144     float: left;
145 }
146
147 legend {
148     font-size: 1.2em;
149     padding: 0 12px;
150     font-weight: 900;
151     background-color: #F9F9F9;
152 }
153
154 fieldset fieldset legend {
155     font-size: 1em;
156     color: #1a2129;
157     padding: 0 18px;
158     margin-left: 75px;
159 }
160
161 input {
162     padding: 3px;
163     margin: 4px 0;
164     border: 1px solid #CFCED3;
165     font: normal 1em Verdana, sans-serif;
166     color: #777;
167 }
168
169 textarea {
170     width: 400px;
171     padding: 4px;
172     font: normal 1em Verdana, sans-serif;
173     border: 1px solid #eee;
174     height: 100px;
175     display: block;
176     color: #777;
177 }
178
179 input.button {
180     margin: 0;
181     font: bold 12px Arial, Sans-serif;
182     border: 1px solid #EAEAEA;
183     padding: 3px 4px;
184     background: #CCC url(buttonbg.gif) repeat-x left bottom;
185     color: #333; /* color: #339900; */
186     cursor: pointer;
187 }
188
189 input.submitbutton {
190     background-color: #006699;
191     color: #FFF;
192     background-image: none;
193     font-weight: 900;
194     border: 1px solid #EAEAEA;
195     margin: 0 0 0 200px;
196 }
197
198 /* search */
199 #sidebar #search {
200     background: #f2f2f2;
201     margin: 0 15px;
202     padding: 5px 0;
203 }
204
205 #sidebar #search img {
206     vertical-align: bottom;
207 }
208
209 #sidebar #search .textbox {
210     background: #FFF url(input.png) no-repeat top left;
211     border: 1px solid #EAEAEA;
212     font-size: 11px;
213     padding: 3px;
214     width: 110px;
215 }
216
217 #sidebar #search input.searchbutton {
218     margin: 0;
219     font: bold 100% Arial, Sans-serif;
220     border: 1px solid #CCC;
221     background: #CCC url(buttonbg.gif) repeat-x left bottom;
222     padding: 1px;
223     height: 25px;
224     color: #333;
225     width: 55px;
226 }
227
228 /*****************************
229       LAYOUT 
230 ******************************/
231 #wrap {
232     margin: 0 auto;
233     padding: 0;
234     text-align: left;
235     background-color: #FFF;
236     width: 790px;
237 }
238
239 #content-wrap {
240     clear: both;
241     margin: 0;
242     padding: 0;
243     width: 790px;
244 }
245
246 /* header */
247 #header {
248     position: relative;
249     clear: left;
250     width: 790px;
251     height: 137px;
252     margin: 0;
253     padding: 0;
254     background: #000 url(headerbg.jpg) no-repeat left bottom;
255 }
256
257 #header h1#logo-text {
258     float: right;
259     margin: 39px 58px 0 0;
260     padding: 0;
261     font: bolder 3.2em 'Trebuchet MS', Arial, Sans-serif;
262     letter-spacing: -2px;
263     color: #FFF;
264     text-transform: none;
265     /* change the values of top and right to adjust the position of the logo*/
266     top: 35px;
267     right: 30px;
268 }
269
270 #header h2#slogan {
271     float: right;
272     margin: 0 38px 0 0;
273     padding: 0;
274     font: bold 1.5em 'Trebuchet MS', Arial, Sans-serif;
275     text-transform: none;
276     letter-spacing: 1px;
277     color: #FFF;
278     clear: both;
279     text-align: right;
280 }
281
282 #header h1#logo-text span {
283     color: #CFCED3;
284 }
285
286 /* menu tabs */
287 #header #header-tabs {
288     position: absolute;
289     top: 0;
290     left: 0;
291     width: 100%;
292     height: 25px;
293     background: #000;
294     font: bold 1.1em Verdana, Tahoma, 'Trebuchet MS', Sans-serif;
295 }
296
297 #header-tabs ul {
298     margin: 0;
299     padding: 2px 0px 0px 0px;
300     list-style: none;
301 }
302
303 #header-tabs li {
304     display: inline;
305     margin: 0;
306     padding: 0;
307 }
308
309 #header-tabs a {
310     float: left;
311     background: url(tableft.gif) no-repeat left top;
312     margin: 0;
313     padding: 0 0 0 4px;
314     text-decoration: none;
315 }
316
317 #header-tabs a span {
318     float: left;
319     display: block;
320     background: url(tabright.gif) no-repeat right top;
321     padding: 7px 15px 4px 8px;
322     color: #CCC;
323 }
324
325 /* Commented Backslash Hack hides rule from IE5-Mac \*/
326 #header-tabs a span {
327     float: none;
328 }
329
330 /* End IE5-Mac hack */
331 #header-tabs a:hover span {
332     color: #FFF;
333 }
334
335 #header-tabs a:hover {
336     background-position: 0% -42px;
337 }
338
339 #header-tabs a:hover span {
340     background-position: 100% -42px;
341 }
342
343 #header-tabs #current a {
344     background-position: 0% -42px;
345 }
346
347 #header-tabs #current a span {
348     background-position: 100% -42px;
349     color: #FFF;
350 }
351
352 /* main content */
353 #main {
354     width: 748px;
355     margin: 0;
356     padding: 8px 16px;
357     background-color: #F9F9F9;
358     border-left: 5px solid #000;
359     border-right: 5px solid #000;
360 }
361
362 #main h1 {
363     padding: 8px 0 3px 25px;
364     text-transform: none;
365     border-bottom: 2px solid #f2f2f2;
366     color: #339900;
367 }
368
369 /* sidebar */
370 #sidebar { /*    float: right;
371     width: 245px;
372     margin: 0 0 10px 0; padding: 0;
373     background-color: inherit;    */
374     display: none;
375 }
376
377 #sidebar h1 {
378     padding: 8px 0px 3px 25px;
379     background: url(square_arrow.gif) no-repeat 0% .7em;
380     text-transform: none;
381     color: #339900;
382 }
383
384 #sidebar ul.sidemenu {
385     list-style: none;
386     margin: 10px 15px;
387     padding: 0;
388 }
389
390 #sidebar ul.sidemenu li {
391     margin-bottom: 1px;
392     border: 1px solid #f2f2f2;
393 }
394
395 #sidebar ul.sidemenu a {
396     display: block;
397     font-weight: bold;
398     color: #333;
399     text-decoration: none;
400     padding: 2px 5px 2px 10px;
401     background: #f2f2f2;
402     border-left: 5px solid #CCC;
403     min-height: 18px;
404 }
405
406 * html body #sidebar ul.sidemenu a {
407     height: 18px;
408 }
409
410 #sidebar ul.sidemenu a:hover {
411     padding: 2px 5px 2px 10px;
412     background: #f2f2f2;
413     color: #339900;
414     border-left: 5px solid #72A545;
415 }
416
417 /* footer */
418 #footer {
419     clear: both;
420     height: 40px;
421     color: #CCC;
422     background: #000;
423     margin: 0;
424     font-size: 92%;
425 }
426
427 #footer a {
428     text-decoration: none;
429     font-weight: bold;
430     color: #FFF;
431 }
432
433 #footer #footer-left {
434     width: 68%;
435     float: left;
436     text-align: left;
437     margin: 0;
438     padding: 10px;
439 }
440
441 #footer #footer-right {
442     width: 25%;
443     float: right;
444     text-align: right;
445     margin: 0;
446     padding: 10px;
447 }
448
449 /* alignment classes */
450 .float-left {
451     float: left;
452 }
453
454 .float-right {
455     float: right;
456 }
457
458 .align-left {
459     text-align: left;
460 }
461
462 .align-right {
463     text-align: right;
464 }
465
466 /* additional classes */
467 .clear {
468     clear: both;
469 }
470
471 .hide {
472     display: none;
473 }
474
475 .gray {
476     color: #CCC;
477 }
478
479 .comments {
480     color: #333;
481     background: #FFF;
482     text-align: right;
483     border-top: 1px dashed #EFF0F1;
484     border-bottom: 1px dashed #EFF0F1;
485     padding: 5px 0;
486     margin-top: 20px;
487 }
488
489 html {
490     min-height: 100.1%;
491 }
492
493 /* ------ one ------------*/
494 body .mainText {
495     font-family: Arial, Helvetica, sans-serif;
496     font-size: 12px;
497 }
498
499 #demoText h1,.mainText h1 {
500     font-size: 130%;
501     color: #0099FF;
502     text-decoration: none;
503     font-family: Arial, Helvetica, sans-serif;
504     margin: 5px 4px 5px 24px;
505     background: none;
506     padding: 0;
507     border: none;
508     text-transform: capitalize;
509 }
510
511 .mainText h2 {
512     font-size: 110%;
513     color: #000033;
514     font-family: Arial, Helvetica, sans-serif;
515     text-decoration: none;
516     background: none;
517     margin: 4px 32px 6px 22px;
518     text-transform: capitalize;
519 }
520
521 .mainText h3 {
522     font-size: 120%;
523     font-weight: 900;
524     margin: 14px 0 0 0;
525     text-align: center;
526     color: #000033;
527 }
528
529 .mainText table {
530     width: 95%;
531     border: 1px solid #0099FF;
532     border-collapse: collapse;
533     margin: 18px 7px;
534 }
535
536 .mainText table td {
537     background-color: #99CCFF;
538     color: #000033;
539     padding: 4px;
540 }
541
542 .mainText table th {
543     background-color: #000033;
544     color: #99CCFF;
545     padding: 4px;
546 }
547
548 .mainText .linkPar a {
549     color: #000033;
550     text-decoration: underline;
551 }
552
553 .mainText .linkPar a:hover {
554     color: #660033;
555     text-decoration: none;
556     font-weight: 900;
557 }
558
559 .pusher {
560     cursor: pointer;
561     padding: 3px 10px 3px 22px;
562     font-weight: 900;
563     font-size: 14px;
564 }
565
566 /* ------------- form specific styles are here  -------------- */
567 fieldset {
568     margin: 0;
569     border: 1px solid #C3DE00;
570     padding: 10px;
571     /*border:none;
572 padding:0;*/
573     color: #7563A5;
574 }
575
576 legend {
577     background-color: #FFFFFF;
578     text-align: center;
579     color: #097981;
580     padding: 0 12px;
581 }
582
583 label {
584     text-align: right;
585     width: 298px;
586     border-right: 1px dotted #099;
587     padding-right: 5px;
588     margin: 0 0 8px 0;
589     float: left;
590     clear: left;
591     display: block;
592     color: #7563A5;
593 }
594
595 label.checkbox,label.textarea {
596     border: none;
597 }
598
599 label.lgfield {
600     border: none;
601     text-align: center;
602     clear: both;
603     float: none;
604     width: 100%;
605 }
606
607 fieldset input,fieldset select,fieldset textarea {
608     margin-left: 10px;
609     margin-bottom: 8px;
610 }
611
612 select.longfield {
613     margin: 0 0 0 115px;
614 }
615
616 input [type="radio"],input [type="checkbox"] {
617     margin: 2px 0 0 4px;
618 }
619
620 textarea {
621     width: 250px;
622     float: left;
623 }
624
625 /*Get Help Form Styles*/
626 p.formDisclaimer {
627     text-align: center;
628     margin: 32px 24px 12px 0;
629     font-style: italic;
630 }
631
632 div.buttonWrapper {
633     margin: 28px 0 14px 0;
634     clear: both;
635     text-align: center;
636 }
637
638 .formspacer {
639     height: 1em;
640     clear: both;
641 }
642
643 .hideField {
644     display: none;
645 }
646
647 .pushOpen {
648     height: 18em;
649 }
650
651 /* ----- error message for field validation ----- */
652 #stepForm label.warning {
653     text-align: left;
654     width: auto;
655     padding: 0;
656     margin: 0 0 0 10px;
657     float: none;
658     clear: none;
659     display: inline;
660     color: #CC3366;
661     font-size: 10px;
662     border: none;
663     border-top: 1px dotted #CC3366;
664 }
665
666 div.requiredNotice {
667     width: 140px;
668     float: right;
669     margin: 0 24px 0 0;
670     padding: 0;
671 }
672
673 h3.stepHeader {
674     text-align: left;
675     font-size: 16px;
676     font-weight: bold;
677     margin: 0 0 24px 24px;
678     color: #676cac;
679 }
680
681 ul#stepForm,ul#stepForm li {
682     margin: 0;
683     padding: 0;
684 }
685
686 ul#stepForm li {
687     list-style: none;
688 }
689
690 /* Form Buttons  */
691 input.submitbutton,.nextbutton,.prevbutton {
692     width: 100px;
693     height: 40px;
694     background-color: #663399;
695     padding: 4px;
696     border: 1px solid #339933;
697     cursor: pointer;
698     text-align: center;
699     color: #FFFFFF;
700     margin: 7px;
701 }
702
703 input.submitbutton {
704     background-color: #006699;
705 }