defaria.com/css/Default.css

   1 /************************************************************************/
   2 /* File:        Styles.css                                              */
   3 /* Description: Cascading Style Sheet definitions for site              */
   4 /* Author:      Andrew@DeFaria.com                                      */
   5 /* Created:     Mon Nov  3 21:55:05 PST 2003                            */
   6 /* Language:    Cascading Style Sheet                                   */
   7 /*                                                                      */
   8 /* (c) Copyright 2003, Andrew@DeFaria.com, all rights reserved.         */
   9 /************************************************************************/
  10 body {
  11   background:           white;
  12   background-image:     url(/Images/Pattern1.gif);
  13   background-repeat:    repeat-y;
  14   margin:               3px;
  15   padding:              2px;
  16   font-family:          trebuchet MS,
  17                         trebuchet,
  18                         verdana,
  19                         sans-serif,
  20                         arial;
  21   font-size:            20px;
  22   color:                black;
  23 }
  24
  25 .heading {
  26   margin-left:          140px;
  27   margin-top:           5px;
  28   padding:              5px;
  29 }
  30
  31 .leftbar {
  32   line-height:          18px;
  33   height:               auto;
  34   left:                 2px;
  35   position:             absolute;
  36   top:                  5px;
  37   width:                135px;
  38 }
  39
  40 h1, h2, h3, h4, h5 {
  41   color:                #005A9C;
  42 }
  43
  44 h1.centered {
  45   text-align:           center;
  46 }
  47
  48 h1 {
  49   font-size:            1.5em;
  50 }
  51
  52 h2 {
  53   font-size:            1em;
  54 }
  55
  56 h3 {
  57   font-size:            .75em;
  58 }
  59
  60 h4 {
  61   font-size:            .5em;
  62 }
  63
  64 h5 {
  65   font-size:            .25em;
  66 }
  67
  68 #content {
  69   margin-left:          140px;
  70   font-size:            16px;
  71 }
  72
  73 #content p {
  74   line-height:          15px;
  75   font-size:            16px;
  76   font-family:          Times New Roman,
  77                         Arial;
  78   color:                black;
  79 }
  80
  81 #menu {
  82   float:                left;
  83   width:                120px;
  84   background:           #336699;
  85   margin-left:          2px;
  86   margin-bottom:        2px;
  87   padding:              2px;
  88   border:               2px groove black;
  89   font-family:          Times New Roman,
  90                         Arial;
  91   font-size:            20px;
  92 }
  93
  94 #menu a {
  95   text-decoration:      none;
  96   font-family:          Georgia,
  97                         Arial;
  98   font-size:            16px;
  99 }
 100 #menu a:link {
 101   text-decoration:      none;
 102   color:                #99CCFF;
 103 }
 104
 105 #menu a:visited {
 106   text-decoration:      none;
 107   color:                white;
 108 }
 109
 110 #menu a:active {
 111   text-decoration:      none;
 112   color:                Red;
 113 }
 114
 115 #menu a:hover {
 116   text-decoration:      none;
 117   color:                White;
 118   background:           #993333;
 119 }
 120
 121 #search {
 122   float:                left;
 123   width:                120px;
 124   background:           #f1d79e;
 125   color:                #a57b46;
 126   font-family:          Georgia,
 127                         Arial;
 128   font-weight:          bold;
 129   font-size:            16px;
 130   margin:               2px;
 131   padding:              2px;
 132   text-align:           center;
 133   border:               solid 2px #716c5b;
 134 }
 135
 136 #q {
 137   font-size:            70%;
 138   font-weight:          normal;
 139   background:           #fae8ba;
 140   border:               solid 1px #e3c690;
 141   border-bottom-color:  #f1d79e;
 142   border-right-color:   #f1d79e;
 143   padding:              2px;
 144   width:                90%;
 145 }
 146 #q:hover, #q:focus {
 147   background:           white;
 148 }
 149
 150 #emailsearch {
 151   float:                left;
 152   width:                120px;
 153   background:           #f1d79e;
 154   color:                #a57b46;
 155   font-family:          Arial;
 156   font-weight:          bold;
 157   font-size:            10px;
 158   margin:               2px;
 159   padding:              2px;
 160   text-align:           center;
 161   border:               solid 2px #716c5b;
 162 }
 163
 164 #emailsearch a {
 165   text-decoration:      none;
 166   font-family:          Arial;
 167   font-size:            10px;
 168 }
 169 #emailsearch a:link {
 170   text-decoration:      none;
 171   color:                #0080c0;
 172 }
 173
 174 #emailsearch a:visited {
 175   color:                #4A7184;
 176   text-decoration:      none;
 177 }
 178
 179 #emailsearch a:active {
 180   text-decoration:      none;
 181   color:                #999966;
 182 }
 183
 184 #emailsearch a:hover {
 185   text-decoration:      none;
 186   color:                blue;
 187   background:           #ffff80;
 188 }
 189
 190 #emailsearchfield {
 191   font-size:            14px;
 192   font-weight:          normal;
 193   background:           #fae8ba;
 194   border:               solid 1px #e3c690;
 195   border-bottom-color:  #f1d79e;
 196   border-right-color:   #f1d79e;
 197   padding:              2px;
 198   width:                90%;
 199 }
 200 #emailsearchfield:hover, #emailsearchfield:focus {
 201   background:           white;
 202 }
 203
 204 body.pop {
 205   background:           #fff;
 206   margin-top:           0px;
 207   margin-left:          0px;
 208   margin-right:         0px;
 209   padding:              0;
 210   background-image:     url(images/logo-small.gif);
 211   background-repeat:    repeat-x;
 212 }
 213
 214 a {
 215   color:                #4A7184;
 216   text-decoration:      none;
 217   font-family:          trebuchet MS,
 218                         trebuchet,
 219                         verdana,
 220                         arial,
 221                         sans-serif;
 222   font-size:            14px;
 223   font-weight:          bold;
 224 }
 225
 226 a:link {
 227   color:                #0080c0;
 228 }
 229
 230 a:visited {
 231   color:                #4A7184;
 232 }
 233
 234 a:active {
 235   color:                #999966;
 236 }
 237
 238 a:hover {
 239   color:                blue;
 240   background:           #ffff80;
 241 }
 242
 243 #menuhover a:hover {
 244   background: black;
 245 }
 246
 247 /* For hovering over img's set the background to transparent. */
 248 /* Note that dipslay: block is required here!                 */
 249 a:hover img {
 250   text-align:           center;
 251 }
 252
 253 /* For img's that happen to be links, don't put that silly    */
 254 /* border!                                                    */
 255 img {
 256   border:               none;
 257 }
 258
 259 font {
 260   font-family:          trebuchet MS,
 261                         trebuchet,
 262                         verdana,
 263                         arial,
 264                         sans-serif;
 265   font-weight:          normal;
 266   text-transform:       none;
 267 }
 268
 269 font.title {
 270   font-family:          trebuchet MS,
 271                         trebuchet,
 272                         verdana,
 273                         arial,
 274                         sans-serif;
 275   font-size:            11px;
 276   color:                #666;
 277   line-height:          15px;
 278 }
 279
 280 font.title-list {
 281   font-family:          trebuchet MS,
 282                         trebuchet,
 283                         verdana,
 284                         arial,
 285                         sans-serif;
 286   font-size:            11px;
 287   color:                #666;
 288   line-height:          15px;
 289 }
 290
 291 font.bold-label {
 292   font-family:          trebuchet MS,
 293                         trebuchet,
 294                         verdana,
 295                         arial,
 296                         sans-serif;
 297   font-size:             11px;
 298   color:                 #666;
 299   font-weight:           bold;
 300 }
 301
 302 font.title-no-padding {
 303   font-family:          trebuchet MS,
 304                         trebuchet,
 305                         verdana,
 306                         arial,
 307                         sans-serif;
 308   font-size:            11px;
 309   color:                #FFF;
 310 }
 311
 312 font.title-padding {
 313   font-family:          trebuchet MS,
 314                         trebuchet,
 315                         verdana,
 316                         arial,
 317                         sans-serif;
 318   font-size:            11px;
 319   color:                #FFF;
 320   line-height:          15px;
 321   padding:              5px;
 322 }
 323
 324 font.title-padding-grey {
 325   font-family:          trebuchet MS,
 326                         trebuchet,
 327                         verdana,
 328                         arial,
 329                         sans-serif;
 330   font-size:            11px;
 331   color:                #333;
 332   line-height:          15px;
 333   padding:              5px;
 334 }
 335
 336 font.pagetitle {
 337   font-family:          trebuchet MS,
 338                         trebuchet,
 339                         verdana,
 340                         arial,
 341                         sans-serif;
 342   font-size:            12px;
 343   color:                #666;
 344   line-height:          15px;
 345   font-weight:          bold;
 346 }
 347
 348 font.pagetitlelink {
 349   font-family:          trebuchet MS,
 350                         trebuchet,
 351                         verdana,
 352                         arial,
 353                         sans-serif;
 354   font-size:            12px;
 355   color:                #336699;
 356   line-height:          15px;
 357   font-weight:          bold;
 358 }
 359
 360 font.plain {
 361   font-family:          trebuchet MS,
 362                         trebuchet,
 363                         verdana,
 364                         arial,
 365                         sans-serif;
 366   font-size:            11px;
 367   color:                #666;
 368   line-height:          15px;
 369 }
 370
 371 font.instructional {
 372   font-family:          verdana,
 373                         arial,
 374                         sans-serif;
 375   font-size:            10px;
 376   color:                #666;
 377   line-height:          13px;
 378   text-align:           justify;
 379 }
 380
 381 .message {
 382   font-family:          verdana,
 383                         arial,
 384                         sans-serif;
 385   font-size:            11px;
 386   color:                #669966;
 387   line-height:          13px;
 388   font-weight:          bold;
 389   margin-bottom:        10px;
 390 }
 391
 392 .message a {
 393   font-family:          verdana,
 394                         arial,
 395                         sans-serif;
 396   font-size:            11px;
 397 }
 398
 399 .standout {
 400   font-family:          verdana,
 401                         arial,
 402                         sans-serif;
 403   font-size:            12px;
 404   color:                #993333;
 405   line-height:          13px;
 406   font-weight:          bold;
 407   margin-bottom:        10px;
 408 }
 409
 410 .error-message {
 411   font-family:          verdana,
 412                         arial,
 413                         sans-serif;
 414   font-size:            11px;
 415   color:                #993333;
 416   line-height:          13px;
 417   font-weight:          bold;
 418   margin-bottom:        10px;
 419 }
 420
 421 .error-message a {
 422   font-family:          verdana,
 423                         arial,
 424                         sans-serif;
 425   font-size:            21px;
 426 }
 427
 428 font.instructional-just {
 429   font-family:          verdana,
 430                         arial,
 431                         sans-serif;
 432   font-size:            10px;
 433   color:                #666;
 434   line-height:          13px;
 435 }
 436
 437 font.head1 {
 438   font-family:          trebuchet MS,
 439                         trebuchet,
 440                         verdana,
 441                         arial,
 442                         sans-serif;
 443   font-size:            11px;
 444   color:                #336699;
 445   line-height:          15px;
 446   font-weight:          bold;
 447 }
 448
 449 font.command {
 450   font-family:          trebuchet MS,
 451                         trebuchet,
 452                         verdana,
 453                         arial,
 454                         sans-serif;
 455   font-size:            12px;
 456   line-height:          15px;
 457   text-transform:       uppercase;
 458   font-weight:          bold;
 459 }
 460
 461 font.command-grey {
 462   font-family:          trebuchet MS,
 463                         trebuchet,
 464                         verdana,
 465                         arial,
 466                         sans-serif;
 467   font-size:            12px;
 468   line-height:          15px;
 469   color:                #666;
 470   font-weight:          bold;
 471 }
 472
 473 p {
 474   color:                black;
 475   font-family:          trebuchet MS,
 476                         trebuchet,
 477                         verdana,
 478                         geneva,
 479                         arial,
 480                         helvetica,
 481                         sans-serif;
 482   font-size:            11px;
 483   line-height:          14px;
 484 }
 485
 486 ul {
 487   color:                black;
 488   font-family:          trebuchet MS,
 489                         trebuchet,
 490                         verdana,
 491                         helvetica,
 492                         sans-serif;
 493   font-size:            14px;
 494   line-height:          16px;
 495 }
 496
 497 li {
 498   font-family:          trebuchet MS,
 499                         trebuchet,
 500                         verdana,
 501                         helvetica,
 502                         sans-serif;
 503   font-size:            14px;
 504   line-height:          16px;
 505 }
 506
 507 .box {
 508   padding:              5px;
 509   background-color:     #ffffea;
 510   color:                rgb(165, 42, 42);
 511   font-size:            8pt;
 512   margin-bottom:        5px;
 513   margin-left:          auto;
 514   margin-right:         auto;
 515   border-top:           4px solid #804000;
 516   border-left:          1px solid #804000;
 517   border-bottom:        1px solid #aca899;
 518   border-right:         1px solid #aca899;
 519   width:                75%;
 520   text-align:           center;
 521   border-radius:        7px;
 522   -moz-border-radius:   7px;
 523 }
 524
 525 .padded-box {
 526   border:               1px solid #696;
 527   padding:              5px;
 528   margin-top:           50px;
 529   text-align:           center;
 530   background:           #ccc;
 531 }
 532
 533 .copyright {
 534   border-bottom:        1px dotted #ccc;
 535   border-top:           1px dotted #ccc;
 536   color:                #999;
 537   font-family:          verdana,
 538                         arial,
 539                         sans-serif;
 540   font-size:            10px;
 541   margin-top:           5px;
 542   text-align:           center;
 543   width:                auto;
 544 }
 545
 546 .copyright a {
 547   font-size:            10px;
 548 }
 549
 550 .input {
 551   font-family:          verdana,
 552                         arial,
 553                         sans-serif;
 554   font-size:            11px;
 555   font-weight:          bold;
 556   color:                #666;
 557 }
 558
 559 input.search {
 560   font-family:          verdana,
 561                         arial,
 562                         sans-serif;
 563   font-size:            10px;
 564   color:                #666;
 565   background:           #222;
 566   font-weight:          normal;
 567 }
 568
 569 input.text {
 570   width:                292px;
 571   height:               20px;
 572 }
 573
 574 input.num {
 575   width:                16px;
 576   height:               20px;
 577 }
 578
 579 input.num4 {
 580   width:                32px;
 581   height:               20px;
 582 }
 583
 584 input.text-short {
 585   width:                175px;
 586   height:               20px;
 587 }
 588
 589 input.text-large {
 590   width:                250px;
 591   height:               20px;
 592   margin-bottom:        5px;
 593 }
 594
 595 input.button {
 596   width:                100px;
 597   font-family:          verdana,
 598                         arial,
 599                         sans-serif;
 600   font-size:            11px;
 601   font-weight:          bold;
 602   color:                #666;
 603   text-transform:       uppercase;
 604 }
 605
 606 input.button-big {
 607   width:                150px;
 608   font-family:          verdana,
 609                         arial,
 610                         sans-serif;
 611   font-size:            11px;
 612   font-weight:          bold;
 613   color:                #666;
 614   text-transform:       uppercase;
 615 }
 616
 617 input.weird-button {
 618   width:                75px;
 619   font-family:          verdana,
 620                         arial,
 621                         sans-serif;
 622   font-size:            11px;
 623   font-weight:          bold;
 624   color:                #000;
 625   background-color:     #FFF;
 626   text-transform:       uppercase;
 627 }
 628
 629 input.button-small {
 630   width:                50px;
 631   font-family:          verdana,
 632                         arial,
 633                         sans-serif;
 634   font-size:            11px;
 635   font-weight:          bold;
 636   color:                #666;
 637   text-transform:       uppercase;
 638 }
 639
 640 input.button-search {
 641   width:                75px;
 642   font-family:          verdana,
 643                         arial,
 644                         sans-serif;
 645   font-size:            10px;
 646   font-weight:          bold;
 647   color:                #666;
 648   text-transform:       lowercase;
 649 }
 650
 651 input.button-go {
 652   width:                100px;
 653   font-family:          verdana,
 654                         arial,
 655                         sans-serif;
 656   font-size:            11px;
 657   font-weight:          bold;
 658   color:                #666;
 659   background-color:     #C5D1C7;
 660   text-transform:       uppercase;
 661 }
 662
 663 input.cbox {
 664   vertical-align:       3px;
 665 }
 666
 667 select {
 668   font-family:          verdana,
 669                         arial,
 670                         sans-serif;
 671   font-weight:          bold;
 672   color:                #666;
 673   font-size:            11px;
 674 }
 675
 676 select.menu {
 677   width:                106px;
 678 }
 679
 680 select.menu-long {
 681   width:                225px;
 682 }
 683
 684 select.blog {
 685   width:                165px;
 686   color:                #666;
 687   font-size:            10px;
 688 }
 689
 690 select.category {
 691   width:                150px;
 692 }
 693
 694 select.menu-short {
 695   width:                130px;
 696 }
 697
 698 textarea {
 699   font-family:          verdana,
 700                         arial,
 701                         sans-serif;
 702   color:                #333;
 703   background-color:     #FFF;
 704   font-size:            11px;
 705 }
 706
 707 textarea.width500 {
 708   font-family:          verdana,
 709                         arial,
 710                         sans-serif;
 711   color:                #333;
 712   background-color:     #FFF;
 713   font-size:            11px;
 714   width:                486px;
 715 }
 716
 717 textarea.config {
 718   font-family:          verdana,
 719                         arial,
 720                         sans-serif;
 721   color:                #333;
 722   font-size:            11px;
 723   width:                292px;
 724 }
 725
 726 textarea.wide {
 727   font-family:          verdana,
 728                         arial,
 729                         sans-serif;
 730   color:                #333;
 731   background-color:     #FFF;
 732   font-size:            11px;
 733 }
 734
 735 textarea.short310 {
 736   font-family:          verdana,
 737                         arial,
 738                         sans-serif;
 739   color:                #333;
 740   background-color:     #FFF;
 741   font-size:            11px;
 742   width:                310px;
 743 }
 744
 745 textarea.short340 {
 746   font-family:          verdana,
 747                         arial,
 748                         sans-serif;
 749   color:                #333;
 750   background-color:     #FFF;
 751   font-size:            11px;
 752   width:                340px;
 753 }
 754 /* Code */
 755 .code {
 756   border:               2px solid #336699;
 757   padding:              5px;
 758   margin-top:           20px;
 759   background:           #ffffea;
 760   color:                black;
 761   font-size:            14px;
 762   font-family:          courier;
 763   border-radius:        10px;
 764   -moz-border-radius:   10px;
 765 }
 766
 767 #code {
 768   color:                black;
 769   font-size:            14px;
 770   font-family:          courier;
 771   padding-left:         5px;
 772 }
 773
 774 #line-number {
 775   color:                #804000;
 776   font-family:          Arial;
 777   font-size:            14px;
 778   padding-right:        5px;
 779   border-right:         1px dotted #804000;
 780 }
 781
 782 .rightbox {
 783   float: right;
 784   padding: 5px;
 785 }
 786
 787 .highlightbox {
 788   border:               solid;
 789   border-top-color:     #336699;
 790   border-top-width:     4pt;
 791   border-left-color:    #336699;
 792   border-left-width:    1pt;
 793   border-bottom-color:  #000000;
 794   border-bottom-width:  1pt;
 795   border-right-color:   #000000;
 796   border-right-width:   1pt;
 797   background-color:     #eeeeee;
 798   font-size:            8pt;
 799   padding:              5px;
 800   float:                right;
 801   text-align:           center;
 802   width:                200px;
 803   border-radius:        7px;
 804   -moz-border-radius:   7px;
 805 }
 806
 807 .centered {
 808   text-align:           center;
 809   margin-left:          auto;
 810   margin-right:         auto;
 811 }
 812
 813 .floatright {
 814   float:                right;
 815 }
 816
 817 .floatcenter {
 818   text-align:           center;
 819 }
 820
 821 pre {
 822   white-space:          pre-wrap;       /* css-3 */
 823   white-space:          -moz-pre-wrap;  /* Mozilla, since 1999 */
 824   white-space:          -pre-wrap;      /* Opera 4-6 */
 825   white-space:          -o-pre-wrap;    /* Opera 7 */
 826   word-wrap:            break-word;     /* Internet Explorer 5.5+ */
 827 }