stylesheets/monobook/main.css

   1 /*
   2 ** Mediawiki 'mono' style sheet for CSS2-capable browsers.
   3 ** Copyright Gabriel Wicke - http://www.aulinx.de/
   4 **
   5 ** Based on http://www.positioniseverything.net/ordered-floats.html by Big John
   6 ** and the Plone 2.0 styles, see http://plone.org/.
   7 ** Alexander Limi - http://www.plonesolutions.com
   8 ** additional plone work:
   9 ** Joe Geldart & Tom Croucher - http://www.netalleynetworks.com, Michael Zeltner - http://niij.org,
  10 ** Geir Bækholt - http://www.plonesolutions.com
  11 ** All you guys rock :)
  12 */
  13
  14 #portal-columns {
  15     width: 100%;
  16     margin: 0;
  17 }
  18 #portal-column-content {
  19     width: 100%;
  20     float: right;
  21     margin: 0 0 0 -12.2em;
  22     padding:0;
  23 }
  24 #portal-column-content #content {
  25     margin: 2.7em 0 0 12.2em;
  26 }
  27 #portal-column-one {
  28     padding-top: 160px;
  29 }
  30 /* the left column width is specified in class .portlet */
  31
  32 /* Font size:
  33 ** We take advantage of keyword scaling- browsers won't go below 9px
  34 ** More at http://www.w3.org/2003/07/30-font-size
  35 ** http://style.cleverchimp.com/font_size_intervals/altintervals.html
  36 */
  37
  38 body {
  39     font: x-small "Bitstream Vera Sans", "Lucida Grande", Verdana, Lucida, Helvetica, Arial, sans-serif;
  40     background: #f9f9f9 url("headbg.jpg") 0px 0px no-repeat;
  41     color: Black;
  42     margin: 0;
  43     padding: 0;
  44 }
  45
  46 /* scale back up to a sane default */
  47 #visual-portal-wrapper {
  48     font-size:123%;
  49     width: 100%;
  50     margin: 0;
  51     padding: 0;
  52 }
  53
  54 /* general styles */
  55
  56 table {
  57     font-size: 100%;
  58 }
  59 a {
  60     text-decoration: none;
  61     /*color: #436976;*/
  62     color: #005189;
  63     background-color: transparent;
  64 }
  65 img {
  66     border: none;
  67     vertical-align: middle;
  68 }
  69 p {
  70     margin: 0.4em 0em 0.7em 0em;
  71     line-height: 1.5em;
  72 }
  73 p a {
  74     text-decoration: none;
  75 }
  76 p a:visited {
  77     color: #5a3696;
  78     background-color: transparent;
  79 }
  80 p a:active {
  81     color: Red;
  82     background-color: transparent;
  83 }
  84 p img {
  85     border: 0;
  86     margin: 0;
  87 }
  88
  89 hr {
  90     height: 1px;
  91     color: #aaaaaa;
  92     background-color: #aaaaaa;
  93     border: 0;
  94     margin: 0.2em 0 0.2em 0;
  95 }
  96
  97 h1, h2, h3, h4, h5, h6 {
  98     color: Black;
  99     background-color: transparent;
 100     font-family: "Lucida Grande", Verdana, Lucida, Helvetica, Arial, sans-serif;
 101     font-size: 100%;
 102     font-weight: normal;
 103     margin: 0;
 104     padding-top: 0.5em;
 105     padding-bottom: 0.17em;
 106    /* border-bottom: 1px solid #2f6fab;*/
 107     border-bottom: 1px solid #aaaaaa;
 108
 109 }
 110 h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {
 111     color: Black ! important;
 112 }
 113 h1 {
 114     font-size: 188%;
 115 }
 116 h2 {
 117     font-size: 150%;
 118 }
 119 h3 {
 120     font-size: 132%;
 121     border-bottom: none;
 122     font-weight: bold;
 123 }
 124 h4 {
 125     font-size: 116%;
 126     border-bottom: none;
 127     font-weight: bold;
 128 }
 129
 130 h5 {
 131     font-size: 100%;
 132     border-bottom: none;
 133     font-weight: bold;
 134 }
 135
 136 h6 {
 137     font-size: 80%;
 138     border-bottom: none;
 139     font-weight: bold;
 140 }
 141
 142
 143 ul {
 144     line-height: 1.5em;
 145     list-style-type: square;
 146     margin: 0.3em 0 0 1.5em;
 147     padding:0;
 148     list-style-image: url("bullet.gif");
 149 }
 150 ol {
 151     line-height: 1.5em;
 152     margin: 0.3em 0 0 1.5em;
 153     padding:0;
 154 }
 155 ul a, ol a {
 156     text-decoration: none;
 157 }
 158 li {
 159     margin-bottom: 0.1em;
 160 }
 161 dt {
 162     font-weight: bold;
 163 }
 164 dt a {
 165     text-decoration: none;
 166 }
 167
 168 dd {
 169     line-height: 1.5em;
 170     margin-bottom: 0.8em;
 171     margin-left: 1.4em;
 172 }
 173 dd a {
 174     text-decoration: none;
 175 }
 176
 177 dd.link a {
 178     text-decoration: none;
 179     color: Black;
 180 }
 181
 182 fieldset {
 183     border: 1px solid #2f6fab;
 184     margin: 1em 0em 1em 0em;
 185     padding: 0em 1em 1em 1em;
 186     line-height: 1.5em;
 187 }
 188 legend {
 189     background: White;
 190     padding: 0.5em;
 191     font-size: 90%;
 192 }
 193
 194 form {
 195     border: none;
 196     margin: 0;
 197 }
 198
 199 textarea {
 200     border: 1px solid #2f6fab;
 201     color: Black;
 202     background-color: white;
 203     width: 98%;
 204     padding: 0.1em;
 205 }
 206 /* hide this from ie/mac and konq2.2 */
 207 @media all {
 208     input {
 209         font-family: "Bitstream Vera Sans", "Lucida Grande", Verdana, Lucida, Helvetica, Arial, sans-serif;
 210         visibility: visible;
 211         border: 1px solid #2f6fab;
 212         color: Black;
 213         background-color: white;
 214         vertical-align: middle;
 215         padding: 0.2em;
 216     }
 217 }
 218 input[type=radio],
 219 input[type=checkbox] {
 220     border:none;
 221 }
 222 select {
 223     border: 1px solid #2f6fab;
 224     color: Black;
 225     vertical-align: top;
 226 }
 227 abbr, acronym, .explain {
 228     border-bottom: 1px dotted Black;
 229     color: Black;
 230     background-color: transparent;
 231     cursor: help;
 232 }
 233 q {
 234     font-family: Times, "Times New Roman", serif;
 235     font-style: italic;
 236 }
 237 blockquote {
 238     font-family: Times, "Times New Roman", serif;
 239     font-style: italic;
 240 }
 241 code {
 242     color: Black;
 243     background-color: #f9f9f9;
 244 }
 245 pre {
 246     padding: 1em;
 247     border: 1px dashed #2f6fab;
 248     color: Black;
 249     background-color: #f9f9f9;
 250     overflow: auto;
 251 }
 252 .pre a {
 253     text-decoration: none;
 254 }
 255
 256
 257 /*
 258 ** the main content area
 259 */
 260
 261 #documentSubtitle {
 262     font-size: 84%;
 263     line-height: 1.2em;
 264     margin: -1.6em 0 0.6em 1em;
 265     color: #7d7d7d;
 266 }
 267
 268 #siteSubtitle {
 269     display: none;
 270 }
 271
 272
 273 #content {
 274     padding: 0 0 1em 0em;
 275     margin: 0;
 276 }
 277
 278 #bodyContent a:hover {
 279     text-decoration: underline;
 280 }
 281
 282 /* Some space under the headers in the content area */
 283 #bodyContent h1,
 284 .documentFirstHeading,
 285 #bodyContent h2,
 286 #bodyContent h3,
 287 #bodyContent h4,
 288 #bodyContent h5 {
 289     margin-bottom:0.8em;
 290 }
 291
 292
 293 .documentContent {
 294     padding: 0em 1em 1.5em 1em;
 295     background: White;
 296     border: 1px solid #aaaaaa;
 297     border-right: none;
 298     margin:0;
 299     line-height: 1.5em;
 300     position: relative;
 301     z-index: 2;
 302 }
 303
 304 /* this will be the user notification thing */
 305 .portalMessage {
 306     background-color: #ffce7b;
 307     border: 1px solid #ffa500;
 308     color: Black;
 309     font-size: 100%;
 310     font-weight: bold;
 311     margin: 2em 0em 1em 0em;
 312     padding: 0.5em 1em;
 313     vertical-align: middle;
 314 }
 315 .portalMessage a {
 316     color: Black;
 317     text-decoration: none;
 318 }
 319 .documentDescription {
 320     /* The summary text describing the document */
 321     font-weight: bold;
 322     display: block;
 323     margin: 1em 0em;
 324     line-height: 1.5em;
 325 }
 326 .documentByLine {
 327     text-align: right;
 328     font-size: 90%;
 329     clear: both;
 330     font-weight: normal;
 331     color: #76797c;
 332 }
 333 .documentByLine a {
 334     text-decoration: none;
 335 }
 336
 337 /*
 338 ** mediawiki-specific styles
 339 */
 340
 341 a.stub,
 342 a.new{ color:#ba0000; text-decoration:none; }
 343
 344 #toc {
 345     /*border:1px solid #2f6fab;*/
 346     border:1px solid #aaaaaa;
 347     background-color:#f9f9f9;
 348     padding:5px;
 349     font-size: 95%;
 350 }
 351 .tocindent {
 352         margin-left: 2em;
 353 }
 354 .tocline {
 355         margin-bottom: 0px;
 356 }
 357 .toctoggle, .editsection {
 358         font-size: smaller;
 359 }
 360 /* images */
 361 div.floatright { float: right;
 362     margin: 0 0 1em 1em;
 363     position:relative;
 364
 365 }
 366 div.floatright p { font-style: italic;}
 367 div.floatleft { float: left; margin: 0.3em 0.5em 0.5em 0;
 368     position:relative;
 369 }
 370 div.floatleft p { font-style: italic; }
 371 /* thumbnails */
 372 div.thumbnail-none,
 373 div.thumbnail-right,
 374 div.thumbnail-left {
 375  /*   border:1px solid #2f6fab;*/
 376       border:1px solid #cccccc;
 377
 378     background-color:#f9f9f9;
 379     padding: 2px;
 380     position:relative;
 381     margin: 0.3em 0 0.5em;
 382     font-size: 95%;
 383     text-align: center;
 384 }
 385 div.thumbnail-none p, div.thumbnail-right p, div.thumbnail-left p {
 386     margin-top:3px; margin-bottom:3px;
 387     position:relative;
 388     text-align: left;
 389 }
 390 div.thumbnail-right {
 391     float: right;
 392     position:relative;
 393     margin-left:0.5em;
 394 }
 395 div.thumbnail-left {
 396     float: left;
 397     position:relative;
 398     margin-right:0.5em;
 399 }
 400 /* table standards */
 401 table.rimage {
 402     float:right;
 403     width:1pt;
 404     position:relative;
 405     margin-left:1em;
 406     margin-bottom:1em;
 407     text-align:center;
 408 }
 409
 410 /*
 411 ** Link rendering
 412 */
 413
 414 .urlexpansion,
 415 .hiddenStructure {
 416     display: none;
 417 }
 418
 419 /*
 420 ** keep the whitespace in front of the ^=, hides rule from konqueror
 421 ** this is css3, the validator doesn't like it when validating as css2
 422 */
 423 #bodyContent a[href ^="http://"],
 424 #bodyContent a[href ^="gopher://"] {
 425     background: url(external.png) center right no-repeat;
 426     padding-right: 13px;
 427 }
 428 #bodyContent a[href ^="https://"],
 429 .link-https {
 430     background: transparent url("lock_icon.gif") center right no-repeat;
 431     padding-right: 16px;
 432 }
 433 #bodyContent a[href ^="mailto:"],
 434 .link-mailto {
 435     background: transparent url("mail_icon.gif") center right no-repeat;
 436     padding-right: 18px;
 437 }
 438 #bodyContent a[href ^="news://"] {
 439     background: transparent url("news_icon.png") center right no-repeat;
 440     padding-right: 18px;
 441 }
 442 #bodyContent a[href ^="ftp://"],
 443 .link-ftp {
 444     background: transparent url("file_icon.gif") center right no-repeat;
 445     padding-right: 18px;
 446 }
 447 #bodyContent a[href ^="irc://"],
 448 .link-irc {
 449     background: transparent url("discussionitem_icon.gif")  center right no-repeat;
 450     padding-right: 18px;
 451 }
 452 .visualClear {
 453     display: block;
 454     clear: both;
 455 }
 456
 457 /*
 458 ** classes for special content elements like town boxes
 459 */
 460 div.townBox {
 461     position:relative;
 462     float:right;
 463     background:White;
 464     margin-left:1em;
 465     border: 1px solid Grey;
 466     padding:0.3em;
 467     line-height: 1.0em;
 468     width: 200px;
 469     overflow: hidden;
 470 }
 471 div.townBox dl {
 472     padding: 0;
 473     margin: 0 0 0.3em 0;
 474     font-size: 96%;
 475 }
 476 div.townBox dl dt {
 477     background-color: transparent;
 478     margin: 0.4em 0 0 0;
 479 }
 480 div.townBox dl dd {
 481     margin: 0.1em 0 0 1.1em;
 482     background-color: #f3f3f3;
 483 }
 484
 485 /*
 486 ** Special content area views
 487 */
 488 .special li {
 489     line-height: 1.4em;
 490     margin: 0;
 491     padding: 0;
 492 }
 493 /* the auto-generated edit comments */
 494 #autocomment { color: gray; }
 495
 496
 497 /*
 498 ** Structural Elements
 499 */
 500
 501 /*
 502 ** the portlets (elements in the quickbar)
 503 */
 504 .portlet {
 505     border: none;
 506     margin: 0 0 1em 0em;
 507     float: none;
 508     padding: 0;
 509     width: 11.6em;
 510     overflow: hidden;
 511 }
 512 .portlet h4 {
 513     font-size: 95%;
 514     font-weight: normal;
 515     white-space: nowrap;
 516 }
 517 .portlet h5 {
 518     background: transparent;
 519     padding: 0em 1em 0em 0.5em;
 520     text-transform: lowercase;
 521     display: inline;
 522     font-size: 91%;
 523     height: 1em;
 524     font-weight: normal;
 525     white-space: nowrap;
 526 }
 527 .portlet h6 {
 528     background: #ffae2e;
 529     border: 1px solid #2f6fab;
 530     border-style: solid solid none solid;
 531     padding: 0em 1em 0em 1em;
 532     text-transform: lowercase;
 533     display: block;
 534     font-size: 1em;
 535     height: 1.2em;
 536     font-weight: normal;
 537     white-space: nowrap;
 538 }
 539 .portletBody {
 540     font-size: 95%;
 541     background: White;
 542     border-collapse: collapse;
 543     border: 1px solid #aaaaaa;
 544 }
 545 .portletDetails {
 546     text-align: right;
 547 }
 548 .portletMore {
 549     display: block;
 550     text-align: right;
 551 }
 552 .portletContent {
 553     padding: 0.1em 0.8em 0.7em 0.5em;
 554 }
 555 .portletClose {
 556     float: right;
 557     text-transform: none;
 558     border-left: 1px solid #2f6fab;
 559     padding: 0em 0.2em;
 560 }
 561 .portlet h1,
 562 .portlet h2,
 563 .portlet h3,
 564 .portlet h4 {
 565     margin: 0;
 566     padding: 0;
 567 }
 568 .portlet .even {
 569     background-color: #f7f9fa;
 570 }
 571 .portlet .odd {
 572     background-color: transparent;
 573 }
 574 .portlet input {
 575     font-size: 100%;
 576 }
 577 .portlet ul {
 578     line-height: 1.5em;
 579     list-style-type: square;
 580     list-style-image: url("bullet.gif");
 581     font-size:95%;
 582 }
 583 .portlet li {
 584     padding:0;
 585     margin: 0 0 0 0;
 586     margin-bottom: 0;
 587 }
 588 .even {
 589     background-color: #f7f9fa;
 590 }
 591 .odd {
 592     background-color: transparent;
 593 }
 594 .visualHighlight {
 595     background-color: #f7f9fa;
 596 }
 597 .discreet {
 598     color: #76797c;
 599     font-size: 80%;
 600     font-weight: normal;
 601 }
 602
 603 /*
 604 ** Logo properties
 605 */
 606
 607 #portlet-logo {
 608     z-index: 3;
 609     position:absolute; /*needed to use z-index */
 610     top: 0;
 611     left: 0;
 612     height: 155px;
 613     width: 135px;
 614     overflow: visible;
 615 }
 616 #portlet-logo a {
 617     display: block;
 618     height: 155px;
 619     width: 135px;
 620     background: url(wiki.png) no-repeat;
 621     background-repeat: no-repeat;
 622 }
 623
 624 /*
 625 ** the navigation portlet
 626 */
 627
 628
 629 #portlet-navigation-tree {
 630     position:relative;
 631     z-index:2;
 632 }
 633 #portlet-navigation-tree .plain {
 634     white-space: nowrap;
 635 }
 636
 637 /*
 638 ** Search portlet
 639 */
 640 #portlet-search {
 641     position:relative;
 642     z-index:2;
 643 }
 644 #portlet-search .portletBody {
 645     text-align: center;
 646 }
 647 input.searchButton {
 648     margin-top:1px;
 649     padding: 0 0.4em;
 650     font-size: 95%;
 651     /*    font-size: 100%;
 652     margin-bottom: 1px ! important;
 653     background: White url(search_icon.gif) 2px 1px no-repeat;
 654     cursor: pointer;
 655     padding: 1px 1px 1px 15px;
 656     text-transform: lowercase;*/
 657
 658 }
 659
 660 #searchGadget {
 661     width:11.0em;
 662     margin: 0 0 0 0;
 663     font-size: 95%;
 664 }
 665
 666
 667 #portlet-search .portletContent {
 668     padding: 0.5em 0.4em 0.4em 0.4em;
 669 }
 670
 671
 672 /*
 673 ** the personal toolbar
 674 */
 675
 676 #portlet-personal {
 677     width:100%;
 678     white-space:nowrap;
 679     padding:0 0 0 0;
 680     margin:0;
 681     position:absolute;
 682     left:0px;
 683     top:0px;
 684     z-index: 0;
 685     border: none;
 686     background-color: transparent;
 687     overflow: visible;
 688     line-height: 1.2em;
 689 }
 690
 691 #portlet-personal .hiddenStructure {
 692     display:none;
 693 }
 694 #portlet-personal .portlet,
 695 #portlet-personal .portletBody,
 696 #portlet-personal .portletContent,
 697 #portlet-personal .odd{
 698     padding:0;
 699     margin:0;
 700     border: none;
 701     z-index:0;
 702     overflow: visible;
 703     background-color: transparent;
 704 }
 705 #portal-personal ul,
 706 #portal-personal li {
 707     z-index:0;
 708     border:none;
 709     background-color: transparent;
 710 }
 711
 712 /* this is the ul contained in the portlet */
 713
 714 #portal-personaltools {
 715 /*    background-color: #fabd23;*/
 716 /*    border-bottom-color: #2f6fab;*/
 717     border: none;
 718     line-height: 1.4em;
 719     color: #2f6fab;
 720     padding: 0em 2em 0 3em;
 721     margin: 0;
 722     text-align: right;
 723     text-transform: lowercase;
 724     list-style: none;
 725     z-index:0;
 726     background-color: transparent;
 727 }
 728
 729 #portal-personaltools .portalNotLoggedIn {
 730     color: #2f6fab;
 731     padding: 0;
 732     background: transparent;
 733     background-image: none;
 734 } /* Used on all descriptions relevant to those not logged in */
 735
 736 #portal-personaltools li {
 737     padding:0;
 738     display: inline;
 739     color: #2f6fab;
 740     margin-left: 1em;
 741     line-height: 1.2em;
 742     background-color: transparent;
 743 }
 744 #portal-personaltools li a {
 745     text-decoration: none;
 746 /*    color: #436976;*/
 747     color: #005896;
 748     padding-bottom: 0.2em;
 749     background-color: transparent;
 750 }
 751 #portal-personaltools li a:hover {
 752     text-decoration: none;
 753 /*    color: #436976;*/
 754     background-color: White;
 755     padding-bottom: 0.2em;
 756 }
 757
 758 /* the icon in front of the user name, single quotes
 759 in bg url to hide it from iemac */
 760 li#personaltools-userpage,
 761 li#personaltools-login {
 762     background: transparent url('user.gif') center left no-repeat;
 763     background-repeat: no-repeat;
 764     padding-left: 20px;
 765     text-transform: none;
 766 }
 767
 768 /*
 769 ** the page-related actions- page/talk, edit etc
 770 */
 771
 772 #portlet-contentViews {
 773     position:absolute;
 774     top: 1.2em;
 775     left: 11.5em;
 776     margin: 0;
 777     white-space:nowrap;
 778     /*width:auto;*/
 779     width: 76%;
 780     line-height: 1.1em;
 781     overflow: visible;
 782     background-color: transparent;
 783     border-collapse: collapse;
 784     padding-left: 1em;
 785     list-style: none;
 786     font-size: 95%;
 787 }
 788
 789 #portlet-contentViews .hiddenStructure {
 790     display: none;
 791 }
 792
 793 #portlet-contentViews ul {
 794     list-style: none;
 795 }
 796 #portlet-contentViews li {
 797     display: inline;
 798     border: 1px solid #aaaaaa;
 799     border-bottom: none;
 800     padding: 0 0 0.1em 0;
 801     margin: 0 0.3em 0 0;
 802     overflow: visible;
 803 }
 804
 805 #portlet-contentViews li.selected {
 806     border-color: #fabd23;
 807     padding: 0 0 0.2em 0;
 808 }
 809
 810 #portlet-contentViews li a {
 811     background-color: White;
 812     color: #005189;
 813     border: none;
 814     padding: 0 0.8em 0.3em 0.8em;
 815     text-decoration: none;
 816     text-transform: lowercase;
 817     position: relative;
 818     z-index: 0;
 819     margin: 0;
 820 }
 821
 822 #portlet-contentViews .selected a {
 823     z-index: 3;
 824 }
 825 #portlet-contentViews li a:hover {
 826     z-index: 3;
 827 }
 828
 829 /* offsets to distinguish the tab groups */
 830 li#contentaction-talk {
 831     margin-right: 1.6em;
 832 }
 833 li#contentaction-watch {
 834     margin-left: 1.6em;
 835 }
 836
 837
 838 /*
 839 ** the remaining portlets
 840 */
 841 #portlet-toolbox,
 842 #portlet-language {
 843     position:relative;
 844     z-index:3;
 845 }
 846
 847 /*
 848 ** footer
 849 */
 850
 851 #portal-footer {
 852     background-color: White;
 853     border-top: 1px solid #fabd23;
 854     border-bottom: 1px solid #fabd23;
 855     margin: 0.3em 0em 1em 0em;
 856     padding: 0.4em 0em 1em 0em;
 857     text-align: center;
 858     font-size: 90%;
 859 }
 860 #portal-footer li {
 861     display: inline;
 862     margin-right: 2em;
 863 }
 864
 865
 866 /*
 867 ** IE/Mac fixes, hope to find a validating way to move this
 868 ** to a separate stylesheet. This would work but doesn't validate:
 869 ** @import("IEMacFixes.css");
 870 */
 871
 872 /* tabs: border on the a, not the div */
 873 *>html #portlet-contentViews li {
 874     border:none;
 875 }
 876 *>html #portlet-contentViews li a {
 877     border: 1px solid #aaaaaa;
 878     border-bottom: none;
 879 }
 880 *>html #portlet-contentViews li.selected a {
 881     border-color: #fabd23;
 882 }
 883
 884 /* fixes for broken IE float handling */
 885 *>html #portal-column-content {
 886     display: inline;
 887 }
 888 /* the full-size images are in center tags */
 889 *>html #bodyContent center,
 890 *>html #bodyContent pre {
 891     overflow: auto;
 892 }
 893 /* debugging tool.. */
 894 /*div{ border:1px solid #000000;}*/