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

Last change on this file since 411 was 411, checked in by tjcschipper, 13 years ago
  • LESS is finally ready for use. Some small visual bugs remain.
File size: 31.5 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: #3aa605;
81}
82#rft.claro .green.textColor.doesHover:hover {
83  color: #79ca0a;
84}
85#rft.claro .green.bgColor {
86  background-color: #3aa605;
87  color: #ffffff;
88}
89#rft.claro .green.bgColor.doesHover:hover {
90  background-color: #79ca0a;
91  color: #111111;
92}
93#rft.claro .green.hoverTextColor:hover {
94  color: #3aa605;
95}
96#rft.claro .green.hoverBgColor:hover {
97  background-color: #3aa605;
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: #3aa605;
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 .rftLineWithActions {
668  border: none;
669  background-image: none;
670  -webkit-box-shadow: none;
671  box-shadow: none;
672  border-radius: 0;
673  position: relative;
674  height: 24px;
675  white-space: nowrap;
676  margin: 4px 0;
677  color: #ffffff;
678}
679#rft.claro .rftLineWithActions.dojoDndItem {
680  -webkit-transition: all 0.2s;
681  -moz-transition: all 0.2s;
682  -o-transition: all 0.2s;
683  -ms-transition: all 0.2s;
684  transition: all 0.2s;
685}
686#rft.claro .rftLineWithActions.dojoDndItem.dojoDndItemBefore {
687  margin-top: 6px;
688  border-top: 6px solid #ffffff;
689}
690#rft.claro .rftLineWithActions.dojoDndItem.dojoDndItemAfter {
691  margin-bottom: 6px;
692  border-bottom: 6px solid #ffffff;
693}
694#rft.claro .rftLineWithActions.dojoDndItem.dojoDndItemover,
695#rft.claro .rftLineWithActions.dojoDndItem.dojoDndItemAnchor {
696  background-image: none;
697  border: none;
698  padding: 2px;
699  background-color: rgba(255, 255, 255, 0.1);
700}
701#rft.claro .rftLineWithActions .rftLineWithActionsTitle {
702  float: left;
703  margin: 0 8px;
704  overflow: hidden;
705  white-space: nowrap;
706  word-wrap: break-word;
707}
708#rft.claro .rftLineWithActions .rftLineWithActionsButtons {
709  margin: 0 0 0 0;
710  padding: 0 0 0 0;
711  line-height: 24px;
712  height: 24px;
713  position: absolute;
714  right: 0;
715  float: left;
716}
717#rft.claro .dojoDndSourceMoved .rftLineWithActions.dojoDndItemAnchor {
718  height: 0;
719}
720#rft.claro .rftIndexMenuBlock {
721  width: 400px;
722  height: 400px;
723  background: #444444;
724  float: left;
725  margin: 16px;
726  overflow: hidden;
727}
728#rft.claro .rftIndexMenuBlock:hover .rftIndexMenuMask {
729  margin-top: -400px;
730}
731#rft.claro .rftIndexMenuMask {
732  width: 400px;
733  height: 400px;
734  background: #444444;
735  color: #999999;
736  margin-top: 0;
737}
738#rft.claro .rftIndexMenuMask .label {
739  color: #999999;
740  font-size: 32px;
741  height: 32px;
742  line-height: 32px;
743  margin-top: 184px;
744  float: left;
745}
746#rft.claro .rftIndexMenuMask .rftIcon {
747  width: 32px;
748  height: 32px;
749  margin: 0;
750  padding: 0 0 0 0;
751  background-image: url('images/icons/rftIcons32.png');
752  float: left;
753  margin: 184px 8px 0 8px;
754}
755#rft.claro .rftIndexMenuButton {
756  border: none;
757  background-image: none;
758  -webkit-box-shadow: none;
759  box-shadow: none;
760  border-radius: 0;
761  margin: 0 0 0 0;
762  padding: 0 0 0 0;
763  -webkit-transition: all 0.3s;
764  -moz-transition: all 0.3s;
765  -o-transition: all 0.3s;
766  -ms-transition: all 0.3s;
767  transition: all 0.3s;
768  line-height: 32px;
769  border: none;
770}
771#rft.claro .rftIndexMenuButton .dijitButtonNode {
772  border: none;
773  color: #999999;
774  font-size: 22px;
775}
776#rft.claro .rftIndexMenuButton .dijitButtonNode .dijitButtonContents {
777  vertical-align: top;
778}
779#rft.claro .rftIndexMenuButton .dijitButtonNode .dijitButtonContents .dijitButtonText {
780  padding-bottom: 10px;
781  line-height: 20px;
782}
783#rft.claro .rftIndexMenuButton .dijitButtonNode .dijitButtonContents .rftIcon {
784  width: 32px;
785  height: 32px;
786  margin: 0;
787  padding: 0 0 0 0;
788  background-image: url('images/icons/rftIcons32.png');
789  margin: 0 8px;
790}
791#rft.claro .rftIndexMenuButton.oneHeight {
792  height: 100px;
793  width: 400px;
794}
795#rft.claro .rftIndexMenuButton.oneHeight .dijitButtonNode {
796  margin: 38px 0 0 0;
797}
798#rft.claro .rftIndexMenuButton.twoHeight {
799  height: 200px;
800  width: 400px;
801}
802#rft.claro .rftIndexMenuButton.twoHeight .dijitButtonNode {
803  margin: 88px 0 0 0;
804}
805#rft.claro .rftIndexMenuButton.fourHeight {
806  height: 400px;
807  width: 400px;
808}
809#rft.claro .rftIndexMenuButton.fourHeight .dijitButtonNode {
810  margin: 188px 0 0 0;
811}
812#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover {
813  color: #ffffff;
814  -webkit-transition: all 0.1s;
815  -moz-transition: all 0.1s;
816  -o-transition: all 0.1s;
817  -ms-transition: all 0.1s;
818  transition: all 0.1s;
819}
820#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover .dijitButtonText {
821  color: #ffffff;
822  -webkit-transition: all 0.1s;
823  -moz-transition: all 0.1s;
824  -o-transition: all 0.1s;
825  -ms-transition: all 0.1s;
826  transition: all 0.1s;
827}
828#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover.blue {
829  background-color: #0072bc;
830}
831#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover.red {
832  background-color: #8c0310;
833}
834#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover.green {
835  background-color: #3aa605;
836}
837#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover.orange {
838  background-color: #ff5b12;
839}
840#rft.claro .rftIndexMenuButton.rftIndexMenuButtonHover.purple {
841  background-color: #6529b7;
842}
843#rft.claro .rftIndexMenuButton.rftIndexMenuButtonActive {
844  -webkit-transition: all 0.3s;
845  -moz-transition: all 0.3s;
846  -o-transition: all 0.3s;
847  -ms-transition: all 0.3s;
848  transition: all 0.3s;
849  color: #111111;
850  background: #ffffff;
851}
852#rft.claro .rftIndexMenuButton.rftIndexMenuButtonActive .rftIcon {
853  width: 32px;
854  height: 32px;
855  margin: 0;
856  padding: 0 0 0 0;
857  background-image: url('images/icons/rftIcons32b.png');
858}
859#rft.claro .dijitMenuPopup .dijitMenu {
860  border: none;
861  background-image: none;
862  -webkit-box-shadow: none;
863  box-shadow: none;
864  border-radius: 0;
865  color: #999999;
866  background-color: #333333;
867  border: none;
868}
869#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem {
870  color: #999999;
871  border: none;
872  background-image: none;
873  -webkit-box-shadow: none;
874  box-shadow: none;
875  border-radius: 0;
876  background-color: #333333;
877}
878#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover .dijitMenuItemLabel,
879#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive .dijitMenuItemLabel,
880#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected .dijitMenuItemLabel {
881  color: #ffffff;
882}
883#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover.red,
884#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive.red,
885#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected.red {
886  background-color: #8c0310;
887}
888#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover.blue,
889#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive.blue,
890#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected.blue {
891  background-color: #0072bc;
892}
893#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover.green,
894#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive.green,
895#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected.green {
896  background-color: #3aa605;
897}
898#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover.orange,
899#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive.orange,
900#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected.orange {
901  background-color: #ff5b12;
902}
903#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover.purple,
904#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive.purple,
905#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemSelected.purple {
906  background-color: #6529b7;
907}
908#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem .rftIcon {
909  width: 16px;
910  height: 16px;
911  margin: 4px 0;
912  padding: 0 0 0 0;
913  background-image: url('images/icons/rftIcons16.png');
914  margin: 0 0 0 0;
915  margin-right: 8px;
916}
917#rft.claro .dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemActive .rftIcon {
918  width: 16px;
919  height: 16px;
920  margin: 4px 0;
921  padding: 0 0 0 0;
922  background-image: url('images/icons/rftIcons16b.png');
923}
924#rft.claro .dijitMenuBar .rftMainMenuButton {
925  border: none;
926  background-image: none;
927  -webkit-box-shadow: none;
928  box-shadow: none;
929  border-radius: 0;
930  -webkit-transition: all 0.1s;
931  -moz-transition: all 0.1s;
932  -o-transition: all 0.1s;
933  -ms-transition: all 0.1s;
934  transition: all 0.1s;
935  border: none;
936  height: 30px;
937  width: auto;
938  background: transparent;
939  color: #999999;
940  text-align: center;
941  font-size: 24px;
942  line-height: 30px;
943  padding: 0 4px;
944  margin: 0 5px;
945}
946#rft.claro .dijitMenuBar .rftMainMenuButton.dijitMenuItemHover,
947#rft.claro .dijitMenuBar .rftMainMenuButton.dijitMenuitemActive {
948  -webkit-transition: all 0.1s;
949  -moz-transition: all 0.1s;
950  -o-transition: all 0.1s;
951  -ms-transition: all 0.1s;
952  transition: all 0.1s;
953}
954#rft.claro .dijitMenuBar .rftMainMenuButton.dijitMenuItemHover {
955  color: #ffffff;
956  font-size: 26px;
957}
958#rft.claro .dijitMenuBar .rftMainMenuButton.dijitMenuItemActive {
959  color: #0072bc;
960  font-size: 26px;
961}
962#rft.claro .dijitMenuBar .rftMainMenuButton.dijitMenuItemSelected {
963  font-size: 26px;
964  color: #ffffff;
965}
966#rft.claro .dojoxTitleGroup .dijitTitlePane {
967  margin: 0 0 0 0;
968}
969#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneTitle {
970  border: none;
971  background-image: none;
972  -webkit-box-shadow: none;
973  box-shadow: none;
974  border-radius: 0;
975  margin: 0 0 0 0;
976  background-color: #ff5b12;
977  border: none;
978  padding: 0 4px;
979  height: 24px;
980}
981#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneTitle.dijitTitlePaneTitleHover,
982#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneTitle.dijitTitlePaneTitleFocused {
983  background-color: #ff9140;
984}
985#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneTextNode {
986  color: #ffffff;
987  font-size: 13px;
988  line-height: 24px;
989}
990#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneContentOuter {
991  background-color: #444444;
992  border: none;
993}
994#rft.claro .dojoxTitleGroup .dijitTitlePane .dijitTitlePaneTitleFocus {
995  margin: 0 0 0 0;
996}
997#rft.claro .rftSurveyListView .rftSurveyListViewContent {
998  min-height: 300px;
999  background: #444444;
1000  overflow: auto;
1001}
1002#rft.claro .rftLargeButton {
1003  border: none;
1004  background-image: none;
1005  -webkit-box-shadow: none;
1006  box-shadow: none;
1007  border-radius: 0;
1008  margin-right: 16px;
1009  height: 24px;
1010}
1011#rft.claro .rftLargeButton*,
1012#rft.claro .rftLargeButton * {
1013  -webkit-user-select: none;
1014  -moz-user-select: none;
1015  -ms-user-select: none;
1016  user-select: none;
1017}
1018#rft.claro .rftLargeButton .dijitButtonNode {
1019  border: none;
1020  background-image: none;
1021  -webkit-box-shadow: none;
1022  box-shadow: none;
1023  border-radius: 0;
1024  border: none;
1025  height: 24px;
1026  background: transparent;
1027  color: #999999;
1028  font-size: 20px;
1029  -webkit-transition: all 0.3s;
1030  -moz-transition: all 0.3s;
1031  -o-transition: all 0.3s;
1032  -ms-transition: all 0.3s;
1033  transition: all 0.3s;
1034}
1035#rft.claro .rftLargeButton .dijitButtonNode .rftIcon {
1036  width: 24px;
1037  height: 24px;
1038  margin: 0 0 0 0;
1039  padding: 0 0 0 0;
1040  background-image: url('images/icons/rftIcons24.png');
1041}
1042#rft.claro .rftLargeButton .dijitButtonNode .dijitButtonText {
1043  line-height: 24px;
1044  margin: 0 0 0 0;
1045  padding-left: 8px;
1046}
1047#rft.claro .rftLargeButton.black .dijitButtonNode .rftIcon {
1048  width: 24px;
1049  height: 24px;
1050  margin: 0 0 0 0;
1051  padding: 0 0 0 0;
1052  background-image: url('images/icons/rftIcons24b.png');
1053}
1054#rft.claro .rftLargeButton.rftLargeButtonHover .dijitButtonNode,
1055#rft.claro .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1056  -webkit-transition: all 0.1s;
1057  -moz-transition: all 0.1s;
1058  -o-transition: all 0.1s;
1059  -ms-transition: all 0.1s;
1060  transition: all 0.1s;
1061}
1062#rft.claro span.blue.rftLargeButton.rftLargeButtonActive .dijitButtonNode,
1063#rft.claro .blue .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1064  color: #0794d1;
1065}
1066#rft.claro span.orange.rftLargeButton.rftLargeButtonActive .dijitButtonNode,
1067#rft.claro .orange .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1068  color: #ff9140;
1069}
1070#rft.claro span.green.rftLargeButton.rftLargeButtonActive .dijitButtonNode,
1071#rft.claro .green .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1072  color: #79ca0a;
1073}
1074#rft.claro span.red.rftLargeButton.rftLargeButtonActive .dijitButtonNode,
1075#rft.claro .red .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1076  color: #bd0013;
1077}
1078#rft.claro span.purple.rftLargeButton.rftLargeButtonActive .dijitButtonNode,
1079#rft.claro .purple .rftLargeButton.rftLargeButtonActive .dijitButtonNode {
1080  color: #993dec;
1081}
1082#rft.claro .rftBlockButton {
1083  border: none;
1084  background-image: none;
1085  -webkit-box-shadow: none;
1086  box-shadow: none;
1087  border-radius: 0;
1088  margin: 0 0 0 0;
1089  height: 24px;
1090  line-height: 24px;
1091  vertical-align: top;
1092}
1093#rft.claro .rftBlockButton .dijitButtonNode {
1094  border: none;
1095  background-image: none;
1096  -webkit-box-shadow: none;
1097  box-shadow: none;
1098  border-radius: 0;
1099  -webkit-transition: all 0.3s;
1100  -moz-transition: all 0.3s;
1101  -o-transition: all 0.3s;
1102  -ms-transition: all 0.3s;
1103  transition: all 0.3s;
1104  line-height: 24px;
1105  vertical-align: top;
1106  height: 24px;
1107  padding: 0 4px;
1108  border: none;
1109  color: #ffffff;
1110  font-size: 13px;
1111}
1112#rft.claro .rftBlockButton .dijitButtonNode .rftIcon {
1113  width: 16px;
1114  height: 16px;
1115  margin: 4px 0;
1116  padding: 0 0 0 0;
1117  background-image: url('images/icons/rftIcons16.png');
1118}
1119#rft.claro .rftBlockButton.rftBlockButtonHover,
1120#rft.claro .rftBlockButton.rftBlockButtonActive {
1121  -webkit-transition: all 0.1s;
1122  -moz-transition: all 0.1s;
1123  -o-transition: all 0.1s;
1124  -ms-transition: all 0.1s;
1125  transition: all 0.1s;
1126}
1127#rft.claro .rftBlockButton.rftBlockButtonHover .rftIcon,
1128#rft.claro .rftBlockButton.rftBlockButtonActive .rftIcon {
1129  vertical-align: top;
1130  width: 16px;
1131  height: 16px;
1132  margin: 4px 0;
1133  padding: 0 0 0 0;
1134  background-image: url('images/icons/rftIcons16b.png');
1135}
1136#rft.claro .rftInlineButton {
1137  float: right;
1138  height: 24px;
1139  width: 24px;
1140}
1141#rft.claro .rftInlineButton .dijitButtonNode {
1142  margin: 0 0 0 0;
1143  padding: 0 0 0 0;
1144  border: none;
1145  background-image: none;
1146  -webkit-box-shadow: none;
1147  box-shadow: none;
1148  border-radius: 0;
1149  width: 24px;
1150  height: 24px;
1151  border: none;
1152}
1153#rft.claro .rftInlineButton .rftIcon {
1154  width: 16px;
1155  height: 16px;
1156  margin: 4px 0;
1157  padding: 0 0 0 0;
1158  background-image: url('images/icons/rftIcons16.png');
1159}
1160#rft.claro .rftInlineButton.white .rftIcon {
1161  width: 16px;
1162  height: 16px;
1163  margin: 4px 0;
1164  padding: 0 0 0 0;
1165  background-image: url('images/icons/rftIcons16.png');
1166}
1167#rft.claro .rftInlineButton.black .rftIcon {
1168  width: 16px;
1169  height: 16px;
1170  margin: 4px 0;
1171  padding: 0 0 0 0;
1172  background-image: url('images/icons/rftIcons16b.png');
1173}
1174#rft.claro .rftInlineButton.rftInlineButtonHover.white {
1175  width: 16px;
1176  height: 16px;
1177  margin: 4px 0;
1178  padding: 0 0 0 0;
1179  background-image: url('images/icons/rftIcons16b.png');
1180}
1181#rft.claro .rftInlineButton.rftInlineButtonHover.black {
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 .rftIcon {
1192  width: 32px;
1193  height: 32px;
1194  margin: 0;
1195  padding: 0 0 0 0;
1196  background-image: url('images/icons/rftIcons32.png');
1197  float: left;
1198  margin: 20px 8px;
1199}
1200#rft.claro .rftObjectBox .rftLineWithActions {
1201  margin: 0 0 0 0;
1202  padding: 0 0 0 0;
1203}
1204#rft.claro .rftSessionObject {
1205  margin: 0 0 0 0;
1206  padding: 0 0 0 0;
1207  width: 100px;
1208  height: 100px;
1209  background: #999999;
1210  margin: 8px;
1211  display: inline-block;
1212}
1213#rft.claro .rftSessionObject .rftIcon {
1214  width: 32px;
1215  height: 32px;
1216  margin: 0;
1217  padding: 0 0 0 0;
1218  background-image: url('images/icons/rftIcons32.png');
1219  margin: 8px 34px 0 34px;
1220}
1221#rft.claro .rftSessionObject label {
1222  margin: 0 0 0 0;
1223  padding: 0 0 0 0;
1224  float: left;
1225  clear: both;
1226  width: 100px;
1227  text-align: center;
1228  color: #ffffff;
1229  overflow: hidden;
1230}
1231#rft.claro .rftSessionObject.blue {
1232  background-color: #0072bc;
1233}
1234#rft.claro .rftSessionObject.blue.selected {
1235  background-color: #0794d1;
1236}
1237#rft.claro .rftSessionObject.green {
1238  background-color: #3aa605;
1239}
1240#rft.claro .rftSessionObject.green.selected {
1241  background-color: #79ca0a;
1242}
1243#rft.claro .rftSessionObject.red {
1244  background-color: #8c0310;
1245}
1246#rft.claro .rftSessionObject.red.selected {
1247  background-color: #bd0013;
1248}
1249#rft.claro .rftObjectBox {
1250  padding: 0 0 0 0;
1251  color: #ffffff;
1252}
1253#rft.claro .rftObjectBox .typeIcon.rftIcon {
1254  width: 32px;
1255  height: 32px;
1256  margin: 0;
1257  padding: 0 0 0 0;
1258  background-image: url('images/icons/rftIcons32.png');
1259}
1260#rft.claro .rftObjectBox .rftLineWithActions {
1261  background-color: #3aa605;
1262}
1263#rft.claro .page_questions .rftSelector .rftSelectorCategory .rftLineWithActions {
1264  background-color: #ff5b12;
1265}
1266#rft.claro .page_questions .rftSelector .rftSelectorSelected .rftLineWithActions {
1267  background-color: #ffffff;
1268  color: #111111;
1269}
1270#rft.claro .page_questions .rftSelector .rftSelectorSelected .rftBlockButton {
1271  background-color: #ff00ff;
1272}
1273#rft.claro .page_questions .rftSelector .rftSelectorSelected .rftBlockButton .dijitButtonNode {
1274  background-color: #ff5b12;
1275}
1276#rft.claro .page_questions .rftSelector .rftSelectorSelected .rftBlockButton.dijitHover .dijitButtonNode {
1277  background-color: #ffffff;
1278}
1279#rft.claro .page_questions .rftSelector .rftSelectorSelected .rftBlockButton.dijitActive .dijitButtonNode {
1280  background-color: #ff9140;
1281}
Note: See TracBrowser for help on using the repository browser.