app/assets/stylesheets/common.css.scss

   1 /* Styles common to large and small screens */
   2
   3 /* Default rules for the body of every page */
   4
   5 body {
   6   font-family: 'Helvetica Neue',Arial,sans-serif;
   7   font-size: 14px;
   8   line-height: 20px;
   9   color: #222;
  10   background-color: #fff;
  11   margin: 0px;
  12   padding: 0px;
  13 }
  14
  15 body.slim {
  16   background-color: #f0f0f0;
  17 }
  18
  19 /* Rules for links */
  20
  21 a {
  22   color: #00f;
  23   text-decoration: none;
  24 }
  25
  26 a:hover {
  27   text-decoration: underline;
  28 }
  29
  30 /* Rules for horizontal lines */
  31
  32 hr {
  33   border: none;
  34   background-color: #ccc;
  35   color: #ccc;
  36   height: 1px;
  37 }
  38
  39 /* Default rules for headings */
  40
  41 h2 {
  42   margin: 5px 0;
  43   font-size: 25px;
  44   line-height: 30px;
  45 }
  46
  47 /* Rules for the whole left sidebar, including the logo */
  48
  49 #left {
  50   position: absolute;
  51   top: 0px;
  52   width: 185px;
  53   font-size: 11px;
  54   line-height: 12px;
  55 }
  56
  57 /* Rules for the OpenStreetMap logo in the top left corner */
  58
  59 #logo {
  60   width: 170px;
  61   min-width: 170px;
  62   padding: 5px;
  63   text-align: center;
  64   margin: 25px 0 5px 0;
  65 }
  66
  67 #logo h1 {
  68   font-size: 18px;
  69   line-height: 20px;
  70   text-align: center;
  71   margin: 0px;
  72 }
  73
  74 #logo h2 {
  75   font-size: 10px;
  76   line-height: 15px;
  77   margin: 0px;
  78 }
  79
  80 /* Rules for the site name */
  81
  82 #small-title {
  83   display: none;
  84 }
  85
  86 /* Rules for the introductory text displayed in the left sidebar to new users */
  87
  88 .sidebar-copy {
  89   padding: 0px 10px;
  90 }
  91
  92 .sidebar-copy p {
  93   margin: 5px 0;
  94 }
  95
  96 .sidebar-copy.intro {
  97   margin-top: -1px;
  98   border-top: 1px solid #ccc;
  99 }
 100
 101 /*
 102  * Rules for alert boxes shown in the left sidebar when important
 103  * information needs to be conveyed such as when the site is
 104  * undergoing maintenance.
 105  */
 106
 107 .sidebar-alert {
 108   padding: 4px 5px 4px 5px;
 109   border-top: 1px solid #ccc;
 110   margin-top: 4px;
 111   margin-bottom: -4px;
 112   background: #e00;
 113   font-size: 13px;
 114   font-weight: bold;
 115   line-height: 17px;
 116
 117   p {
 118     margin: 5px;
 119   }
 120 }
 121
 122 /*
 123  * Rules for notice boxes shown in the left sidebar when important, but
 124  * non-critical information needs to be conveyed such as notices about
 125  * donation drives.
 126  */
 127
 128 .sidebar-notice {
 129   padding: 4px 5px 4px 5px;
 130   border-top: 1px solid #ccc;
 131   margin-top: 4px;
 132   margin-bottom: -4px;
 133   background: #ea0;
 134   font-size: 13px;
 135   line-height: 17px;
 136
 137   p {
 138     margin: 5px;
 139   }
 140 }
 141
 142 /* Rules for the menu displayed in the left sidebar */
 143
 144 .left_menu {
 145   padding: 5px 10px;
 146   margin: 4px 0;
 147   border-top: 1px solid #ccc;
 148   line-height: 20px;
 149   font-size: 14px;
 150   font-weight: bold;
 151 }
 152
 153 .left_menu h1 {
 154   font-style: normal;
 155   font-size: 15px;
 156 }
 157
 158 .left_menu ul {
 159   margin: 0px;
 160   list-style-type: none;
 161 }
 162
 163 .left_menu li {
 164   margin: 0px;
 165   padding: 0px;
 166 }
 167
 168 /* submenus */
 169 .left_menu ul li ul {
 170   font-weight: normal;
 171   line-height: 15px;
 172   font-size: 12px;
 173 }
 174
 175 .left_menu a {
 176   color: #000;
 177 }
 178
 179 /* Rules for SOTM advert */
 180
 181 #sotm {
 182   width: 165px;
 183   margin: 10px;
 184   padding: 0px;
 185   border: 0px;
 186   background: #fff;
 187 }
 188
 189 #sotm img {
 190   width: 165px;
 191 }
 192
 193 /*
 194  * Rules for "optional boxes" which appear in the left sidebar on
 195  * certain pages. Current users are the seach box on the main page
 196  * and the tag cloud on the traces pages.
 197  */
 198
 199 .optionalbox {
 200   padding: 5px 10px;
 201   margin: 4px 0;
 202 }
 203
 204 .optionalbox h1 {
 205   font-size: 14px;
 206   font-weight: bold;
 207   line-height: 20px;
 208   margin: 0px;
 209   vertical-align: bottom;
 210 }
 211
 212 /* Rules for the search box */
 213
 214 .whereami {
 215 }
 216
 217 #search_field form {
 218   width: 100%;
 219   margin: 0px;
 220   padding: 0px;
 221 }
 222
 223 #search_field {
 224   position:relative;
 225 }
 226
 227 #search_field input[type="text"] {
 228   width: 165px;
 229   padding: 5px;
 230   font-size: 14px;
 231   line-height: 15px;
 232   height: 25px;
 233   box-shadow: inset #DDD 0px 1px 3px;
 234   box-sizing: border-box;
 235   -webkit-box-sizing: border-box;
 236   -moz-box-sizing: border-box;
 237   -ms-box-sizing: border-box;
 238 }
 239
 240 #search_field input[type="text"]:focus {
 241   outline: none;
 242   border: 1px solid #000;
 243 }
 244
 245 #search_field input[type="submit"] {
 246   width: 15px;
 247   height: 15px;
 248   border:0;
 249   text-indent:-1000px;
 250   padding-left: 0px;
 251   padding-right: 0px;
 252   background: url(sprite.png);
 253   position:absolute;
 254   right:2px;
 255   top:5px;
 256   cursor:pointer;
 257 }
 258
 259 .search_help {
 260   margin:0;
 261 }
 262
 263 .deemphasize {
 264   color: #999;
 265 }
 266
 267 .deemphasize a {
 268   color: #7092FF;
 269 }
 270
 271 /* Rules for donation request box */
 272
 273 .donate {
 274   width: 153px;
 275   margin: 10px 10px;
 276   padding: 5px;
 277   border: 1px solid #AED1A0;
 278   background: #cbeea7;
 279   line-height: 20px;
 280   text-align: center;
 281   font-size: 14px;
 282   border-radius: 2px;
 283   -moz-border-radius: 2px;
 284 }
 285
 286 .donate a {
 287   color:#222;
 288 }
 289
 290 /* Rules for Creative Commons logo button */
 291
 292 #cclogo {
 293   margin-top: 10px;
 294   margin-bottom: 10px;
 295 }
 296
 297 /* Rules for tabbed navigation bar */
 298
 299 #top-bar {
 300   border-bottom: 1px solid #ccc;
 301   height: 29px;
 302 }
 303
 304 #tabnav {
 305   padding: 0;
 306   margin: 0;
 307   overflow:hidden;
 308 }
 309
 310 #tabnav li {
 311   margin: 0px;
 312   padding: 0px;
 313   display: inline;
 314   list-style-type: none;
 315 }
 316
 317 #tabnav a, #tabnav a:link, #tabnav a:visited {
 318   background: #fff;
 319   font-size: 14px;
 320   line-height: 19px;
 321   font-weight: bold;
 322   padding: 5px 10px;
 323   text-decoration: none;
 324   color: #333;
 325 }
 326
 327 #tabnav a:link.active, #tabnav a:visited.active {
 328   border-bottom: 1px solid #aaa;
 329   background: #9ed485;
 330   color: #000;
 331 }
 332
 333 #tabnav a:link:hover, #tabnav a:visited:hover {
 334   text-decoration:underline;
 335 }
 336
 337 #tabnav a:link.disabled,
 338 #tabnav a:visited.disabled,
 339 #tabnav a:link:hover.disabled,
 340 #tabnav a:visited:hover.disabled {
 341   color: #ccc;
 342   cursor: default;
 343 }
 344
 345 #tabnav a:link.disabled:hover,
 346 #tabnav a:visited.disabled:hover,
 347 #tabnav a:link:hover.disabled:hover,
 348 #tabnav a:visited:hover.disabled:hover {
 349   text-decoration: none;
 350 }
 351
 352 .count-number {
 353   padding: 2px 5px;
 354   border-radius: 3px;
 355   background: #eee;
 356   margin: 0 2px;
 357   font-size: 11px;
 358   color: #333;
 359 }
 360
 361 /* Rules for greeting bar in the top right corner */
 362
 363 #greeting {
 364   height: 28px;
 365   margin: 0px;
 366   font-size: 13px;
 367   line-height: 28px;
 368 }
 369
 370 .greeting-bar-unread {
 371   font-weight: bold;
 372 }
 373
 374 /* Rules for the message shown in place of the map when javascript is disabled */
 375
 376 #noscript {
 377   z-index: 20000000;
 378   position: absolute;
 379   top: 15px;
 380 }
 381
 382 /* Rules for OpenLayers maps */
 383
 384 #map {
 385   margin: 0px;
 386   border: 0px;
 387   padding: 0px;
 388 }
 389
 390 .olControlAttribution {
 391   bottom: 15px !important;
 392   left: 0px !important;
 393   right: 0px !important;
 394   text-align: center;
 395 }
 396
 397 #permalink {
 398   z-index: 10000;
 399   position: absolute;
 400   bottom: 0px;
 401   right: 0px;
 402   padding: 5px;
 403   background:#fff;
 404   text-align: right;
 405   font-size: 12px;
 406 }
 407
 408 #permalink a {
 409   padding: 5px;
 410 }
 411
 412 /* Rules for edit menu */
 413
 414 .menuicon {
 415   padding: 5px;
 416
 417   &:hover {
 418     background: #eee;
 419     text-decoration: none !important;
 420   }
 421 }
 422
 423 .menu {
 424   display: none;
 425   z-index: 10000;
 426   position: absolute;
 427   background-color: #ffffff;
 428   border: 1px solid #cccccc;
 429   border-top: 0px;
 430 }
 431
 432 .menu ul {
 433   margin: 0px;
 434   padding: 0px;
 435 }
 436
 437 .menu li {
 438   padding: 2px 5px;
 439   margin: 0px;
 440   list-style-type: none;
 441   border-top: 1px solid #eee;
 442   white-space: nowrap;
 443 }
 444
 445 /* Rules for attribution text under the main map shown on printouts */
 446
 447 #attribution {
 448   display: none;
 449 }
 450
 451 .attribution_notice {
 452   text-align: center;
 453 }
 454
 455 /* Rules for the popout map sidebar */
 456
 457 #sidebar {
 458   display: none;
 459   position: absolute;
 460   margin: 0px;
 461   padding: 0px;
 462   width: 30%;
 463   top: 0px;
 464   bottom: 0px;
 465 }
 466
 467 #sidebar #sidebar_content {
 468   overflow: auto;
 469   position: absolute;
 470   font-size: 13px;
 471   line-height: 15px;
 472   top: 29px;
 473   bottom: 0px;
 474   left: 0px;
 475   right: 0px;
 476 }
 477
 478 #sidebar .sidebar_title {
 479   margin: 0px;
 480   padding: 3px 6px 4px 6px;
 481   height: 29px;
 482   font-size: 14px;
 483   line-height: 15px;
 484   background: #bbb;
 485 }
 486
 487 /* Rules for the map key which appears in the popout sidebar */
 488
 489 #mapkey h3 {
 490   font-size: 110%;
 491   font-weight: normal;
 492   text-align: center;
 493 }
 494
 495 #mapkey .mapkey-table {
 496   padding-left: 5px;
 497   padding-right: 5px;
 498 }
 499
 500 #mapkey .mapkey-table-key img {
 501   display: block;
 502   margin-left: auto;
 503   margin-right: auto;
 504 }
 505
 506 #mapkey .mapkey-table-value {
 507   font-size: 90%;
 508 }
 509
 510 /* Rules for search results which appear in the popout sidebar */
 511
 512 .search_searching {
 513   margin-top: 5px;
 514   margin-bottom: 5px;
 515 }
 516
 517 .search_results_heading {
 518   margin: 0px;
 519   padding: 2px 5px;
 520   border-bottom: 1px solid #ccc;
 521   font-weight: bold;
 522 }
 523
 524 .search_results_entry {
 525   margin: 0px;
 526   padding: 2px 5px;
 527 }
 528
 529 .search_results_error {
 530   margin: 0px;
 531   padding: 2px 6px 0px;
 532   color: #f00;
 533 }
 534
 535 /* Rules for data browser information which appears in the popout sidebar */
 536
 537 .browse_heading {
 538   margin: 0px;
 539   padding: 3px 6px;
 540   border: 1px solid #ccc;
 541   background: #ddd;
 542 }
 543
 544 .browse_details {
 545   margin: 0px;
 546   padding: 0px 6px;
 547 }
 548
 549 /* Rules for export information which appears in the popout sidebar */
 550
 551 .export_heading {
 552   margin: 0px;
 553   padding: 2px 5px;
 554   border-bottom: 1px solid #ccc;
 555   font-weight: bold;
 556 }
 557
 558 .export_bounds {
 559   width: 100%;
 560   text-align: center;
 561 }
 562
 563 .export_bound {
 564   margin: 5px;
 565 }
 566
 567 .export_details {
 568   padding: 2px 6px;
 569 }
 570
 571 #export_osm {
 572   display: none;
 573 }
 574
 575 #export_mapnik {
 576   display: none;
 577 }
 578
 579 #export_osmarender {
 580   display: none;
 581 }
 582
 583 .export_hint {
 584   padding: 0px 12px;
 585   font-style: italic;
 586 }
 587
 588 .export_buttons {
 589   width: 100%;
 590   text-align: center;
 591 }
 592
 593 /* Rules for the main content area */
 594
 595 #content {
 596   padding: 10px;
 597   margin: 0px;
 598   position: absolute;
 599   bottom: 0px;
 600 }
 601
 602 #content.site_index,
 603 #content.site_edit,
 604 #content.site_export {
 605   border: 0px;
 606   padding: 0px;
 607 }
 608
 609 #slim_container {
 610   width: 100%;
 611 }
 612
 613 #slim_container_content {
 614   max-width: 50em;
 615   background-color: #FFFFFF;
 616   margin: 10px auto;
 617   padding: 3px;
 618   border-radius: 25px;
 619   -moz-border-radius: 25px;
 620   border: 1px solid #e6e6e6;
 621 }
 622
 623 #slim_content {
 624   margin: 10px;
 625   margin-top: 90px;
 626   max-width: 50em;
 627 }
 628
 629 #slim_header {
 630   margin: 10px;
 631   position: absolute;
 632   top: 0px;
 633 }
 634
 635 #slim_header img {
 636   vertical-align: middle;
 637   margin-bottom: 5px;
 638 }
 639
 640 /* Rules for the home page */
 641
 642 .site_index #map {
 643   position: absolute;
 644   top: 0px;
 645   bottom: 0px;
 646   left: 0px;
 647   right: 0px;
 648 }
 649
 650 .site_export #map {
 651   position: absolute;
 652   top: 0px;
 653   bottom: 0px;
 654   left: 0px;
 655   right: 0px;
 656 }
 657
 658 /* Rules for the edit page */
 659
 660 .site_edit #map {
 661   position: absolute;
 662   top: 0px;
 663   bottom: 0px;
 664   left: 0px;
 665   right: 0px;
 666   overflow: hidden;
 667 }
 668
 669 /* Rules for the changeset list shown by the history tab etc */
 670
 671 #changeset_list_container {
 672   position: relative;
 673 }
 674
 675 #changeset_list {
 676   width: 50%;
 677   font-size: small;
 678   border-collapse: collapse;
 679   border-width: 0px;
 680   margin-top: 1px;
 681   margin-bottom: 1px;
 682 }
 683
 684 #changeset_list td {
 685   vertical-align: top;
 686   padding: 3px;
 687 }
 688
 689 #changeset_list .date {
 690   white-space: nowrap;
 691 }
 692
 693 #changeset_list .user {
 694   white-space: nowrap;
 695 }
 696
 697 #changeset_list .area {
 698   white-space: nowrap;
 699 }
 700
 701 #changeset_list .selected {
 702   background-color: rgb(255, 255, 160);
 703   background-color: rgba(255, 255, 85, 0.5);
 704 }
 705
 706 #changeset_list_map {
 707   position: absolute;
 708   top: 0px;
 709   bottom: 0px;
 710   width: 49%;
 711   min-height: 400px;
 712   border: solid 1px black;
 713 }
 714
 715 /* Rules for the data browser */
 716
 717 #browse_navigation {
 718   width: 250px;
 719   text-align: center;
 720 }
 721
 722 table.browse_details th {
 723   white-space: nowrap;
 724 }
 725
 726 #browse_map {
 727   width: 250px;
 728 }
 729
 730 #browse_map #small_map {
 731   width: 250px;
 732   height: 300px;
 733   border: solid 1px black;
 734 }
 735
 736 #browse_map .geolink {
 737   display: none;
 738 }
 739
 740 /* Rules for the trace list shown by the traces tab etc */
 741
 742 #trace_list {
 743   font-size: small;
 744   border-collapse: collapse;
 745   border-width: 0px;
 746 }
 747
 748 #trace_list .trace_summary {
 749   font-size: 12px;
 750   color: gray;
 751 }
 752
 753 #trace_list .trace_pending {
 754   color: red;
 755 }
 756
 757 #trace_list .trace_public {
 758   color: green;
 759 }
 760
 761 #trace_list .trace_identifiable {
 762   color: green;
 763 }
 764
 765 #trace_list .trace_trackable {
 766   color: red;
 767 }
 768
 769 #trace_list .trace_private {
 770   color: red;
 771 }
 772
 773 /* Rules for the user list */
 774
 775 #user_list {
 776   width: 100%;
 777   font-size: small;
 778 }
 779
 780 #user_list tr {
 781   vertical-align: middle;
 782 }
 783
 784 #user_list p {
 785   margin-top: 0px;
 786   margin-bottom: 0px;
 787 }
 788
 789 #user_list_actions {
 790   margin-top: 10px;
 791 }
 792
 793 /* Rules for the new diary entry page */
 794
 795 .diary_entry div#map {
 796   position: relative;
 797   width: 90%;
 798   height: 400px;
 799   border: 1px solid #ccc;
 800   display: none;
 801 }
 802
 803 /* Rules for the login page */
 804
 805 #login_wrapper div {
 806   margin: 5px;
 807   padding: 15px;
 808   border-radius: 15px;
 809   -moz-border-radius: 15px;
 810 }
 811
 812 #login_login {
 813   background-color: #f5f5ff;
 814   border: 1px solid #f3f3ff;
 815   border-radius: 15px;
 816   -moz-border-radius: 15px;
 817 }
 818
 819 #login_login h1 {
 820   margin-top: 5px;
 821 }
 822
 823 table#login_openid_buttons {
 824   padding-bottom: 10px;
 825 }
 826
 827 #login_openid_buttons td {
 828   padding-left: 10px;
 829   padding-right: 10px;
 830   padding-top: 5px;
 831   padding-bottom: 5px;
 832 }
 833
 834 #login_openid_buttons img {
 835   border: 0;
 836 }
 837
 838 #login_signup form.button-to div {
 839   margin: 0px;
 840   padding: 0px;
 841 }
 842
 843 /* Rules for the account confirmation page */
 844
 845 div#contributorTerms {
 846   border: 1px solid black;
 847   padding: 4px;
 848   overflow: auto;
 849   width: 95%;
 850   height: 400px;
 851 }
 852
 853 div#slim_content div#contributorTerms {
 854   width: auto;
 855 }
 856
 857 div#contributorTerms p#first {
 858   margin-top: 0px;
 859 }
 860
 861 div#contributorTerms p#last {
 862   margin-bottom: 0px;
 863 }
 864
 865 div#contributorTerms ol {
 866   margin-bottom: 0px;
 867 }
 868
 869 div#contributorTerms img {
 870   display: block;
 871   margin-left: auto;
 872   margin-right: auto;
 873   margin-top: 10%;
 874 }
 875
 876 form#termsForm {
 877   width: 95%;
 878   margin-bottom: 3em;
 879 }
 880
 881 div#slim_content form#termsForm {
 882   width: auto;
 883 }
 884
 885 p#contributorGuidance {
 886   background-color: #f5f5ff;
 887   border: 1px solid #f3f3ff;
 888   border-radius: 15px;
 889   -moz-border-radius: 15px;
 890   padding: 10px;
 891 }
 892
 893 /* Rules for the account settings page */
 894
 895 #accountForm {
 896   margin-top: 20px;
 897 }
 898
 899 #accountForm td {
 900   padding-bottom: 10px;
 901 }
 902
 903 #accountForm .user_map {
 904   position: relative;
 905   width: 500px;
 906   height: 400px;
 907   border: 1px solid #ccc;
 908 }
 909
 910 #accountImage td {
 911   padding-bottom: 0px;
 912 }
 913
 914 .nohome .location {
 915   display: none;
 916 }
 917
 918 #homerow .message {
 919   display: none;
 920 }
 921
 922 .nohome .message {
 923   display: inline !important;
 924 }
 925
 926 #accountForm input[type=submit] {
 927   margin-top: 15px;
 928 }
 929
 930 /* Rules for the user view */
 931
 932 .user_view .user_map {
 933   position: relative;
 934   width: 400px;
 935   height: 400px;
 936   border: 1px solid #ccc;
 937 }
 938
 939 .user_view .user_map p#no_home_location {
 940   position: absolute;
 941   top: 0px;
 942   bottom: 0px;
 943   width: 90%;
 944   height: 30%;
 945   margin: auto 5%
 946 }
 947
 948 /* Rules for the user map */
 949
 950 .user_map .olControlSimplePanZoom {
 951   display: none;
 952 }
 953
 954 .user_map .olControlZoom {
 955   display: block;
 956 }
 957
 958 /* Rules for user popups on maps */
 959
 960 .user_popup p {
 961   padding-top: 3px;
 962   padding-bottom: 3px;
 963   margin-top: 0px;
 964   margin-bottom: 0px;
 965   margin-left: 55px;
 966   margin-right: 2px;
 967 }
 968
 969 .user_popup img.user_thumbnail {
 970   float: left;
 971 }
 972
 973 /* Rules for message in/out box page */
 974
 975 #messages {
 976   border: 1px solid #ccc;
 977 }
 978
 979 .inbox-row-unread .inbox-subject {
 980   font-weight: bold;
 981 }
 982
 983 .inbox-row .inbox-mark-read {
 984   display: none;
 985 }
 986
 987 .inbox-row-unread .inbox-mark-unread {
 988   display: none;
 989 }
 990
 991 /* Rules for "flash" notice boxes shown at the top of the content area */
 992
 993 #error {
 994   border: 1px solid red;
 995   padding: 7px;
 996   background-color: #fff0f0;
 997   margin-bottom: 20px;
 998   border-radius: 5px;
 999   -moz-border-radius: 5px;
1000 }
1001
1002 #warning {
1003   border: 1px solid orange;
1004   padding: 7px;
1005   background-color: #fff6f0;
1006   margin-bottom: 20px;
1007   border-radius: 5px;
1008   -moz-border-radius: 5px;
1009 }
1010
1011 #notice {
1012   border: 1px solid green;
1013   padding: 7px;
1014   background-color: #f0fff0;
1015   margin-bottom: 20px;
1016   border-radius: 5px;
1017   -moz-border-radius: 5px;
1018 }
1019
1020 /* Rules for highlighting fields with rails validation errors */
1021
1022 .field_with_errors {
1023   padding: 2px;
1024   background-color: red;
1025   display: table;
1026 }
1027
1028 /* Rules for rails validation error boxes */
1029
1030 #errorExplanation {
1031   width: 400px;
1032   border: 2px solid red;
1033   padding: 7px;
1034   padding-bottom: 12px;
1035   margin-bottom: 20px;
1036   background-color: #f0f0f0;
1037 }
1038
1039 #errorExplanation h2 {
1040   font-weight: bold;
1041   font-size: 12px;
1042   margin: -7px;
1043   background-color: #c00;
1044   color: #fff;
1045 }
1046
1047 #errorExplanation p {
1048   color: #333;
1049   margin-bottom: 0px;
1050   padding: 5px;
1051 }
1052
1053 #errorExplanation ul li {
1054   font-size: 12px;
1055   list-style: square;
1056 }
1057
1058 /* Rules for forms */
1059
1060 .fieldName {
1061   vertical-align: top;
1062   font-weight: bold;
1063   font-size: 12px;
1064   line-height: 20px;
1065 }
1066
1067 .minorNote {
1068   font-size: 0.8em;
1069 }
1070
1071 input[type="text"],
1072 input[type="email"],
1073 input[type="url"],
1074 input[type="password"],
1075 textarea {
1076   border: 1px solid #ccc;
1077 }
1078
1079 /* Rules for user images */
1080
1081 img.user_image {
1082   max-width: 100px;
1083   max-height: 100px;
1084   border: 1px solid black;
1085 }
1086
1087 img.user_thumbnail {
1088   max-width: 50px;
1089   max-height: 100px;
1090   border: 1px solid black;
1091 }
1092
1093 /* Rule for "nowrap" class that can be applied to anything to stop wrapping */
1094
1095 .nowrap {
1096   white-space: nowrap;
1097 }
1098
1099 /* Rules for geo microformats */
1100
1101 abbr.geo {
1102   border-bottom: none;
1103 }
1104
1105 /* Rules for RSS buttons */
1106
1107 .rsssmall {
1108   position: relative;
1109   top: 4px;
1110 }
1111
1112 /* Rules for doing distinct colour of alternate table rows */
1113
1114 .table0 {
1115   background: #f6f6f6;
1116 }
1117
1118 .table1 {
1119   background: #fff;
1120 }
1121
1122 /* Rules for OpenID logo */
1123
1124 .openid_logo {
1125   vertical-align: text-bottom;
1126   border: 0;
1127 }
1128
1129 /* Rules for rich text editors */
1130
1131 .richtext_container {
1132   white-space: nowrap;
1133
1134   .richtext_content {
1135     display: inline-block;
1136     vertical-align: top;
1137
1138     .richtext_preview {
1139       display: inline-block;
1140       margin-top: 1px;
1141       margin-bottom: 1px;
1142       border: 4px solid #eee;
1143       background-color: #eee;
1144       white-space: normal;
1145
1146       &.loading {
1147         background-image: image-url("loading.gif");
1148         background-repeat: no-repeat;
1149         background-position: center;
1150       }
1151
1152       > :first-child {
1153         margin-top: 0px;
1154       }
1155     }
1156   }
1157
1158   .richtext_help {
1159     display: inline-block;
1160     vertical-align: top;
1161     background-color: #ddd;
1162     padding: 5px 10px 10px 10px;
1163     font-size: 12px;
1164
1165     p {
1166       margin: 0px;
1167     }
1168
1169     th {
1170       vertical-align: top;
1171     }
1172
1173     td {
1174       font-family: fixed;
1175       line-height: 16px;
1176       padding: 0px !important;
1177     }
1178
1179     input.richtext_doedit {
1180       margin-top: 5px !important;
1181     }
1182
1183     input.richtext_dopreview {
1184       margin-top: 5px !important;
1185     }
1186   }
1187 }