[!!!][FEATURE] FormEngine Checkbox to bootstrap
[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 td.formField-header,
223 .typo3-TCEforms td.palette-header,
224 .typo3-TCEforms td.formField-field {
225         display: block;
226         position: relative;
227         vertical-align: top;
228 }
229
230 div.typo3-TCEforms div.c-tablayer table > tbody > tr > td > table.wrapperTable > tbody > tr > td {
231         padding-left: 10px;
232         padding-right: 10px;
233 }
234
235 .t3-form-field-group-file tr:last-child td {
236         vertical-align: top;
237 }
238
239 .typo3-TCEforms td.icons {
240         padding: 0 2px 2px 2px;
241 }
242
243 .typo3-TCEforms td.thumbnails {
244         padding-top: 2px;
245 }
246
247 .typo3-TCEforms div.imagethumbs {
248         padding-top: 2px;
249         white-space: normal;
250         width: 253px;
251 }
252
253 .typo3-TCEforms div.imagethumbs br {
254         display: none;
255 }
256
257 .typo3-TCEforms div.imagethumbs .nobr {
258         background-color: #CCC;
259         display: inline-block;
260         width: 60px;
261         height: 60px;
262         overflow: hidden;
263         margin-right: 3px;
264         margin-bottom: 1px;
265         text-align: center;
266 }
267
268 .typo3-TCEforms div.imagethumbs .nobr a {
269         display: block;
270         width: 60px;
271         height: 60px;
272         line-height: 58px;
273         text-align: center;
274 }
275
276 .typo3-TCEforms div.imagethumbs .nobr a img {
277         display: inline;
278         margin-right: auto;
279         vertical-align: middle;
280         margin-left: auto;
281 }
282
283 .typo3-TCEforms div.imagethumbs .nobr span {
284         display: none;
285 }
286
287 .typo3-TCEforms span.filetypes {
288         font-size: 0.8em;
289         display: block;
290         margin-top: 6px;
291         white-space: normal;
292         width: 250px;
293 }
294
295 .t3-form-field-container {
296         display: block;
297 }
298
299 .typo3-TCEforms-palette .typo3-csh-link img {
300         padding-top: 3px;
301         vertical-align: top;
302 }
303
304 .typo3-TCEforms-palette select.select,
305 .t3-form-palette-field-container select.select {
306         margin: 4px 2px 4px 1px;
307 }
308
309 .t3-form-palette-field-container .t3-form-palette-field-label,
310 .t3-form-palette-field-container .t3-form-palette-field {
311         display: block;
312         position: relative;
313 }
314
315 .typo3-TCEforms .typo3-csh-link {
316         margin-left: 5px;
317 }
318
319 .t3-tceforms-fieldReadOnly {
320         background-color: #fefefe;
321         border: 1px solid #7c7c7c;
322         border-radius: 2px;
323         pointer-events: none;
324         cursor: default;
325         opacity: 0.5;
326         filter: ~"alpha(opacity=@50)";
327         box-shadow: none;
328         /** Lock icon in right corner */
329         padding: 3px 30px 3px 6px;
330         margin: 0 0.5em 0.5em 0;
331         position: relative;
332 }
333 // no manual resizing for textareas (works on non-IE browser only anyways)
334 // as it is handled by JS: "autosize"
335 .tceforms-textarea {
336         resize: none;
337 }
338
339 //
340 // TCEforms suggest
341 //
342
343 div.typo3-TCEforms-suggest-position-right {
344         margin-left: 10px;
345 }
346
347 div.typo3-TCEforms-suggest label {
348         margin-right: 5px;
349 }
350
351 div.typo3-TCEforms-suggest-indicator {
352         left: 230px;
353         position: relative;
354         top: -18px;
355 }
356
357 div.typo3-TCEforms-suggest-choices {
358         background-color: white;
359         border: 1px solid #888;
360         position: absolute;
361         width: 250px;
362         z-index: 4000;
363 }
364
365 div.typo3-TCEforms-suggest-choices ul {
366         margin: 0;
367         padding: 0;
368 }
369
370 div.typo3-TCEforms-suggest-choices li {
371         cursor: pointer;
372         background-color: #efeff4;
373         background-repeat: no-repeat;
374         background-position: 4px center;
375         list-style-type: none;
376         display: block;
377         margin: 0;
378         padding: 4px 2px 4px 24px;
379 }
380
381 div.typo3-TCEforms-suggest-choices li.suggest-noresults {
382         height: auto;
383 }
384
385 div.typo3-TCEforms-suggest-choices span.suggest-uid {
386         margin-left: 0.3em;
387 }
388
389 div.typo3-TCEforms-suggest-choices span.suggest-path {
390         font-size: 0.9em;
391         margin-top: 0.3em;
392 }
393
394 input.typo3-TCEforms-suggest-search {
395         width: 200px;
396         padding-left: 20px;
397         vertical-align: middle;
398 }
399
400 //
401 // TCEforms Flexforms
402 //
403
404 .t3-form-field-label-flex {
405         border-top: 1px solid #c0c0c0;
406         padding: 5px;
407 }
408
409 .t3-form-field-flex {
410         padding: 0 5px 5px;
411 }
412
413 //
414 // TCEforms Inline-Relational-Record-Editing
415 //
416
417 .t3-form-field-container-wrap {
418         margin: 6px 0px;
419 }
420
421 .t3-form-field-container-inline {
422         border: 1px solid #aaaaaa;
423         background-color: #f9f9f9;
424         margin: 2px 0px;
425 }
426
427 .t3-form-field-header-inline > span {
428         position: absolute;
429         left: 4px;
430         top: 15px;
431 }
432
433 .t3-form-field-header-inline-wrap:before,
434 .t3-form-field-header-inline-wrap:after {
435         content: " ";
436         display: table;
437 }
438
439 .t3-form-field-header-inline-wrap:after {
440     clear: both;
441 }
442
443 .t3-form-field-header-inline-wrap {
444         min-width: 300px;
445 }
446
447 .t3-form-field-header-inline-icon,
448 .t3-form-field-header-inline-thumbnail {
449         float: left;
450         margin-right: 5px;
451 }
452
453 .t3-form-field-header-inline-icon {
454         width: 18px;
455         height: 16px;
456         padding: 3px 0px;
457 }
458
459 .t3-form-field-header-inline-thumbnail {
460         float: left;
461         margin-right: 15px;
462 }
463
464 .t3-form-field-header-inline-thumbnail img {
465         display: block;
466 }
467
468 .t3-form-field-header-inline-ctrl {
469         float: right;
470 }
471
472 .t3-form-field-header-inline-ctrl .t3-icon {
473         margin: 0px;
474         margin-left: 3px;
475 }
476
477 .t3-form-field-header-inline-body,
478 .t3-form-field-header-inline-summary {
479         overflow: hidden;
480         zoom: 1;
481 }
482
483 .t3-form-field-header-inline-thumbnail,
484 .t3-form-field-header-inline-summary {
485         cursor: pointer;
486 }
487
488 .t3-form-field-header-inline-ctrl,
489 .t3-form-field-header-inline-summary {
490         padding: 5px 0px;
491 }
492
493 .t3-form-field-header-inline-summary dl {
494         margin: 0px;
495         overflow: hidden;
496 }
497
498 .t3-form-field-header-inline-summary dt {
499         font-weight: bold;
500         float: left;
501         clear: left;
502         margin-right: 10px;
503 }
504
505 .t3-form-field-header-inline-summary dd {
506         float: left;
507 }
508
509 .t3-form-field-header-inline-ctrl img {
510         vertical-align: middle;
511 }
512
513 .t3-form-field-header-inline .t3-form-field-header-inline-ctrl > * {
514         opacity: 0;
515 }
516
517 .t3-form-field-header-inline:hover .t3-form-field-header-inline-ctrl > * {
518         opacity: 1;
519 }
520
521 .t3-form-field-header-inline .t3-form-field-header-inline-ctrl > span.sortableHandle {
522         margin-left: 16px;
523         opacity: 1;
524         display: inline-block;
525 }
526
527 .t3-form-field-container-inline-placeHolder div.t3-form-field-record-inline,
528 .t3-form-field-container-inline-collapsed div.t3-form-field-record-inline {
529         display:none !important;
530 }
531
532 .t3-form-field-header-inline {
533         background-color: #E0E0E0;
534         cursor: pointer;
535         padding: 6px 16px;
536         position:relative;
537 }
538
539 .t3-form-field-container-inline-placeHolder .t3-form-field-header-inline > span {
540         display:none;
541 }
542
543 .t3-form-field-record-inline {
544         border-top: 1px solid #aaaaaa;
545         padding: 8px 8px;
546         position: relative;
547 }
548
549 .t3-form-field-record-inline > table {
550     width:100%;
551 }
552
553 .t3-form-field-record-inline .typo3-dyntabmenu-divs,
554 .t3-form-field-record-inline .typo3-dyntabmenu-tabs {
555         margin-left:8px;
556         margin-right:8px !important;
557         margin-bottom:0px !important;
558 }
559
560 .sortableHandle {
561         cursor: move;
562 }
563
564 //
565 // TCEforms Sections
566 //
567
568 .t3-flex-section-header .t3-record-title {
569         font-weight: bold;
570 }
571
572 .t3-flex-section {
573         clear: both;
574         margin: 5px 0;
575 }
576
577 .t3-flex-section-header,
578 .t3-form-field-container-flexsection {
579         padding-left: 20px;
580 }
581
582 .t3-form-field-header-flexsection {
583         width: 100%;
584         height: 16px;
585 }
586
587 .t3-form-field-label-flexsection {
588         border-top: 1px solid #cdcdcd;
589         padding: 5px 10px;
590 }
591
592 .t3-form-field-toggle-flexsection {
593         padding: 5px 0 5px 20px;
594 }
595
596 .t3-form-field-add-flexsection {
597         border-top: 1px solid #cdcdcd;
598         padding: 10px 5px 5px 20px;
599 }
600
601 .t3-form-flex,
602 .t3-form-field-container-flexsections {
603         background: #dadada;
604         margin: 5px 0;
605         clear: both;
606 }
607
608 .t3-flex-section-content,
609 .t3-form-field-record-flexsection {
610         background: #eee;
611         padding: 5px 0;
612 }
613
614 .t3-flex-section-content > div,
615 .t3-form-field-record-flexsection > div {
616         margin: 0 10px;
617 }
618
619 .t3-flex-section-header-preview {
620         font-style: italic;
621         width: 100px;
622         display: inline-block;
623         padding-left: 10px;
624         overflow: hidden;
625         white-space: nowrap;
626         text-overflow: ellipsis;
627 }
628
629 // preview image in sys_file records
630
631 img.t3-tceforms-sysfile-imagepreview {
632         float: left;
633         margin-right: 10px;
634         margin-bottom: 10px;
635 }
636
637 * html div#typo3-docbody .typo3-TCEforms {
638         margin-top: 20px;
639 }
640
641 .typo3-TCEforms img[src*="clear.gif"] {
642         z-index: 0;
643 }
644
645 //
646 // TCEforms
647 //
648
649 table#typo3-altdoc-header input,
650 .c-inputButton {
651         background: none;
652         border: 0;
653 }
654
655 .t3-tceforms-widget-null-wrapper {
656         display: inline-block;
657         float: right;
658         position: relative;
659         width: 20px;
660         max-width: 20px;
661 }
662
663 .t3-tceforms-widget-null-wrapper input {
664         margin-left: 2px;
665         margin-top: 42%;
666 }
667 .t3-tceforms-input-wrapper-datetime .t3-icon-edit-pick-date {
668         top: -4px;
669 }
670
671 .typo3-TCEforms table#typo3-altdoc-header input:hover,
672 .c-inputButton:hover {
673         background: none;
674         border: 0;
675 }
676
677 .typo3-TCEforms .typo3-TCEforms-recHeader {
678         color: #555555;
679         font-weight: bold;
680 }
681
682 .typo3-TCEforms .typo3-TCEforms-recHeaderRow {
683         background: #fff;
684         text-align: right;
685 }
686
687 .typo3-TCEforms span.typo3-TCEforms-newToken {
688         color: #990000;
689         font-weight: bold;
690 }
691
692 .typo3-TCEforms span.typo3-TCEforms-helpText {
693         background: transparent;
694         color: #fff;
695 }
696
697 table.typo3-TCEforms-select-checkbox {
698         background-color: #ffffff;
699         border: 1px solid #aaa;
700 }
701
702 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header td {
703         background-color: #fff;
704         font-weight: bold;
705 }
706
707 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr:nth-child(2n) {
708         background-color: #f7f7f7;
709 }
710
711 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-selectedItem {
712         background-color: #d8ecd0;
713 }
714
715 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-invalidItem {
716         color: #dddddd;
717 }
718
719 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr:hover {
720         background-color: #dedede;
721 }
722
723 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-selectedItem:hover {
724         background-color: #abd99a;
725 }
726
727 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-invalidItem:hover {
728         background-color: transparent;
729 }
730
731 .typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell {
732         white-space: nowrap;
733 }
734
735 .typo3-TCEforms optgroup.c-divider,
736 select option.c-divider {
737         background-color: #eee;
738         border-top: 1px solid #666;
739         color: #666;
740         font-style: italic;
741         text-transform: uppercase;
742 }
743
744 // show text of default language under the translated input field
745
746 .t3-form-original-language {
747         background-color: #dadada;
748         border: 1px solid #c0c0c0;
749         padding: 2px;
750         font-size: 0.9em;
751         margin-top: 4px;
752 }
753
754 .t3-form-original-language-diff {
755         border: 1px solid #c0c0c0;
756         font-size: 0.9em;
757         margin-top: 4px;
758 }
759
760 .t3-form-original-language-diffheader {
761         .bg-danger();
762         font-weight: bold;
763         padding: 2px;
764 }
765
766 .t3-form-original-language-diffcontent {
767         padding: 2px;
768 }
769
770 // Default. Always used on main-palettes in the bottom of the forms
771
772 .typo3-TCEforms .typo3-TCEforms-checkboxArray td {
773         padding-right: 5px;
774 }
775
776 input.typo3-TCEforms-suggest-search {
777         background-image: url('../../../../icons/gfx/zoom.gif');
778         background-position: 2px center;
779         background-repeat: no-repeat;
780 }
781
782 div.typo3-TCEforms-suggest-choices ul {
783         list-style-type: none;
784 }
785
786 div.typo3-TCEforms-suggest-choices li.selected {
787         background-color: #ffb !important;
788 }
789
790 div.typo3-TCEforms-suggest-choices li.pages {
791         background-color: #fcc;
792 }
793
794 div.typo3-TCEforms-suggest-choices span.suggest-uid {
795         font-size: 0.9em;
796 }
797
798 div.typo3-TCEforms-suggest-choices span.suggest-path abbr {
799         border-bottom: none;
800 }
801
802 div.typo3-TCEforms-suggest-choises a {
803         cursor: pointer;
804 }
805
806 //
807 // TCEforms Flexforms
808 //
809
810 .t3-form-field-container-flex {
811 }
812
813 div.t3-form-field-container:first-child .t3-form-field-label-flex {
814         border-top: 0;
815 }
816
817 // no separate background for dyntabs in flexforms
818
819 .typo3-TCEforms .wrapperTable div.typo3-dyntabmenu-tabs ,
820 .typo3-TCEforms .wrapperTable1 div.typo3-dyntabmenu-tabs,
821 .typo3-TCEforms .wrapperTable2 div.typo3-dyntabmenu-tabs,
822 .typo3-TCEforms .wrapperTable3 div.typo3-dyntabmenu-tabs,
823 .typo3-TCEforms .wrapperTable4 div.typo3-dyntabmenu-tabs,
824 .typo3-TCEforms .wrapperTable5 div.typo3-dyntabmenu-tabs {
825         background: transparent;
826 }
827
828 // tabs inside the table => flexforms
829
830 .typo3-TCEforms .wrapperTable .typo3-dyntabmenu-divs,
831 .typo3-TCEforms .wrapperTable1 .typo3-dyntabmenu-divs,
832 .typo3-TCEforms .wrapperTable2 .typo3-dyntabmenu-divs,
833 .typo3-TCEforms .wrapperTable3 .typo3-dyntabmenu-divs,
834 .typo3-TCEforms .wrapperTable4 .typo3-dyntabmenu-divs,
835 .typo3-TCEforms .wrapperTable5 .typo3-dyntabmenu-divs {
836         border: 1px solid #c0c0c0;
837 }
838
839 //
840 // TCEforms Inline-Relational-Record-Editing
841 //
842
843 .t3-form-field-header-inline:hover {
844         background-color: #cccccc;
845 }
846
847 .t3-form-field-container-inline-hidden,
848 .t3-form-field-container-inline-placeHolder {
849         opacity:0.3;
850 }
851
852 .t3-form-field-header-inline table {
853     vertical-align:top;
854 }
855
856 .t3-form-field-header-inline-thumbnail-image {
857     border: none;
858 }
859
860 .t3-form-field-record-inline .typo3-message {
861         margin-bottom: 1.5em;
862 }
863
864 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable,
865 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable1,
866 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable2,
867 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable3,
868 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable4,
869 .typo3-TCEforms .t3-form-field-container-inline .wrapperTable5 {
870         border: 0;
871 }
872
873 .t3-form-field-header-inline td.t3-form-field-header-inline-summary dl dt {
874         font-weight: bold;
875 }
876
877 //
878 // TCEforms Sections
879 //
880
881 .typo3-TCEforms-flexForm .bgColor4,
882 .typo3-TCEforms-flexForm .bgColor5 {
883         background: none;
884         display: inline-block;
885 }
886
887 .typo3-TCEforms-select-selectedItemWithBackgroundImage {
888         background-color:#fff;
889         background-position: 0% 50%;
890         background-repeat:no-repeat;
891         padding:1px 1px 1px 24px;
892 }
893
894 .ext-webkit .typo3-TCEforms-select-selectedItemWithBackgroundImage {
895         text-indent: 20px;
896         background-position-x: 6px;
897 }
898 .ext-webkit .typo3-TCEforms-select-selectedItemWithBackgroundImage optgroup option {
899         text-indent: 20px;
900 }
901 .ext-chrome:not(.ext-mac) .typo3-TCEforms-select-selectedItemWithBackgroundImage {
902         text-indent: 0px;
903         background-position-x: 5px;
904 }
905
906 .t3-tceforms-fieldReadOnly span.t3-icon {
907     position: absolute;
908     right: 3px;
909     top: 4px;
910 }
911
912 .t3-form-field-item {
913         position: relative;
914         border: 1px solid transparent;
915         padding: 0;
916 }
917
918 .t3-tceforms-widget-null-wrapper + .t3-form-field-item {
919         display: inline-block;
920 }
921
922 .t3-form-field-item.disabled {
923         border: 1px dotted #696362;
924 }
925
926 .t3-form-field-disable,
927 .t3-form-field-item.disabled .t3-form-field-item.disabled .t3-form-field-disable {
928         display: none;
929 }
930 .t3-form-field-item.disabled .t3-form-field-disable {
931         z-index: 8000;
932         background: #f4f4f4;
933         display: block;
934         position: absolute;
935         width: 100%;
936         height: 100%;
937
938         opacity: 0.5;
939         filter: alpha(opacity=50);
940 }
941
942 .t3-form-palette-field-label {
943         text-indent: 2px;
944 }
945
946 //
947 // TCEforms Tree
948 //
949
950 .t3-form-field-item .x-tree input.x-tree-node-cb {
951         height: auto;
952         margin: 0 0 0 1px;
953         vertical-align: middle;
954 }
955
956 // state: the form field was modified
957 .t3-form-field-label.t3-form-field-state-changed {
958         color: #004fb0;
959 }