source: Dev/trunk/client/qed/css/main.css @ 425

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

Always use the LESS stylesheets.

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