comparison skins/larry/styles.css @ 0:1e000243b222

vanilla 1.3.3 distro, I hope
author Charlie Root
date Thu, 04 Jan 2018 15:50:29 -0500
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:1e000243b222
1 /**
2 * Roundcube webmail styles for skin "Larry"
3 *
4 * Copyright (c) 2012-2017, The Roundcube Dev Team
5 * Screendesign by FLINT / Büro für Gestaltung, bueroflint.com
6 *
7 * The contents are subject to the Creative Commons Attribution-ShareAlike
8 * License. It is allowed to copy, distribute, transmit and to adapt the work
9 * by keeping credits to the original autors in the README file.
10 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
11 */
12
13 body {
14 font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
15 font-size: 11px;
16 color: #333;
17 background: #cad2d9;
18 margin: 0;
19 }
20
21 body.noscroll {
22 /* also avoids bounce effect in Chrome and Safari */
23 overflow: hidden;
24 }
25
26 .iphone body.noscroll {
27 /* revert on iPhone (#1490551) */
28 overflow: auto;
29 }
30
31 a {
32 color: #0069a6;
33 }
34
35 a:visited {
36 color: #0186ba;
37 }
38
39 img {
40 border: 0;
41 }
42
43 .voice {
44 position: absolute;
45 border: 0;
46 clip: rect(0 0 0 0);
47 width: 1px;
48 height: 1px;
49 margin: -1px;
50 padding: 0;
51 overflow: hidden;
52 }
53
54 input,
55 textarea,
56 select,
57 button {
58 font-family: inherit;
59 font-size: inherit;
60 vertical-align: middle;
61 }
62
63 input[type="text"],
64 input[type="password"],
65 textarea {
66 margin: 0; /* Safari by default adds a margin */
67 padding: 4px;
68 border: 1px solid #b2b2b2;
69 border-radius: 4px;
70 }
71
72 input[type="text"]:focus,
73 input[type="password"]:focus,
74 input.button:focus,
75 textarea:focus {
76 border-color: #4787b1;
77 box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9);
78 outline: none;
79 }
80
81 input[type="text"]:required,
82 input[type="password"]:required {
83 border-color: #4787b1;
84 }
85
86 input.placeholder,
87 textarea.placeholder {
88 color: #aaa;
89 }
90
91 .bold {
92 font-weight: bold;
93 }
94
95 /* fixes vertical alignment of checkboxes and labels */
96 label input + span {
97 vertical-align: middle;
98 }
99
100 .noselect {
101 user-select: none;
102 -moz-user-select: none;
103 -khtml-user-select: none;
104 -ms-user-select: none;
105 -webkit-user-select: none;
106 }
107
108 /*** buttons ***/
109
110 input.button {
111 display: inline-block;
112 margin: 0 2px;
113 padding: 4px 8px;
114 color: #525252;
115 border: 1px solid #c0c0c0;
116 border-radius: 4px;
117 background: #f7f7f7;
118 text-decoration: none;
119 outline: none;
120 }
121
122 .formbuttons input.button {
123 color: #ddd;
124 font-size: 110%;
125 padding: 4px 12px;
126 border-color: #465864;
127 border-radius: 5px;
128 background: #666666;
129 box-shadow: 0 1px 1px 0 #ccc;
130 }
131
132 .formbuttons input.button:hover,
133 .formbuttons input.button:focus,
134 input.button.mainaction:hover,
135 input.button.mainaction:focus {
136 color: #f2f2f2;
137 border-color: #465864;
138 box-shadow: 0 0 5px 2px rgba(71,135,177, 0.6);
139 }
140
141 .formbuttons input.button:active {
142 color: #fff;
143 background: #5f5f5f;
144 }
145
146 input.button.mainaction {
147 color: #ededed;
148 border-color: #1f262c;
149 background: #2c2f33;
150 }
151
152 input.button.mainaction:active {
153 color: #fff;
154 background: #515151;
155 background: -moz-linear-gradient(top, #2a2e31 0%, #505050 100%);
156 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2a2e31), color-stop(100%,#505050));
157 background: -ms-linear-gradient(top, #2a2e31 0%, #505050 100%);
158 background: linear-gradient(to bottom, #2a2e31 0%, #505050 100%);
159 }
160
161 input.button[disabled],
162 input.button[disabled]:hover,
163 input.button.mainaction[disabled] {
164 color: #aaa !important;
165 }
166
167 input.mainaction {
168 font-weight: bold;
169 }
170
171 form.smart-upload,
172 input.smart-upload {
173 visibility: hidden;
174 width: 1px;
175 height: 1px;
176 opacity: 0;
177 }
178
179 /** link buttons **/
180
181 a.button,
182 .buttongroup {
183 display: inline-block;
184 margin: 0 2px;
185 padding: 2px 5px;
186 color: #525252;
187 border: 1px solid #c6c6c6;
188 border-radius: 4px;
189 background: #e6e6e6;
190 text-decoration: none;
191 }
192
193 .buttongroup {
194 padding: 0;
195 white-space: nowrap;
196 }
197
198 a.button:focus,
199 input.button:focus {
200 border-color: #017db6;
201 box-shadow: 0 0 2px 1px rgba(71,135,177, 0.6);
202 outline: none;
203 }
204
205 label.disabled,
206 a.button.disabled {
207 color: #999;
208 }
209
210 a.button.disabled,
211 input.button.disabled,
212 input.button[disabled],
213 a.button.disabled:hover,
214 input.button.disabled:hover,
215 input.button[disabled]:hover {
216 border-color: #c6c6c6;
217 }
218
219 a.button.disabled span.inner {
220 opacity: 0.4;
221 }
222
223 .buttongroup a.button {
224 margin: 0;
225 border-width: 0 1px 0 0;
226 border-radius: 0;
227 background: none;
228 }
229
230 .buttongroup a.button.first,
231 .buttongroup a.button:first-child {
232 border-radius: 4px 0 0 4px;
233 border-left: 0;
234 }
235
236 .buttongroup a.button.last,
237 .buttongroup a.button:last-child {
238 border-radius: 0 4px 4px 0;
239 border-right: 0;
240 }
241
242 a.button.pressed,
243 a.button:active,
244 input.button:active {
245 background: #f7f7f7;
246 }
247
248 .pagenav.dark a.button {
249 font-weight: bold;
250 border: 0;
251 background: transparent;
252 margin: 0;
253 }
254
255 .pagenav.dark a.button.pressed {
256 background: #d8d8d8;
257 }
258
259 .buttongroup a.button.selected,
260 .buttongroup a.button.selected:hover {
261 background: #8a8a8a;
262 border-right-color: #8a8a8a;
263 border-left-color: #555;
264 }
265
266 .buttongroup a.button:focus,
267 .buttongroup a.button.selected:focus {
268 background: #f2f2f2;
269 background: -moz-linear-gradient(top, #49b3d2 0, #66bcd9 100%);
270 background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#49b3d2), color-stop(100%,#66bcd9));
271 background: -ms-linear-gradient(top, #49b3d2 0, #66bcd9 100%);
272 background: linear-gradient(to bottom, #49b3d2 0, #66bcd9 100%);
273 }
274
275 .pagenav a.button {
276 padding: 1px 3px;
277 height: 16px;
278 vertical-align: middle;
279 margin-bottom: 1px;
280 }
281
282 .pagenav .buttongroup a.button,
283 .pagenav .buttongroup a.button:hover {
284 padding: 1px 5px;
285 margin-bottom: 0;
286 }
287
288 a.button span.icon,
289 .pagenav a.button span.inner {
290 display: inline-block;
291 width: 16px;
292 height: 13px;
293 text-indent: 1000px;
294 overflow: hidden;
295 background: url(images/buttons.png?v=d70c.9130) -6px -211px no-repeat;
296 }
297
298 a.button.prevpage span.icon,
299 .pagenav a.prevpage span.inner {
300 background-position: -7px -226px;
301 }
302
303 a.button.nextpage span.icon,
304 .pagenav a.nextpage span.inner {
305 background-position: -28px -226px;
306 }
307
308 a.button.lastpage span.icon,
309 .pagenav a.lastpage span.inner {
310 background-position: -28px -211px;
311 }
312
313 a.button.pageup span.icon,
314 .pagenav a.pageup span.inner {
315 background-position: -7px -241px;
316 }
317
318 a.button.pagedown span.icon,
319 .pagenav a.pagedown span.inner {
320 background-position: -29px -241px;
321 }
322
323 a.button.reply span.icon,
324 .pagenav a.reply span.inner {
325 background-position: -7px -256px;
326 }
327
328 a.button.forward span.icon,
329 .pagenav a.forward span.inner {
330 background-position: -29px -256px;
331 }
332
333 a.button.replyall span.icon,
334 .pagenav a.replyall span.inner {
335 background-position: -7px -271px;
336 }
337
338 a.button.extwin span.icon,
339 .pagenav a.extwin span.inner {
340 background-position: -29px -271px;
341 }
342
343 a.button.changeformat.html span.icon,
344 .pagenav a.changeformat.html span.inner {
345 background-position: -7px -1859px;
346 }
347 a.button.changeformat.html.selected span.icon,
348 .pagenav a.changeformat.html.selected span.inner {
349 background-position: -29px -1859px;
350 }
351
352 a.button.changeformat.text span.icon,
353 .pagenav a.changeformat.text span.inner {
354 background-position: -7px -1874px;
355 }
356 a.button.changeformat.text.selected span.icon,
357 .pagenav a.changeformat.text.selected span.inner {
358 background-position: -29px -1874px;
359 }
360
361 a.button.add span.icon {
362 background-position: -7px -2009px;
363 }
364
365 a.button.delete span.icon {
366 background-position: -29px -2009px;
367 }
368
369 .pagenav .countdisplay {
370 display: inline-block;
371 padding: 3px 1em 0 1em;
372 min-width: 16em;
373 }
374
375 .pagenavbuttons {
376 position: relative;
377 top: -2px;
378 }
379
380 .pagenav .pagejumper {
381 text-align: center;
382 padding: 3px 0;
383 cursor: default;
384 }
385
386 a.iconbutton {
387 display: inline-block;
388 width: 20px;
389 height: 18px;
390 text-decoration: none;
391 text-indent: -5000px;
392 background: url(images/buttons.png?v=d70c.9130) -1000px 0 no-repeat;
393 }
394
395 a.iconbutton.disabled {
396 opacity: 0.4;
397 cursor: default;
398 }
399
400 a.iconbutton.searchicon,
401 a.iconbutton.searchoptions {
402 width: 24px;
403 background-position: -2px -317px;
404 }
405
406 a.iconbutton.searchicon {
407 width: 15px;
408 }
409
410 a.iconbutton.reset {
411 width: 24px;
412 background-position: -25px -317px;
413 }
414
415 a.iconbutton.remove,
416 a.iconbutton.cancel {
417 background-position: -7px -378px;
418 }
419
420 a.iconbutton.delete {
421 background-position: -7px -338px;
422 }
423
424 a.iconbutton.add {
425 background-position: -7px -358px;
426 }
427
428 a.iconbutton.remove {
429 background-position: -7px -379px;
430 }
431
432 a.iconbutton.cancel {
433 background-position: -7px -398px;
434 }
435
436 a.iconbutton.edit {
437 background-position: -7px -418px;
438 }
439
440 a.iconbutton.upload {
441 background-position: -6px -438px;
442 }
443
444
445 a.iconlink {
446 display: inline-block;
447 color: #888;
448 text-decoration: none;
449 white-space: nowrap;
450 padding: 2px 8px 2px 20px;
451 background: url(images/buttons.png?v=d70c.9130) -1000px 0 no-repeat;
452 }
453
454 a.iconlink:hover {
455 text-decoration: underline;
456 }
457
458 a.iconlink.delete {
459 background-position: -7px -337px;
460 }
461
462 a.iconlink.add {
463 background-position: -7px -357px;
464 }
465
466 a.iconlink.remove {
467 background-position: -7px -378px;
468 }
469
470 a.iconlink.cancel {
471 background-position: -7px -397px;
472 }
473
474 a.iconlink.edit {
475 background-position: -7px -417px;
476 }
477
478 a.iconlink.upload {
479 background-position: -6px -437px;
480 }
481
482
483 /*** message bar ***/
484
485 #message div.loading,
486 #message div.uploading,
487 #message div.warning,
488 #message div.error,
489 #message div.notice,
490 #message div.confirmation,
491 #message-objects div.notice {
492 color: #555;
493 font-weight: bold;
494 padding: 6px 30px 6px 25px;
495 display: inline-block;
496 white-space: nowrap;
497 background: url(images/messages.png?v=72e9.1264) 0 5px no-repeat;
498 cursor: default;
499 }
500
501 #message div.warning {
502 color: #960;
503 background-position: 0 -86px;
504 }
505
506 #message div.error {
507 color: #cf2734;
508 background-position: 0 -57px;
509 }
510
511 #message div.confirmation {
512 color: #093;
513 background-position: 0 -25px;
514 }
515
516 #message div.loading {
517 background: url(images/ajaxloader.gif?v=c252.1434) 2px 6px no-repeat;
518 }
519
520 #message div a,
521 #message div span {
522 padding-right: 0.5em;
523 text-decoration: none;
524 }
525
526 #message div a:hover {
527 text-decoration: underline;
528 cursor: pointer;
529 }
530
531 #message.statusbar {
532 display: none;
533 position: absolute;
534 bottom: 0;
535 left: 0;
536 right: 0;
537 height: 27px;
538 padding-left: 8px;
539 border-top: 1px solid #ddd;
540 border-radius: 0 0 4px 4px;
541 background: #eaeaea;
542 background: -moz-linear-gradient(top, #eaeaea 0%, #c8c8c8 100%);
543 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eaeaea), color-stop(100%,#c8c8c8));
544 background: -ms-linear-gradient(top, #eaeaea 0%, #c8c8c8 100%);
545 background: linear-gradient(to bottom, #eaeaea 0%, #c8c8c8 100%);
546 white-space: nowrap;
547 overflow: hidden;
548 text-overflow: ellipsis;
549 }
550
551 #messagestack {
552 position: absolute;
553 bottom: 20px;
554 right: 12px;
555 z-index: 50000;
556 width: auto;
557 height: auto;
558 max-height: 85%;
559 overflow-y: auto;
560 padding: 2px;
561 }
562
563 #messagestack div {
564 display: block;
565 position: relative;
566 width: 280px;
567 height: auto;
568 min-height: 16px;
569 margin: 3px 2px 5px 2px;
570 padding: 8px 10px 7px 30px;
571 cursor: default;
572 font-size: 12px;
573 font-weight: bold;
574 border-radius: 4px;
575 border: 1px solid #444;
576 color: #ebebeb;
577
578 background: rgba(64,64,64,0.85);
579 background: -moz-linear-gradient(top, rgba(64,64,64,0.85) 0%, rgba(48,48,48,0.9) 100%);
580 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(64,64,64,0.85)), color-stop(100%,rgba(48,48,48,0.9)));
581 background: -webkit-linear-gradient(top, rgba(64,64,64,0.85) 0%, rgba(48,48,48,0.85) 100%);
582 background: -ms-linear-gradient(top, rgba(64,64,64,0.85) 0%, rgba(48,48,48,0.85) 100%);
583 background: linear-gradient(to bottom, rgba(64,64,64,0.85) 0%, rgba(48,48,48,0.85) 100%);
584 }
585
586 #messagestack div:after {
587 content: "";
588 position: absolute;
589 display: block;
590 top: 0;
591 left: 4px;
592 width: 20px;
593 height: 24px;
594 background: url(images/messages_dark.png?v=8e53.601) 0 7px no-repeat;
595 }
596
597 #messagestack div.error {
598 color: #ff615d;
599 }
600
601 #messagestack div.error:after {
602 background-position: 0 -55px;
603 }
604
605 #messagestack div.warning {
606 color: #f4bf0e;
607 }
608
609 #messagestack div.warning:after {
610 background-position: 0 -84px;
611 }
612
613 #messagestack div.confirmation {
614 color: #00e05a;
615 }
616
617 #messagestack div.confirmation:after {
618 background-position: 0 -25px;
619 }
620
621 #messagestack div.uploading,
622 #messagestack div.loading {
623 color: #ddd;
624 }
625
626 #messagestack div.uploading:after,
627 #messagestack div.loading:after {
628 top: 4px;
629 left: 6px;
630 background: url(images/ajaxloader_dark.gif?v=cf1b.1849) 0 4px no-repeat;
631 }
632
633 #messagestack div.voice {
634 position: absolute;
635 top: -1000px;
636 }
637
638 #messagestack div a {
639 color: #94c0da;
640 }
641
642 #messagestack div a:hover {
643 text-decoration: underline;
644 cursor: pointer;
645 }
646
647 .ui-dialog.error .ui-dialog-title,
648 .ui-dialog.warning .ui-dialog-title,
649 .ui-dialog.confirmation .ui-dialog-title {
650 padding-left: 25px;
651 background: url(images/messages.png?v=72e9.1264) 0 5px no-repeat;
652 }
653
654 .ui-dialog.warning .ui-dialog-title {
655 color: #960;
656 background-position: 0 -91px;
657 }
658
659 .ui-dialog.error .ui-dialog-title {
660 color: #cf2734;
661 background-position: 0 -62px;
662 }
663
664 .ui-dialog.confirmation .ui-dialog-title {
665 color: #093;
666 background-position: 0 -32px;
667 }
668
669 .ui-autocomplete {
670 max-height: 160px;
671 overflow-x: hidden;
672 overflow-y: auto;
673 }
674
675
676 /*** basic page layout ***/
677
678 #header {
679 overflow-x: hidden; /* Chrome bug #1488851 */
680 }
681
682 #topline {
683 height: 18px;
684 background-color: #333333;
685 border-bottom: 1px solid #383838;
686 padding: 2px 0 2px 10px;
687 color: #aaa;
688 text-align: center;
689 }
690
691 #topnav {
692 position: relative;
693 height: 46px;
694 margin-bottom: 10px;
695 padding: 0 0 0 10px;
696 background: #1c1c1c;
697 }
698
699 #topline a,
700 #topnav a {
701 color: #eee;
702 text-decoration: none;
703 }
704
705 #topline a:hover {
706 text-decoration: underline;
707 }
708
709 #toplogo {
710 padding-top: 2px;
711 cursor: pointer;
712 border: none;
713 }
714
715 .topleft {
716 float: left;
717 }
718
719 .topright {
720 float: right;
721 }
722
723 .closelink {
724 display: inline-block;
725 padding: 2px 10px 2px 20px;
726 }
727
728 #topline span.username {
729 padding-right: 1em;
730 }
731
732 #topline .topleft a {
733 display: inline-block;
734 padding: 2px 0.8em 0 0;
735 color: #aaa;
736 }
737
738 #topline a.button-logout {
739 display: inline-block;
740 padding: 2px 10px 2px 20px;
741 background: url(images/buttons.png?v=d70c.9130) -6px -193px no-repeat;
742 color: #fff;
743 }
744
745 #taskbar .button-logout {
746 display: none;
747 }
748
749 #taskbar a.button-logout span.button-inner {
750 background-position: -2px -1791px;
751 }
752
753 #taskbar a.button-logout:hover span.button-inner {
754 background-position: -2px -1829px;
755 }
756
757
758 /*** minimal version of the page header ***/
759
760 .minimal #topline {
761 position: fixed;
762 top: -18px;
763 background: #444;
764 z-index: 5000;
765 width: 100%;
766 height: 22px;
767 -moz-box-sizing: border-box;
768 box-sizing: border-box;
769 }
770
771 .minimal #topline:hover {
772 top: 0px;
773 opacity: 0.94;
774 -webkit-transition: top 0.3s ease-in-out;
775 -moz-transition: top 0.3s ease-in-out;
776 transition: top 0.3s ease-in-out;
777 }
778
779 .extwin #topline,
780 .extwin #topline:hover {
781 position: static;
782 top: 0px;
783 height: 18px;
784 width: auto;
785 -moz-box-sizing: content-box;
786 box-sizing: content-box;
787 opacity: 0.999;
788 }
789
790 .minimal #topline a.button-logout {
791 display: none;
792 }
793
794 .minimal #topline span.username {
795 display: inline-block;
796 padding-top: 2px;
797 }
798
799 .minimal #topnav {
800 position: relative;
801 top: 4px;
802 height: 42px;
803 }
804
805 .minimal #taskbar a {
806 position: relative;
807 padding: 10px 10px 0 6px;
808 height: 32px;
809 }
810
811 .minimal #taskbar .button-logout {
812 display: inline-block;
813 }
814
815 .minimal #taskbar .button-inner {
816 top: -4px;
817 padding: 0;
818 height: 24px !important;
819 width: 27px;
820 text-indent: -5000px;
821 }
822
823 #taskbar .tooltip {
824 display: none;
825 }
826
827 .minimal #taskbar .tooltip {
828 position: absolute;
829 top: -500px;
830 right: 2px;
831 display: inline-block;
832 padding: 2px 8px 3px 8px;
833 background: #444;
834 color: #eee;
835 font-weight: bold;
836 white-space: nowrap;
837 box-shadow: 0 1px 4px 0 #333;
838 z-index: 200;
839 white-space: nowrap;
840 }
841
842 .minimal #taskbar .tooltip:after {
843 content: "";
844 position: absolute;
845 top: -4px;
846 right: 15px;
847 border-style: solid;
848 border-width: 0 4px 4px;
849 border-color: #444 transparent;
850 /* reduce the damage in FF3.0 */
851 display: block;
852 width: 0;
853 z-index: 251;
854 }
855
856 .minimal #taskbar a:hover .tooltip {
857 display: block;
858 top: 39px;
859 }
860
861
862 /*** taskbar ***/
863
864 #taskbar {
865 position: relative;
866 padding-right: 18px;
867 }
868
869 #taskbar a {
870 display: inline-block;
871 height: 34px;
872 padding: 12px 10px 0 6px;
873 }
874
875 #taskbar a span.button-inner {
876 display: inline-block;
877 font-size: 110%;
878 font-weight: normal;
879 padding: 5px 0 0 34px;
880 height: 19px;
881 background: url(images/buttons.png?v=d70c.9130) -1000px 0 no-repeat;
882 }
883
884 #taskbar a:focus {
885 color: #fff;
886 background-color: rgba(73,180,210,0.7);
887 outline: none;
888 }
889
890 #taskbar a.button-selected {
891 color: #20a6fb;
892 background-color: #2c2c2c;
893 }
894
895 #taskbar a.button-mail span.button-inner {
896 background-position: 0 2px;
897 }
898
899 #taskbar a.button-mail:hover span.button-inner,
900 #taskbar a.button-mail.button-selected span.button-inner {
901 background-position: 0 -22px;
902 }
903
904 #taskbar a.button-addressbook span.button-inner {
905 background-position: 0 -48px;
906 }
907
908 #taskbar a.button-addressbook:hover span.button-inner,
909 #taskbar a.button-addressbook.button-selected span.button-inner {
910 background-position: 0 -72px;
911 }
912
913 #taskbar a.button-settings span.button-inner {
914 background-position: 0 -96px;
915 }
916
917 #taskbar a.button-settings:hover span.button-inner,
918 #taskbar a.button-settings.button-selected span.button-inner {
919 background-position: 0 -120px;
920 }
921
922 #taskbar a.button-calendar span.button-inner {
923 background-position: 0 -144px;
924 }
925
926 #taskbar a.button-calendar:hover span.button-inner,
927 #taskbar a.button-calendar.button-selected span.button-inner {
928 background-position: 0 -168px;
929 }
930
931 #taskbar .minmodetoggle {
932 position: absolute;
933 top: 0;
934 right: 0;
935 display: block;
936 width: 19px;
937 height: 46px;
938 cursor: pointer;
939 background: url(images/buttons.png?v=d70c.9130) -35px -1778px no-repeat;
940 }
941
942 .minimal #taskbar .minmodetoggle {
943 height: 42px;
944 background-position: -35px -1820px;
945 }
946
947 #mainscreen {
948 position: absolute;
949 top: 88px;
950 left: 10px;
951 right: 10px;
952 bottom: 20px;
953 }
954
955 #mainscreencontent {
956 position: absolute;
957 top: 42px;
958 left: 0;
959 right: 0;
960 bottom: 0;
961 }
962
963 #mainscreen.offset {
964 top: 132px;
965 }
966
967 #mainscreen .offset {
968 top: 42px;
969 }
970
971 .minimal #mainscreen {
972 top: 62px;
973 }
974
975 .minimal #mainscreen.offset {
976 top: 102px;
977 }
978
979 .extwin #mainscreen {
980 top: 40px;
981 }
982
983 .extwin #mainscreen.offset {
984 top: 86px;
985 }
986
987 .uibox {
988 border: 1px solid #b2b8bf;
989 border-radius: 4px;
990 overflow: hidden;
991 background: #fff;
992 }
993
994 .minwidth {
995 min-width: 1024px;
996 }
997
998 .scroller {
999 overflow: auto;
1000 }
1001
1002 .watermark {
1003 background-image: url(images/watermark.jpg?v=e784.5000);
1004 background-position: center;
1005 background-repeat: no-repeat;
1006 }
1007
1008 /* fix scrolling within iframes in webkit browsers on touch devices */
1009 @media screen and (-webkit-min-device-pixel-ratio:0) and (max-device-width:1024px) {
1010 .iframebox {
1011 overflow: auto;
1012 -webkit-overflow-scrolling: touch;
1013 }
1014 }
1015
1016
1017 /*** lists ***/
1018
1019 .listbox {
1020 background: #d9ecf4;
1021 overflow: hidden;
1022 }
1023
1024 .listbox .scroller {
1025 position: absolute;
1026 top: 0;
1027 left: 0;
1028 width: 100%;
1029 bottom: 0;
1030 overflow-x: hidden;
1031 overflow-y: auto;
1032 }
1033
1034 .listbox .scroller.withfooter {
1035 bottom: 42px;
1036 }
1037
1038 .listbox .boxtitle + .scroller {
1039 top: 34px;
1040 }
1041
1042 .boxtitle,
1043 .uibox .listing thead th,
1044 .uibox .listing thead td {
1045 font-size: 12px;
1046 font-weight: bold;
1047 padding: 7px 8px 6px 8px;
1048 line-height: 20px;
1049 margin: 0;
1050 border-bottom: 1px solid #bbd3da;
1051 white-space: nowrap;
1052 }
1053
1054 .uibox .listing thead th,
1055 .uibox .listing thead td {
1056 padding-bottom: 8px;
1057 height: auto;
1058 }
1059
1060 .uibox .boxtitle,
1061 .uibox .listing thead th,
1062 .uibox .listing thead td {
1063 background: #b0ccd7;
1064 color: #004458;
1065 border-radius: 4px 4px 0 0;
1066 }
1067
1068 .listbox .listitem,
1069 .listbox .tablink,
1070 .listing tbody td,
1071 .listing li {
1072 display: block;
1073 border-bottom: 1px solid #bbd3da;
1074 cursor: default;
1075 font-weight: normal;
1076 }
1077
1078 .listbox .listitem a,
1079 .listbox .listitem span,
1080 .listbox .tablink a,
1081 .listing tbody td,
1082 .listing li a {
1083 display: block;
1084 color: #376572;
1085 text-decoration: none;
1086 cursor: default;
1087 padding: 5px 8px;
1088 line-height: 17px;
1089 height: 17px;
1090 white-space: nowrap;
1091 }
1092
1093 .listing tbody td {
1094 display: table-cell;
1095 min-height: 14px;
1096 outline: none;
1097 }
1098
1099 .listing tbody td a {
1100 color: #376572;
1101 text-decoration: none;
1102 }
1103
1104 .webkit .listing tbody td {
1105 height: 14px;
1106 }
1107
1108 /* This padding-left minus the focused padding left should be half of the focused border-left */
1109 .listing thead tr td:first-child,
1110 .listing tbody tr td:first-child {
1111 border-left: 2px solid transparent;
1112 padding-left: 6px;
1113 }
1114
1115 .listing.iconized thead tr td:first-child,
1116 .listing.iconized tbody tr td:first-child {
1117 padding-left: 34px;
1118 }
1119
1120 /* because of border-collapse, we make the left border twice what we want it to be - half will be hidden to the left */
1121 .listing.focus tbody tr.focused > td:first-child {
1122 border-left: 2px solid #739da8;
1123 }
1124
1125 .listbox .listitem.selected,
1126 .listbox .tablink.selected,
1127 .listbox .listitem.selected > a,
1128 .listbox .tablink.selected > a,
1129 .listing tbody tr.selected td,
1130 .listing li.selected,
1131 .listing li.selected > a {
1132 color: #004458;
1133 font-weight: bold;
1134 background-color: #c7e3ef;
1135 }
1136
1137 ul.listing {
1138 display: block;
1139 list-style: none;
1140 margin: 0;
1141 padding: 0;
1142 }
1143
1144 ul.listing li {
1145 background-color: #d9ecf4;
1146 overflow: hidden;
1147 text-overflow: ellipsis;
1148 white-space: nowrap;
1149 }
1150
1151 ul.listing li ul {
1152 border-top: 1px solid #bbd3da;
1153 }
1154
1155 ul.listing li.droptarget,
1156 table.listing tr.droptarget td {
1157 background-color: #e8e798;
1158 }
1159
1160 .listbox table.listing {
1161 background-color: #d9ecf4;
1162 }
1163
1164 table.listing,
1165 table.layout {
1166 border: 0;
1167 width: 100%;
1168 border-spacing: 0;
1169 }
1170
1171 table.layout td {
1172 vertical-align: top;
1173 }
1174
1175 ul.treelist li {
1176 position: relative;
1177 }
1178
1179 ul.treelist li ul {
1180 margin: 0;
1181 padding: 0;
1182 }
1183
1184 ul.treelist li ul li:last-child {
1185 border-bottom: 0;
1186 }
1187
1188 ul.treelist li a {
1189 display: block;
1190 padding-left: 20px;
1191 overflow: hidden;
1192 text-overflow: ellipsis;
1193 }
1194
1195 ul.treelist li a:focus,
1196 ul.listing .listitem a:focus,
1197 ul.listing .listitem span:focus,
1198 ul.listing.focus .listitem.focused span {
1199 color: #fff !important;
1200 background-color: rgba(73,180,210,0.6);
1201 outline: none;
1202 }
1203
1204 ul.treelist ul li a {
1205 padding-left: 38px;
1206 }
1207
1208 ul.treelist ul ul li a {
1209 padding-left: 54px;
1210 }
1211
1212 ul.treelist.iconized li a {
1213 padding-left: 36px;
1214 }
1215
1216 ul.treelist.iconized ul li a {
1217 padding-left: 62px;
1218 }
1219
1220 ul.treelist.iconized ul ul li a {
1221 padding-left: 88px;
1222 }
1223
1224 ul.treelist.iconized ul ul ul li a {
1225 padding-left: 114px;
1226 }
1227
1228 ul.treelist li div.treetoggle {
1229 position: absolute;
1230 top: 7px;
1231 left: 4px;
1232 width: 13px;
1233 height: 13px;
1234 background: url(images/listicons.png?v=c458.10409) -3px -144px no-repeat;
1235 cursor: pointer;
1236 }
1237
1238 ul.treelist li ul li div.treetoggle {
1239 left: 22px;
1240 }
1241
1242 ul.treelist.iconized li div.treetoggle {
1243 top: 13px;
1244 left: 19px;
1245 }
1246
1247 ul.treelist.iconized ul li div.treetoggle {
1248 left: 45px;
1249 }
1250
1251 ul.treelist.iconized ul ul li div.treetoggle {
1252 left: 71px;
1253 }
1254
1255 ul.treelist li div.treetoggle.expanded {
1256 background-position: -3px -168px;
1257 }
1258
1259 ul.treelist li.selected > div.collapsed {
1260 background-position: -23px -144px;
1261 }
1262
1263 ul.treelist li.selected > div.expanded {
1264 background-position: -23px -168px;
1265 }
1266
1267 .listbox .boxfooter {
1268 position: absolute;
1269 bottom: 0;
1270 left: 0;
1271 width: 100%;
1272 height: 42px;
1273 border-top: 1px solid #bbd3da;
1274 background: #d9ecf4;
1275 white-space: nowrap;
1276 overflow: hidden;
1277 }
1278
1279 .uibox .boxfooter {
1280 border-radius: 0 0 4px 4px;
1281 }
1282
1283 .boxfooter .listbutton {
1284 display: inline-block;
1285 text-decoration: none;
1286 width: 48px;
1287 border-right: 1px solid #fff;
1288 background: #c7e3ef;
1289 padding: 3px 0;
1290 margin-top: 1px;
1291 }
1292
1293 .boxfooter a.listbutton:focus {
1294 color: #fff;
1295 background-color: rgba(73,180,210,0.6);
1296 outline: none;
1297 }
1298
1299 .uibox .boxfooter .listbutton:first-child {
1300 border-radius: 0 0 0 4px;
1301 }
1302
1303 .boxfooter .listbutton .inner {
1304 display: inline-block;
1305 width: 48px;
1306 height: 35px;
1307 text-indent: -5000px;
1308 background-image: url(images/buttons.png?v=d70c.9130);
1309 background-position: -1000px 0;
1310 background-repeat: no-repeat;
1311 }
1312
1313 .boxfooter .listbutton.add .inner {
1314 background-position: 10px -1301px;
1315 }
1316
1317 .boxfooter .listbutton.delete .inner {
1318 background-position: 10px -1342px;
1319 }
1320
1321 .boxfooter .listbutton.groupactions .inner {
1322 background-position: 5px -1382px;
1323 }
1324
1325 .boxfooter .listbutton.addto .inner {
1326 background-position: 5px -1422px;
1327 }
1328
1329 .boxfooter .listbutton.addcc .inner {
1330 background-position: 5px -1462px;
1331 }
1332
1333 .boxfooter .listbutton.addbcc {
1334 width: 54px;
1335 }
1336
1337 .boxfooter .listbutton.addbcc .inner {
1338 width: 54px;
1339 background-position: 2px -1502px;
1340 }
1341
1342 .boxfooter .listbutton.removegroup .inner {
1343 background-position: 5px -1540px;
1344 }
1345
1346 .boxfooter .listbutton.disabled .inner {
1347 opacity: 0.4;
1348 }
1349
1350 .boxfooter .countdisplay {
1351 display: inline-block;
1352 position: relative;
1353 top: 10px;
1354 color: #69929e;
1355 padding: 3px 6px;
1356 }
1357
1358 .boxpagenav {
1359 position: absolute;
1360 top: 10px;
1361 right: 6px;
1362 width: auto;
1363 }
1364
1365 .boxpagenav a.icon {
1366 display: inline-block;
1367 padding: 1px 3px;
1368 height: 13px;
1369 width: 14px;
1370 text-indent: 1000px;
1371 vertical-align: bottom;
1372 overflow: hidden;
1373 background: url(images/buttons.png?v=d70c.9130) -4px -286px no-repeat;
1374 }
1375
1376 .boxpagenav a.icon.prevpage {
1377 background-position: -4px -301px;
1378 }
1379
1380 .boxpagenav a.icon.nextpage {
1381 background-position: -28px -301px;
1382 }
1383
1384 .boxpagenav a.icon.lastpage {
1385 background-position: -28px -286px;
1386 }
1387
1388 .boxpagenav a.icon.disabled {
1389 opacity: 0.4;
1390 }
1391
1392 .centerbox {
1393 width: 40em;
1394 margin: 16px auto;
1395 }
1396
1397 .errorbox {
1398 width: 40em;
1399 padding: 20px;
1400 }
1401
1402 .errorbox h3 {
1403 font-size: 16px;
1404 margin-top: 0;
1405 }
1406
1407
1408 /*** Records table ***/
1409
1410 table.records-table {
1411 display: table;
1412 width: 100%;
1413 table-layout: fixed;
1414 border-spacing: 0;
1415 border: 1px solid #bbd3da;
1416 }
1417
1418 .boxlistcontent .records-table {
1419 border: 0;
1420 }
1421
1422 .records-table thead th,
1423 .records-table thead td {
1424 color: #69939e;
1425 font-size: 11px;
1426 font-weight: bold;
1427 background: #d6eaf3;
1428 border-left: 1px solid #bbd3da;
1429 padding: 8px 7px;
1430 overflow: hidden;
1431 text-overflow: ellipsis;
1432 text-align: left;
1433 }
1434
1435 .records-table.sortheader thead th,
1436 .records-table.sortheader thead td {
1437 padding: 0;
1438 }
1439
1440 .records-table thead th a,
1441 .records-table thead td a,
1442 .records-table thead th span,
1443 .records-table thead td span {
1444 display: block;
1445 padding: 7px 7px;
1446 color: #69939e;
1447 text-decoration: none;
1448 overflow: hidden;
1449 text-overflow: ellipsis;
1450 }
1451
1452 .records-table thead th a:focus,
1453 .records-table thead td a:focus {
1454 color: #fff;
1455 background-color: rgba(73,180,210,0.7);
1456 outline: none;
1457 }
1458
1459 .records-table tbody td {
1460 padding: 2px 7px;
1461 border-bottom: 1px solid #ddd;
1462 border-left: 1px dotted #bbd3da;
1463 white-space: nowrap;
1464 cursor: default;
1465 overflow: hidden;
1466 text-overflow: ellipsis;
1467 background-color: #fff;
1468 outline: none;
1469 }
1470
1471 /* This padding-left minus the focused padding left should be half of the focused border-left */
1472 .records-table thead tr th:first-child,
1473 .records-table thead tr td:first-child,
1474 .records-table tbody tr td:first-child {
1475 border-left: 2px solid transparent;
1476 padding-left: 4px;
1477 }
1478
1479 /* because of border-collapse, we make the left border twice what we want it to be - half will be hidden to the left */
1480 .records-table.focus tbody tr.focused > td:first-child {
1481 border-left: 2px solid #49b3d2;
1482 }
1483
1484 .records-table tr.selected td {
1485 color: #fff !important;
1486 background-color: #4db0d2;
1487 }
1488
1489 .records-table.focus tr.selected td {
1490 background-color: #017db6 !important;
1491 }
1492
1493 .records-table tr.selected td a,
1494 .records-table tr.selected td span {
1495 color: #fff !important;
1496 }
1497
1498 .records-table tr.deleted td,
1499 .records-table tr.deleted td a {
1500 color: #ccc !important;
1501 }
1502
1503 /*** iFrames ***/
1504
1505 #aboutframe {
1506 width: 97%;
1507 height: 100%;
1508 border: 0;
1509 padding: 0;
1510 }
1511
1512 body.iframe {
1513 background: #fff;
1514 margin: 38px 0 10px 0;
1515 }
1516
1517 body.iframe.error {
1518 background: #ededed;
1519 }
1520
1521 body.iframe.floatingbuttons {
1522 margin-bottom: 40px;
1523 }
1524
1525 body.iframe.fullheight {
1526 margin: 0;
1527 }
1528
1529 .contentbox .boxtitle,
1530 body.iframe .boxtitle {
1531 color: #777;
1532 background: #efefef;
1533 border-bottom: 1px solid #d0d0d0;
1534 }
1535
1536 body.iframe .boxtitle {
1537 position: fixed;
1538 top: 0;
1539 left: 0;
1540 width: 100%;
1541 z-index: 100;
1542 }
1543
1544 body.iframe .footerleft.floating,
1545 #composeview-bottom .formbuttons.floating {
1546 position: fixed;
1547 left: 0;
1548 bottom: 0;
1549 width: 100%;
1550 z-index: 110;
1551 background: #fff;
1552 padding-top: 8px;
1553 padding-bottom: 12px;
1554 }
1555
1556 body.iframe .footerleft.floating:before,
1557 #composeview-bottom .formbuttons.floating:before {
1558 content: " ";
1559 position: absolute;
1560 top: -6px;
1561 left: 0;
1562 width: 100%;
1563 height: 6px;
1564 background: url(images/overflowshadow.png?v=ac21.201) top center no-repeat;
1565 }
1566
1567 .boxcontent {
1568 padding: 10px;
1569 }
1570
1571 .boxcontent .boxwarning {
1572 margin: 0 0 10px;
1573 display: block;
1574 color: #960;
1575 border: 1px solid #ffdf0e;
1576 background: url(images/messages.png?v=72e9.1264) #fef893 5px -85px no-repeat;
1577 padding: 6px 12px 6px 30px;
1578 }
1579
1580 .contentbox .scroller {
1581 position: absolute;
1582 top: 34px;
1583 left: 0;
1584 right: 0;
1585 bottom: 0px;
1586 overflow: auto;
1587 }
1588
1589 .iframebox {
1590 position: absolute;
1591 top: 0;
1592 left: 0;
1593 right: 0;
1594 bottom: 0px;
1595 }
1596
1597 .footerleft {
1598 padding: 0 12px 4px 12px;
1599 }
1600
1601 .propform fieldset {
1602 margin-bottom: 20px;
1603 border: 0;
1604 padding: 0;
1605 }
1606
1607 .propform fieldset legend {
1608 display: block;
1609 font-size: 14px;
1610 font-weight: bold;
1611 padding-bottom: 10px;
1612 margin-bottom: 0;
1613 }
1614
1615 .propform fieldset fieldset legend {
1616 color: #666;
1617 font-size: 12px;
1618 }
1619
1620 .propform div.prop {
1621 margin-bottom: 0.5em;
1622 }
1623
1624 .propform div.prop.block label {
1625 display: block;
1626 margin-bottom: 0.3em;
1627 }
1628
1629 .propform div.prop.block input,
1630 .propform div.prop.block textarea {
1631 width: 95%;
1632 }
1633
1634 .propform a.disabled {
1635 color: #999;
1636 text-decoration: none;
1637 cursor: default;
1638 }
1639
1640 fieldset.floating {
1641 float: left;
1642 margin-right: 10px;
1643 margin-bottom: 10px;
1644 }
1645
1646 table.propform {
1647 width: 100%;
1648 border-spacing: 0;
1649 border-collapse: collapse;
1650 }
1651
1652 ul.proplist li,
1653 table.propform td {
1654 width: 80%;
1655 padding: 4px 10px;
1656 background: #eee;
1657 border-bottom: 2px solid #fff;
1658 }
1659
1660 table.propform td.title {
1661 width: 20%;
1662 color: #333;
1663 padding-right: 20px;
1664 white-space: nowrap;
1665 }
1666
1667 table.propform .mceLayout td {
1668 padding: 0;
1669 border-bottom: 0;
1670 }
1671
1672 ul.proplist {
1673 list-style: none;
1674 margin: 0;
1675 padding: 0;
1676 }
1677
1678 ul.proplist li {
1679 width: auto;
1680 }
1681
1682 #pluginbody {
1683 position: absolute;
1684 top: 0;
1685 left: 0;
1686 right: 0;
1687 bottom: 0;
1688 }
1689
1690
1691 /*** Login form ***/
1692
1693 #login-form {
1694 position: relative;
1695 width: 580px;
1696 margin: 20ex auto 2ex auto;
1697 }
1698
1699 #login-form .box-inner {
1700 width: 430px;
1701 background: #404040;
1702 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #404040), color-stop(100%, #2e2e2e));
1703 background: -ms-linear-gradient(top, #404040 0%, #2e2e2e 100%);
1704 background: linear-gradient(to bottom, #404040 0%, #2e2e2e 100%);
1705 margin: 0 50px;
1706 padding: 10px 24px 24px 24px;
1707 border-radius: 6px;
1708 }
1709
1710 #login-form .box-bottom {
1711 margin-top: -3px;
1712 padding-top: 10px;
1713 }
1714
1715 #login-form .noscriptwarning {
1716 margin: 0 auto;
1717 width: 430px;
1718 color: #cf2734;
1719 font-size: 110%;
1720 font-weight: bold;
1721 }
1722
1723 #login-form td.input {
1724 width: 80%;
1725 padding: 8px;
1726 }
1727
1728 #login-form input[type="text"],
1729 #login-form input[type="password"] {
1730 width: 100%;
1731 border-color: #666;
1732 }
1733
1734 #login-form input.button {
1735 color: #444;
1736 border-color: #f9f9f9;
1737 background-color: #f9f9f9;
1738 }
1739
1740 #login-form input.button:active {
1741 color: #333;
1742 background-color: #dcdcdc;
1743 }
1744
1745 #login-form form table {
1746 width: 98%;
1747 }
1748
1749 #login-form td.title {
1750 width: 20%;
1751 white-space: nowrap;
1752 color: #cecece;
1753 text-align: right;
1754 padding-right: 1em;
1755 }
1756
1757 #login-form p.formbuttons {
1758 margin-top: 2em;
1759 text-align: center;
1760 }
1761
1762 #login-form #logo {
1763 margin-bottom: 20px;
1764 border: none;
1765 }
1766
1767 #login-form #message {
1768 min-height: 40px;
1769 padding: 5px 25px;
1770 text-align: center;
1771 font-size: 1.1em;
1772 }
1773
1774 #login-form #message div {
1775 display: inline-block;
1776 padding-right: 0;
1777 font-size: 12px;
1778 }
1779
1780 #bottomline {
1781 font-size: 90%;
1782 text-align: center;
1783 margin-top: 2em;
1784 }
1785
1786
1787
1788 /*** quicksearch **/
1789
1790 .searchbox {
1791 position: relative;
1792 }
1793
1794 #quicksearchbar {
1795 position: absolute;
1796 right: 2px;
1797 top: 2px;
1798 width: 240px;
1799 }
1800
1801 .searchbox input,
1802 #quicksearchbar input {
1803 width: 176px;
1804 margin: 0;
1805 padding: 3px 30px 3px 34px;
1806 height: 18px;
1807 background: #f1f1f1;
1808 border-color: #ababab;
1809 font-weight: bold;
1810 font-size: 11px;
1811 }
1812
1813 .searchbox .searchicon,
1814 .searchbox #searchmenulink,
1815 #quicksearchbar #searchmenulink {
1816 position: absolute;
1817 top: 5px;
1818 left: 6px;
1819 }
1820
1821 .searchbox #searchreset,
1822 .searchbox .iconbutton.reset,
1823 #quicksearchbar #searchreset {
1824 position: absolute;
1825 top: 4px;
1826 right: 1px;
1827 }
1828
1829 .listsearchbox {
1830 padding: 4px;
1831 background: #c7e3ef;
1832 display: none;
1833 }
1834
1835 .listsearchbox input {
1836 width: 100%;
1837 height: 26px;
1838 -moz-box-sizing: border-box;
1839 box-sizing: border-box;
1840 }
1841
1842 /*** toolbar ***/
1843
1844 .toolbar .spacer {
1845 display: inline-block;
1846 width: 24px;
1847 height: 40px;
1848 padding: 0;
1849 }
1850
1851 .toolbar a.button {
1852 text-align: center;
1853 font-size: 10px;
1854 color: #555;
1855 min-width: 50px;
1856 max-width: 70px;
1857 height: 13px;
1858 overflow: hidden;
1859 text-overflow: ellipsis;
1860 white-space: nowrap;
1861 padding: 28px 2px 0 2px;
1862 background: url(images/buttons.png?v=d70c.9130) -100px 0 no-repeat transparent;
1863 border: 0;
1864 border-radius: 0;
1865 }
1866
1867 .dropbutton .dropbuttontip:focus,
1868 .toolbar a.button:focus {
1869 color: #fff;
1870 background-color: rgba(30,150,192, 0.5);
1871 border-radius: 3px;
1872 }
1873
1874 .toolbar a.button.disabled {
1875 opacity: 0.4;
1876 }
1877
1878 .toolbar a.button.selected {
1879 color: #1978a1;
1880 }
1881
1882 .toolbar a.button.selected:focus {
1883 color: #fff;
1884 }
1885
1886 .toolbar a.button.hidden {
1887 display: none;
1888 }
1889
1890 .dropbutton {
1891 display: inline-block;
1892 position: relative;
1893 }
1894
1895 .dropbutton .dropbuttontip {
1896 display: block;
1897 position: absolute;
1898 right: 0;
1899 top: 0;
1900 height: 41px;
1901 width: 18px;
1902 overflow: hidden;
1903 text-indent: -5000px;
1904 background: url(images/buttons.png?v=d70c.9130) 0 -1255px no-repeat;
1905 cursor: pointer;
1906 outline: none;
1907 }
1908
1909 .dropbutton .dropbuttontip:focus,
1910 .dropbutton .dropbuttontip:hover {
1911 background-position: -26px -1255px;
1912 }
1913
1914 .dropbutton a.button.disabled + .dropbuttontip {
1915 opacity: 0.5;
1916 }
1917
1918 .dropbutton a.button.disabled + .dropbuttontip:hover {
1919 background-position: 0 -1255px;
1920 }
1921
1922 .dropbutton a.button {
1923 margin-left: 0;
1924 padding-left: 0;
1925 margin-right: 0;
1926 padding-right: 0;
1927 }
1928
1929 .toolbar a.button.back {
1930 background-position: 0 -1216px;
1931 }
1932
1933 .toolbar a.button.checkmail {
1934 background-position: center -1176px;
1935 }
1936
1937 .toolbar a.button.compose {
1938 background-position: center -530px;
1939 }
1940
1941 .toolbar a.button.reply {
1942 background-position: center -570px;
1943 }
1944
1945 .toolbar a.button.reply-all {
1946 min-width: 64px;
1947 background-position: 0 -610px;
1948 }
1949
1950 .toolbar a.button.forward {
1951 min-width: 64px;
1952 background-position: 0 -650px;
1953 }
1954
1955 .toolbar a.button.delete {
1956 background-position: center -690px;
1957 }
1958
1959 .toolbar a.button.archive {
1960 background-position: center -730px;
1961 }
1962
1963 .toolbar a.button.junk {
1964 background-position: center -770px;
1965 }
1966
1967 .toolbar a.button.print {
1968 background-position: center -810px;
1969 }
1970
1971 .toolbar a.button.markmessage {
1972 background-position: center -1094px;
1973 }
1974
1975 .toolbar a.button.move {
1976 background-position: center -1971px;
1977 }
1978
1979 .toolbar a.button.more {
1980 background-position: center -850px;
1981 }
1982
1983 .toolbar a.button.attach {
1984 background-position: center -890px;
1985 }
1986
1987 .toolbar a.button.spellcheck {
1988 min-width: 64px;
1989 background-position: 0 -930px;
1990 }
1991
1992 .toolbar a.button.spellcheck.selected {
1993 background-position: 0 -1620px;
1994 color: #1978a1;
1995 }
1996
1997 .toolbar a.button.insertsig {
1998 background-position: center -1135px;
1999 }
2000
2001 .toolbar a.button.search {
2002 background-position: center -970px;
2003 }
2004
2005 .toolbar a.button.import {
2006 background-position: center -1012px;
2007 }
2008
2009 .toolbar a.button.export {
2010 min-width: 64px;
2011 background-position: 0 -1054px;
2012 }
2013
2014 .toolbar a.button.send {
2015 background-position: center -1660px;
2016 }
2017
2018 .toolbar a.button.savedraft {
2019 background-position: center -1700px;
2020 }
2021
2022 .toolbar a.button.close {
2023 background-position: 0 -1745px;
2024 }
2025
2026 .toolbar a.button.download {
2027 background-position: center -1892px;
2028 }
2029
2030 .toolbar a.button.responses {
2031 background-position: center -1932px;
2032 }
2033
2034 .toolbar a.button.encrypt {
2035 background-position: center -2025px;
2036 }
2037
2038 .toolbar a.button.encrypt.selected {
2039 background-position: center -2065px;
2040 }
2041
2042 a.menuselector {
2043 display: inline-block;
2044 border: 1px solid #ababab;
2045 border-radius: 4px;
2046 background: #f1f1f1;
2047 text-decoration: none;
2048 color: #333;
2049 cursor: pointer;
2050 white-space: nowrap;
2051 }
2052
2053 a.menuselector .handle {
2054 display: inline-block;
2055 padding: 0 32px 0 6px;
2056 height: 20px;
2057 line-height: 19px;
2058 background: url(images/selector.png?v=0d5b.118) right center no-repeat;
2059 border-radius: 4px;
2060 }
2061
2062 a.menuselector:active {
2063 background: #dddddd;
2064 background: -moz-linear-gradient(top, #dddddd 0%, #f8f8f8 100%);
2065 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dddddd), color-stop(100%,#f8f8f8));
2066 background: -ms-linear-gradient(top, #dddddd 0%, #f8f8f8 100%);
2067 background: linear-gradient(to bottom, #dddddd 0%, #f8f8f8 100%);
2068 text-decoration: none;
2069 }
2070
2071 select.decorated {
2072 position: relative;
2073 z-index: 10;
2074 opacity: 0;
2075 height: 22px;
2076 cursor: pointer;
2077 -khtml-appearance: none;
2078 -webkit-appearance: none;
2079 border: 0;
2080 }
2081
2082 html.opera select.decorated {
2083 opacity: 1;
2084 }
2085
2086 select.decorated option {
2087 color: #fff;
2088 background: #444;
2089 border: 0;
2090 border-top: 1px solid #5a5a5a;
2091 border-bottom: 1px solid #333;
2092 padding: 4px 6px;
2093 outline: none;
2094 cursor: default;
2095 }
2096
2097
2098 a.menuselector:focus,
2099 a.menuselector.focus,
2100 a.iconbutton:focus,
2101 .pagenav a.button:focus {
2102 border-color: #0883d0;
2103 box-shadow: 0 0 4px 2px rgba(71,135,177, 0.8);
2104 outline: none;
2105 }
2106
2107
2108 /*** quota indicator ***/
2109
2110 #quotadisplay {
2111 left: 6px;
2112 height: 18px;
2113 font-size: 12px;
2114 font-weight: bold;
2115 padding-left: 30px;
2116 background: url(images/quota.png?v=aaa4.1389) -100px 0 no-repeat;
2117 }
2118
2119 #quotadisplay.p90,
2120 #quotadisplay.p100 {
2121 color: #e03221;
2122 }
2123
2124 table.quota-info {
2125 border-spacing: 0;
2126 border-collapse: collapse;
2127 table-layout: fixed;
2128 margin: 5px;
2129 }
2130
2131 table.quota-info td,
2132 table.quota-info th {
2133 color: white;
2134 border: 1px solid lightgrey;
2135 padding: 2px 3px;
2136 text-align: center;
2137 min-width: 80px;
2138 }
2139
2140 table.quota-info td.name {
2141 text-align: left;
2142 }
2143
2144 table.quota-info td.root {
2145 font-style: italic;
2146 }
2147
2148 /*** popup menus ***/
2149
2150 .popupmenu,
2151 #rcmKSearchpane {
2152 display: none;
2153 position: absolute;
2154 top: 32px;
2155 left: 90px;
2156 width: auto;
2157 max-height: 70%;
2158 overflow: -moz-scrollbars-vertical;
2159 overflow-y: auto;
2160 background: #444;
2161 z-index: 240;
2162 border-radius: 4px;
2163 box-shadow: 0 2px 6px 0 #333;
2164 }
2165
2166 .popupmenu.dropdown {
2167 border-radius: 0 0 4px 4px;
2168 border-top: 0;
2169 }
2170
2171 .popupmenu > .buttons {
2172 border-top: 1px solid #5a5a5a;
2173 height: 25px;
2174 padding-top: 5px;
2175 text-align: center;
2176 }
2177
2178 ul.toolbarmenu,
2179 ul.toolbarmenu ul,
2180 #rcmKSearchpane ul {
2181 margin: 0;
2182 padding: 0;
2183 list-style: none;
2184 }
2185
2186 .googie_list td,
2187 ul.toolbarmenu li,
2188 #rcmKSearchpane ul li {
2189 color: #fff;
2190 white-space: nowrap;
2191 min-width: 130px;
2192 margin: 0;
2193 border-top: 1px solid #5a5a5a;
2194 }
2195
2196 .googie_list tr:first-child td,
2197 ul.toolbarmenu > li:first-child,
2198 select.decorated option:first-child {
2199 border-top: 0;
2200 }
2201
2202 .googie_list tr:last-child td,
2203 ul.toolbarmenu > li:last-child,
2204 select.decorated option:last-child {
2205 border-bottom: 0;
2206 }
2207
2208 .googie_list td span,
2209 ul.toolbarmenu li a {
2210 display: block;
2211 color: #666;
2212 text-decoration: none;
2213 min-height: 14px;
2214 padding: 6px 16px 6px 10px;
2215 }
2216
2217 .googie_list td span {
2218 padding: 3px 10px;
2219 }
2220
2221 .googie_list td span,
2222 ul.toolbarmenu li a.active {
2223 color: #fff;
2224 cursor: default;
2225 }
2226
2227 .googie_list td.googie_list_onhover,
2228 ul.toolbarmenu li a.active:hover,
2229 ul.toolbarmenu li a.active:focus,
2230 #rcmKSearchpane ul li.selected,
2231 #pagejump-selector ul li.selected,
2232 select.decorated option:hover,
2233 select.decorated option[selected='selected'] {
2234 background-color: #0883d0;
2235 outline: none;
2236 }
2237
2238 ul.toolbarmenu.iconized li a,
2239 ul.toolbarmenu.selectable li a {
2240 padding-left: 30px;
2241 }
2242
2243 ul.toolbarmenu.selectable li a.selected {
2244 background: url(images/messages.png?v=72e9.1264) 4px -27px no-repeat;
2245 }
2246
2247 ul.toolbarmenu li label {
2248 display: block;
2249 color: #fff;
2250 padding: 4px 8px;
2251 }
2252
2253 ul.toolbarmenu li.separator label {
2254 color: #bbb;
2255 font-style: italic;
2256 padding: 0 8px;
2257 line-height: 17px;
2258 }
2259
2260 ul.toolbarmenu li input {
2261 margin: 0;
2262 }
2263
2264 ul.toolbarmenu li a.icon {
2265 color: #eee;
2266 padding: 2px 6px;
2267 }
2268
2269 ul.toolbarmenu li span.icon,
2270 #rcmKSearchpane ul li i.icon {
2271 display: block;
2272 min-height: 14px;
2273 padding: 4px 4px 1px 24px;
2274 height: 17px;
2275 background-image: url(images/listicons.png?v=c458.10409);
2276 background-position: -100px 0;
2277 background-repeat: no-repeat;
2278 opacity: 0.2;
2279 }
2280
2281 ul.toolbarmenu li a.active span.icon {
2282 opacity: 0.99;
2283 }
2284
2285 ul.toolbarmenu li span.read {
2286 background-position: 0 -1220px;
2287 }
2288
2289 ul.toolbarmenu li span.unread {
2290 background-position: 0 -1196px;
2291 }
2292
2293 ul.toolbarmenu li span.flagged {
2294 background-position: 0 -1244px;
2295 }
2296
2297 ul.toolbarmenu li span.unflagged {
2298 background-position: 0 -1268px;
2299 }
2300
2301 ul.toolbarmenu li span.mail {
2302 background-position: 0 -1293px;
2303 }
2304
2305 ul.toolbarmenu li span.list {
2306 background-position: 0 -1317px;
2307 }
2308
2309 ul.toolbarmenu li span.invert {
2310 background-position: 0 -1340px;
2311 }
2312
2313 ul.toolbarmenu li span.cross {
2314 background-position: 0 -1365px;
2315 }
2316
2317 ul.toolbarmenu li span.print {
2318 background-position: 0 -1436px;
2319 }
2320
2321 ul.toolbarmenu li span.download {
2322 background-position: 0 -1412px;
2323 }
2324
2325 ul.toolbarmenu li span.rename {
2326 background-position: 0 -2295px;
2327 }
2328
2329 ul.toolbarmenu li span.edit {
2330 background-position: 0 -1388px;
2331 }
2332
2333 ul.toolbarmenu li span.viewsource {
2334 background-position: 0 -1460px;
2335 }
2336
2337 ul.toolbarmenu li span.extwin {
2338 background-position: 0 -1484px;
2339 }
2340
2341 ul.toolbarmenu li span.conversation {
2342 background-position: 0 -1532px;
2343 }
2344
2345 ul.toolbarmenu li span.move {
2346 background-position: 0 -2126px;
2347 }
2348
2349 ul.toolbarmenu li span.copy {
2350 background-position: 0 -2150px;
2351 }
2352
2353 #pagejump-selector {
2354 max-height: 250px;
2355 overflow-x: hidden;
2356 }
2357
2358 #pagejump-selector ul li {
2359 min-width: 45px;
2360 padding: 4px 6px;
2361 cursor: default;
2362 }
2363
2364 #snippetslist {
2365 max-width: 200px;
2366 }
2367
2368 #snippetslist li a {
2369 overflow: hidden;
2370 text-overflow: ellipsis;
2371 }
2372
2373 #rcmKSearchpane {
2374 border-radius: 0 0 4px 4px;
2375 border-top: 0;
2376 }
2377
2378 #rcmKSearchpane ul li {
2379 text-decoration: none;
2380 min-height: 14px;
2381 padding: 6px 10px 6px 28px;
2382 border: 0;
2383 cursor: default;
2384 position: relative;
2385 }
2386
2387 #rcmKSearchpane ul li i.icon {
2388 opacity: 0.99;
2389 position: absolute;
2390 top: 4px;
2391 left: 5px;
2392 width: 18px;
2393 height: 18px;
2394 padding: 0;
2395 background-position: -1px -2223px;
2396 }
2397
2398 #rcmKSearchpane ul li.group i.icon {
2399 background-position: -1px -2247px;
2400 }
2401
2402 .popupdialog {
2403 display: none;
2404 padding: 10px;
2405 }
2406
2407 .popupdialog .formbuttons {
2408 margin: 20px 0 4px 0;
2409 }
2410
2411 .ui-dialog .prompt input {
2412 display: block;
2413 margin: 8px 0;
2414 }
2415
2416 .hint {
2417 margin: 4px 0;
2418 color: #999;
2419 }
2420
2421 .splitter {
2422 user-select: none;
2423 -moz-user-select: none;
2424 -khtml-user-select: none;
2425 position: absolute;
2426 background: url(images/splitter.png?v=6d32.134) center no-repeat;
2427 }
2428
2429 .splitter-h {
2430 height: 10px;
2431 width: 100%;
2432 cursor: n-resize;
2433 cursor: row-resize;
2434 background-position: center 0;
2435 }
2436
2437 .splitter-v {
2438 width: 10px;
2439 height: 100%;
2440 cursor: e-resize;
2441 cursor: col-resize;
2442 background-position: 0 center;
2443 }
2444
2445 #rcmdraglayer {
2446 min-width: 260px;
2447 width: auto !important;
2448 width: 260px;
2449 padding: 6px 8px;
2450 background: #444;
2451 border: 1px solid #555;
2452 border-radius: 4px;
2453 box-shadow: 0 2px 6px 0 #333;
2454 z-index: 250;
2455 color: #ccc;
2456 white-space: nowrap;
2457 opacity: 0.92;
2458 }
2459
2460 #rcmdraglayer:after {
2461 content: "";
2462 position: absolute;
2463 top: 6px;
2464 left: -6px;
2465 border-style: solid;
2466 border-width: 6px 6px 6px 0;
2467 border-color: transparent #444;
2468 /* reduce the damage in FF3.0 */
2469 display: block;
2470 width: 0;
2471 z-index: 251;
2472 }
2473
2474 .draglayercopy:before {
2475 position: absolute;
2476 bottom: -6px;
2477 left: -6px;
2478 content: " ";
2479 width: 16px;
2480 height: 16px;
2481 background: url(images/buttons.png?v=d70c.9130) -7px -358px no-repeat;
2482 z-index: 255;
2483 }
2484
2485 .popup label > input {
2486 margin-left: 10px;
2487 }
2488
2489 /*** folder selector ***/
2490
2491 #folder-selector {
2492 z-index: 1000;
2493 }
2494
2495 #folder-selector li a span {
2496 background: url(images/listicons.png?v=c458.10409) 4px -2021px no-repeat;
2497 display: block;
2498 height: 17px;
2499 min-height: 14px;
2500 padding: 4px 4px 1px 28px;
2501 overflow: hidden;
2502 max-width: 120px;
2503 text-overflow: ellipsis;
2504 }
2505
2506 #folder-selector li a.virtual {
2507 opacity: .2;
2508 }
2509
2510 #folder-selector li a.inbox span {
2511 background-position: 4px -2049px;
2512 }
2513 #folder-selector li a.drafts span {
2514 background-position: 4px -1388px;
2515 }
2516 #folder-selector li a.sent span {
2517 background-position: 4px -2074px;
2518 }
2519 #folder-selector li a.trash span {
2520 background-position: 4px -1508px;
2521 }
2522 #folder-selector li a.junk span {
2523 background-position: 4px -2100px;
2524 }
2525
2526 /*** folders list ***/
2527
2528 .folderlist li.mailbox a {
2529 padding-left: 36px;
2530 white-space: nowrap;
2531 overflow: hidden;
2532 text-overflow: ellipsis;
2533 background-image: url(images/listicons.png?v=c458.10409);
2534 background-repeat: no-repeat;
2535 background-position: 6px 3px;
2536 }
2537
2538 .folderlist li.mailbox.unread > a {
2539 padding-right: 36px;
2540 }
2541
2542 .folderlist li.mailbox > a:focus,
2543 .folderlist li.mailbox.selected > a {
2544 background-position: 6px -21px;
2545 }
2546
2547 .folderlist li.mailbox.inbox > a {
2548 background-position: 6px -189px;
2549 }
2550
2551 .folderlist li.mailbox.inbox > a:focus,
2552 .folderlist li.mailbox.inbox.selected > a {
2553 background-position: 6px -213px;
2554 }
2555
2556 .folderlist li.mailbox.drafts > a {
2557 background-position: 6px -238px;
2558 }
2559
2560 .folderlist li.mailbox.drafts > a:focus,
2561 .folderlist li.mailbox.drafts.selected > a {
2562 background-position: 6px -262px;
2563 }
2564
2565 .folderlist li.mailbox.sent > a {
2566 background-position: 6px -286px;
2567 }
2568
2569 .folderlist li.mailbox.sent > a:focus,
2570 .folderlist li.mailbox.sent.selected > a {
2571 background-position: 6px -310px;
2572 }
2573
2574 .folderlist li.mailbox.junk > a {
2575 background-position: 6px -334px;
2576 }
2577
2578 .folderlist li.mailbox.junk > a:focus,
2579 .folderlist li.mailbox.junk.selected > a {
2580 background-position: 6px -358px;
2581 }
2582
2583 .folderlist li.mailbox.trash > a {
2584 background-position: 6px -382px;
2585 }
2586
2587 .folderlist li.mailbox.trash > a:focus,
2588 .folderlist li.mailbox.trash.selected > a {
2589 background-position: 6px -406px;
2590 }
2591
2592 .folderlist li.mailbox.trash.empty > a {
2593 background-position: 6px -1924px;
2594 }
2595
2596 .folderlist li.mailbox.trash.empty > a:focus,
2597 .folderlist li.mailbox.trash.empty.selected > a {
2598 background-position: 6px -1948px;
2599 }
2600
2601 .folderlist li.mailbox.archive > a {
2602 background-position: 6px -1699px;
2603 }
2604
2605 .folderlist li.mailbox.archive > a:focus,
2606 .folderlist li.mailbox.archive.selected > a {
2607 background-position: 6px -1723px;
2608 }
2609
2610 .folderlist li.mailbox ul li.drafts > a {
2611 background-position: 23px -238px;
2612 }
2613
2614 .folderlist li.mailbox ul li.drafts > a:focus,
2615 .folderlist li.mailbox ul li.drafts.selected > a {
2616 background-position: 23px -262px;
2617 }
2618
2619 .folderlist li.mailbox ul li.sent > a {
2620 background-position: 23px -286px;
2621 }
2622
2623 .folderlist li.mailbox ul li.sent > a:focus,
2624 .folderlist li.mailbox ul li.sent.selected > a {
2625 background-position: 23px -310px;
2626 }
2627
2628 .folderlist li.mailbox ul li.junk > a {
2629 background-position: 23px -334px;
2630 }
2631
2632 .folderlist li.mailbox ul li.junk > a:focus,
2633 .folderlist li.mailbox ul li.junk.selected > a {
2634 background-position: 23px -358px;
2635 }
2636
2637 .folderlist li.mailbox ul li.trash > a {
2638 background-position: 23px -382px;
2639 }
2640
2641 .folderlist li.mailbox ul li.trash > a:focus,
2642 .folderlist li.mailbox ul li.trash.selected > a {
2643 background-position: 23px -406px;
2644 }
2645
2646 .folderlist li.mailbox ul li.trash.empty > a {
2647 background-position: 23px -1924px;
2648 }
2649
2650 .folderlist li.mailbox ul li.trash.empty > a:focus,
2651 .folderlist li.mailbox ul li.trash.empty.selected > a {
2652 background-position: 23px -1948px;
2653 }
2654
2655 .folderlist li.mailbox ul li.archive > a {
2656 background-position: 23px -1699px;
2657 }
2658
2659 .folderlist li.mailbox ul li.archive > a:focus,
2660 .folderlist li.mailbox ul li.archive.selected > a {
2661 background-position: 23px -1723px;
2662 }
2663
2664 .folderlist li.virtual > a {
2665 color: #aaa;
2666 }
2667
2668 .folderlist li.mailbox div.treetoggle {
2669 top: 13px;
2670 left: 19px;
2671 }
2672
2673 .folderlist li.mailbox ul li:last-child {
2674 border-bottom: 0;
2675 }
2676
2677 /* nested mailboxes */
2678
2679 .folderlist li.mailbox ul {
2680 list-style: none;
2681 margin: 0;
2682 padding: 0;
2683 border-top: 1px solid #bbd3da;
2684 }
2685
2686 .folderlist li.mailbox ul li a {
2687 padding-left: 52px; /* 36 + 1 x 16 */
2688 background-position: 22px -93px; /* 6 + 1 x 16 */
2689 }
2690 .folderlist li.mailbox ul li > a:focus,
2691 .folderlist li.mailbox ul li.selected > a {
2692 background-position: 22px -117px;
2693 }
2694 .folderlist li.mailbox ul li div.treetoggle {
2695 left: 33px;
2696 top: 14px;
2697 }
2698
2699 .folderlist li.mailbox ul ul li.mailbox a {
2700 padding-left: 68px; /* 2x */
2701 background-position: 38px -93px;
2702 }
2703 .folderlist li.mailbox ul ul li > a:focus,
2704 .folderlist li.mailbox ul ul li.selected > a {
2705 background-position: 38px -117px;
2706 }
2707 .folderlist li.mailbox ul ul li div.treetoggle {
2708 left: 48px;
2709 }
2710
2711 .folderlist li.mailbox ul ul ul li.mailbox a {
2712 padding-left: 84px; /* 3x */
2713 background-position: 54px -93px;
2714 }
2715 .folderlist li.mailbox ul ul ul li > a:focus,
2716 .folderlist li.mailbox ul ul ul li.selected > a {
2717 background-position: 54px -117px;
2718 }
2719 .folderlist li.mailbox ul ul ul li div.treetoggle {
2720 left: 64px;
2721 }
2722
2723 .folderlist li.mailbox ul ul ul ul li.mailbox a {
2724 padding-left: 100px; /* 4x */
2725 background-position: 70px -93px;
2726 }
2727 .folderlist li.mailbox ul ul ul ul li > a:focus,
2728 .folderlist li.mailbox ul ul ul ul li.selected > a {
2729 background-position: 70px -117px;
2730 }
2731 .folderlist li.mailbox ul ul ul ul li div.treetoggle {
2732 left: 80px;
2733 }
2734
2735 /* indent folders on levels > 4 */
2736 .folderlist li.mailbox ul ul ul ul ul li {
2737 padding-left: 16px;
2738 }
2739 .folderlist li.mailbox ul ul ul ul ul li div.treetoggle {
2740 left: 96px;
2741 }
2742
2743
2744 /*** attachment list ***/
2745
2746 .attachmentslist {
2747 list-style: none;
2748 margin: 0;
2749 padding: 0;
2750 overflow: hidden;
2751 text-overflow: ellipsis;
2752 }
2753
2754 .attachmentslist li {
2755 display: block;
2756 position: relative;
2757 background: url(images/filetypes.png?v=a0f5.4718) 0 0 no-repeat;
2758 margin-bottom: 1px;
2759 line-height: 24px;
2760 }
2761
2762 .attachmentslist li.txt,
2763 .attachmentslist li.text {
2764 background-position: 0 -416px;
2765 }
2766
2767 .attachmentslist li.pdf {
2768 background-position: 0 -26px;
2769 }
2770
2771 .attachmentslist li.doc,
2772 .attachmentslist li.docx,
2773 .attachmentslist li.msword {
2774 background-position: 0 -52px;
2775 }
2776
2777 .attachmentslist li.odt {
2778 background-position: 0 -78px;
2779 }
2780
2781 .attachmentslist li.xls,
2782 .attachmentslist li.xlsx,
2783 .attachmentslist li.msexcel {
2784 background-position: 0 -104px;
2785 }
2786
2787 .attachmentslist li.ods {
2788 background-position: 0 -130px;
2789 }
2790
2791 .attachmentslist li.zip,
2792 .attachmentslist li.gz {
2793 background-position: 0 -156px;
2794 }
2795
2796 .attachmentslist li.rar {
2797 background-position: 0 -182px;
2798 }
2799
2800 .attachmentslist li.image {
2801 background-position: 0 -208px;
2802 }
2803
2804 .attachmentslist li.jpg,
2805 .attachmentslist li.jpeg {
2806 background-position: 0 -234px;
2807 }
2808
2809 .attachmentslist li.png {
2810 background-position: 0 -260px;
2811 }
2812
2813 .attachmentslist li.m4p {
2814 background-position: 0 -286px;
2815 }
2816
2817 .attachmentslist li.mp3,
2818 .attachmentslist li.audio {
2819 background-position: 0 -312px;
2820 }
2821
2822 .attachmentslist li.video {
2823 background-position: 0 -338px;
2824 }
2825
2826 .attachmentslist li.ics,
2827 .attachmentslist li.calendar {
2828 background-position: 0 -364px;
2829 }
2830
2831 .attachmentslist li.vcard {
2832 background-position: 0 -390px;
2833 }
2834
2835 .attachmentslist li.sig,
2836 .attachmentslist li.pgp-signature,
2837 .attachmentslist li.pkcs7-signature {
2838 background-position: 0 -442px;
2839 }
2840
2841 .attachmentslist li.html {
2842 background-position: 0 -468px;
2843 }
2844
2845 .attachmentslist li.eml,
2846 .attachmentslist li.rfc822 {
2847 background-position: 0 -494px;
2848 }
2849
2850 .attachmentslist li.ppt,
2851 .attachmentslist li.pptx,
2852 .attachmentslist li.ppsx,
2853 .attachmentslist li.vnd.mspowerpoint {
2854 background-position: 0 -520px;
2855 }
2856
2857 .attachmentslist li.odp,
2858 .attachmentslist li.otp {
2859 background-position: 0 -546px;
2860 }
2861
2862 .attachmentslist li.application.asc {
2863 background-position: 0 -598px;
2864 }
2865
2866 .attachmentslist li.application.pgp-keys {
2867 background-position: 0 -572px;
2868 }
2869
2870
2871 .attachmentslist li a {
2872 display: block;
2873 color: #333;
2874 font-weight: bold;
2875 padding: 3px 15px 3px 30px;
2876 text-decoration: none;
2877 white-space: nowrap;
2878 overflow: hidden;
2879 text-overflow: ellipsis;
2880 line-height: 20px;
2881 outline: none;
2882 }
2883
2884 .attachmentslist li a.drop {
2885 background: url(images/buttons.png?v=d70c.9130) no-repeat scroll center -1570px;
2886 width: 14px;
2887 height: 20px;
2888 cursor: pointer;
2889 position: absolute;
2890 right: 0;
2891 top: 0;
2892 padding: 0;
2893 overflow: hidden;
2894 text-indent: -5000px;
2895 outline: none;
2896 }
2897
2898 #compose-attachments .attachmentslist li a.drop {
2899 right: 24px;
2900 }
2901
2902 .attachmentslist li a:focus,
2903 .attachmentslist li a.drop:focus {
2904 background-color: rgba(30,150,192, 0.5);
2905 border-radius: 2px;
2906 }
2907
2908 #compose-attachments ul li {
2909 padding-right: 24px;
2910 }
2911
2912 .attachmentslist li a:hover {
2913 text-decoration: underline;
2914 }
2915
2916 .attachmentslist li.uploading {
2917 background: url(images/ajaxloader.gif?v=c252.1434) 4px 4px no-repeat;
2918 padding-left: 30px;
2919 }
2920
2921 .attachmentslist li a.delete,
2922 .attachmentslist li a.cancelupload {
2923 position: absolute;
2924 top: 4px;
2925 right: 0;
2926 width: 20px;
2927 height: 18px;
2928 padding: 0;
2929 text-decoration: none;
2930 text-indent: -5000px;
2931 background-image: url(images/buttons.png?v=d70c.9130);
2932 background-position: -6px -338px;
2933 background-repeat: no-repeat;
2934 }
2935
2936 .attachmentslist li a.cancelupload {
2937 background-position: -6px -378px;
2938 }
2939
2940 /*** fieldset tabs ***/
2941
2942 .tabbed.ui-tabs {
2943 padding: 0;
2944 border: 0 !important;
2945 background: none;
2946 }
2947
2948 .ui-dialog .tabbed.ui-tabs {
2949 margin: -12px -8px 0 -8px;
2950 }
2951
2952 .boxcontent.tabbed.ui-tabs {
2953 padding: 10px;
2954 }
2955
2956 .ui-tabs .tabsbar.ui-tabs-nav {
2957 margin-bottom: 4px;
2958 }
2959
2960 .ui-dialog-content .ui-tabs .tabsbar.ui-tabs-nav {
2961 margin-bottom: 0;
2962 }
2963
2964 .tabsbar .tablink:last-child {
2965 background: none;
2966 }
2967
2968 .tabsbar .tablink:last-child a {
2969 border-right: 0;
2970 }
2971
2972 .ui-tabs .ui-tabs-nav li.tablink a {
2973 background: #fff;
2974 }
2975
2976 .ui-tabs fieldset.ui-tabs-panel {
2977 border: 0;
2978 padding: 0;
2979 margin-left: 0;
2980 background: none;
2981 }
2982
2983 .ui-dialog .propform .ui-tabs-panel {
2984 display: block;
2985 background: #efefef;
2986 padding: 0.5em 1em;
2987 }
2988
2989 #image-selector-form.droptarget {
2990 background: url(images/filedrop.png?v=be5d.415) center bottom no-repeat;
2991 }
2992
2993 /** Common TinyMCE fixes **/
2994 .mce-btn-small .mce-ico {
2995 display: inline; /* for old Firefox */
2996 }
2997
2998 .mce-btn-small i {
2999 line-height: 16px !important;
3000 vertical-align: text-top !important;
3001 }
3002
3003 _:not(), _:-moz-handler-blocked, .mozilla .mce-btn-small i {
3004 line-height: 20px !important;
3005 }
3006
3007 .mce-textbox {
3008 border-radius: 0;
3009 box-shadow: none;
3010 }
3011
3012 .mce-textbox:focus {
3013 box-shadow: none;
3014 outline: none;
3015 }
3016
3017 /** PGP Key import dialog **/
3018 .pgpkeyimport div.key {
3019 position: relative;
3020 margin-bottom: 2px;
3021 padding: 1em;
3022 background-color: #ebebeb;
3023 }
3024
3025 .pgpkeyimport div.key.revoked,
3026 .pgpkeyimport div.key.disabled {
3027 color: #a0a0a0;
3028 }
3029
3030 .pgpkeyimport div.key label {
3031 display: inline-block;
3032 margin-right: 0.5em;
3033 }
3034
3035 .pgpkeyimport div.key label:after {
3036 content: ":";
3037 }
3038
3039 .pgpkeyimport div.key label + a,
3040 .pgpkeyimport div.key label + span {
3041 display: inline-block;
3042 margin-right: 2em;
3043 white-space: nowrap;
3044 }
3045
3046 .pgpkeyimport div.key label + a {
3047 font-weight: bold;
3048 }
3049
3050 .pgpkeyimport ul.uids {
3051 margin: 1em 0 0 0;
3052 padding: 0;
3053 }
3054
3055 .pgpkeyimport li.uid {
3056 border: 0;
3057 padding: 0.3em;
3058 }
3059
3060 .pgpkeyimport div.key input.button.importkey {
3061 position: absolute;
3062 top: 0.8em;
3063 right: 0.8em;
3064 padding: 4px 6px;
3065 }
3066
3067 .pgpkeyimport div.key input.button[disabled] {
3068 display: none;
3069 }