source: Dev/branches/rest-dojo-ui/client/rft/css/main.css @ 412

Last change on this file since 412 was 412, checked in by tjcschipper, 13 years ago
  • Most visual bugs are gone now.
File size: 31.8 KB
Line 
1/* Menu.css */
2@import "external.css";
3DESCRIPTION {
4  /*
5How to use colour system:
6Apply a combination of at most 1 "colour" class and one or more "modifier" classes.
7Colour classes: Red, Blue, Green, Orange, Purple
8Modifer classes:
9- textColor: Change the font colour of element to the "colour" class combined with.
10- bgColor: Change the background colour to the "colour" class combined with.
11- doesHover: If present in combination with one of the above two modifiers,
12the element will shift it's background- or text colour to a lighter version on hover.
13- hoverTextColor: Same as .textColor, but only affects elements being hovered over.
14- hoverBgColor: Same as .bgColor, but only affects elements being hovered over.
15NOTE: .doesHover does nothing in combination with the above two modifiers!
16*/
17
18}
19#rft.claro .blue.textColor {
20  color: #0072bc;
21}
22#rft.claro .blue.textColor.doesHover:hover {
23  color: #0794d1;
24}
25#rft.claro .blue.bgColor {
26  background-color: #0072bc;
27  color: #ffffff;
28}
29#rft.claro .blue.bgColor.doesHover:hover {
30  background-color: #0794d1;
31  color: #111111;
32}
33#rft.claro .blue.hoverTextColor:hover {
34  color: #0072bc;
35}
36#rft.claro .blue.hoverBgColor:hover {
37  background-color: #0072bc;
38}
39#rft.claro .red.textColor {
40  color: #8c0310;
41}
42#rft.claro .red.textColor.doesHover:hover {
43  color: #bd0013;
44}
45#rft.claro .red.bgColor {
46  background-color: #8c0310;
47  color: #ffffff;
48}
49#rft.claro .red.bgColor.doesHover:hover {
50  background-color: #bd0013;
51  color: #111111;
52}
53#rft.claro .red.hoverTextColor:hover {
54  color: #8c0310;
55}
56#rft.claro .red.hoverBgColor:hover {
57  background-color: #8c0310;
58}
59#rft.claro .orange.textColor {
60  color: #ff5b12;
61}
62#rft.claro .orange.textColor.doesHover:hover {
63  color: #ff9140;
64}
65#rft.claro .orange.bgColor {
66  background-color: #ff5b12;
67  color: #ffffff;
68}
69#rft.claro .orange.bgColor.doesHover:hover {
70  background-color: #ff9140;
71  color: #111111;
72}
73#rft.claro .orange.hoverTextColor:hover {
74  color: #ff5b12;
75}
76#rft.claro .orange.hoverBgColor:hover {
77  background-color: #ff5b12;
78}
79#rft.claro .green.textColor {
80  color: #25a000;
81}
82#rft.claro .green.textColor.doesHover:hover {
83  color: #63c400;
84}
85#rft.claro .green.bgColor {
86  background-color: #25a000;
87  color: #ffffff;
88}
89#rft.claro .green.bgColor.doesHover:hover {
90  background-color: #63c400;
91  color: #111111;
92}
93#rft.claro .green.hoverTextColor:hover {
94  color: #25a000;
95}
96#rft.claro .green.hoverBgColor:hover {
97  background-color: #25a000;
98}
99#rft.claro .purple.textColor {
100  color: #6529b7;
101}
102#rft.claro .purple.textColor.doesHover:hover {
103  color: #993dec;
104}
105#rft.claro .purple.bgColor {
106  background-color: #6529b7;
107  color: #ffffff;
108}
109#rft.claro .purple.bgColor.doesHover:hover {
110  background-color: #993dec;
111  color: #111111;
112}
113#rft.claro .purple.hoverTextColor:hover {
114  color: #6529b7;
115}
116#rft.claro .purple.hoverBgColor:hover {
117  background-color: #6529b7;
118}
119#rft.claro .textColor,
120#rft.claro .hoverTextColor {
121  transition: color 0.2s;
122}
123#rft.claro .bgColor,
124#rft.claro .hoverBgColor {
125  transition: background-color 0.2s;
126}
127/* This stylesheet compensates for the restoration of the claro style to its original specs. (21-6-2012)
128 * These changes should be moved to relevant stylesheets as soon as possible!
129*/
130/* Menu.css */
131.claro .topbar .dijitMenuitem {
132  width: 90px;
133  background-image: none;
134  background-position: top;
135  text-align: center;
136}
137.claro .dijitMenuPassive .dijitMenuItemHover,
138.claro .dijitMenuPassive .dijitMenuItemSelected {
139  background-color: transparent;
140  color: #ffffff;
141  border: none;
142  padding: 0 4px;
143}
144.claro .dijitMenuPassive .dijitMenuItemActive {
145  background-position: top;
146}
147/* layout/BorderContainer.css */
148.claro .dijitSplitContainer-child,
149.claro .dijitBorderContainer-child {
150  border: none;
151}
152.claro .dijitTabContainerTop-dijitContentPane,
153.claro .dijitTabContainerLeft-dijitContentPane,
154.claro .dijitTabContainerBottom-dijitContentPane,
155.claro .dijitTabContainerRight-dijitContentPane,
156.claro .dijitAccordionContainer-dijitContentPane {
157  background-color: transparent;
158}
159.claro .dijitSplitContainer-dijitContentPane,
160.claro .dijitBorderContainer-dijitContentPane {
161  background-color: transparent;
162}
163/* layout/TabContainer.css */
164.claro .dijitTabPaneWrapper {
165  background: transparent;
166}
167.claro .dijitTabInnerDiv {
168  background-color: transparent;
169  color: #999999;
170  border: none;
171}
172.claro .dijitTabContent {
173  border: none;
174}
175.claro .dijitTabHover .dijitTabInnerDiv {
176  background-color: transparent;
177  color: #ffffff;
178}
179.claro .dijitTabActive .dijitTabInnerDiv {
180  color: #0072bc;
181}
182.claro .dijitTabChecked .dijitTabInnerDiv {
183  background-color: transparent;
184  color: #ffffff;
185}
186.claro .dijitTabContent {
187  border: 1px solid #999999;
188}
189.claro .dijitTabHover .dijitTabContent {
190  border-color: #ffffff;
191}
192.claro .dijitTabActive .dijitTabContent {
193  border-color: transparent;
194}
195.claro .dijitTabChecked .dijitTabContent {
196  color: #ffffff;
197  border-color: #0072bc;
198}
199/*lefttabs*/
200.claro .dijitTabContainerLeft-tabs .dijitTab {
201  border-width: 1px;
202  left: 0;
203  margin-bottom: 4px;
204  margin-right: 8px;
205}
206.claro .dijitTabContainerLeft-tabs .dijitTabInnerDiv {
207  border: none;
208  background: transparent;
209  background-image: none;
210  background-position: top;
211  background-repeat: no-repeat;
212}
213.claro .dijitTabContainerLeft-tabs .dijitTabContent {
214  padding: 3px 8px 4px 8px;
215  background-image: none;
216}
217.claro .dijitTabContainerLeft-tabs .dijitTabChecked .dijitTabContent {
218  padding-right: 8px;
219  background-image: none;
220}
221.claro .dijitTabContainerLeft-tabs .dijitTabChecked .dijitTabInnerDiv {
222  -webkit-box-shadow: none;
223  -moz-box-shadow: none;
224  box-shadow: none;
225}
226.claro .dijitTabContainerLeft-tabs .dijitTabInnerDiv,
227.claro .dijitTabContainerLeft-tabs .dijitTabContent {
228  -moz-border-radius: 0;
229  border-radius: 0;
230  border: none;
231}
232*:focus {
233  outline: none;
234}
235html,
236body {
237  width: 100%;
238  height: 100%;
239  background-color: #333333;
240}
241#rft.claro {
242  font-family: 'Segoe UI', Helvetica, Verdana, Arial, sans-serif;
243  font-size: 13px;
244  color: #111111;
245}
246#rft.claro .dijitBorderContainer,
247#rft.claro .dijitContentPane,
248#rft.claro .dijitTabContainer,
249#rft.claro .dijitTabPaneWrapper {
250  background: transparent;
251  border: none;
252}
253#rft.claro h1 {
254  margin: 0 0 0 0;
255  padding: 0 10px 8px 10px;
256  float: left;
257  clear: left;
258  font-size: 48px;
259  color: #999999;
260  line-height: 48px;
261  font-weight: normal;
262  -webkit-user-select: none;
263  -moz-user-select: none;
264  -ms-user-select: none;
265  user-select: none;
266}
267#rft.claro h2 {
268  margin: 0 0 0 0;
269  padding: 0 0 0 0;
270  color: #999999;
271  font-size: 22px;
272  line-height: 30px;
273}
274#rft.claro h2 .rftIcon {
275  width: 32px;
276  height: 32px;
277  margin: 0;
278  padding: 0 0 0 0;
279  background-image: url('images/icons/rftIcons32.png');
280  margin-right: 8px;
281}
282#rft.claro h3 {
283  margin: 0 0 0 0;
284  font-size: 18px;
285  margin-bottom: 4px;
286}
287#rft.claro h4 {
288  font-size: 16px;
289}
290#rft.claro .topbar {
291  overflow-y: hidden;
292}
293#rft.claro .topbar .dijitMenuBar {
294  border: none;
295  background-image: none;
296  -webkit-box-shadow: none;
297  box-shadow: none;
298  border-radius: 0;
299  background-color: transparent;
300  float: right;
301  clear: right;
302  margin-top: 16px;
303}
304#rft.claro .topbar .breadcrumbs {
305  color: #999999;
306}
307#rft.claro .topbar .breadcrumbs .breadcrumb {
308  font-size: 13px;
309}
310#rft.claro .topbar .breadcrumbs .breadcrumb.breadcrumbCurrent {
311  color: #ffffff;
312  font-size: 15px;
313}
314#rft.claro .topbar .breadcrumbs .breadcrumb.breadcrumbHover {
315  color: #0072bc;
316}
317#rft.claro .dijitContentPane.page {
318  margin: 0 0 0 0;
319  padding: 0 0 0 0;
320}
321#rft.claro .dijitContentPane.content {
322  margin: 0 0 0 0;
323  padding: 0 0 0 0;
324  display: block;
325  clear: both;
326  background-color: #555555;
327  background-image: -webkit-gradient(50% 50%, circle, #666666 1%, #444444 100%);
328  -moz-background-image: gradient(50% 50%, circle, #666666 1%, #444444 100%);
329  -o-background-image: gradient(50% 50%, circle, #666666 1%, #444444 100%);
330  -ms-background-image: gradient(50% 50%, circle, #666666 1%, #444444 100%);
331  background-image: gradient(50% 50%, circle, #666666 1%, #444444 100%);
332}
333#rft.claro .dijitContentPane.content .dijitBorderContainer {
334  padding: 4px;
335}
336#rft.claro .loginLabel {
337  float: left;
338  clear: left;
339  width: 100px;
340}
341#rft.claro .loginInput {
342  width: 150px;
343}
344#rft.claro .rftMultipleChoiceWidget {
345  display: table;
346}
347#rft.claro .rftMultipleChoiceWidget .row {
348  display: table-row;
349}
350#rft.claro .rftMultipleChoiceWidget .rowBox {
351  display: table-cell;
352}
353#rft.claro .rftMultipleChoiceWidget .rowText {
354  display: table-cell;
355  width: 100px;
356}
357#rft.claro .rftMultipleChoiceWidget .rowBtn {
358  display: table-cell;
359  width: 30px;
360}
361#rft.claro .verticalTabList {
362  width: 190px;
363}
364#rft.claro .dijitTab {
365  -webkit-transition: all 0.2s;
366  -moz-transition: all 0.2s;
367  -o-transition: all 0.2s;
368  -ms-transition: all 0.2s;
369  transition: all 0.2s;
370  background-color: transparent;
371  padding: 4px 8px;
372  color: #999999;
373  overflow: hidden;
374}
375#rft.claro .dijitTabContainerLeft-tabs {
376  border: none;
377  padding: 4px;
378}
379#rft.claro .dijitTabContainerLeft-tabs .dijitTab {
380  margin: 4px;
381  width: 200px;
382  min-height: 30px;
383  border: 1px solid #999999;
384}
385#rft.claro .dijitTabContainerLeft-tabs .dijitTab .dijitTabContent {
386  min-height: 30px;
387  line-height: 30px;
388  width: 190px;
389}
390#rft.claro .dijitTabContainerLeft-tabs .dijitTab.dijitTabChecked {
391  -webkit-transition: all 0.1s;
392  -moz-transition: all 0.1s;
393  -o-transition: all 0.1s;
394  -ms-transition: all 0.1s;
395  transition: all 0.1s;
396  color: #ffffff;
397  border: 1px solid transparent;
398}
399#rft.claro .dijitTabContainerLeft-tabs .dijitTab.dijitTabChecked.dijitTabHover {
400  border: 1px solid transparent;
401}
402#rft.claro .dijitTabContainerLeft-tabs .dijitTab.dijitTabHover {
403  -webkit-transition: all 0.1s;
404  -moz-transition: all 0.1s;
405  -o-transition: all 0.1s;
406  -ms-transition: all 0.1s;
407  transition: all 0.1s;
408  color: #ffffff;
409  border-color: #ffffff;
410}
411#rft.claro .dijitTabContainerLeft-tabs .dijitTab.dijitTabActive {
412  -webkit-transition: all 0.1s;
413  -moz-transition: all 0.1s;
414  -o-transition: all 0.1s;
415  -ms-transition: all 0.1s;
416  transition: all 0.1s;
417  color: #999999;
418}
419#rft.claro.blue .dijitTabChecked,
420#rft.claro .blue .dijitTabChecked,
421#rft.claro div.blue.dijitTabChecked {
422  background-color: #0072bc;
423}
424#rft.claro.green .dijitTabChecked,
425#rft.claro .green .dijitTabChecked,
426#rft.claro div.green.dijitTabChecked {
427  background-color: #25a000;
428}
429#rft.claro.red .dijitTabChecked,
430#rft.claro .red .dijitTabChecked,
431#rft.claro div.red.dijitTabChecked {
432  background-color: #8c0310;
433}
434#rft.claro.orange .dijitTabChecked,
435#rft.claro .orange .dijitTabChecked,
436#rft.claro div.orange.dijitTabChecked {
437  background-color: #ff5b12;
438}
439#rft.claro.purple .dijitTabChecked,
440#rft.claro .purple .dijitTabChecked,
441#rft.claro div.purple.dijitTabChecked {
442  background-color: #6529b7;
443}
444#rft.claro fieldset {
445  border: none;
446}
447#rft.claro fieldset.align input,
448#rft.claro fieldset.align .dijitTextBox,
449#rft.claro fieldset.align textarea {
450  margin-left: 0;
451}
452#rft.claro fieldset.align label {
453  color: #ffffff;
454  display: inline-block;
455  width: 100px !important;
456}
457#rft.claro .newline {
458  float: left;
459  clear: left;
460  display: block;
461}
462#rft.claro .floatRight {
463  float: right;
464  margin: 0 0 0 0;
465}
466#rft.claro .rftLineListView {
467  max-width: 200px;
468  max-height: 500px;
469}
470#rft.claro .rftLineListView .rftLineListViewContent {
471  width: auto;
472  overflow: auto;
473}
474#rft.claro .rftIcon {
475  margin: 0 0 0 0;
476  padding: 0 0 0 0;
477  float: left;
478  display: inline-block;
479  border: none;
480  background-color: transparent;
481  background-repeat: no-repeat;
482}
483#rft .rftIconApplication {
484  background-position: 0px 0px;
485}
486#rft .rftIconDashboard {
487  background-position: -32px 0px;
488}
489#rft .rftIconSession {
490  background-position: -64px 0px;
491}
492#rft .rftIconSessionActive {
493  background-position: -96px 0px;
494}
495#rft .rftIconSessionTemplate {
496  background-position: -128px 0px;
497}
498#rft .rftIconSurvey {
499  background-position: -160px 0px;
500}
501#rft .rftIconQuestion {
502  background-position: -192px 0px;
503}
504#rft .rftIconQuestionFill {
505  background-position: -224px 0px;
506}
507#rft .rftIconRespondent {
508  background-position: -256px 0px;
509}
510#rft .rftIconAnswer {
511  background-position: -288px 0px;
512}
513#rft .rftIconAnswerSet {
514  background-position: -320px 0px;
515}
516#rft .rftIconGameData {
517  background-position: -352px 0px;
518}
519#rft .rftIconUser {
520  background-position: -384px 0px;
521}
522#rft .rftIconAccept {
523  background-position: -416px 0px;
524}
525#rft .rftIconCancel {
526  background-position: -448px 0px;
527}
528#rft .rftIconPlus {
529  background-position: -480px 0px;
530}
531#rft .rftIconMinus {
532  background-position: -512px 0px;
533}
534#rft .rftIconIncrease {
535  background-position: -544px 0px;
536}
537#rft .rftIconDecrease {
538  background-position: -576px 0px;
539}
540#rft .rftIconDelete {
541  background-position: -608px 0px;
542}
543#rft .rftIconHome {
544  background-position: -640px 0px;
545}
546#rft .rftIconPreview {
547  background-position: -672px 0px;
548}
549#rft .rftIconSave {
550  background-position: -704px 0px;
551}
552#rft .rftIconDiscard {
553  background-position: -736px 0px;
554}
555#rft .rftIconProperties {
556  background-position: -768px 0px;
557}
558#rft .rftIconUndo {
559  background-position: -800px 0px;
560}
561#rft .rftIconRedo {
562  background-position: -832px 0px;
563}
564#rft .rftIconBack {
565  background-position: -864px 0px;
566}
567#rft .rftIconForward {
568  background-position: -896px 0px;
569}
570#rft .rftIconRefresh {
571  background-position: -928px 0px;
572}
573#rft .rftIconHelp {
574  background-position: -960px 0px;
575}
576#rft .rftIconInspect {
577  background-position: -992px 0px;
578}
579#rft .rftIconTag {
580  background-position: -1024px 0px;
581}
582#rft .rftIconImage {
583  background-position: -1056px 0px;
584}
585#rft .rftIconEdit {
586  background-position: -1088px 0px;
587}
588#rft .rftIconLock {
589  background-position: -1120px 0px;
590}
591#rft .rftIconUnlock {
592  background-position: -1152px 0px;
593}
594#rft .rftIconPreset {
595  background-position: -1184px 0px;
596}
597#rft .rftIconTextBlock {
598  background-position: -1216px 0px;
599}
600#rft .rftIconPageBreak {
601  background-position: -1248px 0px;
602}
603#rft .rftIconExternal {
604  background-position: -1280px 0px;
605}
606#rft .rftIconInput {
607  background-position: -1312px 0px;
608}
609#rft .rftIconPublish {
610  background-position: -1344px 0px;
611}
612#rft .rftIconFullArrowUp {
613  background-position: -1696px 0px;
614}
615#rft .rftIconFullArrowDown {
616  background-position: -1728px 0px;
617}
618#rft .rftIconFullArrowLeft {
619  background-position: -1760px 0px;
620}
621#rft .rftIconFullArrowRight {
622  background-position: -1792px 0px;
623}
624#rft .rftIconHalfArrowUp {
625  background-position: -1824px 0px;
626}
627#rft .rftIconHalfArrowDown {
628  background-position: -1856px 0px;
629}
630#rft .rftIconHalfArrowLeft {
631  background-position: -1888px 0px;
632}
633#rft .rftIconHalfArrowRight {
634  background-position: -1920px 0px;
635}
636#rft.claro .rftSelector {
637  margin: 0 0 0 0;
638  padding: 0 0 0 0;
639  margin: 4px;
640}
641#rft.claro .rftSelector .rftLineWithActions {
642  margin: 0 0 0 0;
643  padding: 0 0 0 0;
644}
645#rft.claro .rftSelector .rftSelectorSelected .rftSelectorIndicator {
646  margin: 0 0 0 0;
647  padding: 0 0 0 0;
648  float: left;
649  width: 8px;
650  height: 24px;
651  background-color: #bedead;
652}
653#rft.claro .rftSelector .rftSelectorSelected .rftSelectorIndicator.conflict {
654  background-color: #ff0000;
655}
656#rft.claro .rftSelector .rftSelectorSelected .rftSelectorIndicator.pending {
657  background-color: #ff8000;
658}
659#rft.claro .rftSelector .rftSelectorSelected .rftSelectorIndicator.success {
660  background-color: #00ff00;
661}
662#rft.claro .rftSelector .rftSelectorOptions .rftLineWithActions,
663#rft.claro .rftSelector .rftSelectorSelected .rftLineWithActions {
664  background-color: #ffffff;
665  color: #111111;
666}
667#rft.claro .rftSelector .rftSelectorOptions .rftLineWithActions .rftInlineButton .rftIcon {
668  width: 16px;
669  height: 16px;
670  margin: 4px 0;
671  padding: 0 0 0 0;
672  background-image: url('images/icons/rftIcons16b.png');
673}
674#rft.claro .rftLineWithActions {
675  border: none;
676  background-image: none;
677  -webkit-box-shadow: none;
678  box-shadow: none;
679  border-radius: 0;
680  position: relative;
681  height: 24px;
682  white-space: nowrap;
683  margin: 4px 0;
684  color: #ffffff;
685  background-color: #0072bc;
686}
687#rft.claro .rftLineWithActions.dojoDndItem {
688  -webkit-transition: all 0.2s;
689  -moz-transition: all 0.2s;
690  -o-transition: all 0.2s;
691  -ms-transition: all 0.2s;
692  transition: all 0.2s;
693}
694#rft.claro .rftLineWithActions.dojoDndItem.dojoDndItemBefore {
695  margin-top: 6px;
696  border-top: 6px solid #ffffff;
697}
698#rft.claro .rftLineWithActions.dojoDndItem.dojoDndItemAfter {
699  margin-bottom: 6px;
700  border-bottom: 6px solid #ffffff;
701}
702#rft.claro .rftLineWithActions.dojoDndItem.dojoDndItemover,
703#rft.claro .rftLineWithActions.dojoDndItem.dojoDndItemAnchor {
704  background-image: none;
705  border: none;
706  padding: 2px;
707  background-color: rgba(255, 255, 255, 0.1);
708}
709#rft.claro .rftLineWithActions .rftLineWithActionsTitle {
710  float: left;
711  margin: 0 8px;
712  overflow: hidden;
713  white-space: nowrap;
714  word-wrap: break-word;
715  line-height: 24px;
716}
717#rft.claro .rftLineWithActions .rftLineWithActionsButtons {
718  margin: 0 0 0 0;
719  padding: 0 0 0 0;
720  line-height: 24px;
721  height: 24px;
722  position: absolute;
723  right: 0;
724  float: left;
725}
726#rft.claro .dojoDndSourceMoved .rftLineWithActions.dojoDndItemAnchor {
727  height: 0;
728}
729#rft.claro .rftIndexMenuBlock {
730  width: 400px;
731  height: 400px;
732  background: #444444;
733  float: left;
734  margin: 16px;
735  overflow: hidden;
736}
737#rft.claro .rftIndexMenuBlock:hover .rftIndexMenuMask {
738  margin-top: -400px;
739}
740#rft.claro .rftIndexMenuMask {
741  width: 400px;
742  height: 400px;
743  background: #444444;
744  color: #999999;
745  margin-top: 0;
746}
747#rft.claro .rftIndexMenuMask .label {
748  color: #999999;
749  font-size: 32px;
750  height: 32px;
751  line-height: 32px;
752  margin-top: 184px;
753  float: left;
754}
755#rft.claro .rftIndexMenuMask .rftIcon {
756  width: 32px;
757  height: 32px;
758  margin: 0;
759  padding: 0 0 0 0;
760  background-image: url('images/icons/rftIcons32.png');
761  float: left;
762  margin: 184px 8px 0 8px;
763}
764#rft.claro .rftIndexMenuButton {
765  border: none;
766  background-image: none;
767  -webkit-box-shadow: none;
768  box-shadow: none;
769  border-radius: 0;
770  margin: 0 0 0 0;
771  padding: 0 0 0 0;
772  -webkit-transition: all 0.3s;
773  -moz-transition: all 0.3s;
774  -o-transition: all 0.3s;
775  -ms-transition: all 0.3s;
776  transition: all 0.3s;
777  line-height: 32px;
778  border: none;
779}
780#rft.claro .rftIndexMenuButton .dijitButtonNode {
781  border: none;
782  color: #999999;
783  font-size: 22px;
784}
785#rft.claro .rftIndexMenuButton .dijitButtonNode .dijitButtonContents {
786  vertical-align: top;
787}
788#rft.claro .rftIndexMenuButton .dijitButtonNode .dijitButtonContents .dijitButtonText {
789  padding-bottom: 10px;
790  line-height: 20px;
791}
792#rft.claro .rftIndexMenuButton .dijitButtonNode .dijitButtonContents .rftIcon {
793  width: 32px;
794  height: 32px;
795  margin: 0;
796  padding: 0 0 0 0;
797  background-image: url('images/icons/rftIcons32.png');
798  margin: 0 8px;
799}
800#rft.claro .rftIndexMenuButton.oneHeight {
801  height: 100px;
802  width: 400px;
803}
804#rft.claro .rftIndexMenuButton.oneHeight .dijitButtonNode {
805  margin: 38px 0 0 0;
806}
807#rft.claro .rftIndexMenuButton.twoHeight {
808  height: 200px;
809  width: 400px;
810}
811#rft.claro .rftIndexMenuButton.twoHeight .dijitButtonNode {
812  margin: 88px 0 0 0;
813}
814#rft.claro .rftIndexMenuButton.fourHeight {
815  height: 400px;
816  width: 400px;
817}
818#rft.claro .rftIndexMenuButton.fourHeight .dijitButtonNode {
819  margin: 188px 0 0 0;
820}
821#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover {
822  color: #ffffff;
823  -webkit-transition: all 0.1s;
824  -moz-transition: all 0.1s;
825  -o-transition: all 0.1s;
826  -ms-transition: all 0.1s;
827  transition: all 0.1s;
828}
829#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover .dijitButtonText {
830  color: #ffffff;
831  -webkit-transition: all 0.1s;
832  -moz-transition: all 0.1s;
833  -o-transition: all 0.1s;
834  -ms-transition: all 0.1s;
835  transition: all 0.1s;
836}
837#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover.blue {
838  background-color: #0072bc;
839}
840#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover.red {
841  background-color: #8c0310;
842}
843#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover.green {
844  background-color: #25a000;
845}
846#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover.orange {
847  background-color: #ff5b12;
848}
849#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover.purple {
850  background-color: #6529b7;
851}
852#rft.claro .rftIndexMenuButton.rftIndexMenuButtonActive {
853  -webkit-transition: all 0.3s;
854  -moz-transition: all 0.3s;
855  -o-transition: all 0.3s;
856  -ms-transition: all 0.3s;
857  transition: all 0.3s;
858  color: #111111;
859  background: #ffffff;
860}
861#rft.claro .rftIndexMenuButton.rftIndexMenuButtonActive .rftIcon {
862  width: 32px;
863  height: 32px;
864  margin: 0;
865  padding: 0 0 0 0;
866  background-image: url('images/icons/rftIcons32b.png');
867}
868#rft.claro .dijitMenuPopup .dijitMenu {
869  border: none;
870  background-image: none;
871  -webkit-box-shadow: none;
872  box-shadow: none;
873  border-radius: 0;
874  color: #999999;
875  background-color: #333333;
876  border: none;
877}
878#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem {
879  color: #999999;
880  border: none;
881  background-image: none;
882  -webkit-box-shadow: none;
883  box-shadow: none;
884  border-radius: 0;
885  background-color: #333333;
886}
887#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover .dijitMenuItemLabel,
888#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive .dijitMenuItemLabel,
889#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected .dijitMenuItemLabel {
890  color: #ffffff;
891}
892#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover.red,
893#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive.red,
894#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected.red {
895  background-color: #8c0310;
896}
897#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover.blue,
898#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive.blue,
899#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected.blue {
900  background-color: #0072bc;
901}
902#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover.green,
903#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive.green,
904#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected.green {
905  background-color: #25a000;
906}
907#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover.orange,
908#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive.orange,
909#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected.orange {
910  background-color: #ff5b12;
911}
912#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover.purple,
913#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive.purple,
914#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected.purple {
915  background-color: #6529b7;
916}
917#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem .rftIcon {
918  width: 16px;
919  height: 16px;
920  margin: 4px 0;
921  padding: 0 0 0 0;
922  background-image: url('images/icons/rftIcons16.png');
923  margin: 0 0 0 0;
924  margin-right: 8px;
925}
926#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive .rftIcon {
927  width: 16px;
928  height: 16px;
929  margin: 4px 0;
930  padding: 0 0 0 0;
931  background-image: url('images/icons/rftIcons16b.png');
932}
933#rft.claro .dijitMenuBar .rftMainMenuButton {
934  border: none;
935  background-image: none;
936  -webkit-box-shadow: none;
937  box-shadow: none;
938  border-radius: 0;
939  -webkit-transition: all 0.1s;
940  -moz-transition: all 0.1s;
941  -o-transition: all 0.1s;
942  -ms-transition: all 0.1s;
943  transition: all 0.1s;
944  border: none;
945  height: 30px;
946  width: auto;
947  background: transparent;
948  color: #999999;
949  text-align: center;
950  font-size: 24px;
951  line-height: 30px;
952  padding: 0 4px;
953  margin: 0 5px;
954}
955#rft.claro .dijitMenuBar .rftMainMenuButton.dijitMenuItemHover,
956#rft.claro .dijitMenuBar .rftMainMenuButton.dijitMenuitemActive {
957  -webkit-transition: all 0.1s;
958  -moz-transition: all 0.1s;
959  -o-transition: all 0.1s;
960  -ms-transition: all 0.1s;
961  transition: all 0.1s;
962}
963#rft.claro .dijitMenuBar .rftMainMenuButton.dijitMenuItemHover {
964  color: #ffffff;
965  font-size: 26px;
966}
967#rft.claro .dijitMenuBar .rftMainMenuButton.dijitMenuItemActive {
968  color: #0072bc;
969  font-size: 26px;
970}
971#rft.claro .dijitMenuBar .rftMainMenuButton.dijitMenuItemSelected {
972  font-size: 26px;
973  color: #ffffff;
974}
975#rft.claro .dojoxTitleGroup .dijitTitlePane {
976  margin: 0 0 0 0;
977}
978#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneTitle {
979  border: none;
980  background-image: none;
981  -webkit-box-shadow: none;
982  box-shadow: none;
983  border-radius: 0;
984  margin: 0 0 0 0;
985  background-color: #ff5b12;
986  border: none;
987  padding: 0 4px;
988  height: 24px;
989}
990#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneTitle.dijitTitlePaneTitleHover,
991#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneTitle.dijitTitlePaneTitleFocused {
992  background-color: #ff9140;
993}
994#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneTextNode {
995  color: #ffffff;
996  font-size: 13px;
997  line-height: 24px;
998}
999#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneContentOuter {
1000  background-color: #444444;
1001  border: none;
1002}
1003#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneTitleFocus {
1004  margin: 0 0 0 0;
1005}
1006#rft.claro .rftSurveyListView .rftSurveyListViewContent {
1007  min-height: 300px;
1008  background: #444444;
1009  overflow: auto;
1010}
1011#rft.claro .rftLargeButton {
1012  border: none;
1013  background-image: none;
1014  -webkit-box-shadow: none;
1015  box-shadow: none;
1016  border-radius: 0;
1017  margin-right: 16px;
1018  height: 24px;
1019}
1020#rft.claro .rftLargeButton*,
1021#rft.claro .rftLargeButton * {
1022  -webkit-user-select: none;
1023  -moz-user-select: none;
1024  -ms-user-select: none;
1025  user-select: none;
1026}
1027#rft.claro .rftLargeButton .dijitButtonNode {
1028  border: none;
1029  background-image: none;
1030  -webkit-box-shadow: none;
1031  box-shadow: none;
1032  border-radius: 0;
1033  border: none;
1034  height: 24px;
1035  background: transparent;
1036  color: #999999;
1037  font-size: 20px;
1038  -webkit-transition: all 0.3s;
1039  -moz-transition: all 0.3s;
1040  -o-transition: all 0.3s;
1041  -ms-transition: all 0.3s;
1042  transition: all 0.3s;
1043}
1044#rft.claro .rftLargeButton .dijitButtonNode .rftIcon {
1045  width: 24px;
1046  height: 24px;
1047  margin: 0 0 0 0;
1048  padding: 0 0 0 0;
1049  background-image: url('images/icons/rftIcons24.png');
1050}
1051#rft.claro .rftLargeButton .dijitButtonNode .dijitButtonText {
1052  line-height: 24px;
1053  margin: 0 0 0 0;
1054  padding-left: 8px;
1055}
1056#rft.claro .rftLargeButton.black .dijitButtonNode .rftIcon {
1057  width: 24px;
1058  height: 24px;
1059  margin: 0 0 0 0;
1060  padding: 0 0 0 0;
1061  background-image: url('images/icons/rftIcons24b.png');
1062}
1063#rft.claro .rftLargeButton.rftLargeButtonHover .dijitButtonNode,
1064#rft.claro .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1065  -webkit-transition: all 0.1s;
1066  -moz-transition: all 0.1s;
1067  -o-transition: all 0.1s;
1068  -ms-transition: all 0.1s;
1069  transition: all 0.1s;
1070}
1071#rft.claro span.blue.rftLargeButton.rftLargeButtonActive .dijitButtonNode,
1072#rft.claro .blue .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1073  color: #0794d1;
1074}
1075#rft.claro span.orange.rftLargeButton.rftLargeButtonActive .dijitButtonNode,
1076#rft.claro .orange .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1077  color: #ff9140;
1078}
1079#rft.claro span.green.rftLargeButton.rftLargeButtonActive .dijitButtonNode,
1080#rft.claro .green .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1081  color: #63c400;
1082}
1083#rft.claro span.red.rftLargeButton.rftLargeButtonActive .dijitButtonNode,
1084#rft.claro .red .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1085  color: #bd0013;
1086}
1087#rft.claro span.purple.rftLargeButton.rftLargeButtonActive .dijitButtonNode,
1088#rft.claro .purple .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1089  color: #993dec;
1090}
1091#rft.claro .rftBlockButton {
1092  border: none;
1093  background-image: none;
1094  -webkit-box-shadow: none;
1095  box-shadow: none;
1096  border-radius: 0;
1097  margin: 0 0 0 0;
1098  height: 24px;
1099  vertical-align: top;
1100}
1101#rft.claro .rftBlockButton .dijitButtonContents {
1102  height: 24px;
1103}
1104#rft.claro .rftBlockButton .dijitButtonNode {
1105  border: none;
1106  background-image: none;
1107  -webkit-box-shadow: none;
1108  box-shadow: none;
1109  border-radius: 0;
1110  -webkit-transition: all 0.3s;
1111  -moz-transition: all 0.3s;
1112  -o-transition: all 0.3s;
1113  -ms-transition: all 0.3s;
1114  transition: all 0.3s;
1115  line-height: 24px;
1116  vertical-align: top;
1117  height: 24px;
1118  padding: 0 4px;
1119  border: none;
1120  color: #ffffff;
1121  font-size: 13px;
1122}
1123#rft.claro .rftBlockButton .dijitButtonNode .dijitButtonText {
1124  line-height: 24px;
1125}
1126#rft.claro .rftBlockButton .dijitButtonNode .rftIcon {
1127  width: 16px;
1128  height: 16px;
1129  margin: 4px 0;
1130  padding: 0 0 0 0;
1131  background-image: url('images/icons/rftIcons16.png');
1132}
1133#rft.claro .rftBlockButton.rftBlockButtonHover,
1134#rft.claro .rftBlockButton.rftBlockButtonActive {
1135  -webkit-transition: all 0.1s;
1136  -moz-transition: all 0.1s;
1137  -o-transition: all 0.1s;
1138  -ms-transition: all 0.1s;
1139  transition: all 0.1s;
1140}
1141#rft.claro .rftBlockButton.rftBlockButtonHover .rftIcon,
1142#rft.claro .rftBlockButton.rftBlockButtonActive .rftIcon {
1143  vertical-align: top;
1144  width: 16px;
1145  height: 16px;
1146  margin: 4px 0;
1147  padding: 0 0 0 0;
1148  background-image: url('images/icons/rftIcons16b.png');
1149}
1150#rft.claro .rftInlineButton {
1151  float: right;
1152  height: 24px;
1153  width: 24px;
1154}
1155#rft.claro .rftInlineButton .dijitButtonNode {
1156  margin: 0 0 0 0;
1157  padding: 0 0 0 0;
1158  border: none;
1159  background-image: none;
1160  -webkit-box-shadow: none;
1161  box-shadow: none;
1162  border-radius: 0;
1163  width: 24px;
1164  height: 24px;
1165  border: none;
1166}
1167#rft.claro .rftInlineButton .rftIcon {
1168  width: 16px;
1169  height: 16px;
1170  margin: 4px 0;
1171  padding: 0 0 0 0;
1172  background-image: url('images/icons/rftIcons16.png');
1173}
1174#rft.claro .rftInlineButton.white .rftIcon {
1175  width: 16px;
1176  height: 16px;
1177  margin: 4px 0;
1178  padding: 0 0 0 0;
1179  background-image: url('images/icons/rftIcons16.png');
1180}
1181#rft.claro .rftInlineButton.black .rftIcon {
1182  width: 16px;
1183  height: 16px;
1184  margin: 4px 0;
1185  padding: 0 0 0 0;
1186  background-image: url('images/icons/rftIcons16b.png');
1187}
1188#rft.claro .rftObjectBox {
1189  margin: 8px 0;
1190}
1191#rft.claro .rftObjectBox .rftLineWithActions {
1192  margin: 0 0 0 0;
1193  padding: 0 0 0 0;
1194}
1195#rft.claro .rftSessionObject {
1196  margin: 0 0 0 0;
1197  padding: 0 0 0 0;
1198  width: 100px;
1199  height: 100px;
1200  background: #999999;
1201  margin: 8px;
1202  display: inline-block;
1203}
1204#rft.claro .rftSessionObject .rftIcon {
1205  width: 32px;
1206  height: 32px;
1207  margin: 0;
1208  padding: 0 0 0 0;
1209  background-image: url('images/icons/rftIcons32.png');
1210  margin: 8px 34px 0 34px;
1211}
1212#rft.claro .rftSessionObject label {
1213  margin: 0 0 0 0;
1214  padding: 0 0 0 0;
1215  float: left;
1216  clear: both;
1217  width: 100px;
1218  text-align: center;
1219  color: #ffffff;
1220  overflow: hidden;
1221}
1222#rft.claro .rftSessionObject.blue {
1223  background-color: #0072bc;
1224}
1225#rft.claro .rftSessionObject.blue.selected {
1226  background-color: #0794d1;
1227}
1228#rft.claro .rftSessionObject.green {
1229  background-color: #25a000;
1230}
1231#rft.claro .rftSessionObject.green.selected {
1232  background-color: #63c400;
1233}
1234#rft.claro .rftSessionObject.red {
1235  background-color: #8c0310;
1236}
1237#rft.claro .rftSessionObject.red.selected {
1238  background-color: #bd0013;
1239}
1240#rft.claro .page_questions .rftSelector .rftSelectorCategory .rftLineWithActions {
1241  background-color: #ff5b12;
1242}
1243#rft.claro .page_questions .rftSelector .rftSelectorSelected .rftLineWithActions {
1244  background-color: #ffffff;
1245  color: #111111;
1246}
1247#rft.claro .page_questions .rftSelector .rftSelectorSelected .rftBlockButton {
1248  background-color: #ff00ff;
1249}
1250#rft.claro .page_questions .rftSelector .rftSelectorSelected .rftBlockButton .dijitButtonNode {
1251  background-color: #ff5b12;
1252}
1253#rft.claro .page_questions .rftSelector .rftSelectorSelected .rftBlockButton.dijitHover .dijitButtonNode {
1254  background-color: #ffffff;
1255  color: #111111;
1256}
1257#rft.claro .page_questions .rftSelector .rftSelectorSelected .rftBlockButton.dijitActive .dijitButtonNode {
1258  background-color: #ff9140;
1259  color: #ffffff;
1260}
1261#rft.claro .page_sessions .rftObjectBox {
1262  padding: 0 0 0 0;
1263  color: #ffffff;
1264}
1265#rft.claro .page_sessions .rftObjectBox .typeIcon.rftIcon {
1266  width: 32px;
1267  height: 32px;
1268  margin: 0;
1269  padding: 0 0 0 0;
1270  background-image: url('images/icons/rftIcons32.png');
1271}
1272#rft.claro .page_sessions .rftObjectBox .rftLineWithActions {
1273  background-color: #25a000;
1274}
1275#rft.claro .page_sessions .rftObjectBox .rftLineWithActions .rftBlockButton .dijitButtonNode {
1276  background-color: #25a000;
1277}
1278#rft.claro .page_sessions .rftObjectBox .rftLineWithActions .rftBlockButton.dijitHover .dijitButtonNode {
1279  background-color: #ffffff;
1280  color: #111111;
1281}
1282#rft.claro .page_sessions .rftObjectBox .rftLineWithActions .rftBlockButton.dijitActive .dijitButtonNode {
1283  background-color: #63c400;
1284  color: #ffffff;
1285}
Note: See TracBrowser for help on using the repository browser.