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   padding: 0px;
 387 }
 388
 389 .olControlAttribution {
 390   bottom: 15px !important;
 391   left: 0px !important;
 392   right: 0px !important;
 393   text-align: center;
 394 }
 395
 396 #permalink {
 397   z-index: 10000;
 398   position: absolute;
 399   bottom: 0px;
 400   right: 0px;
 401   padding: 5px;
 402   background:#fff;
 403   text-align: right;
 404   font-size: 12px;
 405 }
 406
 407 #permalink a {
 408   padding: 5px;
 409 }
 410
 411 /* Rules for edit menu */
 412
 413 .menuicon {
 414   padding: 5px;
 415
 416   &:hover {
 417     background: #eee;
 418     text-decoration: none !important;
 419   }
 420 }
 421
 422 .menu {
 423   display: none;
 424   z-index: 10000;
 425   position: absolute;
 426   background-color: #ffffff;
 427   border: 1px solid #cccccc;
 428   border-top: 0px;
 429 }
 430
 431 .menu ul {
 432   margin: 0px;
 433   padding: 0px;
 434 }
 435
 436 .menu li {
 437   padding: 2px 5px;
 438   margin: 0px;
 439   list-style-type: none;
 440   border-top: 1px solid #eee;
 441   white-space: nowrap;
 442 }
 443
 444 /* Rules for attribution text under the main map shown on printouts */
 445
 446 #attribution {
 447   display: none;
 448 }
 449
 450 .attribution_notice {
 451   text-align: center;
 452 }
 453
 454 /* Rules for the popout map sidebar */
 455
 456 #sidebar {
 457   display: none;
 458   position: absolute;
 459   margin: 0px;
 460   padding: 0px;
 461   width: 30%;
 462   top: 0px;
 463   bottom: 0px;
 464 }
 465
 466 #sidebar #sidebar_content {
 467   overflow: auto;
 468   position: absolute;
 469   font-size: 13px;
 470   line-height: 15px;
 471   top: 29px;
 472   bottom: 0px;
 473   left: 0px;
 474   right: 0px;
 475 }
 476
 477 #sidebar .sidebar_title {
 478   margin: 0px;
 479   padding: 3px 6px 4px 6px;
 480   height: 29px;
 481   font-size: 14px;
 482   line-height: 15px;
 483   background: #bbb;
 484 }
 485
 486 /* Rules for the map key which appears in the popout sidebar */
 487
 488 #mapkey h3 {
 489   font-size: 110%;
 490   font-weight: normal;
 491   text-align: center;
 492 }
 493
 494 #mapkey .mapkey-table {
 495   padding-left: 5px;
 496   padding-right: 5px;
 497 }
 498
 499 #mapkey .mapkey-table-key {
 500 }
 501
 502 #mapkey .mapkey-table-value {
 503   font-size: 90%;
 504 }
 505
 506 /* Rules for search results which appear in the popout sidebar */
 507
 508 .search_searching {
 509   margin-top: 5px;
 510   margin-bottom: 5px;
 511 }
 512
 513 .search_results_heading {
 514   margin: 0px;
 515   padding: 2px 5px;
 516   border-bottom: 1px solid #ccc;
 517   font-weight: bold;
 518 }
 519
 520 .search_results_entry {
 521   margin: 0px;
 522   padding: 2px 5px;
 523 }
 524
 525 .search_results_error {
 526   margin: 0px;
 527   padding: 2px 6px 0px;
 528   color: #f00;
 529 }
 530
 531 /* Rules for data browser information which appears in the popout sidebar */
 532
 533 .browse_heading {
 534   margin: 0px;
 535   padding: 3px 6px;
 536   border: 1px solid #ccc;
 537   background: #ddd;
 538 }
 539
 540 .browse_details {
 541   margin: 0px;
 542   padding: 0px 6px;
 543 }
 544
 545 /* Rules for export information which appears in the popout sidebar */
 546
 547 .export_heading {
 548   margin: 0px;
 549   padding: 2px 5px;
 550   border-bottom: 1px solid #ccc;
 551   font-weight: bold;
 552 }
 553
 554 .export_bounds {
 555   width: 100%;
 556   text-align: center;
 557 }
 558
 559 .export_bound {
 560   margin: 5px;
 561 }
 562
 563 .export_details {
 564   padding: 2px 6px;
 565 }
 566
 567 #export_osm {
 568   display: none;
 569 }
 570
 571 #export_mapnik {
 572   display: none;
 573 }
 574
 575 #export_osmarender {
 576   display: none;
 577 }
 578
 579 .export_hint {
 580   padding: 0px 12px;
 581   font-style: italic;
 582 }
 583
 584 .export_buttons {
 585   width: 100%;
 586   text-align: center;
 587 }
 588
 589 /* Rules for the main content area */
 590
 591 #content {
 592   padding: 10px;
 593   margin: 0px;
 594   position: absolute;
 595   bottom: 0px;
 596 }
 597
 598 #content.site_index,
 599 #content.site_edit,
 600 #content.site_export {
 601   border: 0px;
 602   padding: 0px;
 603 }
 604
 605 #slim_container {
 606   width: 100%;
 607 }
 608
 609 #slim_container_content {
 610   max-width: 50em;
 611   background-color: #FFFFFF;
 612   margin: 10px auto;
 613   padding: 3px;
 614   border-radius: 25px;
 615   -moz-border-radius: 25px;
 616   border: 1px solid #e6e6e6;
 617 }
 618
 619 #slim_content {
 620   margin: 10px;
 621   margin-top: 90px;
 622   max-width: 50em;
 623 }
 624
 625 #slim_header {
 626   margin: 10px;
 627   position: absolute;
 628   top: 0px;
 629 }
 630
 631 #slim_header img {
 632   vertical-align: middle;
 633   margin-bottom: 5px;
 634 }
 635
 636 /* Rules for the home page */
 637
 638 .site_index #map {
 639   position: absolute;
 640   top: 0px;
 641   bottom: 0px;
 642   left: 0px;
 643   right: 0px;
 644 }
 645
 646 .site_export #map {
 647   position: absolute;
 648   top: 0px;
 649   bottom: 0px;
 650   left: 0px;
 651   right: 0px;
 652 }
 653
 654 /* Rules for the edit page */
 655
 656 .site_edit #map {
 657   position: absolute;
 658   top: 0px;
 659   bottom: 0px;
 660   left: 0px;
 661   right: 0px;
 662 }
 663
 664 /* Rules for the changeset list shown by the history tab etc */
 665
 666 #changeset_list_container {
 667   position: relative;
 668 }
 669
 670 #changeset_list {
 671   width: 50%;
 672   font-size: small;
 673   border-collapse: collapse;
 674   border-width: 0px;
 675   margin-top: 1px;
 676   margin-bottom: 1px;
 677 }
 678
 679 #changeset_list td {
 680   vertical-align: top;
 681   padding: 3px;
 682 }
 683
 684 #changeset_list .date {
 685   white-space: nowrap;
 686 }
 687
 688 #changeset_list .user {
 689   white-space: nowrap;
 690 }
 691
 692 #changeset_list .area {
 693   white-space: nowrap;
 694 }
 695
 696 #changeset_list .selected {
 697   background-color: rgb(255, 255, 160);
 698   background-color: rgba(255, 255, 85, 0.5);
 699 }
 700
 701 #changeset_list_map {
 702   position: absolute;
 703   top: 0px;
 704   bottom: 0px;
 705   width: 49%;
 706   min-height: 400px;
 707   border: solid 1px black;
 708 }
 709
 710 /* Rules for the data browser */
 711
 712 #browse_navigation {
 713   width: 250px;
 714   text-align: center;
 715 }
 716
 717 table.browse_details th {
 718   white-space: nowrap;
 719 }
 720
 721 #browse_map {
 722   width: 250px;
 723 }
 724
 725 #browse_map #small_map {
 726   width: 250px;
 727   height: 300px;
 728   border: solid 1px black;
 729 }
 730
 731 #browse_map .geolink {
 732   display: none;
 733 }
 734
 735 /* Rules for the trace list shown by the traces tab etc */
 736
 737 #trace_list {
 738   font-size: small;
 739   border-collapse: collapse;
 740   border-width: 0px;
 741 }
 742
 743 #trace_list .trace_summary {
 744   font-size: 12px;
 745   color: gray;
 746 }
 747
 748 #trace_list .trace_pending {
 749   color: red;
 750 }
 751
 752 #trace_list .trace_public {
 753   color: green;
 754 }
 755
 756 #trace_list .trace_identifiable {
 757   color: green;
 758 }
 759
 760 #trace_list .trace_trackable {
 761   color: red;
 762 }
 763
 764 #trace_list .trace_private {
 765   color: red;
 766 }
 767
 768 /* Rules for the user list */
 769
 770 #user_list {
 771   width: 100%;
 772   font-size: small;
 773 }
 774
 775 #user_list tr {
 776   vertical-align: middle;
 777 }
 778
 779 #user_list p {
 780   margin-top: 0px;
 781   margin-bottom: 0px;
 782 }
 783
 784 #user_list_actions {
 785   margin-top: 10px;
 786 }
 787
 788 /* Rules for the new diary entry page */
 789
 790 .diary_entry div#map {
 791   position: relative;
 792   width: 90%;
 793   height: 400px;
 794   border: 1px solid #ccc;
 795   display: none;
 796 }
 797
 798 /* Rules for the login page */
 799
 800 #login_wrapper div {
 801   margin: 5px;
 802   padding: 15px;
 803   border-radius: 15px;
 804   -moz-border-radius: 15px;
 805 }
 806
 807 #login_login {
 808   background-color: #f5f5ff;
 809   border: 1px solid #f3f3ff;
 810   border-radius: 15px;
 811   -moz-border-radius: 15px;
 812 }
 813
 814 #login_login h1 {
 815   margin-top: 5px;
 816 }
 817
 818 table#login_openid_buttons {
 819   padding-bottom: 10px;
 820 }
 821
 822 #login_openid_buttons td {
 823   padding-left: 10px;
 824   padding-right: 10px;
 825   padding-top: 5px;
 826   padding-bottom: 5px;
 827 }
 828
 829 #login_openid_buttons img {
 830   border: 0;
 831 }
 832
 833 #login_signup form.button-to div {
 834   margin: 0px;
 835   padding: 0px;
 836 }
 837
 838 /* Rules for the account confirmation page */
 839
 840 div#contributorTerms {
 841   border: 1px solid black;
 842   padding: 4px;
 843   overflow: auto;
 844   width: 95%;
 845   height: 400px;
 846 }
 847
 848 div#slim_content div#contributorTerms {
 849   width: auto;
 850 }
 851
 852 div#contributorTerms p#first {
 853   margin-top: 0px;
 854 }
 855
 856 div#contributorTerms p#last {
 857   margin-bottom: 0px;
 858 }
 859
 860 div#contributorTerms ol {
 861   margin-bottom: 0px;
 862 }
 863
 864 div#contributorTerms img {
 865   display: block;
 866   margin-left: auto;
 867   margin-right: auto;
 868   margin-top: 10%;
 869 }
 870
 871 form#termsForm {
 872   width: 95%;
 873   margin-bottom: 3em;
 874 }
 875
 876 div#slim_content form#termsForm {
 877   width: auto;
 878 }
 879
 880 p#contributorGuidance {
 881   background-color: #f5f5ff;
 882   border: 1px solid #f3f3ff;
 883   border-radius: 15px;
 884   -moz-border-radius: 15px;
 885   padding: 10px;
 886 }
 887
 888 /* Rules for the account settings page */
 889
 890 #accountForm {
 891   margin-top: 20px;
 892 }
 893
 894 #accountForm td {
 895   padding-bottom: 10px;
 896 }
 897
 898 #accountForm .user_map {
 899   position: relative;
 900   width: 500px;
 901   height: 400px;
 902   border: 1px solid #ccc;
 903 }
 904
 905 #accountImage td {
 906   padding-bottom: 0px;
 907 }
 908
 909 .nohome .location {
 910   display: none;
 911 }
 912
 913 #homerow .message {
 914   display: none;
 915 }
 916
 917 .nohome .message {
 918   display: inline !important;
 919 }
 920
 921 #accountForm input[type=submit] {
 922   margin-top: 15px;
 923 }
 924
 925 /* Rules for the user view */
 926
 927 .user_view .user_map {
 928   position: relative;
 929   width: 400px;
 930   height: 400px;
 931   border: 1px solid #ccc;
 932 }
 933
 934 .user_view .user_map p#no_home_location {
 935   position: absolute;
 936   top: 0px;
 937   bottom: 0px;
 938   width: 90%;
 939   height: 30%;
 940   margin: auto 5%
 941 }
 942
 943 /* Rules for the user map */
 944
 945 .user_map .olControlSimplePanZoom {
 946   display: none;
 947 }
 948
 949 .user_map .olControlZoom {
 950   display: block;
 951 }
 952
 953 /* Rules for user popups on maps */
 954
 955 .user_popup p {
 956   padding-top: 3px;
 957   padding-bottom: 3px;
 958   margin-top: 0px;
 959   margin-bottom: 0px;
 960   margin-left: 55px;
 961   margin-right: 2px;
 962 }
 963
 964 .user_popup img.user_thumbnail {
 965   float: left;
 966 }
 967
 968 /* Rules for message in/out box page */
 969
 970 #messages {
 971   border: 1px solid #ccc;
 972 }
 973
 974 .inbox-row-unread .inbox-subject {
 975   font-weight: bold;
 976 }
 977
 978 .inbox-row .inbox-mark-read {
 979   display: none;
 980 }
 981
 982 .inbox-row-unread .inbox-mark-unread {
 983   display: none;
 984 }
 985
 986 /* Rules for "flash" notice boxes shown at the top of the content area */
 987
 988 #error {
 989   border: 1px solid red;
 990   padding: 7px;
 991   background-color: #fff0f0;
 992   margin-bottom: 20px;
 993   border-radius: 5px;
 994   -moz-border-radius: 5px;
 995 }
 996
 997 #warning {
 998   border: 1px solid orange;
 999   padding: 7px;
1000   background-color: #fff6f0;
1001   margin-bottom: 20px;
1002   border-radius: 5px;
1003   -moz-border-radius: 5px;
1004 }
1005
1006 #notice {
1007   border: 1px solid green;
1008   padding: 7px;
1009   background-color: #f0fff0;
1010   margin-bottom: 20px;
1011   border-radius: 5px;
1012   -moz-border-radius: 5px;
1013 }
1014
1015 /* Rules for highlighting fields with rails validation errors */
1016
1017 .field_with_errors {
1018   padding: 2px;
1019   background-color: red;
1020   display: table;
1021 }
1022
1023 /* Rules for rails validation error boxes */
1024
1025 #errorExplanation {
1026   width: 400px;
1027   border: 2px solid red;
1028   padding: 7px;
1029   padding-bottom: 12px;
1030   margin-bottom: 20px;
1031   background-color: #f0f0f0;
1032 }
1033
1034 #errorExplanation h2 {
1035   font-weight: bold;
1036   font-size: 12px;
1037   margin: -7px;
1038   background-color: #c00;
1039   color: #fff;
1040 }
1041
1042 #errorExplanation p {
1043   color: #333;
1044   margin-bottom: 0px;
1045   padding: 5px;
1046 }
1047
1048 #errorExplanation ul li {
1049   font-size: 12px;
1050   list-style: square;
1051 }
1052
1053 /* Rules for forms */
1054
1055 .fieldName {
1056   vertical-align: top;
1057   font-weight: bold;
1058   font-size: 12px;
1059   line-height: 20px;
1060 }
1061
1062 .minorNote {
1063   font-size: 0.8em;
1064 }
1065
1066 input[type="text"],
1067 input[type="email"],
1068 input[type="url"],
1069 input[type="password"],
1070 textarea {
1071   border: 1px solid #ccc;
1072 }
1073
1074 /* Rules for user images */
1075
1076 img.user_image {
1077   max-width: 100px;
1078   max-height: 100px;
1079   border: 1px solid black;
1080 }
1081
1082 img.user_thumbnail {
1083   max-width: 50px;
1084   max-height: 100px;
1085   border: 1px solid black;
1086 }
1087
1088 /* Rule for "nowrap" class that can be applied to anything to stop wrapping */
1089
1090 .nowrap {
1091   white-space: nowrap;
1092 }
1093
1094 /* Rules for geo microformats */
1095
1096 abbr.geo {
1097   border-bottom: none;
1098 }
1099
1100 /* Rules for RSS buttons */
1101
1102 .rsssmall {
1103   position: relative;
1104   top: 4px;
1105 }
1106
1107 /* Rules for doing distinct colour of alternate table rows */
1108
1109 .table0 {
1110   background: #f6f6f6;
1111 }
1112
1113 .table1 {
1114   background: #fff;
1115 }
1116
1117 /* Rules for OpenID logo */
1118
1119 .openid_logo {
1120   vertical-align: text-bottom;
1121   border: 0;
1122 }
1123
1124 /* Rules for rich text editors */
1125
1126 .richtext_container {
1127   white-space: nowrap;
1128
1129   .richtext_content {
1130     display: inline-block;
1131     vertical-align: top;
1132
1133     .richtext_preview {
1134       display: inline-block;
1135       margin-top: 1px;
1136       margin-bottom: 1px;
1137       border: 4px solid #eee;
1138       background-color: #eee;
1139       white-space: normal;
1140
1141       &.loading {
1142         background-image: image-url("loading.gif");
1143         background-repeat: no-repeat;
1144         background-position: center;
1145       }
1146
1147       > :first-child {
1148         margin-top: 0px;
1149       }
1150     }
1151   }
1152
1153   .richtext_help {
1154     display: inline-block;
1155     vertical-align: top;
1156     background-color: #ddd;
1157     padding: 5px 10px 10px 10px;
1158     font-size: 12px;
1159
1160     p {
1161       margin: 0px;
1162     }
1163
1164     th {
1165       vertical-align: top;
1166     }
1167
1168     td {
1169       font-family: fixed;
1170       line-height: 16px;
1171       padding: 0px !important;
1172     }
1173
1174     input.richtext_doedit {
1175       margin-top: 5px !important;
1176     }
1177
1178     input.richtext_dopreview {
1179       margin-top: 5px !important;
1180     }
1181   }
1182 }