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