[!!!][TASK] FormEngine: Unify resizable textareas
[Packages/TYPO3.CMS.git] / typo3 / sysext / t3skin / Resources / Private / Styles / TYPO3 / _element_tceforms.less
1 //
2 // TCEforms
3 //
4
5 // Special handling of Tabs within FormEngine
6
7 .typo3-TCEforms {
8
9         // Move dyntab inner padding into fieldset for horizontal HR (only when tabs are there)
10
11         .typo3-dyntabmenu-divs {
12                 border-top: 1px solid @nav-tabs-border-color;
13         }
14         .typo3-dyntabmenu-tabs + .typo3-dyntabmenu-divs {
15                 border-top: none;
16                 padding: 0;
17         }
18
19         .c-tablayer {
20                 div,
21                 td {
22                         vertical-align: top;
23                 }
24
25                 > table {
26                         margin-bottom: 0;
27
28                         > tbody {
29                                 > tr {
30                                         > td {
31                                                 padding: 0 @line-height-computed 0 @line-height-computed;
32                                                 background: none;
33
34                                                 &.palette-header {
35                                                         border-top: 1px solid @nav-tabs-border-color;
36                                                         padding: ceil(@line-height-computed * 1.5) @line-height-computed floor(@line-height-computed * 0.25) @line-height-computed;
37
38                                                         h3 {
39                                                                 margin-top: 0;
40                                                         }
41                                                 }
42
43                                                 .t3-form-palette-fieldset {
44                                                         .t3-form-palette-field-container {
45                                                                 display: inline-block;
46                                                                 padding-right: 25px;
47                                                                 padding-bottom: @line-height-computed;
48                                                         }
49                                                 }
50
51                                         }
52
53                                         &:first-child {
54                                                 > td {
55                                                         padding-top: @line-height-computed;
56
57                                                         &.palette-header {
58                                                                 border-top: none;
59                                                         }
60                                                 }
61                                         }
62
63                                         &:last-child {
64                                                 > td {
65                                                         padding-bottom: @line-height-computed;
66                                                 }
67                                         }
68                                 }
69                         }
70                 }
71         }
72 }
73
74 img.t3-TCEforms-reqImg {
75         display: block;
76         position: absolute;
77         left: 14px;
78         top: 28%;
79         z-index: 3000;
80         height: 16px;
81         margin-right: 2px;
82         width: 16px;
83 }
84
85 img.t3-TCEforms-reqTabImg {
86         height: 16px;
87         margin-left: 4px;
88         margin-bottom: -3px;
89         width: 16px;
90 }
91
92 img.t3-TCEforms-contentchangedImg {
93         display: block;
94         position: absolute;
95         left: 4px;
96         top: 32%;
97         z-index: 4000;
98         width: 7px;
99 }
100
101 .t3-form-palette-icon-required {
102         display: block;
103         position: absolute;
104         left: 4px;
105         top: 26%;
106         z-index: 3000;
107         height: 16px;
108         margin-right: 2px;
109         width: 16px;
110 }
111
112 // renamed to .t3-form-palette-icon-required, lines below kept for backwards-compatibility
113
114 img.t3-TCEforms-reqPaletteImg {
115         display: block;
116         position: absolute;
117         left: 14px;
118         top: 30%;
119         z-index: 3000;
120         height: 16px;
121         margin-right: 2px;
122         width: 16px;
123 }
124
125 .t3-form-palette-icon-contentchanged {
126         display: block;
127         position: absolute;
128         left: -6px;
129         top: 30%;
130         z-index: 4000;
131         width: 7px;
132 }
133
134 // renamed to .t3-form-palette-icon-contentchanged, lines below kept for backwards-compatibility
135
136 img.t3-TCEforms-contentchangedPaletteImg {
137         display: block;
138         position: absolute;
139         left: 4px;
140         top: 30%;
141         z-index: 4000;
142         width: 7px;
143 }
144
145 .typo3-TCEforms {
146         width: 100%;
147 }
148
149 .typo3-TCEforms-recHeaderRow {
150         padding-top: 5px;
151         padding-bottom: 20px;
152 }
153
154 .typo3-TCEforms .bgColor2,
155 .typo3-TCEforms tr.bgColor2 td {
156         padding-bottom: 5px;
157 }
158
159 .typo3-TCEforms optgroup.c-divider,
160 select option.c-divider {
161         margin-top: 10px;
162         padding: 0px;
163 }
164
165 .typo3-TCEforms optgroup option {
166         background-color: white;
167         border-bottom: none;
168         color: black;
169         font-style: normal;
170         text-indent: 0px;
171         text-transform: none;
172         margin: 0px;
173         padding: 2px;
174 }
175
176 .typo3-TCEforms select.icon-select option {
177         padding-left: 22px;
178 }
179
180 .typo3-TCEforms table.typo3-TCEforms-select-checkbox {
181         margin-bottom: 10px;
182 }
183
184 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tbody {
185         display: block;
186         max-height: 300px;
187         overflow-y: scroll;
188 }
189
190 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td {
191         vertical-align: middle;
192 }
193
194 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header td,
195 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-checkbox,
196 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell {
197         padding: 1px 3px;
198 }
199
200 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell {
201         min-width: 300px;
202 }
203
204 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell img {
205         margin-right: 5px;
206         width: 16px;
207 }
208
209 .typo3-TCEforms table.typo3-TCEforms-select-checkbox td.c-descr {
210         width: 40px;
211 }
212
213 .typo3-TCEforms table.typo3-TCEforms-select-checkbox td.c-descr img {
214         float: right;
215 }
216
217 .typo3-TCEforms table.typo3-TCEforms-select-singlebox {
218         margin-bottom: 10px;
219         margin-top: 4px;
220 }
221
222 .typo3-TCEforms .checkbox,
223 .typo3-TCEforms .checkbox:hover {
224         position: relative;
225         z-index: 3500;
226 }
227
228 .typo3-TCEforms td.formField-header,
229 .typo3-TCEforms td.palette-header,
230 .typo3-TCEforms td.formField-field {
231         display: block;
232         position: relative;
233         vertical-align: top;
234 }
235
236 div.typo3-TCEforms div.c-tablayer table > tbody > tr > td > table.wrapperTable > tbody > tr > td {
237         padding-left: 10px;
238         padding-right: 10px;
239 }
240
241 .t3-form-field-group-file tr:last-child td {
242         vertical-align: top;
243 }
244
245 .typo3-TCEforms td.icons {
246         padding: 0 2px 2px 2px;
247 }
248
249 .typo3-TCEforms td.thumbnails {
250         padding-top: 2px;
251 }
252
253 .typo3-TCEforms div.imagethumbs {
254         padding-top: 2px;
255         white-space: normal;
256         width: 253px;
257 }
258
259 .typo3-TCEforms div.imagethumbs br {
260         display: none;
261 }
262
263 .typo3-TCEforms div.imagethumbs .nobr {
264         background-color: #CCC;
265         display: inline-block;
266         width: 60px;
267         height: 60px;
268         overflow: hidden;
269         margin-right: 3px;
270         margin-bottom: 1px;
271         text-align: center;
272 }
273
274 .typo3-TCEforms div.imagethumbs .nobr a {
275         display: block;
276         width: 60px;
277         height: 60px;
278         line-height: 58px;
279         text-align: center;
280 }
281
282 .typo3-TCEforms div.imagethumbs .nobr a img {
283         display: inline;
284         margin-right: auto;
285         vertical-align: middle;
286         margin-left: auto;
287 }
288
289 .typo3-TCEforms div.imagethumbs .nobr span {
290         display: none;
291 }
292
293 .typo3-TCEforms span.filetypes {
294         font-size: 0.8em;
295         display: block;
296         margin-top: 6px;
297         white-space: normal;
298         width: 250px;
299 }
300
301 .t3-form-field-container {
302         display: block;
303 }
304
305 .typo3-TCEforms-palette .typo3-csh-link img {
306         padding-top: 3px;
307         vertical-align: top;
308 }
309
310 .typo3-TCEforms-palette select.select,
311 .t3-form-palette-field-container select.select {
312         margin: 4px 2px 4px 1px;
313 }
314
315 .t3-form-palette-field-container .t3-form-palette-field-label,
316 .t3-form-palette-field-container .t3-form-palette-field {
317         display: block;
318         position: relative;
319 }
320
321 .typo3-TCEforms .typo3-csh-link {
322         margin-left: 5px;
323 }
324
325 .t3-tceforms-fieldReadOnly {
326         background-color: #fefefe;
327         border: 1px solid #7c7c7c;
328         border-radius: 2px;
329         pointer-events: none;
330         cursor: default;
331         opacity: 0.5;
332         filter: ~"alpha(opacity=@50)";
333         box-shadow: none;
334         /** Lock icon in right corner */
335         padding: 3px 30px 3px 6px;
336         margin: 0 0.5em 0.5em 0;
337         position: relative;
338 }
339 // no manual resizing for textareas (works on non-IE browser only anyways)
340 // as it is handled by JS: "autosize"
341 .tceforms-textarea {
342         resize: none;
343 }
344
345 //
346 // TCEforms suggest
347 //
348
349 div.typo3-TCEforms-suggest-position-right {
350         margin-left: 10px;
351 }
352
353 div.typo3-TCEforms-suggest label {
354         margin-right: 5px;
355 }
356
357 div.typo3-TCEforms-suggest-indicator {
358         left: 230px;
359         position: relative;
360         top: -18px;
361 }
362
363 div.typo3-TCEforms-suggest-choices {
364         background-color: white;
365         border: 1px solid #888;
366         position: absolute;
367         width: 250px;
368         z-index: 4000;
369 }
370
371 div.typo3-TCEforms-suggest-choices ul {
372         margin: 0;
373         padding: 0;
374 }
375
376 div.typo3-TCEforms-suggest-choices li {
377         cursor: pointer;
378         background-color: #efeff4;
379         background-repeat: no-repeat;
380         background-position: 4px center;
381         list-style-type: none;
382         display: block;
383         margin: 0;
384         padding: 4px 2px 4px 24px;
385 }
386
387 div.typo3-TCEforms-suggest-choices li.suggest-noresults {
388         height: auto;
389 }
390
391 div.typo3-TCEforms-suggest-choices span.suggest-uid {
392         margin-left: 0.3em;
393 }
394
395 div.typo3-TCEforms-suggest-choices span.suggest-path {
396         font-size: 0.9em;
397         margin-top: 0.3em;
398 }
399
400 input.typo3-TCEforms-suggest-search {
401         width: 200px;
402         padding-left: 20px;
403         vertical-align: middle;
404 }
405
406 //
407 // TCEforms Flexforms
408 //
409
410 .t3-form-field-label-flex {
411         border-top: 1px solid #c0c0c0;
412         padding: 5px;
413 }
414
415 .t3-form-field-flex {
416         padding: 0 5px 5px;
417 }
418
419 //
420 // TCEforms Inline-Relational-Record-Editing
421 //
422
423 .t3-form-field-container-wrap {
424         margin: 6px 0px;
425 }
426
427 .t3-form-field-container-inline {
428         border: 1px solid #aaaaaa;
429         background-color: #f9f9f9;
430         margin: 2px 0px;
431 }
432
433 .t3-form-field-header-inline > span {
434         position: absolute;
435         left: 4px;
436         top: 15px;
437 }
438
439 .t3-form-field-header-inline-wrap:before,
440 .t3-form-field-header-inline-wrap:after {
441         content: " ";
442         display: table;
443 }
444
445 .t3-form-field-header-inline-wrap:after {
446     clear: both;
447 }
448
449 .t3-form-field-header-inline-wrap {
450         min-width: 300px;
451 }
452
453 .t3-form-field-header-inline-icon,
454 .t3-form-field-header-inline-thumbnail {
455         float: left;
456         margin-right: 5px;
457 }
458
459 .t3-form-field-header-inline-icon {
460         width: 18px;
461         height: 16px;
462         padding: 3px 0px;
463 }
464
465 .t3-form-field-header-inline-thumbnail {
466         float: left;
467         margin-right: 15px;
468 }
469
470 .t3-form-field-header-inline-thumbnail img {
471         display: block;
472 }
473
474 .t3-form-field-header-inline-ctrl {
475         float: right;
476 }
477
478 .t3-form-field-header-inline-ctrl .t3-icon {
479         margin: 0px;
480         margin-left: 3px;
481 }
482
483 .t3-form-field-header-inline-body,
484 .t3-form-field-header-inline-summary {
485         overflow: hidden;
486         zoom: 1;
487 }
488
489 .t3-form-field-header-inline-thumbnail,
490 .t3-form-field-header-inline-summary {
491         cursor: pointer;
492 }
493
494 .t3-form-field-header-inline-ctrl,
495 .t3-form-field-header-inline-summary {
496         padding: 5px 0px;
497 }
498
499 .t3-form-field-header-inline-summary dl {
500         margin: 0px;
501         overflow: hidden;
502 }
503
504 .t3-form-field-header-inline-summary dt {
505         font-weight: bold;
506         float: left;
507         clear: left;
508         margin-right: 10px;
509 }
510
511 .t3-form-field-header-inline-summary dd {
512         float: left;
513 }
514
515 .t3-form-field-header-inline-ctrl img {
516         vertical-align: middle;
517 }
518
519 .t3-form-field-header-inline .t3-form-field-header-inline-ctrl > * {
520         opacity: 0;
521 }
522
523 .t3-form-field-header-inline:hover .t3-form-field-header-inline-ctrl > * {
524         opacity: 1;
525 }
526
527 .t3-form-field-header-inline .t3-form-field-header-inline-ctrl > span.sortableHandle {
528         margin-left: 16px;
529         opacity: 1;
530         display: inline-block;
531 }
532
533 .t3-form-field-container-inline-placeHolder div.t3-form-field-record-inline,
534 .t3-form-field-container-inline-collapsed div.t3-form-field-record-inline {
535         display:none !important;
536 }
537
538 .t3-form-field-header-inline {
539         background-color: #E0E0E0;
540         cursor: pointer;
541         padding: 6px 16px;
542         position:relative;
543 }
544
545 .t3-form-field-container-inline-placeHolder .t3-form-field-header-inline > span {
546         display:none;
547 }
548
549 .t3-form-field-record-inline {
550         border-top: 1px solid #aaaaaa;
551         padding: 8px 8px;
552         position: relative;
553 }
554
555 .t3-form-field-record-inline > table {
556     width:100%;
557 }
558
559 .t3-form-field-record-inline .typo3-dyntabmenu-divs,
560 .t3-form-field-record-inline .typo3-dyntabmenu-tabs {
561         margin-left:8px;
562         margin-right:8px !important;
563         margin-bottom:0px !important;
564 }
565
566 .sortableHandle {
567         cursor: move;
568 }
569
570 //
571 // TCEforms Sections
572 //
573
574 .t3-flex-section-header .t3-record-title {
575         font-weight: bold;
576 }
577
578 .t3-flex-section {
579         clear: both;
580         margin: 5px 0;
581 }
582
583 .t3-flex-section-header,
584 .t3-form-field-container-flexsection {
585         padding-left: 20px;
586 }
587
588 .t3-form-field-header-flexsection {
589         width: 100%;
590         height: 16px;
591 }
592
593 .t3-form-field-label-flexsection {
594         border-top: 1px solid #cdcdcd;
595         padding: 5px 10px;
596 }
597
598 .t3-form-field-toggle-flexsection {
599         padding: 5px 0 5px 20px;
600 }
601
602 .t3-form-field-add-flexsection {
603         border-top: 1px solid #cdcdcd;
604         padding: 10px 5px 5px 20px;
605 }
606
607 .t3-form-flex,
608 .t3-form-field-container-flexsections {
609         background: #dadada;
610         margin: 5px 0;
611         clear: both;
612 }
613
614 .t3-flex-section-content,
615 .t3-form-field-record-flexsection {
616         background: #eee;
617         padding: 5px 0;
618 }
619
620 .t3-flex-section-content > div,
621 .t3-form-field-record-flexsection > div {
622         margin: 0 10px;
623 }
624
625 .t3-flex-section-header-preview {
626         font-style: italic;
627         width: 100px;
628         display: inline-block;
629         padding-left: 10px;
630         overflow: hidden;
631         white-space: nowrap;
632         text-overflow: ellipsis;
633 }
634
635 // preview image in sys_file records
636
637 img.t3-tceforms-sysfile-imagepreview {
638         float: left;
639         margin-right: 10px;
640         margin-bottom: 10px;
641 }
642
643 * html div#typo3-docbody .typo3-TCEforms {
644         margin-top: 20px;
645 }
646
647 .typo3-TCEforms img[src*="clear.gif"] {
648         z-index: 0;
649 }
650
651 //
652 // TCEforms
653 //
654
655 table#typo3-altdoc-header input,
656 .c-inputButton {
657         background: none;
658         border: 0;
659 }
660
661 .typo3-TCEforms .checkbox,
662 .typo3-TCEforms .checkbox:hover {
663         border: 0;
664 }
665
666 .t3-tceforms-widget-null-wrapper {
667         display: inline-block;
668         float: right;
669         position: relative;
670         width: 20px;
671         max-width: 20px;
672 }
673
674 .t3-tceforms-widget-null-wrapper input {
675         margin-left: 2px;
676         margin-top: 42%;
677 }
678 .t3-tceforms-input-wrapper-datetime .t3-icon-edit-pick-date {
679         top: -4px;
680 }
681
682 .typo3-TCEforms table#typo3-altdoc-header input:hover,
683 .c-inputButton:hover {
684         background: none;
685         border: 0;
686 }
687
688 .typo3-TCEforms .typo3-TCEforms-recHeader {
689         color: #555555;
690         font-weight: bold;
691 }
692
693 .typo3-TCEforms .typo3-TCEforms-recHeaderRow {
694         background: #fff;
695         text-align: right;
696 }
697
698 .typo3-TCEforms span.typo3-TCEforms-newToken {
699         color: #990000;
700         font-weight: bold;
701 }
702
703 .typo3-TCEforms span.typo3-TCEforms-helpText {
704         background: transparent;
705         color: #fff;
706 }
707
708 table.typo3-TCEforms-select-checkbox {
709         background-color: #ffffff;
710         border: 1px solid #aaa;
711 }
712
713 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header td {
714         background-color: #fff;
715         font-weight: bold;
716 }
717
718 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr:nth-child(2n) {
719         background-color: #f7f7f7;
720 }
721
722 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-selectedItem {
723         background-color: #d8ecd0;
724 }
725
726 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-invalidItem {
727         color: #dddddd;
728 }
729
730 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr:hover {
731         background-color: #dedede;
732 }
733
734 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-selectedItem:hover {
735         background-color: #abd99a;
736 }
737
738 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-invalidItem:hover {
739         background-color: transparent;
740 }
741
742 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell {
743         white-space: nowrap;
744 }
745
746 .typo3-TCEforms optgroup.c-divider,
747 select option.c-divider {
748         background-color: #eee;
749         border-top: 1px solid #666;
750         color: #666;
751         font-style: italic;
752         text-transform: uppercase;
753 }
754
755 // show text of default language under the translated input field
756
757 .t3-form-original-language {
758         background-color: #dadada;
759         border: 1px solid #c0c0c0;
760         padding: 2px;
761         font-size: 0.9em;
762         margin-top: 4px;
763 }
764
765 .t3-form-original-language-diff {
766         border: 1px solid #c0c0c0;
767         font-size: 0.9em;
768         margin-top: 4px;
769 }
770
771 .t3-form-original-language-diffheader {
772         .bg-danger();
773         font-weight: bold;
774         padding: 2px;
775 }
776
777 .t3-form-original-language-diffcontent {
778         padding: 2px;
779 }
780
781 // Default. Always used on main-palettes in the bottom of the forms
782
783 .typo3-TCEforms .typo3-TCEforms-checkboxArray td {
784         padding-right: 5px;
785 }
786
787 input.typo3-TCEforms-suggest-search {
788         background-image: url('../../../../icons/gfx/zoom.gif');
789         background-position: 2px center;
790         background-repeat: no-repeat;
791 }
792
793 div.typo3-TCEforms-suggest-choices ul {
794         list-style-type: none;
795 }
796
797 div.typo3-TCEforms-suggest-choices li.selected {
798         background-color: #ffb !important;
799 }
800
801 div.typo3-TCEforms-suggest-choices li.pages {
802         background-color: #fcc;
803 }
804
805 div.typo3-TCEforms-suggest-choices span.suggest-uid {
806         font-size: 0.9em;
807 }
808
809 div.typo3-TCEforms-suggest-choices span.suggest-path abbr {
810         border-bottom: none;
811 }
812
813 div.typo3-TCEforms-suggest-choises a {
814         cursor: pointer;
815 }
816
817 //
818 // TCEforms Flexforms
819 //
820
821 .t3-form-field-container-flex {
822 }
823
824 div.t3-form-field-container:first-child .t3-form-field-label-flex {
825         border-top: 0;
826 }
827
828 // no separate background for dyntabs in flexforms
829
830 .typo3-TCEforms .wrapperTable div.typo3-dyntabmenu-tabs ,
831 .typo3-TCEforms .wrapperTable1 div.typo3-dyntabmenu-tabs,
832 .typo3-TCEforms .wrapperTable2 div.typo3-dyntabmenu-tabs,
833 .typo3-TCEforms .wrapperTable3 div.typo3-dyntabmenu-tabs,
834 .typo3-TCEforms .wrapperTable4 div.typo3-dyntabmenu-tabs,
835 .typo3-TCEforms .wrapperTable5 div.typo3-dyntabmenu-tabs {
836         background: transparent;
837 }
838
839 // tabs inside the table => flexforms
840
841 .typo3-TCEforms .wrapperTable .typo3-dyntabmenu-divs,
842 .typo3-TCEforms .wrapperTable1 .typo3-dyntabmenu-divs,
843 .typo3-TCEforms .wrapperTable2 .typo3-dyntabmenu-divs,
844 .typo3-TCEforms .wrapperTable3 .typo3-dyntabmenu-divs,
845 .typo3-TCEforms .wrapperTable4 .typo3-dyntabmenu-divs,
846 .typo3-TCEforms .wrapperTable5 .typo3-dyntabmenu-divs {
847         border: 1px solid #c0c0c0;
848 }
849
850 //
851 // TCEforms Inline-Relational-Record-Editing
852 //
853
854 .t3-form-field-header-inline:hover {
855         background-color: #cccccc;
856 }
857
858 .t3-form-field-container-inline-hidden,
859 .t3-form-field-container-inline-placeHolder {
860         opacity:0.3;
861 }
862
863 .t3-form-field-header-inline table {
864     vertical-align:top;
865 }
866
867 .t3-form-field-header-inline-thumbnail-image {
868     border: none;
869 }
870
871 .t3-form-field-record-inline .typo3-message {
872         margin-bottom: 1.5em;
873 }
874
875 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable,
876 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable1,
877 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable2,
878 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable3,
879 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable4,
880 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable5 {
881         border: 0;
882 }
883
884 .t3-form-field-header-inline td.t3-form-field-header-inline-summary dl dt {
885         font-weight: bold;
886 }
887
888 //
889 // TCEforms Sections
890 //
891
892 .typo3-TCEforms-flexForm .bgColor4,
893 .typo3-TCEforms-flexForm .bgColor5 {
894         background: none;
895         display: inline-block;
896 }
897
898 .typo3-TCEforms-select-selectedItemWithBackgroundImage {
899         background-color:#fff;
900         background-position: 0% 50%;
901         background-repeat:no-repeat;
902         padding:1px 1px 1px 24px;
903 }
904
905 .ext-webkit .typo3-TCEforms-select-selectedItemWithBackgroundImage {
906         text-indent: 20px;
907         background-position-x: 6px;
908 }
909 .ext-webkit .typo3-TCEforms-select-selectedItemWithBackgroundImage optgroup option {
910         text-indent: 20px;
911 }
912 .ext-chrome:not(.ext-mac) .typo3-TCEforms-select-selectedItemWithBackgroundImage {
913         text-indent: 0px;
914         background-position-x: 5px;
915 }
916
917 .t3-tceforms-fieldReadOnly span.t3-icon {
918     position: absolute;
919     right: 3px;
920     top: 4px;
921 }
922
923 .t3-form-field-item {
924         position: relative;
925         border: 1px solid transparent;
926         padding: 0;
927 }
928
929 .t3-tceforms-widget-null-wrapper + .t3-form-field-item {
930         display: inline-block;
931 }
932
933 .t3-form-field-item.disabled {
934         border: 1px dotted #696362;
935 }
936
937 .t3-form-field-disable,
938 .t3-form-field-item.disabled .t3-form-field-item.disabled .t3-form-field-disable {
939         display: none;
940 }
941 .t3-form-field-item.disabled .t3-form-field-disable {
942         z-index: 8000;
943         background: #f4f4f4;
944         display: block;
945         position: absolute;
946         width: 100%;
947         height: 100%;
948
949         opacity: 0.5;
950         filter: alpha(opacity=50);
951 }
952
953 .t3-form-palette-field-label {
954         text-indent: 2px;
955 }
956
957 //
958 // TCEforms Tree
959 //
960
961 .t3-form-field-item .x-tree input.x-tree-node-cb {
962         height: auto;
963         margin: 0 0 0 1px;
964         vertical-align: middle;
965 }
966
967 // state: the form field was modified
968 .t3-form-field-label.t3-form-field-state-changed {
969         color: #004fb0;
970 }