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