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