skins/monobook/main.css

   1 /*
   2 ** MediaWiki 'monobook' style sheet for CSS2-capable browsers.
   3 ** Copyright Gabriel Wicke - http://wikidev.net/
   4 ** License: GPL (http://www.gnu.org/copyleft/gpl.html)
   5 **
   6 ** Loosely based on http://www.positioniseverything.net/ordered-floats.html by Big John
   7 ** and the Plone 2.0 styles, see http://plone.org/ (Alexander Limi,Joe Geldart & Tom Croucher,
   8 ** Michael Zeltner and Geir Bækholt)
   9 ** All you guys rock :)
  10 */
  11
  12 div#column-content {
  13         width: 100%;
  14         float: right;
  15         margin: 0 0 .6em -12.2em;
  16         padding: 0;
  17 }
  18 div#content {
  19         margin: 2.8em 0 0 12.2em;
  20         padding: 0 1em 1em 1em;
  21         position: relative;
  22         z-index: 2;
  23 }
  24 div#column-one {
  25         padding-top: 160px;
  26 }
  27 /* Hide, but keep accessible for screen-readers */
  28 #column-one h2 {
  29         position: absolute;
  30         top: -9999px;
  31 }
  32 div#content {
  33         background: white;
  34         color: black;
  35         border: 1px solid #aaa;
  36         border-right: none;
  37         line-height: 1.5em;
  38 }
  39 /* the left column width is specified in class .portlet */
  40
  41 /* Font size:
  42 ** We take advantage of keyword scaling- browsers won't go below 9px
  43 ** More at http://www.w3.org/2003/07/30-font-size
  44 ** http://style.cleverchimp.com/font_size_intervals/altintervals.html
  45 */
  46
  47 body {
  48         font: x-small sans-serif;
  49         /* @embed */
  50         background: #f9f9f9 url(headbg.jpg) 0 0 no-repeat;
  51         color: black;
  52         margin: 0;
  53         padding: 0;
  54         direction: ltr; /* Needed for RTL flipping */
  55         unicode-bidi: embed;
  56 }
  57
  58 /* scale back up to a sane default */
  59 div#globalWrapper {
  60         font-size: 127%;
  61         width: 100%;
  62         margin: 0;
  63         padding: 0;
  64 }
  65
  66 /* general styles */
  67 a {
  68         color: #002bb8;
  69 }
  70 a:visited {
  71         color: #5a3696;
  72 }
  73 a.new,
  74 #p-personal a.new {
  75         color: #cc2200;
  76 }
  77
  78 ul {
  79         list-style-type: square;
  80         /* @embed */
  81         list-style-image: url(bullet.gif);
  82 }
  83
  84 input.historysubmit {
  85         padding: 0 .3em .3em .3em !important;
  86         font-size: 94%;
  87         cursor: pointer;
  88         height: 1.7em !important;
  89         margin-left: 1.6em;
  90 }
  91
  92 pre, .mw-code {
  93         line-height: 1.1em;
  94 }
  95
  96 /*
  97 ** the main content area
  98 */
  99
 100 #siteNotice {
 101         font-size: 95%;
 102         padding: 0 0.9em;
 103 }
 104 #localNotice {
 105         margin: 0;
 106 }
 107 #siteNotice p {
 108         margin: 0;
 109         padding: 0;
 110 }
 111
 112 /*
 113 ** classes for special content elements like town boxes
 114 ** intended to be referenced directly from the wiki src
 115 */
 116
 117 /*
 118 ** User styles
 119 */
 120 /* table standards */
 121 table.rimage {
 122         float: right;
 123         position: relative;
 124         margin-left: 1em;
 125         margin-bottom: 1em;
 126         text-align: center;
 127 }
 128
 129 /*
 130 ** edit views etc
 131 */
 132 .special li {
 133         line-height: 1.4em;
 134         margin: 0;
 135         padding: 0;
 136 }
 137
 138 /*
 139 ** keep the whitespace in front of the ^=, hides rule from konqueror
 140 ** this is css3, the validator doesn't like it when validating as css2
 141 */
 142 #bodyContent a.external,
 143 #bodyContent a.external[href ^="gopher://"] {
 144         /* @embed */
 145         background: url(external-ltr.png) center right no-repeat;
 146         padding-right: 13px;
 147 }
 148 #bodyContent a.external[href ^="https://"],
 149 .link-https {
 150         /* @embed */
 151         background: url(lock_icon.gif) center right no-repeat;
 152         padding-right: 16px;
 153 }
 154 #bodyContent a.external[href ^="mailto:"],
 155 .link-mailto {
 156         /* @embed */
 157         background: url(mail_icon.gif) center right no-repeat;
 158         padding-right: 18px;
 159 }
 160 #bodyContent a.external[href ^="news:"] {
 161         /* @embed */
 162         background: url(news_icon.png) center right no-repeat;
 163         padding-right: 18px;
 164 }
 165 #bodyContent a.external[href ^="ftp://"],
 166 .link-ftp {
 167         /* @embed */
 168         background: url(file_icon.gif) center right no-repeat;
 169         padding-right: 18px;
 170 }
 171 #bodyContent a.external[href ^="irc://"],
 172 #bodyContent a.external[href ^="ircs://"],
 173 .link-irc {
 174         /* @embed */
 175         background: url(discussionitem_icon.gif) center right no-repeat;
 176         padding-right: 18px;
 177 }
 178 #bodyContent a.external[href $=".ogg"], #bodyContent a.external[href $=".OGG"],
 179 #bodyContent a.external[href $=".mid"], #bodyContent a.external[href $=".MID"],
 180 #bodyContent a.external[href $=".midi"], #bodyContent a.external[href $=".MIDI"],
 181 #bodyContent a.external[href $=".mp3"], #bodyContent a.external[href $=".MP3"],
 182 #bodyContent a.external[href $=".wav"], #bodyContent a.external[href $=".WAV"],
 183 #bodyContent a.external[href $=".wma"], #bodyContent a.external[href $=".WMA"],
 184 .link-audio {
 185         /* @embed */
 186         background: url(audio.png) center right no-repeat;
 187         padding-right: 13px;
 188 }
 189 #bodyContent a.external[href $=".ogm"], #bodyContent a.external[href $=".OGM"],
 190 #bodyContent a.external[href $=".avi"], #bodyContent a.external[href $=".AVI"],
 191 #bodyContent a.external[href $=".mpeg"], #bodyContent a.external[href $=".MPEG"],
 192 #bodyContent a.external[href $=".mpg"], #bodyContent a.external[href $=".MPG"],
 193 .link-video {
 194         /* @embed */
 195         background: url(video.png) center right no-repeat;
 196         padding-right: 13px;
 197 }
 198 #bodyContent a.external[href $=".pdf"], #bodyContent a.external[href $=".PDF"],
 199 #bodyContent a.external[href *=".pdf#"], #bodyContent a.external[href *=".PDF#"],
 200 #bodyContent a.external[href *=".pdf?"], #bodyContent a.external[href *=".PDF?"],
 201 .link-document {
 202         /* @embed */
 203         background: url(document.png) center right no-repeat;
 204         padding-right: 12px;
 205 }
 206
 207 /* Interwiki Styling */
 208 #bodyContent a.extiw,
 209 #bodyContent a.extiw:active {
 210         color: #36b;
 211 }
 212
 213 /* External links */
 214 #bodyContent a.external {
 215         color: #36b;
 216 }
 217
 218 /*
 219 ** Structural Elements
 220 */
 221
 222 /*
 223 ** general portlet styles (elements in the quickbar)
 224 */
 225 .portlet {
 226         border: none;
 227         margin: 0 0 .5em;
 228         padding: 0;
 229         float: none;
 230         width: 11.6em;
 231         overflow: hidden;
 232 }
 233 .portlet h3 {
 234         background: transparent;
 235         padding: 0 1em 0 .5em;
 236         display: inline;
 237         height: 1em;
 238         text-transform: lowercase;
 239         font-size: 91%;
 240         font-weight: normal;
 241         white-space: nowrap;
 242 }
 243 .pBody {
 244         font-size: 95%;
 245         background-color: white;
 246         color: black;
 247         border-collapse: collapse;
 248         border: 1px solid #aaa;
 249         padding: 0 .8em .3em .5em;
 250 }
 251 .portlet ul {
 252         line-height: 1.5em;
 253         font-size: 95%;
 254 }
 255 .portlet li {
 256         padding: 0;
 257         margin: 0;
 258 }
 259
 260 /*
 261 ** Logo properties
 262 */
 263
 264 #p-logo {
 265         top: 0;
 266         left: 0;
 267         position: absolute; /*needed to use z-index */
 268         z-index: 3;
 269         height: 155px;
 270         width: 12em;
 271         overflow: visible;
 272 }
 273 #p-logo h3 {
 274         display: none;
 275 }
 276 #p-logo a,
 277 #p-logo a:hover {
 278         display: block;
 279         height: 155px;
 280         width: 12.2em;
 281         background-repeat: no-repeat;
 282         background-position: 35% 50% !important;
 283         text-decoration: none;
 284 }
 285
 286 /*
 287 ** Search portlet
 288 */
 289 #p-search {
 290         position: relative;
 291         z-index: 3;
 292 }
 293 input.searchButton {
 294         margin-top: 1px;
 295         font-size: 95%;
 296 }
 297 #searchGoButton {
 298         padding-left: .5em;
 299         padding-right: .5em;
 300         font-weight: bold;
 301 }
 302 #searchInput {
 303         width: 10.9em;
 304         margin: 0;
 305         font-size: 95%;
 306 }
 307 #p-search .pBody {
 308         padding: .5em .4em .4em .4em;
 309         text-align: center;
 310 }
 311 #p-search #searchform div div {
 312         margin-top: .4em;
 313         font-size: 95%;
 314 }
 315 /*
 316 ** the personal toolbar
 317 */
 318 #p-personal {
 319         position: absolute;
 320         left: 0;
 321         top: 0;
 322         z-index: 0;
 323 }
 324 #p-personal {
 325         width: 100%;
 326         white-space: nowrap;
 327         padding: 0;
 328         margin: 0;
 329         border: none;
 330         background: none;
 331         overflow: visible;
 332         line-height: 1.2em;
 333 }
 334 #p-personal h3 {
 335         display: none;
 336 }
 337 #p-personal .portlet,
 338 #p-personal .pBody {
 339         z-index: 0;
 340         padding: 0;
 341         margin: 0;
 342         border: none;
 343         overflow: visible;
 344         background: none;
 345 }
 346 /* this is the ul contained in the portlet */
 347 #p-personal ul {
 348         border: none;
 349         line-height: 1.4em;
 350         color: #2f6fab;
 351         padding: 0 2em 0 3em;
 352         margin: 0;
 353         text-align: right;
 354         list-style-type: none;
 355         list-style-image: none;
 356         z-index: 0;
 357         background: none;
 358         cursor: default;
 359 }
 360 #p-personal li {
 361         z-index: 0;
 362         border: none;
 363         padding: 0;
 364         display: inline;
 365         color: #2f6fab;
 366         margin-left: 1em;
 367         line-height: 1.2em;
 368         background: none;
 369 }
 370 #p-personal li a {
 371         text-decoration: none;
 372         color: #005896;
 373         padding-bottom: .2em;
 374         background: none;
 375 }
 376 #p-personal li a:hover {
 377         background-color: white;
 378         padding-bottom: .2em;
 379         text-decoration: none;
 380 }
 381 #p-personal li.active a:hover {
 382         background-color: transparent;
 383 }
 384 /* the icon in front of the user name, single quotes
 385 in bg url to hide it from iemac */
 386 li#pt-userpage,
 387 li#pt-anonuserpage,
 388 li#pt-login {
 389         /* @embed */
 390         background: url(user.gif) top left no-repeat;
 391         padding-left: 20px;
 392         text-transform: none;
 393 }
 394 #p-personal ul {
 395         text-transform: lowercase;
 396 }
 397 #p-personal li.active {
 398         font-weight: bold;
 399 }
 400 /*
 401 ** the page-related actions- page/talk, edit etc
 402 */
 403 #p-cactions {
 404         position: absolute;
 405         top: 1.3em;
 406         left: 11.5em;
 407         margin: 0;
 408         white-space: nowrap;
 409         width: 76%;
 410         line-height: 1.1em;
 411         overflow: visible;
 412         background: none;
 413         border-collapse: collapse;
 414         padding-left: 1em;
 415         font-size: 95%;
 416 }
 417 #p-cactions ul {
 418         list-style-type: none;
 419         list-style-image: none;
 420 }
 421 #p-cactions li {
 422         display: inline;
 423         border: 1px solid #aaa;
 424         border-bottom: none;
 425         padding: 0 0 .1em 0;
 426         margin: 0 .3em 0 0;
 427         overflow: visible;
 428         background: white;
 429 }
 430 #p-cactions li.selected {
 431         border-color: #fabd23;
 432         padding: 0 0 .2em 0;
 433         font-weight: bold;
 434 }
 435 #p-cactions li a {
 436         background-color: #fbfbfb;
 437         color: #002bb8;
 438         border: none;
 439         padding: 0 .8em .3em;
 440         position: relative;
 441         z-index: 0;
 442         margin: 0;
 443         text-decoration: none;
 444 }
 445 #p-cactions li.selected a {
 446         z-index: 3;
 447         background-color: white;
 448 }
 449 #p-cactions .new a {
 450         color: #ba0000;
 451 }
 452 #p-cactions li a:hover {
 453         z-index: 3;
 454         text-decoration: none;
 455         background-color: white;
 456 }
 457 #p-cactions h3 {
 458         display: none;
 459 }
 460 #p-cactions li.istalk {
 461         margin-right: 0;
 462 }
 463 #p-cactions li.istalk a {
 464         padding-right: .5em;
 465 }
 466 #p-cactions #ca-addsection a {
 467         padding-left: .4em;
 468         padding-right: .4em;
 469 }
 470 /* offsets to distinguish the tab groups */
 471 li#ca-talk {
 472         margin-right: 1.6em;
 473 }
 474 li#ca-watch,
 475 li#ca-unwatch,
 476 li#ca-varlang-0,
 477 li#ca-print {
 478         margin-left: 1.6em;
 479 }
 480 #p-cactions .pBody {
 481         font-size: 1em;
 482         background-color: transparent;
 483         color: inherit;
 484         border-collapse: inherit;
 485         border: 0;
 486         padding: 0;
 487 }
 488 #p-cactions li a {
 489         text-transform: lowercase;
 490 }
 491
 492 #p-lang {
 493         position: relative;
 494         z-index: 3;
 495 }
 496
 497 /* Override text-transform on languages where capitalization is significant */
 498 .capitalize-all-nouns .portlet h3,
 499 .capitalize-all-nouns #p-personal ul,
 500 .capitalize-all-nouns #p-cactions ul li a {
 501         text-transform: none;
 502 }
 503
 504 /* TODO: #t-iscite is only used by the Cite extension, come up with some
 505  * system which allows extensions to add to this file on the fly
 506  */
 507 #t-ispermalink, #t-iscite {
 508         color: #999;
 509 }
 510 /*
 511 ** footer
 512 */
 513 div#footer {
 514         background-color: white;
 515         border-top: 1px solid #fabd23;
 516         border-bottom: 1px solid #fabd23;
 517         margin: .6em 0 1em 0;
 518         padding: .4em 0 1.2em 0;
 519         text-align: center;
 520         font-size: 90%;
 521 }
 522 div#footer li {
 523         display: inline;
 524         margin: 0 1.3em;
 525 }
 526 #f-poweredbyico, #f-copyrightico {
 527         margin: 0 8px;
 528         position: relative;
 529         top: -2px; /* Bump it up just a tad */
 530 }
 531 #f-poweredbyico {
 532         float: right;
 533         height: 1%;
 534 }
 535 #f-copyrightico {
 536         float: left;
 537         height: 1%;
 538 }
 539
 540 .mw-htmlform-submit {
 541         font-weight: bold;
 542         padding-left: .3em;
 543         padding-right: .3em;
 544         margin-right: 2em;
 545 }
 546
 547 /* js pref toc */
 548 #preftoc {
 549         margin: 0;
 550         padding: 0;
 551         width: 100%;
 552         clear: both;
 553 }
 554 #preftoc li {
 555         background-color: #f0f0f0;
 556         color: #000;
 557 }
 558 #preftoc li {
 559         margin: 1px -2px 1px 2px;
 560         float: left;
 561         padding: 2px 0 3px 0;
 562         border: 1px solid #fff;
 563         border-right-color: #716f64;
 564         border-bottom: 0;
 565         position: relative;
 566         white-space: nowrap;
 567         list-style-type: none;
 568         list-style-image: none;
 569         z-index: 3;
 570 }
 571 #preftoc li.selected {
 572         font-weight: bold;
 573         background-color: #f9f9f9;
 574         border: 1px solid #aaa;
 575         border-bottom: none;
 576         cursor: default;
 577         top: 1px;
 578         padding-top: 2px;
 579         margin-right: -3px;
 580 }
 581 #preftoc > li.selected {
 582         top: 2px;
 583 }
 584 #preftoc a,
 585 #preftoc a:active {
 586         display: block;
 587         color: #000;
 588         padding: 0 .7em;
 589         position: relative;
 590         text-decoration: none;
 591 }
 592 #preftoc li.selected a {
 593         cursor: default;
 594         text-decoration: none;
 595 }
 596 #preferences {
 597         margin: 0;
 598         border: 1px solid #aaa;
 599         clear: both;
 600         padding: 1.5em;
 601         background-color: #F9F9F9;
 602 }
 603 .prefsection {
 604         border: none;
 605         padding: 0;
 606         margin: 0;
 607 }
 608
 609 .prefsection legend {
 610         font-weight: bold;
 611 }
 612 .prefsection table, .prefsection legend {
 613         background-color: #F9F9F9;
 614 }
 615 .mainLegend {
 616         display: none;
 617 }
 618 td.htmlform-tip {
 619         font-size: x-small;
 620         padding: .2em 2em;
 621         color: #666;
 622 }
 623
 624 .preferences-login {
 625         clear: both;
 626         margin-bottom: 1.5em;
 627 }
 628
 629 .prefcache {
 630         font-size: 90%;
 631         margin-top: 2em;
 632 }
 633
 634 div#userloginForm,
 635 div#userlogin {
 636         margin: 0 3em 1em 0;
 637         border: 1px solid #aaa;
 638         clear: both;
 639         padding: 1.5em 2em;
 640         background-color: #f9f9f9;
 641         float: left;
 642 }
 643
 644 div#userloginForm table,
 645 div#userlogin table {
 646         background-color: #f9f9f9;
 647 }
 648
 649 div#userloginForm h2,
 650 div#userlogin h2 {
 651         padding-top: 0;
 652 }
 653
 654 div#userlogin .captcha,
 655 div#userloginForm .captcha {
 656         border: 1px solid #bbb;
 657         padding: 1.5em 2em;
 658         background-color: white;
 659 }
 660
 661 #loginend, #signupend {
 662         clear: both;
 663 }
 664
 665 #userloginprompt, #languagelinks {
 666         font-size: 85%;
 667 }
 668
 669 #login-sectiontip {
 670         font-size: 85%;
 671         line-height: 1.2;
 672         padding-top: 2em;
 673 }
 674
 675 #userlogin .loginText, #userlogin .loginPassword {
 676         width: 12em;
 677 }
 678
 679 #userloginlink a, #wpLoginattempt, #wpCreateaccount {
 680         font-weight: bold;
 681 }
 682
 683 /*
 684 ** IE/Mac fixes, hope to find a validating way to move this
 685 ** to a separate stylesheet. This would work but doesn't validate:
 686 ** @import("IEMacFixes.css");
 687 */
 688 /* tabs: border on the a, not the div */
 689 * > html #p-cactions li {
 690         border: none;
 691 }
 692 * > html #p-cactions li a {
 693         border: 1px solid #aaa;
 694         border-bottom: none;
 695 }
 696 * > html #p-cactions li.selected a {
 697         border-color: #fabd23;
 698 }
 699 /* footer icons need a fixed width */
 700 * > html #f-poweredbyico,
 701 * > html #f-copyrightico {
 702         width: 88px;
 703 }
 704 * > html #bodyContent,
 705 * > html #bodyContent pre {
 706         overflow-x: auto;
 707         width: 100%;
 708         padding-bottom: 25px;
 709 }
 710
 711 /* more IE fixes */
 712 /* float/negative margin brokenness */
 713 * html div#footer {
 714         margin-top: 0;
 715 }
 716 * html div#column-content {
 717         display: inline;
 718         margin-bottom: 0;
 719 }
 720 #pagehistory li.selected {
 721         position: relative;
 722 }
 723
 724 /* Mac IE 5.0 fix; floated content turns invisible */
 725 * > html div#column-content {
 726         float: none;
 727 }
 728 * > html div#column-one {
 729         position: absolute;
 730         left: 0;
 731         top: 0;
 732 }
 733 * > html div#footer {
 734         margin-left: 13.2em;
 735 }
 736 .redirectText {
 737         font-size: 150%;
 738         margin: 5px;
 739 }
 740
 741 div.patrollink {
 742         clear: both;
 743 }
 744
 745 .sharedUploadNotice {
 746         font-style: italic;
 747 }
 748
 749 span.updatedmarker {
 750         color: black;
 751         background-color: #0f0;
 752 }
 753
 754 .editExternally {
 755         border: 1px solid gray;
 756         background-color: #ffffff;
 757         padding: 3px;
 758         margin-top: 0.5em;
 759         float: left;
 760         font-size: small;
 761         text-align: center;
 762 }
 763 .editExternallyHelp {
 764         font-style: italic;
 765         color: gray;
 766 }
 767
 768 .toggle {
 769         margin-left: 2em;
 770         text-indent: -2em;
 771 }
 772
 773 /* @bug 1714 */
 774 input#wpSave,
 775 input#wpDiff {
 776         margin-right: 0.33em;
 777 }
 778
 779 #wpSave {
 780         font-weight: bold;
 781 }
 782
 783 /* noarticletext */
 784 div.noarticletext {
 785         border: 1px solid #ccc;
 786         background: #fff;
 787         padding: .2em 1em;
 788         color: #000;
 789 }
 790
 791 div#searchTargetContainer {
 792         left: 10px;
 793         top: 10px;
 794         width: 90%;
 795         background: white;
 796 }
 797
 798 div#searchTarget {
 799         padding: 3px;
 800         margin: 5px;
 801         background: #F0F0F0;
 802         border: solid 1px blue;
 803 }
 804
 805 div#searchTarget ul li {
 806         list-style-type: none;
 807         list-style-image: none;
 808 }
 809
 810 div#searchTarget ul li:before {
 811         color: orange;
 812         content: "\00BB \0020";
 813 }
 814
 815 div#searchTargetHide {
 816         float: right;
 817         border: solid 1px black;
 818         background: #DCDCDC;
 819         padding: 2px;
 820 }
 821
 822 #powersearch p {
 823         margin-top: 0;
 824 }
 825
 826 div.multipageimagenavbox {
 827         border: solid 1px silver;
 828         padding: 4px;
 829         margin: 1em;
 830         background: #f0f0f0;
 831 }
 832
 833 div.multipageimagenavbox div.thumb {
 834         border: none;
 835         margin-left: 2em;
 836         margin-right: 2em;
 837 }
 838
 839 div.multipageimagenavbox hr {
 840         margin: 6px;
 841 }
 842
 843 table.multipageimage td {
 844         text-align: center;
 845 }
 846
 847 .templatesUsed {
 848         margin-top: 1.5em;
 849 }
 850
 851 .mw-summary-preview {
 852         margin: 0.1em 0;
 853 }
 854
 855 /* Friendlier slave lag warnings */
 856 div.mw-lag-warn-normal,
 857 div.mw-lag-warn-high {
 858         padding: 3px;
 859         text-align: center;
 860         margin: 3px auto;
 861 }
 862 div.mw-lag-warn-normal {
 863         border: 1px solid #FFCC66;
 864         background-color: #FFFFCC;
 865 }
 866 div.mw-lag-warn-high {
 867         font-weight: bold;
 868         border: 2px solid #FF0033;
 869         background-color: #FFCCCC;
 870 }
 871
 872 .MediaTransformError {
 873         background-color: #ccc;
 874         padding: 0.1em;
 875 }
 876 .MediaTransformError td {
 877         text-align: center;
 878         vertical-align: middle;
 879         font-size: 90%;
 880 }
 881
 882 /* God-damned hack for the crappy layout */
 883 .os-suggest {
 884         font-size: 127%;
 885 }
 886
 887 /* Sometimes people don't want personal tools to be lowercase! */
 888 .no-text-transform {
 889         text-transform: none;
 890 }
 891
 892 /* Tooltips are outside of the normal body code, so this helps make the size of the text sensible */
 893 .tipsy {
 894         font-size: 127%;
 895 }
 896
 897 /* mediawiki.notification */
 898 .skin-monobook .mw-notification {
 899         -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.125);
 900         -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.125);
 901         box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.125);
 902 }