source: Dev/trunk/client/qed/css/qed.css @ 432

Last change on this file since 432 was 432, checked in by hendrikvanantwerpen, 12 years ago

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