pyc-website
main website for pyc inc.
git clone https://9o.is/git/pyc-website.git
main.less
(106091B)
1 html {
2 margin: 0;
3 padding: 0;
4 height: 100%;
5 overflow-x: hidden !important;
6 background:url('@{base-url}/@{html-background-image}') @html-background-color;
7 }
8
9 body {
10 margin: 0;
11 padding: 0;
12 height: 100%;
13 overflow:hidden;
14 background:url('@{base-url}/@{body-background-image}') @body-background-color;
15 direction:ltr;
16 }
17
18 a:hover, a:active, a:focus, button, button:active, button:focus, object, embed, input::-moz-focus-inner {
19 outline: 0;
20 }
21
22 h1,h2,h3,h4 {
23 margin:0;
24 font-family:"Open Sans", Arial, Helvetica, Sans-Serif;
25 font-weight:300;
26 }
27
28 .page-title {
29 margin: 12px 0 28px;
30 span {
31 font-size: @font-size-base+3;
32 color: @gray-dark;
33 display: inline-block;
34 vertical-align: 1px;
35 }
36 }
37
38 label {
39 font-weight:normal;
40 }
41
42 *:focus {
43 outline: 0 !important;
44 }
45
46 textarea:focus,
47 select:focus,
48 input[type="text"]:focus,
49 input[type="password"]:focus,
50 input[type="datetime"]:focus,
51 input[type="datetime-local"]:focus,
52 input[type="date"]:focus,
53 input[type="month"]:focus,
54 input[type="time"]:focus,
55 input[type="week"]:focus,
56 input[type="number"]:focus,
57 input[type="email"]:focus,
58 input[type="url"]:focus,
59 input[type="search"]:focus,
60 input[type="tel"]:focus,
61 input[type="color"]:focus,
62 .uneditable-input:focus {
63 outline: 0;
64 outline: thin dotted \9;
65 /* IE6-9 */
66
67 -webkit-box-shadow: none !important;
68 -moz-box-shadow: none !important;
69 box-shadow: none !important;
70
71 }
72
73 .input-sm,
74 .input-lg,
75 .input-xs,
76 .form-control {
77 border-radius:0px !important;
78 -webkit-border-radius: 0px !important;
79 -moz-border-radius: 0px !important;
80 }
81
82 .input-xs {
83 height: 24px;
84 padding: 2px 10px;
85 font-size: 11px;
86 line-height: 1.5;
87 }
88
89 .btn-xs {
90 padding: 1px 5px;
91 }
92
93 .btn-sm {
94 padding: 6px 10px 5px;
95 }
96
97 .btn-lg {
98 padding: 10px 16px;
99 }
100
101 .no-space {
102 margin:0;
103 }
104
105 .no-space > [class*="col-"] {
106 margin: 0 !important;
107 padding-right: 0;
108 padding-left: 0;
109 }
110
111 #content {
112 padding:10px 14px;
113 position:relative;
114 left:0px;
115 }
116
117 body.container {
118 position: relative;
119 padding: 0;
120 border-left:1px solid @gray-mid-light;
121 border-right:1px solid @gray-mid-light;
122 box-shadow: 0 2px 70px rgba(red(@black), green(@black), blue(@black), 0.45);
123 }
124
125 .no-content-padding {
126 margin: -10px -14px 0 -14px; /*used with content >:first-child */
127 }
128
129 .no-padding {
130 padding:0px !important;
131 & > pre {
132 margin:30px;
133 }
134
135 & > table {
136 border:none !important;
137 margin-bottom:0px !important;
138 border-bottom-width:0px !important;
139
140 tr td:last-child, tr th:last-child {
141 border-right:none !important;
142 }
143
144 tr td:first-child, tr th:first-child {
145 border-left:none !important;
146 }
147 }
148
149 .dataTables_wrapper table {
150 border:none !important;
151 margin-bottom:0px !important;
152 border-bottom-width:0px !important;
153
154 tr td:last-child, tr th:last-child {
155 border-right:none !important;
156 }
157 tr td:first-child, tr th:first-child {
158 border-left:none !important;
159 }
160 }
161 }
162
163 .no-padding-bottom {
164 padding-bottom:0px !important;
165 }
166 .padding-5 {
167 padding:5px !important;
168 }
169 .padding-7 {
170 padding:7px !important;
171 }
172 .padding-10 {
173 padding:10px !important;
174 }
175 .padding-top-10 {
176 padding-top:10px !important;
177 }
178
179 .no-padding .dataTables_wrapper table tbody tr:last-child td {
180 border-bottom:0;
181 }
182
183 /*
184 * Headers
185 */
186
187 h1 {
188 letter-spacing:-1px;
189 font-size:@font-size-h1;
190 margin:10px 0;
191 }h1 small {
192 font-size:@font-size-h4;
193 font-weight:300;
194 letter-spacing:-1px;
195 }.lead {
196 font-size:@font-size-h4 + 1px;
197 }
198
199 h2 {
200 letter-spacing:-1px;
201 font-size: @font-size-h2;
202 margin:20px 0;
203 line-height:normal;
204 }
205
206 h3 {
207 display: block;
208 font-size: @font-size-h3;
209 font-weight: 400;
210 margin: 20px 0;
211 line-height:normal;
212 }
213
214 h4 {
215 line-height:normal;
216 }
217
218 h5 {
219 font-size: @font-size-h5;
220 font-weight: 300;
221 margin: 10px 0;
222 line-height:normal;
223 }
224
225 h6 {
226 font-size: @font-size-h6;
227 margin: 10px 0;
228 font-weight:bold;
229 line-height:normal;
230 }
231
232 .row-seperator-header {
233 margin:15px 14px 20px;
234 border-bottom:none;
235 display:block;
236 color: darken( @gray-light, 20.9%);
237 font-size:20px;
238 font-weight:400;
239 }
240
241 /*
242 * Forced text alignments
243 */
244
245 .text-align-center, .text-center {
246 text-align:center !important
247 }
248 .text-align-left, .text-left {
249 text-align:left !important
250 }
251 .text-align-right, .text-right {
252 text-align:right !important
253 }
254
255 /*
256 * Font Weights
257 */
258
259 .semi-bold {
260 font-weight:400 !important;
261 }
262
263 .ultra-light {
264 font-weight:300 !important;
265 }
266
267 /*
268 * Font Sizes
269 */
270
271
272 .font-xs {
273 font-size:85% !important;
274 }
275
276 .font-sm {
277 font-size:95% !important;
278 }
279
280 .font-md {
281 font-size:130% !important;
282 }
283
284 .font-lg {
285 font-size:160% !important;
286 }
287
288 .font-xl {
289 font-size:200% !important;
290 }
291
292 .font-400 {
293 font-size:400% !important;
294 }
295
296 /*
297 * Center Canvas
298 */
299 .center-canvas, .center-child-canvas > canvas {
300 display:block !important;
301 margin:0 auto !important;
302 }
303
304 /*
305 * Margins
306 */
307
308 .no-margin {
309 margin:0px !important;
310 }
311
312 .margin-top-5 {
313 margin-top:5px !important;
314 }
315
316 .margin-top-10 {
317 margin-top:10px !important;
318 }
319
320 .margin-bottom-5 {
321 margin-bottom:5px !important;
322 }
323
324 .margin-bottom-10 {
325 margin-bottom:10px !important;
326 }
327
328 .margin-right-5 {
329 margin-right:5px !important;
330 }
331
332
333 /*
334 * No border
335 */
336
337 .no-border, .well[class*=" bg-"].no-border {
338 border-width:0px !important;
339 }
340
341 .no-border-transparent {
342 border-color:transparent !important;
343 }
344
345 .no-border-radius {
346 border-radius:0px;
347 -moz-border-radius: 0px;
348 -webkit-border-radius: 0px;
349 }
350
351 /*
352 * Inlines
353 */
354 .display-inline {
355 display:inline-block !important;
356 }
357
358 .display-normal {
359 display:inline !important;
360 }
361
362
363 /*
364 * Images
365 */
366
367 .hover-transparent {
368 opacity:.5;
369 }.hover-transparent:hover {
370 opacity:1;
371 }
372
373 /*
374 * JUST A BORDER
375 */
376 .bordered {
377 border:1px solid rgba(red(@black), green(@black), blue(@black),.2);
378 }.bordered:hover {
379 border:1px solid rgba(red(@black), green(@black), blue(@black),.4);
380 }
381
382 /*
383 * CURSORS
384 */
385 .cursor-pointer {
386 cursor:pointer;
387 }
388
389 /*
390 * ***************************************************
391 * MAIN LAYOUT START
392 * ***************************************************
393 */
394
395 aside {
396 display: block;
397 overflow: hidden;
398 min-height:100%;
399 background: @asideColor-end;
400 background: url(@asideDataURL);
401 background: -moz-linear-gradient(left, @asideColor-end 93%, @asideColor-start 100%);
402 background: -webkit-gradient(linear, left top, right top, color-stop(93%, @asideColor-end), color-stop(100%, @asideColor-start));
403 background: -webkit-linear-gradient(left, @asideColor-end 93%, @asideColor-start 100%);
404 background: -o-linear-gradient(left, @asideColor-end 93%, @asideColor-start 100%);
405 background: -ms-linear-gradient(left, @asideColor-end 93%, @asideColor-start 100%);
406 background: linear-gradient(to right, @asideColor-end 93%, @asideColor-start 100%);
407 min-height: 100%;
408 }
409
410 /*
411 * HEADER GROUP
412 */
413
414
415 #header {
416 display: block;
417 height: @smart-navbar-height;
418 position: relative;
419 margin: 0;
420 padding: 0 13px 0 0;
421 background-color: @smart-navbar-color-start;
422 background-image: -moz-linear-gradient(top, @smart-navbar-color-start, @smart-navbar-color-end);
423 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@smart-navbar-color-start), to(@smart-navbar-color-end));
424 background-image: -webkit-linear-gradient(top, @smart-navbar-color-start, @smart-navbar-color-end);
425 background-image: -o-linear-gradient(top, @smart-navbar-color-start, @smart-navbar-color-end);
426 background-image: linear-gradient(to bottom, @smart-navbar-color-start, @smart-navbar-color-end);
427 background-repeat: repeat-x;
428 }
429
430 #header > div {
431 display: inline-block;
432 vertical-align: middle;
433 height: @smart-navbar-height;
434 float:left;
435 }
436
437 #header > div.open {
438 font-weight:bold;
439 }
440
441 .fixed-header #header {
442 position:fixed;
443 width:100%;
444 z-index: 1001;
445 }
446
447 .container.fixed-header #header {
448 max-width: 1164px;
449 }
450
451 .fixed-header #header .ajax-dropdown {
452 z-index: 1000;
453 }
454
455 .fixed-header #shortcut {
456 position:fixed;
457 }
458
459 .fixed-header #main {
460 margin-top:@smart-navbar-height;
461 }
462
463 #logo-group > span {
464 display: inline-block;
465 height: @smart-navbar-height - 10;
466 float: left;
467 }
468
469 #logo-group span#activity {
470 -moz-border-radius: 2px;
471 -webkit-border-radius: 2px;
472 border-radius: 2px;
473 cursor: default !important;
474 display: inline-block;
475 font-weight: bold;
476 height: 24px;
477 width: 24px;
478 padding: 2px;
479 text-align: center;
480 text-decoration: none !important;
481 -moz-user-select: none;
482 -webkit-user-select: none;
483 background-color: lighten(@gray-lightest, 1.9%);
484 background-image: -webkit-gradient(linear,left top,left bottom,from(lighten(@gray-lightest, 1.9%)),to(darken(@gray-lightest, 1%)));
485 background-image: -webkit-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
486 background-image: -moz-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
487 background-image: -ms-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
488 background-image: -o-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
489 background-image: linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
490
491
492 border: 1px solid @gray-mid-light;
493 color: @dropdownbtn-icon-color;
494 font-size: 19px;
495 margin: 10px 0 0 0;
496 position:relative;
497 }
498
499 #logo-group span#activity:hover {
500 border: 1px solid @gray-mid-light;
501 transition: all 0.0s;
502 cursor: pointer !important;
503 -webkit-box-shadow: inset 0px 0px 4px 1px rgba(red(@black), green(@black), blue(@black), 0.08);
504 box-shadow: inset 0px 0px 4px 1px rgba(red(@black), green(@black), blue(@black), 0.08);
505 }
506
507 #logo {
508 display: inline-block;
509 width: @asideWidth - 45px;
510 margin-top: 13px;
511 margin-left: 9px;
512 }
513
514 #logo img {
515 width:110px;
516 height:auto;
517 padding-left:3px;
518 }
519
520 #logo-group > span .badge {
521 position: absolute;
522 top: -5px;
523 right: -5px;
524 cursor: pointer;
525 background:@blueSky;
526 display: inline-block;
527 font-size: 10px;
528 box-shadow: inset 1px 1px 0 rgba(red(@black), green(@black), blue(@black), 0.1), inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black), 0.07);
529 color: @white;
530 font-weight: bold;
531 border-radius: 50%;
532 -moz-border-radius: 50%;
533 -webkit-border-radius: 50%;
534 padding: 2px 4px 3px 4px;
535 text-align: center;
536 line-height: normal;
537 }
538 #activity.active .badge {
539 background: darken(@blueSky, 10%) !important;
540 }
541
542 #project-context {
543 display: inline-block;
544 padding: 7px 13px 0;
545 position:relative;
546 }
547
548 #project-context > span {
549 display: block;
550 }
551
552 #project-context > :first-child {
553 display: block;
554 color: @gray-mid-light;
555 font-size: 10px;
556 font-weight: bold;
557 text-transform: uppercase;
558 text-shadow: 0 0 1px white;
559 padding-left:0px;
560 text-align:left;
561 }
562
563 #project-selector {
564 max-width: 97%;
565 white-space: nowrap;
566 background: none;
567 border: none;
568 padding: 0;
569 text-align: left;
570 color: @gray;
571 font-size: 14px;
572 cursor: pointer;
573 }
574
575 #project-selector:hover {
576 color: @gray-dark;
577 }
578
579 .header-search {
580 position:relative;
581 }.header-search.pull-right {
582 margin-left:6px;
583 }
584
585 .header-search > input[type="text"] {
586 display: block;
587 box-sizing: border-box;
588 -moz-box-sizing: border-box;
589 min-width:200px;
590 width: 100%;
591 height: 30px;
592 padding: 0 10px;
593 outline: none;
594 border-width: 1px;
595 border-style: solid;
596 border-radius: 0;
597 border-color:@gray-mid-light;
598 background: @white;
599 color: #404040;
600 appearance: normal;
601 -moz-appearance: none;
602 -webkit-appearance: none;
603 margin-top:10px;
604 line-height:normal;
605 }
606
607 .header-search > button {
608 background: none;
609 border: none;
610 color: #6D6A69;
611 font-size: 17px;
612 height: 30px;
613 line-height: 30px;
614 margin: 0;
615 padding: 0;
616 position: absolute;
617 right: 0px;
618 top: 10px;
619 width: 30px;
620 z-index: 2;
621 }
622
623 #search-mobile {
624 display:none;
625 }
626
627 #cancel-search-js {
628 position: absolute;
629 display: none;
630 background: @brand-danger;
631 z-index: 3;
632 color: @white;
633 padding: 0;
634 right: 10px;
635 top: 10px;
636 text-align: center;
637 height: 29px;
638 line-height: 29px;
639 width: 30px;
640 font-size: 17px;
641 text-decoration:none !important;
642 }
643
644 #header > :first-child, aside {
645 width: @asideWidth;
646 }
647
648
649 /*
650 * LEFT PANEL
651 */
652
653 #left-panel {
654 position: absolute;
655 top: @smart-navbar-height;
656 left: 0px;
657 z-index: @left-panel-zindex;
658 }
659
660 #main {
661 display: block;
662 margin-left: @asideWidth;
663 padding: 0;
664 min-height:500px;
665 }
666
667 /*
668 * RIBBON
669 */
670
671 #ribbon {
672 min-height: @ribbon-height;
673 background: @ribbonBGColor;
674 padding: 0 13px;
675 position:relative;
676 }
677
678 #ribbon .breadcrumb {
679 display: inline-block;
680 margin: 0;
681 padding: 11px 34px 11px 0 !important;
682 background:none;
683 vertical-align:top;
684 }
685
686 #ribbon .breadcrumb a, #ribbon .breadcrumb {
687 color: #BBB !important;
688 text-decoration:none !Important;
689 }
690
691 #ribbon .breadcrumb > .active, #ribbon .breadcrumb li:last-child {
692 color: #E4E4E4;
693 }
694
695 .fixed-ribbon #ribbon {
696 position: fixed;
697 right: 0;
698 left: @asideWidth;
699 top: @smart-navbar-height;
700 z-index: @fixed-ribbon-zindex;
701 }
702
703 .container.fixed-ribbon #ribbon {
704 width: 944px;
705 left: 590px;
706 }
707
708 .fixed-ribbon #content {
709 padding-top: @smart-navbar-height + 1;
710 }
711
712 .minified.fixed-ribbon #ribbon {
713 left: 45px;
714 }
715
716 .hidden-menu.fixed-ribbon #ribbon {
717 left:10px;
718 }
719
720 /*
721 * NAV
722 * Menu CSS is learnt from: http://experiments.wemakesites.net/css3-treeview.html
723 */
724
725 .fixed-navigation #left-panel {
726 position:fixed;
727 z-index: @fixed-navigation-zindex;
728 }
729
730 /* All levels */
731 nav ul li a:active {
732 background:@asideNavActiveBGColor !important;
733 }
734
735 /* All levels */
736 nav ul {
737 width: 100%;
738 padding: 40px 28px 25px 0;
739 padding: 0;
740 margin: 0;
741 font-size: 13px;
742 line-height: 0.5em;
743 list-style: none;
744 position: relative;
745 }
746
747 /* All levels */
748 nav ul .active > a {
749 color: #fff !important;
750 position: relative;
751 }
752
753 /* All levels */
754 nav ul li.active > a:before {
755 content: "\f0d9";
756 font-family: FontAwesome;
757 display: block;
758 height: 27px;
759 line-height: normal;
760 width: 27px;
761 position: absolute;
762 right: -21px;
763 font-size: 20px;
764 color:@gray-lighter;
765 }
766
767 nav ul li.active.open > a:before {
768 content: "";
769 }
770
771
772 /* All levels */
773 nav ul li {
774 overflow: hidden;
775 }
776
777 /* All levels */
778 nav ul li a {
779 line-height: normal;
780 font-size: @asideNavFontSize;
781 padding: 10px 10px 10px 11px;
782 color: @asideLinkColor;
783 display: block;
784 font-weight: normal;
785 text-decoration: none !important;
786 }
787
788 /* Second level */
789 nav > ul > li > ul > li > a {
790 padding-top: 7px;
791 padding-bottom: 7px;
792 }
793
794 /* Third Level */
795 nav > ul > li > ul > li > ul > li > a {
796 padding-top: 7px;
797 padding-bottom: 7px;
798 }
799
800 /* All levels */
801 nav ul li a:focus {
802 color: @asideLinkColorFocus;
803 }
804
805 /* All levels */
806 nav ul li a:hover {
807 color: @asideLinkColorHover;
808 text-decoration: none;
809 }
810
811 /* All levels */
812 nav ul b {
813 float: right;
814 font-size: @asideNavFontSize;
815 margin-top: -1px;
816 }
817
818 /* All levels */
819 nav ul span.menu-item-parent {
820 display: inline-block;
821 margin: 0;
822 padding: 0;
823 }
824
825 /* First level: A, Second level: LI Open */
826 nav ul li.open > a, nav ul li.open > a b {
827 color: #fff !important;
828 }
829
830 /* First level: Icon */
831 nav > ul > li > a > i {
832 /*font-size: 121%; fa-lg overrides this so.. */
833 margin-right: 5px;
834 width: 15px;
835 display: inline-block;
836 text-align: center;
837 position:relative;
838 }
839 /* First level icon */
840 nav > ul > li > a > i > em {
841 font-size: 9px;
842 display: block;
843 padding: 2px;
844 position: absolute;
845 top: -8px;
846 right: -6px;
847 text-decoration: none;
848 font-style: normal;
849 background: #ED1C24;
850 color: @white;
851 min-width: 13px;
852 border-radius: 50%;
853 max-height:13px;
854 line-height: 8px;
855 font-weight: bold;
856 vertical-align: baseline;
857 white-space: nowrap;
858 text-align: center;
859 border: 1px solid rgba(red(@white), green(@white), blue(@white), 0.1);
860 }
861
862
863 /* Second level switched to relative */
864 nav ul li li {
865 border-bottom: none;
866 position: relative;
867 }
868
869
870 /* Second level: UL */
871 nav > ul > li > ul::before {
872 content: "";
873 display: block;
874 position: absolute;
875 z-index: 1;
876 left: 23px;
877 top: 0;
878 bottom: 0;
879 border-left: 1px solid #7A7A7A;
880 }
881
882 /* Second level: UL LI */
883 nav > ul ul li::before {
884 content: "";
885 display: block;
886 position: absolute;
887 width: 8px;
888 left: 23px;
889 top: 16px;
890 border-top: 1px solid #7A7A7A;
891 z-index: 1;
892 }
893
894 /* Third level: UL LI */
895 nav > ul ul ul li::before {
896 content: "";
897 display: block;
898 position: absolute;
899 width: 18px;
900 left: 10px;
901 top: 17px;
902 border-top: 1px solid transparent;
903 }
904
905 /* Second level and onwards > */
906 nav > ul ul li a i {
907 font-size: @asideNavFontSize !important;
908 width: 18px !important;
909 text-align: center !important;
910 }
911
912 /* Second and Third level line color */
913 nav > ul > li:hover > ul::before, nav > ul > li:hover > ul > li::before{
914 border-color: #ACACAC !important;
915 }
916
917
918 /* Second Level: UL */
919 nav ul ul {
920 margin: 0;
921 padding: 0;
922 display: none;
923 background: rgba(69, 69, 69,.6);
924 }
925
926 nav ul ul {
927 padding: 7px 0;
928 }
929
930 /* Third Level: UL */
931 nav ul ul ul {
932 background: transparent;
933 padding: 0;
934 }
935
936 /* Third Level: LI */
937 nav ul ul li {
938 margin: 0;
939 padding: 0;
940 }
941
942 /* Second Level: A */
943 nav ul ul li > a {
944 padding-left: 42px;
945 font-size: @asideNavFontSizeSecondLevel;
946 font-weight: normal;
947 outline: 0;
948 }
949
950 /* Second Level: A:hover */
951 nav ul ul li > a:hover {
952 background-color: rgba(69, 69, 69,.8);
953 color: @white;
954 }
955
956 /* Third Level: A */
957 nav ul ul ul li a {
958 color: @gray-mid-light;
959 padding: 8px 10px 8px 70px;
960 font-size: @asideNavFontSizeThirdLevel;
961 }
962
963 /* Third Level: A:hover */
964 nav ul ul ul li a:hover {
965 background-color: #4C4F53;
966 color: @white;
967 }
968
969 /* Fourth Level: A */
970 nav ul ul ul ul li a {
971 padding-left: 90px;
972 }
973
974 /* Fifth Level: A */
975 nav ul ul ul ul ul li a {
976 padding-left: 110px;
977 }
978
979 /* Sixth Level: A */
980 nav ul ul ul ul ul ul li a {
981 padding-left: 130px;
982 }
983
984 /* Second level: B */
985 nav ul ul b {
986 color: #B3B3B3;
987 }
988
989 /* Second level: LI:hover B */
990 nav ul ul > li:hover b {
991 color: #D5D9E2;
992 }
993
994 /*
995 * HEADER NAV DROPDOWN LIST
996 */
997
998 .header-dropdown-list {
999 list-style:none;
1000 float:right;
1001 position:relative;
1002 margin:0;
1003 & > li {
1004 display: inline-block;
1005 padding-right: 5px;
1006 & > .dropdown-toggle {
1007 margin-top:16px;
1008 display:block;
1009 }
1010 }
1011 }
1012
1013
1014
1015 /*
1016 * ***************************************************
1017 * MAIN LAYOUT END
1018 * ***************************************************
1019 */
1020
1021
1022
1023 /*
1024 * ACCORDIONS
1025 */
1026
1027 .smart-accordion-default.panel-group .panel+.panel {
1028 margin-top:-1px;
1029 }
1030
1031 .smart-accordion-default.panel-group .panel-heading {
1032 padding:0px;
1033 }
1034
1035 .smart-accordion-default.panel-group .panel-title a {
1036 display: block;
1037 padding: 10px 15px;
1038 text-decoration: none !important;
1039 }
1040
1041 .smart-accordion-default .panel-heading, .panel-group .panel {
1042 border-radius: 0px;
1043 -webkit-border-radius: 0px;
1044 -moz-border-radius: 0px;
1045 }
1046
1047 .smart-accordion-default .panel-default>.panel-heading {
1048 background-color: lighten( @gray-lightest, 3.5%);
1049 }
1050
1051 .smart-accordion-default .panel-default {
1052 border-color:lighten( @gray-light, 16.5%);
1053 }
1054
1055 .smart-accordion-default .panel-title > a >:first-child{
1056 display:none;
1057 }
1058
1059 .smart-accordion-default .panel-title > a.collapsed > .fa{
1060 display:none;
1061 }
1062
1063 .smart-accordion-default .panel-title > a.collapsed >:first-child{
1064 display:inline-block;
1065 }
1066
1067 .no-padding .smart-accordion-default > div {
1068 border-left:none !important;
1069 border-right:none !important;
1070 }
1071
1072 .no-padding .smart-accordion-default > div:first-child {
1073 border-top:none !important;
1074 }
1075
1076 .no-padding .smart-accordion-default > div:last-child {
1077 border-bottom:none !important;
1078 }
1079
1080 /*
1081 * ON OFF SWITCHES
1082 */
1083
1084 /* http://proto.io/freebies/onoff/ */
1085
1086 .onoffswitch-container {
1087 margin-top:4px;
1088 margin-left:7px;
1089 display:inline-block;
1090 }
1091
1092 .onoffswitch {
1093 position: relative;
1094 width: 50px;
1095 -webkit-user-select:none;
1096 -moz-user-select:none;
1097 -ms-user-select: none;
1098 margin-top:3px;
1099 margin-bottom:3px;
1100 margin-left:5px;
1101 display:inline-block;
1102 vertical-align:middle;
1103
1104 }
1105 .onoffswitch-checkbox {
1106 display: none;
1107 }
1108 .onoffswitch-label {
1109 display: block;
1110 overflow: hidden;
1111 cursor: pointer;
1112 border: 1px solid lighten(@gray, 5%);
1113 border-radius: 50px;
1114 border-color: lighten(@gray-light, 8%) lighten(@gray-light, 10%) lighten(@gray-light, 2%);
1115 -webkit-box-sizing: content-box;
1116 -moz-box-sizing: content-box;
1117 box-sizing: content-box;
1118 }
1119 .onoffswitch-inner {
1120 width: 200%;
1121 margin-left: -100%;
1122 display:block;
1123
1124 }
1125 .onoffswitch-inner:before, .onoffswitch-inner:after {
1126 float: left;
1127 width: 50%;
1128 height: 15px;
1129 padding: 0;
1130 line-height: 15px;
1131 font-size: 10px;
1132 color: @white;
1133 font-family: Trebuchet, Arial, sans-serif;
1134 font-weight: bold;
1135 -moz-box-sizing: border-box;
1136 -webkit-box-sizing: border-box;
1137 box-sizing: border-box;
1138
1139 }
1140 .onoffswitch-inner:before {
1141 content: attr(data-swchon-text);
1142 text-shadow: 0 -1px 0 @gray-dark;
1143 padding-left: 7px;
1144 background-color: @onOffSwitchBG;
1145 color: @white;
1146 box-shadow: inset 0 2px 6px rgba(red(@black), green(@black), blue(@black), 0.5), 0 1px 2px rgba(red(@black), green(@black), blue(@black), 0.05);
1147 text-align:left;
1148
1149 }
1150 .onoffswitch-inner:after {
1151 content: attr(data-swchoff-text);
1152 padding-right: 7px;
1153 text-shadow: 0 -1px 0 @white;
1154 background-color: @white;
1155 color: @gray;
1156 text-align: right;
1157 box-shadow:inset 0 2px 4px rgba(red(@black), green(@black), blue(@black),.15), 0 1px 2px rgba(red(@black), green(@black), blue(@black),.05);
1158 }
1159 .onoffswitch-switch {
1160 width: 19px;
1161 height:19px;
1162 margin: -2px;
1163 background: white;
1164 border: 1px solid lighten(@gray-light, .5%);
1165 border-radius: 50px;
1166 position: absolute;
1167 top: 0;
1168 bottom: 0;
1169 right: 32px;
1170 -webkit-box-sizing: content-box;
1171 -moz-box-sizing: content-box;
1172 box-sizing: content-box;
1173 background-color: @gray-lightest;
1174 background-image: -moz-linear-gradient(top, white, @gray-lighter);
1175 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(white), to(@gray-lighter));
1176 background-image: -webkit-linear-gradient(top, white, @gray-lighter);
1177 background-image: -o-linear-gradient(top, white, @gray-lighter);
1178 background-image: linear-gradient(to bottom, white, @gray-lighter);
1179 background-repeat: repeat-x;
1180 -webkit-box-shadow: 1px 1px 4px 0px rgba(red(@black), green(@black), blue(@black), .3);
1181 box-shadow: 1px 1px 4px 0px rgba(red(@black), green(@black), blue(@black), .3);
1182 }
1183
1184 .onoffswitch-checkbox + .onoffswitch-label .onoffswitch-switch:before, .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch:before {
1185 content: "\f00d";
1186 color:@brand-danger;
1187 display:block;
1188 text-align:center;
1189 line-height:19px;
1190 font-size: 10px;
1191 text-shadow: 0 -1px 0 @white;
1192 font-weight:bold;
1193
1194 font-family:FontAwesome;
1195 }
1196
1197 /* checked */
1198 .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch:before {
1199 content: "\f00c";
1200 color: @blue;
1201 }
1202
1203 .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
1204 margin-left: 0;
1205 display:block;
1206 }
1207 .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
1208 right: 0px;
1209 }
1210
1211 .onoffswitch-switch:hover {
1212 background-color: @gray-lighter;
1213 }
1214 .onoffswitch-switch:active {
1215 background-color: @gray-lighter;
1216 box-shadow:inset 0 2px 4px rgba(red(@black), green(@black), blue(@black),.15), 0 1px 2px rgba(red(@black), green(@black), blue(@black),.05);
1217 }
1218
1219 /*
1220 * Disabled state
1221 */
1222 .onoffswitch-checkbox:disabled + .onoffswitch-label .onoffswitch-inner:after, .onoffswitch-checkbox:checked:disabled + .onoffswitch-label .onoffswitch-inner:before {
1223 text-shadow: 0 1px 0 @white;
1224 background: @gray-mid-light;
1225 color: @gray-dark;
1226 }
1227
1228 .onoffswitch-checkbox:checked:disabled + .onoffswitch-label .onoffswitch-switch, .onoffswitch-checkbox:disabled + .onoffswitch-label .onoffswitch-switch {
1229 background-color: @gray-lightest;
1230 background-image: -moz-linear-gradient(top, @gray-mid-light, @gray-lightest);
1231 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@gray-mid-light), to(@gray-lightest));
1232 background-image: -webkit-linear-gradient(top, @gray-mid-light, @gray-lightest);
1233 background-image: -o-linear-gradient(top, @gray-mid-light, @gray-lightest);
1234 background-image: linear-gradient(to bottom, @gray-mid-light, @gray-lightest);
1235 box-shadow: none !important;
1236 }
1237
1238 .onoffswitch-checkbox:disabled + .onoffswitch-label,
1239 .onoffswitch-checkbox:checked:disabled + .onoffswitch-label .onoffswitch-label {
1240 border-color: lighten(@gray-light, 7%) @gray-light darken(@gray-light, 7%) !important;
1241 }
1242
1243 .onoffswitch-checkbox:checked + .onoffswitch-label{
1244 border-color: @onOffSwitchBG darken(@onOffSwitchBG, 7%) darken(@onOffSwitchBG, 12%);
1245 }
1246
1247
1248 .onoffswitch + span, .onoffswitch-title {
1249 display: inline-block;
1250 vertical-align: middle;
1251 margin-top: -5px;
1252 }
1253
1254
1255 /*
1256 * FORMS
1257 */
1258
1259 .form-control {
1260 box-shadow:none !important;
1261 -webkit-box-shadow: none !important;
1262 -moz-box-shadow: none !important;
1263 }
1264
1265 .form hr {
1266 margin-left:-13px;
1267 margin-right:-13px;
1268 border-color:rgba(red(@black), green(@black), blue(@black), 0.1);
1269 margin-top: 20px;
1270 margin-bottom: 20px;
1271 }
1272
1273 .form fieldset {
1274 display: block;
1275 border: none;
1276 background: rgba(red(@white), green(@white), blue(@white), 0.9);
1277 position: relative;
1278 }
1279
1280 fieldset {
1281 position:relative;
1282 }
1283
1284 .form-actions {
1285 display: block;
1286 padding: 13px 14px 15px;
1287 border-top: 1px solid rgba(red(@black), green(@black), blue(@black), 0.1);
1288 background: rgba(red(lighten(@gray-lightest, 2%)), green(lighten(@gray-lightest, 2%)), blue(lighten(@gray-lightest, 2%)), 0.9);
1289 margin-top:25px;
1290 margin-left: -13px;
1291 margin-right: -13px;
1292 margin-bottom: -13px;
1293 text-align:right;
1294
1295 }.well .form-actions {
1296 margin-left: -19px;
1297 margin-right: -19px;
1298 margin-bottom: -19px;
1299 }.well.well-lg .form-actions {
1300 margin-left: -24px;
1301 margin-right: -24px;
1302 margin-bottom: -24px;
1303 }.well.well-sm .form-actions {
1304 margin-left: -9px;
1305 margin-right: -9px;
1306 margin-bottom: -9px;
1307 }
1308
1309 .popover-content .form-actions {
1310 margin:0 -14px -9px;
1311 border-radius:0 0 3px 3px;
1312 padding:9px 14px
1313 }
1314
1315 .no-padding .form .form-actions {
1316 margin:0;
1317 display: block;
1318 padding: 13px 14px 15px;
1319 border-top: 1px solid rgba(red(@black), green(@black), blue(@black), 0.1);
1320 background: rgba(248, 248, 248, 0.9);
1321 text-align:right;
1322 margin-top:25px;
1323 }
1324
1325 .form header, legend {
1326 display: block;
1327 padding: 8px 0;
1328 border-bottom: 1px dashed rgba(red(@black), green(@black), blue(@black), 0.2);
1329 background: @white;
1330 font-size: 16px;
1331 font-weight: 300;
1332 color: @gray-darker;
1333 margin: 25px 0px 20px;
1334 } .no-padding .form header {
1335 margin: 25px 14px 0;
1336 }.form header:first-child {
1337 margin-top:10px;
1338 } legend {
1339 font-weight:400;
1340 margin-top:0px;
1341 background:none;
1342 }
1343
1344 .input-group-addon {
1345 padding: 6px 10px;
1346 border-radius: 0;
1347 -moz-border-radius: 0;
1348 -webkit-border-radius: 0;
1349 }
1350
1351 .input-group-addon {
1352 transition: border-color 0.3s;
1353 -o-transition: border-color 0.3s;
1354 -ms-transition: border-color 0.3s;
1355 -moz-transition: border-color 0.3s;
1356 -webkit-transition: border-color 0.3s;
1357
1358 transition: background-color 0.3s;
1359 -o-transition: background-color 0.3s;
1360 -ms-transition: background-color 0.3s;
1361 -moz-transition: background-color 0.3s;
1362 -webkit-transition: background-color 0.3s;
1363 }
1364
1365 .input-group-addon .fa {
1366 font-size:14px;
1367 }
1368
1369 .input-group-addon .fa-lg, .input-group-addon .fa-2x {
1370 font-size: 2em;
1371 }
1372
1373 .input-group-addon .fa-3x, .input-group-addon .fa-4x, .input-group-addon .fa-5x {
1374 font-size: 30px;
1375 }
1376
1377 input[type="text"]:focus + .input-group-addon {
1378 border-color: @blueSky;
1379 background-color: lighten(@state-info-text, 23%);
1380 color:@white;
1381 }
1382
1383 .has-warning input[type="text"]:focus + .input-group-addon {
1384 border-color: darken(@state-warning-bg, 50%);
1385 background-color: darken(@state-warning-bg, 30%);
1386 color:@white;
1387 }
1388
1389 .has-error input[type="text"]:focus + .input-group-addon {
1390 border-color: @state-danger-bg;
1391 background-color: @state-danger-bg;
1392 color:@white;
1393 }
1394
1395 .has-success input[type="text"]:focus + .input-group-addon {
1396 border-color:darken(@state-success-bg, 50%);
1397 background-color:darken(@state-success-bg, 40%);
1398 color:@white;
1399 }
1400
1401 .form fieldset .form-group:last-child, .form fieldset .form-group:last-child .note,
1402 .form .form-group:last-child, .form .form-group:last-child .note {
1403 margin-bottom:0;
1404 }
1405
1406 .note {
1407 margin-top: 6px;
1408 padding: 0 1px;
1409 font-size: 11px;
1410 line-height: 15px;
1411 color: @gray-light;
1412 }
1413
1414 /*
1415 * WITH ICON
1416 */
1417 .input-icon-right {
1418 position:relative;
1419 }
1420 .input-icon-right > i, .input-icon-left > i {
1421 position:absolute;
1422 right:10px;
1423 top:30%;
1424 font-size:16px;
1425 color:@gray-mid-light;
1426 }
1427
1428 .input-icon-left > i {
1429 right:auto;
1430 left:24px;
1431 }
1432
1433 .input-icon-right .form-control {
1434 padding-right:27px;
1435 }
1436
1437 .input-icon-left .form-control {
1438 padding-left:29px;
1439 }
1440
1441 input[type="text"].ui-autocomplete-loading,
1442 input[type="password"].ui-autocomplete-loading,
1443 input[type="datetime"].ui-autocomplete-loading,
1444 input[type="datetime-local"].ui-autocomplete-loading,
1445 input[type="date"].ui-autocomplete-loading,
1446 input[type="month"].ui-autocomplete-loading,
1447 input[type="time"].ui-autocomplete-loading,
1448 input[type="week"].ui-autocomplete-loading,
1449 input[type="number"].ui-autocomplete-loading,
1450 input[type="email"].ui-autocomplete-loading,
1451 input[type="url"].ui-autocomplete-loading,
1452 input[type="search"].ui-autocomplete-loading,
1453 input[type="tel"].ui-autocomplete-loading,
1454 input[type="color"].ui-autocomplete-loading {
1455 background-image: url("@{base-url}/select2-spinner.gif") !important;
1456 background-repeat: no-repeat;
1457 background-position: 99% 50%;
1458 padding-right:27px
1459 }
1460
1461 .input-group-addon .checkbox, .input-group-addon .radio {
1462 min-height: 0px;
1463 margin-right:0px !important;
1464 padding-top:0;
1465 }
1466
1467 .input-group-addon label input[type="checkbox"].checkbox + span,
1468 .input-group-addon label input[type="radio"].radiobox + span,
1469 .input-group-addon label input[type="radio"].radiobox + span:before,
1470 .input-group-addon label input[type="checkbox"].checkbox + span:before {
1471 margin-right:0px;
1472 }
1473
1474 .input-group-addon .onoffswitch , .input-group-addon .onoffswitch-label{
1475 margin:0;
1476 }
1477
1478 /*
1479 * HR
1480 */
1481
1482 hr.simple {
1483 margin-top:10px;
1484 margin-bottom:10px;
1485 border-style:dashed;
1486 }
1487
1488 /*
1489 * Timeline Seperator
1490 */
1491
1492 .timeline-seperator {
1493 display:block;
1494 text-align:center;
1495 color:@gray-light;
1496 margin:20px 0 0;
1497 & > :first-child {
1498 padding:4px 5px;
1499 border:1px dashed rgba(red(@black), green(@black), blue(@black), 0.1);
1500 background:@white;
1501 font-size:11px;
1502 border-radius:4px;
1503 }
1504 }.timeline-seperator .btn, .timeline-seperator .btn + .dropdown-menu {
1505 margin-right:15px;
1506 }
1507
1508 .timeline-seperator:after {
1509 display:block;
1510 content:" ";
1511 margin:0 20px;
1512 border-bottom:1px dashed rgba(red(@black), green(@black), blue(@black), 0.1);
1513 margin-top:-8px;
1514 }
1515
1516 /*
1517 * Alerts
1518 */
1519 .alert {
1520 margin-bottom: 20px;
1521 margin-top: 0px;
1522 padding: 5px 15px 5px 34px;
1523 color:#675100;
1524 border-width:0px;
1525 border-left-width:5px;
1526 padding:10px;
1527 border-radius:0px;
1528 -webkit-border-radius: 0px;
1529 -moz-border-radius: 0px;
1530 .close {
1531 top: 0px;
1532 right: -5px;
1533 line-height: 20px;
1534 }
1535 }
1536
1537 .alert-heading {
1538 font-weight:600;
1539 }
1540
1541 .alert-danger {
1542 border-color: @state-danger-border;
1543 color: @state-danger-text;
1544 background: @state-danger-bg;
1545 text-shadow:none;
1546 }
1547
1548 .alert-warning {
1549 border-color: @state-warning-border;
1550 color: @state-warning-text;
1551 background: @state-warning-bg;
1552 }
1553
1554 .alert-success {
1555 border-color: @state-success-border;
1556 color: @state-success-text;
1557 background: @state-success-bg;
1558 }
1559
1560 .alert-info {
1561 border-color: @state-info-border;
1562 color: @state-info-text;
1563 background: @state-info-bg;
1564 }
1565
1566 /*
1567 * WELLS
1568 */
1569
1570 .well {
1571 background: darken(@white, 1.5%);
1572 border: 1px solid darken(@gray-lighter, 7%);
1573 box-shadow: 0 1px 1px darken(@gray-lighter, 1%);
1574 -webkit-box-shadow: 0 1px 1px darken(@gray-lighter, 1%);
1575 -moz-box-shadow: 0 1px 1px darken(@gray-lighter, 1%);
1576 position:relative;
1577 }
1578
1579 .well.well-clean {
1580 -webkit-box-shadow:none;
1581 -moz-box-shadow:none;
1582 box-shadow:none;
1583 border-color:transparent;
1584 }
1585
1586 .well.well-glass {
1587 -webkit-box-shadow:none;
1588 -moz-box-shadow:none;
1589 box-shadow:none;
1590 border-color:transparent;
1591 background-color:rgba(red(@white), green(@white), blue(@white),.25);
1592 color:@white;
1593 }
1594
1595 .well.well-light {
1596 background: @white;
1597 border: 1px solid darken(@gray-lighter, 5%);
1598 }
1599
1600 .widget-body {
1601 .well {
1602 margin-bottom:0px;
1603 }
1604 }
1605
1606 .well.transparent {
1607 border:none !important;
1608 background:none !important;
1609 }
1610
1611 .jarviswidget.well.transparent > div, .jarviswidget.well.transparent > div .widget-body {
1612 padding:0px !important;
1613 }
1614
1615 /* any wells with custom bg the border will be darkened */
1616 .well[class^="bg-"], .well[class*=" bg-"]{
1617 border: 1px solid @gray !important;
1618 }
1619
1620 /*
1621 * PROGRESS BARS
1622 */
1623
1624 .progress-micro {
1625 height: @progressbar-micro !important;
1626 line-height:@progressbar-micro !important;
1627 }
1628
1629 .progress-xs {
1630 height: @progressbar-xs !important;
1631 line-height:@progressbar-xs !important;
1632 }
1633
1634 .progress-sm {
1635 height: @progressbar-sm !important;
1636 line-height:@progressbar-sm !important;
1637 }
1638
1639 .progress-lg {
1640 height: @progressbar-lg !important;
1641 line-height:@progressbar-lg !important;
1642 }
1643
1644 .progress .progress-bar {
1645 position: absolute;
1646 overflow: hidden;
1647 line-height: 20px;
1648 }
1649
1650 .progress .progressbar-back-text {
1651 position: absolute;
1652 width: 100%;
1653 height: 100%;
1654 font-size: 12px;
1655 line-height: 20px;
1656 text-align: center;
1657 }
1658
1659 .progress .progressbar-front-text {
1660 display: block;
1661 width: 100%;
1662 font-size: 12px;
1663 line-height: 20px;
1664 text-align: center;
1665 }
1666
1667 .progress.right .progress-bar {
1668 right: 0;
1669 }
1670
1671 .progress.right .progressbar-front-text {
1672 position: absolute;
1673 right: 0;
1674 }
1675
1676 .progress.vertical {
1677 width: 25px;
1678 height: 100%;
1679 min-height:150px;
1680 margin-right: 20px;
1681 display:inline-block;
1682 margin-bottom:0px;
1683 }
1684
1685 .progress.wide-bar {
1686 width: 40px;
1687 }
1688
1689 .progress.vertical.bottom {
1690 position: relative;
1691 }
1692
1693 .progress.vertical.bottom .progressbar-front-text {
1694 position: absolute;
1695 bottom: 0;
1696 }
1697
1698 .progress.vertical .progress-bar {
1699 width: 100%;
1700 height: 0;
1701 -webkit-transition: height 0.6s ease;
1702 transition: height 0.6s ease;
1703 }
1704
1705 .progress.vertical.bottom .progress-bar {
1706 position: absolute;
1707 bottom: 0;
1708 }
1709
1710 @-webkit-keyframes progress-bar-stripes {
1711 from {
1712 background-position: 40px 0;
1713 }
1714 to {
1715 background-position: 0 0;
1716 }
1717 }
1718
1719 @-moz-keyframes progress-bar-stripes {
1720 from {
1721 background-position: 40px 0;
1722 }
1723 to {
1724 background-position: 0 0;
1725 }
1726 }
1727
1728 @-o-keyframes progress-bar-stripes {
1729 from {
1730 background-position: 0 0;
1731 }
1732 to {
1733 background-position: 40px 0;
1734 }
1735 }
1736
1737 @keyframes progress-bar-stripes {
1738 from {
1739 background-position: 40px 0;
1740 }
1741 to {
1742 background-position: 0 0;
1743 }
1744 }
1745
1746
1747 .progress {
1748 position: relative;
1749 margin-bottom: 20px;
1750 overflow: hidden;
1751 height: 22px;
1752 background: @gray-lighter;
1753 box-shadow: 0 1px 0 transparent, 0 0 0 1px lighten( @gray-light, 29%) inset;
1754 -webkit-box-shadow: 0 1px 0 transparent, 0 0 0 1px lighten( @gray-light, 29%) inset;
1755 -moz-box-shadow: 0 1px 0 transparent, 0 0 0 1px lighten( @gray-light, 29%) inset;
1756
1757 border-radius:@progressbar-radius;
1758 -moz-border-radius:@progressbar-radius;
1759 -webkit-border-radius:@progressbar-radius;
1760
1761 }
1762
1763
1764 .progress-bar {
1765 float: left;
1766 width: 0;
1767 height: 100%;
1768 font-size: 11px;
1769 color: @white;
1770 text-align: center;
1771 background-color: @blue;
1772 -webkit-box-shadow: inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black), 0.15);
1773 box-shadow: inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black), 0.15);
1774 font-weight:bold;
1775 text-shadow: 0 -1px 0 rgba(red(@black), green(@black), blue(@black), 0.25);
1776 background-image:url('@{base-url}/pattern/overlay-pattern.png');
1777 }
1778
1779 .progress-striped .progress-bar {
1780 background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, transparent), to(transparent));
1781 background-image: -webkit-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1782 background-image: -moz-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1783 background-image: linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1784 background-size: 40px 40px;
1785 }
1786
1787 .progress.active .progress-bar {
1788 -webkit-animation: progress-bar-stripes 2s linear infinite;
1789 -moz-animation: progress-bar-stripes 2s linear infinite;
1790 -ms-animation: progress-bar-stripes 2s linear infinite;
1791 -o-animation: progress-bar-stripes 2s linear infinite;
1792 animation: progress-bar-stripes 2s linear infinite;
1793 }
1794
1795 .progress-bar-danger {
1796 background-color: @brand-danger;
1797 }
1798
1799 .progress-striped .progress-bar-danger {
1800 background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, transparent), to(transparent));
1801 background-image: -webkit-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1802 background-image: -moz-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1803 background-image: linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1804 }
1805
1806 .progress-bar-success {
1807 background-color: @brand-success;
1808 }
1809
1810 .progress-striped .progress-bar-success {
1811 background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, transparent), to(transparent));
1812 background-image: -webkit-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1813 background-image: -moz-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1814 background-image: linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1815 }
1816
1817 .progress-bar-warning {
1818 background-color: @brand-warning;
1819 }
1820
1821 .progress-striped .progress-bar-warning {
1822 background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, transparent), to(transparent));
1823 background-image: -webkit-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1824 background-image: -moz-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1825 background-image: linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1826 }
1827
1828 .progress-bar-info {
1829 background-color: @brand-info;
1830 }
1831
1832 .progress-striped .progress-bar-info {
1833 background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, transparent), to(transparent));
1834 background-image: -webkit-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1835 background-image: -moz-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1836 background-image: linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
1837 }
1838
1839
1840 .progress-info .bar, .progress .bar-info {
1841 background: @brand-info;
1842 }
1843
1844
1845 .vertical-bars {
1846 padding:0;
1847 margin:0;
1848 }
1849
1850 .vertical-bars:after {
1851 content: "";
1852 display: block;
1853 height: 0;
1854 clear: both;
1855 }
1856 .vertical-bars li {
1857 padding: 14px 0;
1858 width: 25%;
1859 display: block;
1860 float: left;
1861 text-align: center;
1862 }
1863 .vertical-bars li:first-child {
1864 border-left: none;
1865 }
1866 .vertical-bars > li > .progress.vertical:first-child {
1867 margin-left: auto;
1868 }
1869 .vertical-bars > li > .progress.vertical {
1870 margin: 0 auto;
1871 float: none;
1872 }
1873
1874
1875 /*
1876 * BAR HOLDER
1877 */
1878 .bar-holder:first-child {
1879 border-top: none;
1880 }
1881 .bar-holder {
1882 padding: 18px 15px;
1883 }
1884
1885 .bar-holder .progress {
1886 margin:0;
1887 }
1888
1889 /*
1890 * TABS
1891 */
1892 .nav-tabs>li > a .badge {
1893 font-size: 11px;
1894 padding: 3px 5px 3px 5px;
1895 opacity: .5;
1896 margin-left: 5px;
1897 min-width: 17px;
1898 font-weight: normal;
1899 }
1900
1901 .nav-tabs>li > a > .fa {
1902 opacity: .5;
1903 }
1904
1905 .tabs-left .nav-tabs>li > a .badge {
1906 margin-right:5px;
1907 margin-left:0px;
1908 }
1909
1910
1911 .nav-tabs>li > a .label {
1912 display:inline-block;
1913 font-size:11px;
1914 margin-left:5px;
1915 opacity: .5;
1916 }
1917
1918 .nav-tabs>li.active > a .badge, .nav-tabs>li.active > a .label, .nav-tabs>li.active > a > .fa{
1919
1920 opacity: 1;
1921 }
1922
1923 .nav-tabs>li>a {
1924 border-radius:0px;
1925 color:@gray-dark;
1926 }
1927
1928 .nav-tabs > li.active > a {
1929 -webkit-box-shadow: 0 -2px 0 @blue;
1930 -moz-box-shadow: 0 -2px 0 @blue;
1931 box-shadow: 0 -2px 0 @blue;
1932 border-top-width: 0px !important;
1933 margin-top: 1px !important;
1934 font-weight:bold;
1935 }
1936
1937 .tabs-left .nav-tabs > li.active > a {
1938 -webkit-box-shadow: -2px 0 0 @blue;
1939 -moz-box-shadow: -2px 0 0 @blue;
1940 box-shadow: -2px 0 0 @blue;
1941 border-top-width: 1px !important;
1942 border-left: none !important;
1943 margin-left: 1px !important;
1944 }
1945
1946 .tabs-left .nav-pills > li.active > a {
1947 border:none !important;
1948 box-shadow:none !important;
1949 -webkit-box-shadow: none !important;
1950 -moz-box-shadow: none !important;
1951 }
1952
1953 .tabs-right .nav-tabs > li.active > a {
1954 -webkit-box-shadow: 2px 0 0 @blue;
1955 -moz-box-shadow: 2px 0 0 @blue;
1956 box-shadow: 2px 0 0 @blue;
1957 border-top-width: 1px !important;
1958 border-right: none !important;
1959 margin-right: 1px !important;
1960 }
1961
1962 .tabs-below .nav-tabs > li.active > a {
1963 -webkit-box-shadow: 0 2px 0 @blue;
1964 -moz-box-shadow: 0 2px 0 @blue;
1965 box-shadow: 0 2px 0 @blue;
1966 border-bottom-width: 0px !important;
1967 border-top: none !important;
1968 margin-top: 0px !important;
1969 }
1970
1971
1972
1973 .tabs-below > .nav-tabs, .tabs-right > .nav-tabs, .tabs-left > .nav-tabs {
1974 border-bottom: 0;
1975 }
1976
1977 .tab-content > .tab-pane, .pill-content > .pill-pane {
1978 display: none;
1979 }
1980
1981 .tab-content > .active, .pill-content > .active {
1982 display: block;
1983 }
1984
1985 .tabs-below > .nav-tabs {
1986 border-top: 1px solid darken(@gray-lighter, 7%);
1987 }
1988
1989 .tabs-below > .nav-tabs > li {
1990 margin-top: -1px;
1991 margin-bottom: 0;
1992 }
1993
1994 .tabs-left > .nav-tabs > li, .tabs-right > .nav-tabs > li,
1995 .tabs-left > .nav-pills > li, .tabs-right > .nav-pills > li {
1996 float: none;
1997 }
1998
1999 .tabs-left > .nav-tabs > li > a, .tabs-right > .nav-tabs > li > a,
2000 .tabs-left > .nav-pills > li > a, .tabs-right > .nav-pills > li > a {
2001 min-width: 74px;
2002 margin-right: 0;
2003 margin-bottom: 3px;
2004 }
2005
2006 .tabs-left > .nav-tabs, .tabs-left > .nav-pills {
2007 float: left;
2008 margin-right: 19px;
2009 border-right: 1px solid darken(@gray-lighter, 7%);
2010 } .tabs-left > .nav-pills {
2011 border-right:none;
2012 }
2013
2014 .tabs-left > .nav-tabs > li > a {
2015 margin-right: -1px;
2016 }
2017
2018 .tabs-left > .nav-tabs > li > a:hover, .tabs-left > .nav-tabs > li > a:focus {
2019 border-color: @gray-lighter darken(@gray-lighter, 10%) @gray-lighter @gray-lighter;
2020 }
2021
2022 .tabs-left > .nav-tabs .active > a, .tabs-left > .nav-tabs .active > a:hover, .tabs-left > .nav-tabs .active > a:focus {
2023 border-color: darken(@gray-lighter, 10%) transparent darken(@gray-lighter, 10%) darken(@gray-lighter, 7%);
2024 *border-right-color: @white;
2025 }
2026
2027 .tabs-left > .tab-content {
2028 margin-left: 109px;
2029 }
2030
2031 .tabs-right > .nav-tabs {
2032 float: right;
2033 margin-left: 19px;
2034 border-left: 1px solid darken(@gray-lighter, 7%); /* DDD */
2035 }
2036
2037 .tabs-right > .nav-tabs > li > a {
2038 margin-left: -1px;
2039 }
2040
2041 .tabs-right > .nav-tabs > li > a:hover, .tabs-right > .nav-tabs > li > a:focus {
2042 border-color: @gray-lighter @gray-lighter @gray-lighter darken(@gray-lighter, 7%);
2043 }
2044
2045 .tabs-right > .nav-tabs .active > a, .tabs-right > .nav-tabs .active > a:hover, .tabs-right > .nav-tabs .active > a:focus {
2046 border-color: darken(@gray-lighter, 7%) darken(@gray-lighter, 7%) darken(@gray-lighter, 7%) transparent;
2047 *border-left-color: @white;
2048 }
2049
2050 .tabs-below > .nav-tabs, .tabs-right > .nav-tabs, .tabs-left > .nav-tabs {
2051 border-bottom: 0;
2052 }
2053
2054 .tab-content > .tab-pane, .pill-content > .pill-pane {
2055 display: none;
2056 }
2057
2058 .tab-content > .active, .pill-content > .active {
2059 display: block;
2060 }
2061
2062 .tabs-below > .nav-tabs {
2063 border-top: 1px solid darken(@gray-lighter, 7%);
2064 }
2065
2066 .tabs-below > .nav-tabs > li {
2067 margin-top: -1px;
2068 margin-bottom: 0;
2069 }
2070
2071 .tabs-below > .nav-tabs > li > a:hover, .tabs-below > .nav-tabs > li > a:focus {
2072 border-top-color: darken(@gray-lighter, 7%);
2073 border-bottom-color: transparent;
2074 }
2075
2076 .tabs-below > .nav-tabs > .active > a, .tabs-below > .nav-tabs > .active > a:hover, .tabs-below > .nav-tabs > .active > a:focus {
2077 border-color: transparent darken(@gray-lighter, 7%) darken(@gray-lighter, 7%) darken(@gray-lighter, 7%); /* tabs */
2078 }
2079
2080 /* bordered tabs */
2081 .nav-tabs.bordered {
2082 background:@white;
2083 border:1px solid darken(@gray-lighter, 7%);
2084 }
2085
2086 .nav-tabs.bordered >:first-child a{
2087 border-left-width:0px !important;
2088 }
2089
2090 .nav-tabs.bordered + .tab-content {
2091 border:1px solid darken(@gray-lighter, 7%);
2092 border-top:none;
2093 }
2094
2095 /* bordered tabs top right */
2096
2097 .tabs-pull-right.nav-tabs>li, .tabs-pull-right.nav-pills>li {
2098 float:right;
2099 }
2100
2101 .tabs-pull-right.nav-tabs>li:first-child > a, .tabs-pull-right.nav-pills>li:first-child > a {
2102 margin-right:1px;
2103 }
2104
2105 .tabs-pull-right.bordered.nav-tabs>li:first-child > a, .tabs-pull-right.bordered.nav-pills>li:first-child > a {
2106 border-left-width:1px !important;
2107 margin-right:0px;
2108 border-right-width:0px;
2109 }
2110
2111 /* jarviswidget header first child is tab */
2112
2113 .jarviswidget > header > .nav-tabs.pull-left > li:first-child a{
2114 border-left-width:0px !important;
2115 }
2116
2117
2118 /*
2119 * WEBKIT IOS HIGHLIGHT COLOR
2120 *
2121 */
2122 a:link, .btn, button {
2123 -webkit-tap-highlight-color: fade(@red, 50%);
2124 }
2125
2126 .login-info, .login-info *, #logo-group *, .minified .menu-item-parent {
2127 -webkit-box-sizing: content-box;
2128 -moz-box-sizing: content-box;
2129 box-sizing: content-box;
2130 }
2131
2132
2133 /*
2134 * BS2 useful classes
2135 * these classes and its importance was overlooked in BS3
2136 */
2137
2138 .hidden-desktop {
2139 display:none !important;
2140 }
2141
2142 /*
2143 * DROPDOWN MENU
2144 */
2145 .dropdown-menu-xs {
2146 min-width:37px;
2147 }
2148
2149 .dropdown-menu-xs>li>a {
2150 padding: 3px 10px;
2151 }.dropdown-menu-xs>li>a:hover i {
2152 color:#fff !important;
2153 }
2154
2155 /* Dropdown menu extended */
2156 .dropdown-submenu {
2157 position: relative;
2158 }
2159
2160 .dropdown-submenu>.dropdown-menu {
2161 top: 0;
2162 left: 100%;
2163 margin-top: -6px;
2164 margin-left: -1px;
2165 }
2166
2167 .dropdown-submenu:hover>.dropdown-menu {
2168 display: block;
2169 }
2170
2171 .dropdown-submenu>a:after {
2172 display: block;
2173 content: " ";
2174 float: right;
2175 width: 0;
2176 height: 0;
2177 border-color: transparent;
2178 border-style: solid;
2179 border-width: 5px 0 5px 5px;
2180 border-left-color: @gray-mid-light;
2181 margin-top: 5px;
2182 margin-right: -10px;
2183 }
2184
2185 .dropdown-submenu:hover>a:after {
2186 border-left-color: @white;
2187 }
2188
2189 .dropdown-submenu.pull-left {
2190 float: none;
2191 }
2192
2193 .dropdown-submenu.pull-left>.dropdown-menu {
2194 left: -100%;
2195 margin-left: 10px;
2196 }
2197
2198 /*
2199 * Table
2200 */
2201
2202 .table.has-tickbox thead tr th:first-child {
2203 width:18px;
2204 }
2205
2206 .table.has-tickbox.smart-form thead tr th:first-child .radio,
2207 .table.has-tickbox.smart-form thead tr th:first-child .checkbox,
2208 .table.has-tickbox.smart-form tbody tr td:first-child .radio,
2209 .table.has-tickbox.smart-form tbody tr td:first-child .checkbox {
2210 padding:0px !important;
2211 }
2212
2213 .table thead tr, .fc-border-separate thead tr {
2214 background-color: @gray-lighter;
2215 background-image: -webkit-gradient(linear,0 0,0 100%,from(@table-header-color-start),to(@table-header-color-end));
2216 background-image: -webkit-linear-gradient(top,@table-header-color-start 0,@table-header-color-end 100%);
2217 background-image: -moz-linear-gradient(top,@table-header-color-start 0,@table-header-color-end 100%);
2218 background-image: -ms-linear-gradient(top,@table-header-color-start 0,@table-header-color-end 100%);
2219 background-image: -o-linear-gradient(top,@table-header-color-start 0,@table-header-color-end 100%);
2220 background-image: -linear-gradient(top,@table-header-color-start 0,@table-header-color-end 100%);
2221 font-size: 12px;
2222 }.fc-border-separate thead tr th {
2223 padding: 4px;
2224 line-height: 1.428571429;
2225 }
2226
2227 .table-bordered>thead>tr>th, .table-bordered>thead>tr>td {
2228 border-width:1px;
2229 }
2230
2231 .no-padding > .table-bordered {
2232 border:none !important;
2233 }
2234
2235 .no-padding > .table-bordered thead tr th:first-child,
2236 .no-padding > .table-bordered thead tr td:first-child,
2237 .no-padding > .table-bordered tbody tr td:first-child {
2238 border-left-width:0px !important;
2239 }
2240 .no-padding > .table-bordered thead tr th:last-child,
2241 .no-padding > .table-bordered tbody tr td:last-child {
2242 border-right-width:0px !important;
2243 }
2244
2245 .no-padding > .table-bordered tbody tr:last-child td {
2246 border-bottom-width:0px !important;
2247 }
2248
2249 .no-padding .note-editable .table-bordered {
2250 border: 1px solid darken(@gray-lighter, 7%) !important;
2251 }
2252
2253 .smart-form.table td .radio i,
2254 .smart-form.table td .checkbox i,
2255 .smart-form.table th .radio i,
2256 .smart-form.table th .checkbox i {
2257 top: 0px !important;
2258 }
2259
2260
2261
2262
2263
2264
2265 /*
2266 * small stats
2267 */
2268
2269 .show-stats .progress {
2270 height: 7px;
2271 border-radius: 0;
2272 margin-top: 3px;
2273 margin-bottom: 15px;
2274 }
2275
2276 .show-stats {
2277 padding-top:6px !important;
2278 }
2279
2280 .show-stat-buttons {
2281 float:left;
2282 width:100%;
2283 }
2284
2285 .show-stats .show-stat-buttons>:first-child{
2286 padding-right:5px;
2287 }
2288 .show-stats .show-stat-buttons>:last-child{
2289 padding-left:5px;
2290 }
2291
2292 .show-stat-microcharts {
2293 margin-left:-10px;
2294 margin-right:-10px;
2295 }
2296
2297 .show-stat-microcharts > div {
2298 border-right: 1px solid #DADADA !important;
2299 border-top: 1px solid #DADADA !important;
2300 margin-top: 10px !important;
2301 height: 65px;
2302 overflow:hidden;
2303 padding: 7px 9px;
2304 }
2305
2306 .show-stat-microcharts >:last-child {
2307 border-right:none !important;
2308 }
2309
2310 .show-stat-microcharts .sparkline {
2311 margin-top:10px;
2312 margin-right:8px;
2313 opacity:.7;
2314 } .show-stat-microcharts .sparkline:hover {
2315 opacity:1;
2316 }
2317
2318 .smaller-stat {
2319 margin:0;
2320 padding:0;
2321 list-style:none;
2322 }
2323
2324 .smaller-stat li {
2325 margin-top:3px;
2326 margin-right:0px;
2327 }.smaller-stat li:first-child {
2328 margin-top:8px;
2329 }
2330
2331 .smaller-stat span.label {
2332 width:40px;
2333 display:block;
2334 text-align:left;
2335 opacity:.5;
2336 cursor: default;
2337 } .smaller-stat span.label:hover {
2338 opacity:1;
2339 }
2340
2341 /*
2342 * Login info
2343 */
2344
2345 .login-info {
2346 border-bottom: 1px solid #D8D4D4;
2347 display: block;
2348 font-size: 12px;
2349 height: 39px;
2350 line-height: 39px;
2351 color: @white;
2352 border: solid transparent;
2353 border-width: 1px 0px 1px 0px;
2354 box-shadow: inset 1px 1px 0 rgba(red(@black), green(@black), blue(@black), 0.1), inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black), 0.07);
2355 width: 100%;
2356 margin: 0px !important;
2357 border-bottom: 1px solid #525151;
2358 }
2359
2360 .login-info strong, .login-info a {
2361 text-transform: capitalize;
2362 font-size: @font-size-base + 1px; /* 14px~ */
2363 display: inline-block;
2364 color: #A8A8A8;
2365 text-decoration: none;
2366 }
2367 .login-info strong, .login-info a:hover {
2368 color: @white;
2369 }
2370
2371 .login-info span {
2372 height: 38px;
2373 display: block;
2374 padding: 0 10px;
2375 border-bottom: 1px solid #1A1817;
2376 }
2377
2378 .login-info img {
2379 width: 25px;
2380 height: auto;
2381 display: inline-block;
2382 vertical-align: middle;
2383 margin-top: -3px;
2384 margin-right: 7px;
2385 margin-left: 0px;
2386
2387 border-left: 3px solid @white;
2388 }
2389
2390 img.online {
2391 border-left-color: @greenBright !important;
2392 }
2393 img.busy {
2394 border-left-color: @redBright !important;
2395 }
2396 img.offline {
2397 border-left-color: darken(@gray-lighter, 7%) !important;
2398 }
2399 img.away {
2400 border-left-color: #ffc40d !important;
2401 }
2402
2403 /*
2404 * Client page forms
2405 */
2406 .client-form header {
2407 padding: 15px 13px;
2408 margin:0;
2409 border-bottom-style:solid;
2410 border-bottom-color:rgba(red(@black), green(@black), blue(@black), .1);
2411 background: rgba(248, 248, 248, .9);
2412 }
2413
2414
2415 /*
2416 * MINIFIED MENU
2417 */
2418
2419 .minified .inbox-badge {
2420 border-radius: 50%;
2421 font-size: 9px;
2422 padding: 2px;
2423 position: absolute;
2424 top: 6px;
2425 right: 6px;
2426 background: #ED1C24;
2427 min-width:13px;
2428 }
2429
2430 .minifyme {
2431 border-bottom: 1px solid #302F2F;
2432 background: #454545;
2433 color: #A8A8A8;
2434 text-align: center;
2435 padding: 0;
2436 width: 36px;
2437 height: 28px;
2438 display: block;
2439 position: absolute;
2440 right: -3px;
2441 border-radius: 5px 0px 0px 5px;
2442 cursor: pointer;
2443 margin-top: 5px;
2444 font-size: 19px;
2445 transition: all 0.1s linear 0s;
2446 }
2447 .minifyme:hover {
2448 background:#646464;
2449 color:#E4E4E4;
2450 right: 0px;
2451 }
2452
2453 .minified .minifyme {
2454 right: 0px;
2455 color: #A8A8A8;
2456 position: relative;
2457 width: 100%;
2458 border-radius: 0px;
2459 margin: 0;
2460 height: 34px;
2461 font-size: 23px;
2462 }
2463
2464 .minified .minifyme .fa:before {
2465 content:"\f0a9";
2466 }
2467
2468 .minified .login-info a {
2469 display: none;
2470 }
2471
2472 .minified .login-info span {
2473 padding: 0px 5px;
2474 text-align:center;
2475 }
2476 .minified .login-info img {
2477 margin: -4px 0 0;
2478 width: 30px;
2479 }
2480
2481 .minified .login-info {
2482 height: 38px;
2483 border-bottom: 1px solid #181818;
2484 }
2485
2486 .minified #left-panel {
2487 width: 45px;
2488 }
2489
2490 .minified #main {
2491 margin-left: 45px;
2492 }
2493
2494 /*
2495 * Minified NAV
2496 */
2497
2498 .minified #left-panel, .minified nav > ul > li {
2499 overflow: visible;
2500 }
2501
2502 .minified nav > ul > ul {
2503 min-height: 100px !important;
2504 max-height: 180px !important;
2505 overflow-y: scroll;
2506 overflow-x: hidden;
2507 background: #ed1c24 !important;
2508 }
2509
2510 .minified nav > ul > li, .minified nav > ul > li a {
2511 position: relative;
2512 }
2513
2514 .minified nav ul > li > a {
2515 padding: 10px 11px;
2516 display:block
2517 }
2518
2519 .minified nav > ul > li > a .fa.fa-fw {
2520 display: block;
2521 width: auto;
2522 text-align: center;
2523 padding:0;
2524 }
2525
2526 .minified nav > ul > li > a > i {
2527 text-align:center;
2528 margin:0;
2529 display:block;
2530 }
2531
2532 .minified nav > ul > li.active > a::before {
2533 content: "\f0d9";
2534 }
2535
2536 .minified nav ul ul li a {
2537 padding-left: 14px;
2538 }
2539 .minified nav ul ul li li a {
2540 padding-left: 25px;
2541 }
2542
2543 .minified nav > ul ul li::before {
2544 left: 12px;
2545 }
2546 .minified nav > ul > li > ul::before {
2547 left: 12px;
2548 }
2549
2550 .minified nav > ul > li > a .menu-item-parent, .minified nav > ul > li > a > b {
2551 display: none;
2552 }
2553
2554 .minified nav > ul > li > a > .menu-item-parent {
2555 display: none;
2556 position: absolute;
2557 left: 40px;
2558 top: -3px;
2559 width: @asideWidth - 34px;
2560 height: 38px;
2561 line-height: 38px;
2562 background-color: whiteSmoke;
2563 color: @gray-dark;
2564 z-index: 3;
2565 -webkit-box-shadow: 2px 1px 2px 0 rgba(red(@black), green(@black), blue(@black), 0.2);
2566 -moz-box-shadow: 2px 1px 2px 0 rgba(red(@black), green(@black), blue(@black),0.2);
2567 box-shadow: 2px 1px 2px 0 rgba(red(@black), green(@black), blue(@black), 0.2);
2568 border-left: 1px solid @gray-mid-light;
2569 border-top: 1px solid #D8D4D4;
2570 border-bottom: 1px solid @white;
2571 padding-left: 12px;
2572 }
2573
2574 .minified nav > ul > li > ul {
2575 display: none !important;
2576 position: absolute;
2577 left: 40px;
2578 width: @asideWidth - 20px;
2579 z-index: 5;
2580 border: 1px solid @gray-mid-light;
2581 min-height: 180px;
2582 -webkit-box-shadow: 1px 1px 2px 0 rgba(red(@black), green(@black), blue(@black), 0.2);
2583 -moz-box-shadow: 1px 1px 2px 0 rgba(red(@black), green(@black), blue(@black),0.2);
2584 box-shadow: 1px 1px 2px 0 rgba(red(@black), green(@black), blue(@black), 0.2);
2585 background: #3A3633;
2586 margin-top: -3px;
2587 }
2588
2589
2590 .minified nav ul > li > ul > li > ul {
2591 position: relative;
2592 left: 13px;
2593 border: none;
2594 width: auto;
2595 margin-left: -12px;
2596 width: @asideWidth - 23px;
2597 }
2598
2599 .minified nav > ul > li:hover > a > .menu-item-parent, .minified nav > ul > li:hover > ul {
2600 display: block !important;
2601 }
2602
2603 .minified nav > ul > li > ul > li {
2604 background-color: rgba(69, 69, 69, .9);
2605 }
2606 .minified nav > ul > li > ul > li > ul > li {
2607 background-color: #484B50;
2608 }
2609
2610 .minified nav > ul > li {
2611 border-bottom: 1px solid #1A1817;
2612 border-top: 1px solid #525151;
2613 }
2614
2615 .minified nav > ul > li > ul::before {
2616 border-left: none;
2617 }
2618
2619 .minified nav > ul ul li::before {
2620 border: none;
2621 }
2622
2623 .slimScrollDiv, .slimScrollDiv > :first-child {
2624 overflow: hidden;
2625 }
2626
2627 .minified .slimScrollDiv, .minified .slimScrollDiv > :first-child {
2628 overflow: visible !important;
2629 }
2630
2631 .minified .slimScrollBar, .minified .slimScrollRail {
2632 display: none;
2633 }
2634
2635 .minified nav > ul > li > ul > li > a {
2636 padding-top: 7px;
2637 padding-bottom: 7px;
2638 }
2639
2640 .minified nav > ul > li > ul > li > ul > li > a {
2641 padding-top: 7px;
2642 padding-bottom: 7px;
2643 }
2644
2645 .minified nav > ul > li > ul > li > ul > li a {
2646 padding-top: 6px;
2647 padding-bottom: 6px;
2648 }
2649
2650 /* Fourth Level: A */
2651 .minified nav ul ul ul ul li a {
2652 padding-left: 45px;
2653 }
2654
2655 /* Fifth Level: A */
2656 .minified nav ul ul ul ul ul li a {
2657 padding-left: 62px;
2658 }
2659
2660 /* Sixth Level: A */
2661 .minified nav ul ul ul ul ul ul li a {
2662 padding-left: 82px;
2663 }
2664
2665 /*
2666 * SHORT CUTS
2667 */
2668
2669 .pull-right {
2670 float: right !Important;
2671 }
2672 .pull-left {
2673 float: left !Important;
2674 }
2675
2676 /*
2677 * ALTERNATIVE PAGING
2678 */
2679
2680 .pagination.pagination-alt>li>a {
2681 box-shadow: none;
2682 -moz-box-shadow: none;
2683 -webkit-box-shadow: none;
2684 border: none;
2685 margin-left: -1px;
2686 }
2687 .pagination.pagination-alt > li:first-child>a {
2688 padding-left:0px;
2689 }
2690
2691 /*
2692 * CUSTOM BUTTON
2693 */
2694
2695 .pagination > li > a, .pagination > li > span {
2696 box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
2697 -moz-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
2698 -webkit-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
2699 }
2700
2701 .disabled {
2702 color:@white;
2703 }
2704 .btn-default.disabled {
2705 color:@gray-light;
2706 }
2707
2708 .btn {
2709 border-radius:2px;
2710 -webkit-border-radius: 2px;
2711 -moz-border-radius: 2px;
2712 box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
2713 -moz-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
2714 -webkit-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
2715 }
2716 .btn:active {
2717 position:relative;
2718 top:1px;
2719 left:1px;
2720 }
2721
2722 .btn.btn-ribbon {
2723 background-color: #707070;
2724 background-image: -moz-linear-gradient(top, #777, #666);
2725 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#777), to(#666));
2726 background-image: -webkit-linear-gradient(top, #777, #666);
2727 background-image: -o-linear-gradient(top, #777, #666);
2728 background-image: linear-gradient(to bottom, #777, #666);
2729 background-repeat: repeat-x;
2730 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff777777', endColorstr='#ff666666', GradientType=0);
2731 color: white;
2732 padding: 0 5px;
2733 line-height: 20px;
2734 vertical-align: middle;
2735 height: 20px;
2736 display: block;
2737 border: none;
2738 float: left;
2739 margin: 0 8px 0 0;
2740 cursor: pointer;
2741 }
2742
2743 .btn.btn-ribbon > i {
2744 font-size:111%;
2745 }
2746
2747 .ribbon-button-alignment {
2748 padding-top: 10px;
2749 display: inline-block;
2750 }
2751
2752 .ribbon-button-alignment.pull-right > .btn.btn-ribbon {
2753 margin: 0 0 0 8px;
2754 }
2755
2756
2757 /*
2758 * Panels
2759 */
2760 .panel-purple {
2761 border-color:@purple;
2762 & > .panel-heading {
2763 color: @white;
2764 background-color: @purple;
2765 border-color: @purple;
2766 }
2767 }
2768 .panel-greenLight {
2769 border-color:@greenLight;
2770 & > .panel-heading {
2771 color: @white;
2772 background-color: @greenLight;
2773 border-color: @greenLight;
2774 }
2775 }
2776 .panel-greenDark {
2777 border-color:@greenDark;
2778 & > .panel-heading {
2779 color: @white;
2780 background-color: @greenDark;
2781 border-color: @greenDark;
2782 }
2783 }
2784 .panel-darken {
2785 border-color:@gray-dark;
2786 & > .panel-heading {
2787 color: @white;
2788 background-color: #404040;
2789 border-color: #404040;
2790 }
2791 }
2792 .panel-pink {
2793 border-color:@pink;
2794 & > .panel-heading {
2795 color: @white;
2796 background-color: @pink;
2797 border-color: @pink;
2798 }
2799 }
2800 .panel-green {
2801 border-color:@green;
2802 & > .panel-heading {
2803 color: @white;
2804 background-color: @green;
2805 border-color: @green;
2806 }
2807 }
2808 .panel-blueLight {
2809 border-color: @blueLight;
2810 & > .panel-heading {
2811 color: @white;
2812 background-color: @blueLight;
2813 border-color: @blueLight;
2814 }
2815 }
2816 .panel-pinkDark {
2817 border-color:@pinkDark;
2818 & > .panel-heading {
2819 color: @white;
2820 background-color: @pinkDark;
2821 border-color: @pinkDark;
2822 }
2823 }
2824 .panel-redLight {
2825 border-color: @redLight;
2826 & > .panel-heading {
2827 color: @white;
2828 background-color: @redLight;
2829 border-color: @redLight;
2830 }
2831 }
2832 .panel-red {
2833 border-color: @red;
2834 & > .panel-heading {
2835 color: @white;
2836 background-color: @red;
2837 border-color: @red;
2838 }
2839 }
2840 .panel-teal {
2841 border-color: @teal;
2842 & > .panel-heading {
2843 color: @white;
2844 background-color: @teal;
2845 border-color: @teal;
2846 }
2847 }
2848 .panel-orange {
2849 border-color: @orange;
2850 & > .panel-heading {
2851 color: @white;
2852 background-color: @orange;
2853 border-color: @orange;
2854 }
2855 }
2856 .panel-blueDark {
2857 border-color: @blueDark;
2858 & > .panel-heading {
2859 color: @white;
2860 background-color: @blueDark;
2861 border-color: @blueDark;
2862 }
2863 }
2864 .panel-magenta {
2865 border-color:@magenta;
2866 & > .panel-heading {
2867 color: @white;
2868 background-color: @magenta;
2869 border-color: @magenta;
2870 }
2871 }
2872 .panel-blue {
2873 border-color: @blue;
2874 & > .panel-heading {
2875 color: @white;
2876 background-color: @blue;
2877 border-color: @blue;
2878 }
2879 }
2880
2881
2882 .panel-footer > .btn-block {
2883 border-radius:0px;
2884 -moz-border-radius:0px;
2885 -webkit-border-radius: 0px;
2886 border-bottom:none;
2887 border-left:none;
2888 border-right:none;
2889 }
2890
2891 /*
2892 * Circle Buttons
2893 */
2894
2895 .btn-circle {
2896 width: 30px;
2897 height: 30px;
2898 text-align: center;
2899 padding: 6px 0;
2900 font-size: 12px;
2901 line-height: 18px;
2902 border-radius: 50%;
2903 -moz-border-radius: 50%;
2904 -webkit-border-radius: 50%;
2905 }
2906 .btn-circle.btn-lg {
2907 width: 50px;
2908 height: 50px;
2909 padding: 10px 15px;
2910 font-size: 18px;
2911 line-height: 30px;
2912 border-radius: 50%;
2913 -moz-border-radius: 50%;
2914 -webkit-border-radius: 50%;
2915 }
2916 .btn-circle.btn-xl {
2917 width: 70px;
2918 height: 70px;
2919 padding: 10px 15px;
2920 font-size: 24px;
2921 line-height: 50px;
2922 border-radius: 50%;
2923 -moz-border-radius: 50%;
2924 -webkit-border-radius: 50%;
2925 }
2926
2927
2928 /*
2929 * Big Metro Buttons
2930 */
2931
2932 .btn-metro {
2933 margin:0 0 20px;
2934 padding-top:15px;
2935 padding-bottom:15px;
2936 }
2937
2938 .btn-metro > span {
2939 display:block;
2940 vertical-align: bottom;
2941 margin-top:10px;
2942 text-transform:uppercase;
2943 }
2944
2945 .btn-metro > span.label {
2946 position: absolute;
2947 top:0px;
2948 right:0px;
2949 }
2950
2951 /*
2952 * buttons with labels
2953 */
2954
2955 .btn-label {position: relative;left: -12px;display: inline-block;padding: 6px 12px;background: rgba(red(@black), green(@black), blue(@black),0.15);border-radius: 3px 0 0 3px;}
2956 .btn-labeled {padding-top: 0;padding-bottom: 0;}
2957
2958
2959 /*
2960 * ANIMATION
2961 */
2962
2963 #left-panel, #content {
2964 -moz-transition: left .1s ease-out;
2965 -ms-transition: left .1s ease-out;
2966 -o-transition: left .1s ease-out;
2967 -webkit-transition: left .1s ease-out;
2968 transition: left .1s ease-out;
2969 }
2970
2971 #main {
2972 -moz-transition: all .1s ease-out;
2973 -ms-transition: all .1s ease-out;
2974 -o-transition: all .1s ease-out;
2975 -webkit-transition: all .1s ease-out;
2976 transition: all .1s ease-out;
2977 }
2978
2979 /*
2980 * CHARTS
2981 */
2982
2983 .chart-small {
2984 height:100px;
2985 width:100%;
2986 }
2987
2988 .chart-large {
2989 height:235px;
2990 width:100%;
2991 }
2992
2993 .chart-xl {
2994 height:297px;
2995 width:100%;
2996 }
2997
2998 /*
2999 * Flot Tool tips
3000 */
3001
3002 #flotTip {
3003 padding: 3px 5px;
3004 background-color: @white;
3005 z-index: @tooltip-zindex;
3006 color: @gray-dark;
3007
3008 -webkit-box-shadow: 0 1px 8px rgba(red(@black), green(@black), blue(@black), 0.1);
3009 -moz-box-shadow: 0 1px 8px rgba(red(@black), green(@black), blue(@black),0.1);
3010 box-shadow: 0 1px 8px rgba(red(@black), green(@black), blue(@black), 0.1);
3011 font-size: 14px;
3012 border: 1px solid #C1C1C1;
3013
3014 -moz-border-radius: 4px;
3015 -khtml-border-radius: 4px;
3016 -webkit-border-radius: 4px;
3017 border-radius: 4px;
3018 }
3019
3020 #flotTip span {
3021 color:#38812D;
3022 font-weight:bold;
3023 }
3024
3025
3026 .legendLabel span {
3027 display: block;
3028 margin: 0 5px;
3029 }
3030 .legendColorBox {
3031 padding-left: 10px;
3032 vertical-align: top;
3033 padding-top: 5px;
3034 }
3035 .legendColorBox div > div {
3036 width: 4px;
3037 height: 4px;
3038 border-radius: 50%;
3039 -webkit-border-radius: 50%;
3040 -moz-border-radius: 50%;
3041 box-sizing:content-box;
3042 -moz-box-sizing:content-box;
3043 -webkit-box-sizing: content-box;
3044 }
3045
3046
3047 /*
3048 * Morris Charts
3049 */
3050
3051 .morris-hover.morris-default-style {
3052 border-radius: 10px;
3053 padding: 6px;
3054 color: #666;
3055 background: rgba(red(@white), green(@white), blue(@white), 0.8);
3056 border: solid 2px rgba(230, 230, 230, 0.8);
3057 font-family: sans-serif;
3058 font-size: 12px;
3059 text-align: center;
3060 .morris-hover-row-label {
3061 font-weight: bold;
3062 margin: 0.25em 0;
3063 }
3064 .morris-hover-point {
3065 white-space: nowrap;
3066 margin: 0.1em 0;
3067 }
3068 }
3069 .morris-hover {
3070 position: absolute;
3071 z-index: @morris-hover;
3072 }
3073
3074 /*
3075 * Flot Chart
3076 */
3077
3078 .chart {
3079 height:220px;
3080 margin:20px 5px 10px 10px;
3081 }
3082
3083 .has-legend {
3084 margin-top: 30px !important;
3085 }
3086
3087 .has-legend-unique {
3088 margin-top: 19px !important;
3089 }
3090
3091 /*
3092 * EASY PIE CHART
3093 */
3094 .easyPieChart {
3095 position: relative;
3096 text-align: center;
3097 canvas {
3098 position: absolute;
3099 top: 0;
3100 left: 0;
3101 }
3102 }
3103
3104 .easy-pie-chart {
3105 display:inline-block;
3106 .percent {
3107 color:#444;
3108 font-size:12px;
3109 font-weight:bold;
3110 }
3111 }
3112
3113 .easy-pie-title {
3114 display: inline-block;
3115 margin: 10px 6px 0;
3116 white-space: nowrap;
3117 overflow: hidden;
3118 text-overflow: ellipsis;
3119 font-size:12px;
3120 font-weight:400;
3121 text-transform:uppercase;
3122 width:100px;
3123 height:19px;
3124 text-overflow: ellipsis;
3125 white-space: nowrap;
3126 overflow: hidden;
3127 }
3128
3129 .easy-pie-title .icon-color-good,
3130 .easy-pie-title .icon-color-bad {
3131 font-size:18px;
3132 }
3133
3134
3135 /*
3136 * Carren colors
3137 */
3138
3139 .icon-color-good {
3140 color:@greenBright;
3141 }
3142
3143 .icon-color-bad {
3144 color:@redBright;
3145 }
3146
3147 /*
3148 * SIGNS
3149 */
3150 .percent-sign:after, .degree-sign:after {
3151 content: " %";
3152 line-height: normal;
3153 }
3154
3155 .degree-sign:after {
3156 content:" °F";
3157 }
3158
3159 /*
3160 * HIDDEN MENU
3161 */
3162 .hidden-menu #left-panel {
3163 left: -@asideWidth + 10px;
3164 z-index: @hidden-lefthand-menu-zindex;
3165 }
3166 .hidden-menu #main {
3167 margin-left: 10px;
3168 }
3169
3170 .hidden-menu #left-panel:hover {
3171 left: 0px;
3172 }
3173
3174 .hidden-menu .minifyme {
3175 display: none;
3176 }
3177
3178 .minified #hide-menu {
3179 display: none;
3180 }
3181
3182 .btn-header.pull-right {
3183 margin-left:6px;
3184 }
3185
3186 .btn-header a > span {
3187 font-size:13px;
3188 font-weight:normal;
3189 line-height:30px;
3190 height:30px;
3191 display:inline-block;
3192 }
3193
3194 .btn-header > :first-child > a {
3195 -moz-border-radius: 2px;
3196 -webkit-border-radius: 2px;
3197 border-radius: 2px;
3198 cursor: default !important;
3199 display: inline-block;
3200 font-weight: bold;
3201 height: 30px;
3202 min-width: 30px;
3203 padding: 2px;
3204 text-align: center;
3205 text-decoration: none !important;
3206 -moz-user-select: none;
3207 -webkit-user-select: none;
3208 background-color: lighten(@gray-lightest, 1.9%);
3209 background-image: -webkit-gradient(linear,left top,left bottom,from(lighten(@gray-lightest, 1.9%)),to(darken(@gray-lightest, 1%)));
3210 background-image: -webkit-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
3211 background-image: -moz-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
3212 background-image: -ms-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
3213 background-image: -o-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
3214 background-image: linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
3215 border: 1px solid @gray-mid-light;
3216 color: #6D6A69;
3217 font-size: 17px;
3218 margin: 10px 0 0 0;
3219 }
3220
3221 .btn-header > :first-child > a:hover {
3222 border: 1px solid @gray-mid-light;
3223 color: #222;
3224 transition: all 0.0s;
3225 cursor: pointer;
3226 -webkit-box-shadow: inset 0px 0px 4px 1px rgba(red(@black), green(@black), blue(@black), .08);
3227 box-shadow: inset 0px 0px 4px 1px rgba(red(@black), green(@black), blue(@black), .08);
3228 }
3229
3230 .btn-header > :first-child > a:active {
3231 background-color: #e8e8e8;
3232 background-image: -moz-linear-gradient(top, #e8e8e8 0%, #ededed 100%);
3233 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8e8e8), color-stop(100%,#ededed));
3234 background-image: -webkit-linear-gradient(top, #e8e8e8 0%,#ededed 100%);
3235 background-image: -o-linear-gradient(top, #e8e8e8 0%,#ededed 100%);
3236 background-image: -ms-linear-gradient(top, #e8e8e8 0%,#ededed 100%);
3237 background-image: linear-gradient(to bottom, #e8e8e8 0%,#ededed 100%);
3238 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#ededed',GradientType=0 );
3239 -webkit-box-shadow: inset 0px 0px 3px 1px rgba(red(@black), green(@black), blue(@black), .15);
3240 box-shadow: inset 0px 0px 3px 1px rgba(red(@black), green(@black), blue(@black), .15);
3241 }
3242
3243 .hidden-menu #hide-menu > :first-child > a {
3244 background-color: #e8e8e8;
3245 background-image: -moz-linear-gradient(top, #5A5A5A 0%, #686868 100%);
3246 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5A5A5A), color-stop(100%,#686868));
3247 background-image: -webkit-linear-gradient(to bottom, #5A5A5A 0%,#686868 100%);
3248 background-image: -o-linear-gradient(to bottom, #5A5A5A 0%,#686868 100%);
3249 background-image: -ms-linear-gradient(to bottom, #5A5A5A 0%,#686868 100%);
3250 background-image: linear-gradient(to bottom, #5A5A5A 0%,#686868 100%);
3251 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5A5A5A', endColorstr='#686868',GradientType=0 );
3252 -webkit-box-shadow: inset 0px 0px 2px 1px rgba(red(@black), green(@black), blue(@black), .1);
3253 box-shadow: inset 0px 0px 2px 1px rgba(red(@black), green(@black), blue(@black), .1);
3254 color: @white;
3255 border-color:#494949;
3256 }
3257
3258 .hidden-menu #hide-menu > :first-child > a {
3259 -webkit-box-shadow: inset 0px 0px 3px 1px rgba(red(@black), green(@black), blue(@black), .15);
3260 box-shadow: inset 0px 0px 3px 1px rgba(red(@black), green(@black), blue(@black), .15);
3261 }
3262
3263 .hidden-menu #hide-menu > :first-child > a:active {
3264 -webkit-box-shadow: inset 0px 0px 6px 1px rgba(red(@black), green(@black), blue(@black), .2);
3265 box-shadow: inset 0px 0px 6px 1px rgba(red(@black), green(@black), blue(@black), .2);
3266 }
3267
3268 /*
3269 * AJAX DROPDOWN
3270 */
3271
3272 .ajax-dropdown >:first-child {
3273 margin:0 0 3px 0;
3274 padding:0 0 9px 0;
3275 }
3276
3277 .ajax-dropdown {
3278 position: absolute;
3279 display: none;
3280 z-index: @ajax-dropdown-zindex;
3281 background: white;
3282 top: 48px;
3283 left: 16px;
3284 width: 344px;
3285 height: 435px;
3286 border-radius:0px;
3287 -webkit-border-radius: 0px;
3288 -moz-border-radius: 0px;
3289 -webkit-box-shadow: 0 2px 4px rgba(30, 30, 100, 0.25);
3290 -moz-box-shadow: 0 2px 4px rgba(30,30,100,0.25);
3291 box-shadow: 0 2px 4px rgba(30, 30, 100, 0.25);
3292 padding:10px;
3293 background: @white;
3294 border: 1px solid #b3b3b3;
3295 }
3296
3297 .ajax-dropdown:after, .ajax-dropdown:before {
3298 bottom: 100%;
3299 border: solid transparent;
3300 content: " ";
3301 height: 0;
3302 width: 0;
3303 position: absolute;
3304 pointer-events: none;
3305 }
3306
3307 .ajax-dropdown:after {
3308 border-color: rgba(red(@white), green(@white), blue(@white), 0);
3309 border-bottom-color: @ajaxdrop-arrow-top-color;
3310 border-width: @ajaxdropdown-arrow-size;
3311 left: 50%;
3312 margin-left: -@ajaxdropdown-arrow-size;
3313 }
3314
3315 .ajax-dropdown:before {
3316 border-color: rgba(131, 131, 131, 0);
3317 border-bottom-color: @ajaxdrop-arrow-bottom-color;
3318 border-width: @ajaxdropdown-arrow-bottom;
3319 left: 50%;
3320 margin-left: -@ajaxdropdown-arrow-bottom;
3321 }
3322
3323 .ajax-dropdown .btn-group .btn {
3324 font-weight:bold;
3325 text-transform:capitalize;
3326 }
3327
3328 .ajax-dropdown .btn-group >:nth-child(2) {
3329 border-right-width:0px;
3330 border-left-width:0px;
3331 }
3332
3333 .ajax-dropdown .btn-group .btn:active {
3334 top:0px;
3335 left:0px;
3336 }
3337
3338 .ajax-notifications {
3339 height: @ajaxdropdown-height;
3340 display:block;
3341 overflow: auto;
3342 margin-right: -10px;
3343 margin-left: -10px;
3344 border-bottom: 1px solid #CECECE;
3345 border-top: 1px solid #CECECE;
3346 background: #E9E9E9;
3347 }
3348
3349 .ajax-notifications > .alert.alert-transparent {
3350 background-color: transparent;
3351 border-color: transparent;
3352 color: #757575;
3353 margin:13px 10px;
3354 }
3355
3356 .ajax-notifications > .alert>:first-child {
3357 margin-bottom:10px;
3358 font-weight:400;
3359 }
3360
3361 .ajax-dropdown >:last-child {
3362 font-size:13px;
3363 display: block;
3364 padding: 5px 0;
3365 line-height: 22px;
3366 font-weight: 400;
3367 }
3368
3369 .ajax-dropdown .fa-4x.fa-border {
3370 border-width:3px;
3371 border-radius:50%;
3372 -webkit-border-radius: 50%;
3373 -moz-border-radius: 50%;
3374 display:block;
3375 margin:0 auto;
3376 width:46px;
3377 text-align:center;
3378 color: #D1D1D1;
3379 border-color:#D1D1D1;
3380 }
3381
3382 /*
3383 * LARGE DROPDOWNS
3384 */
3385
3386 .dropdown-large {
3387 position: static !important;
3388 }
3389 .dropdown-menu-large {
3390 margin-left: 16px;
3391 margin-right: 16px;
3392 padding: 20px 0px;
3393 }
3394 .dropdown-menu-large > li > ul {
3395 padding: 0;
3396 margin: 0;
3397 }
3398 .dropdown-menu-large > li > ul > li {
3399 list-style: none;
3400 }
3401 .dropdown-menu-large > li > ul > li > a {
3402 display: block;
3403 padding: 3px 20px;
3404 clear: both;
3405 font-weight: normal;
3406 line-height: 1.428571429;
3407 color: #333333;
3408 white-space: normal;
3409 }
3410 .dropdown-menu-large > li ul > li > a:hover,
3411 .dropdown-menu-large > li ul > li > a:focus {
3412 text-decoration: none;
3413 color: #262626;
3414 background-color: #f5f5f5;
3415 }
3416 .dropdown-menu-large .disabled > a,
3417 .dropdown-menu-large .disabled > a:hover,
3418 .dropdown-menu-large .disabled > a:focus {
3419 color: #999999;
3420 }
3421 .dropdown-menu-large .disabled > a:hover,
3422 .dropdown-menu-large .disabled > a:focus {
3423 text-decoration: none;
3424 background-color: transparent;
3425 background-image: none;
3426 filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
3427 cursor: not-allowed;
3428 }
3429 .dropdown-menu-large .dropdown-header {
3430 color: #428bca;
3431 font-size: 18px;
3432 }
3433 @media (max-width: 768px) {
3434 .dropdown-menu-large {
3435 margin-left: 0 ;
3436 margin-right: 0 ;
3437 }
3438 .dropdown-menu-large > li {
3439 margin-bottom: 30px;
3440 }
3441 .dropdown-menu-large > li:last-child {
3442 margin-bottom: 0;
3443 }
3444 .dropdown-menu-large .dropdown-header {
3445 padding: 3px 15px !important;
3446 }
3447 }
3448
3449
3450
3451 /*
3452 * PAGING
3453 */
3454
3455 .pagination-xs>li>a, .pagination-xs>li>span {
3456 padding: 4px 9px;
3457 font-size:12px;
3458 }
3459
3460 /*
3461 * NOTIFICATIONS : MAIL
3462 */
3463
3464 .notification-body *, .notification-body:before *, .notification-body:after * {
3465 box-sizing:border-box !important;
3466 -webkit-box-sizing:border-box !important;
3467 -moz-box-sizing:border-box !important;
3468 }
3469
3470 .notification-body {
3471 padding:0 0 0 3px;
3472 margin:0;
3473 list-style:none;
3474 }
3475
3476 .notification-body > li {
3477 border-bottom: 1px solid #E9E9E9;
3478 position:relative;
3479 }
3480
3481
3482 .notification-body > li > span {
3483 background: @white;
3484 display: block;
3485 min-height: 25px;
3486 overflow: hidden;
3487 padding: 8px 10px 13px;
3488 white-space: normal;
3489 }
3490
3491 .notification-body > li > span:hover {
3492 background: #F0F4F7 ;
3493 color: #667F8F;
3494 }
3495
3496 .notification-body > li a.msg {
3497 padding-left:50px !important;
3498 }
3499
3500
3501 .notification-body > li a, .notification-body > li a:hover {
3502 text-decoration: none;
3503 }
3504
3505 .notification-body > li a, .notification-body > li a span {
3506 display:block;
3507 position:relative;
3508 overflow:hidden;
3509 }
3510
3511 .notification-body > li a, .notification-body > li a:hover {
3512 text-decoration:none;
3513 }
3514
3515 .notification-body > li:hover .progress {
3516 background: @white;
3517 box-shadow: 0 1px 0 rgba(red(@black), green(@black), blue(@black), 0), 0 0 0 1px #A7A7A7 inset;
3518 -webkit-box-shadow: 0 1px 0 rgba(red(@black), green(@black), blue(@black), 0), 0 0 0 1px #CCC inset;
3519 -moz-box-shadow: 0 1px 0 transparent, 0 0 0 1px lighten(@gray-lighter, 10%) inset;
3520 }.notification-body > li:hover .text-muted {
3521 color:@gray-dark;
3522 }
3523
3524 .notification-body .from {
3525 font-size: @font-size-base + 1px;
3526 line-height:normal;
3527 color:@gray-dark;
3528 font-weight:normal;
3529 margin-right:60px;
3530 margin-bottom:6px;
3531 height:20px;
3532 text-overflow:ellipsis;
3533 white-space: nowrap;
3534 overflow: hidden;
3535 }
3536
3537 .notification-body .unread .from {
3538 font-weight:bold;
3539 }
3540
3541 .notification-body .unread {
3542 background:#FFFFE0;
3543 }
3544
3545 .notification-body time {
3546 position:absolute;
3547 top:3px;
3548 right:0;
3549 font-size: 11px;
3550 font-weight:normal;
3551 color:#058dc7;
3552 }
3553
3554 .notification-body .msg-body, .notification-body .subject {
3555 font-size: @font-size-base;
3556 color:#A0A0A0;
3557 max-height:35px;
3558 width: 100%;
3559 text-overflow:ellipsis;
3560 white-space: nowrap;
3561 overflow: hidden;
3562 }
3563
3564 .notification-body .subject {
3565 font-size: @font-size-base;
3566 color:@gray-dark;
3567 max-height:22px;
3568 }
3569
3570
3571 /*
3572 * WIZARDS
3573 */
3574
3575 .bootstrapWizard {
3576 display: block;
3577 list-style: none;
3578 padding: 0;
3579 position: relative;
3580 width: 100%;
3581 }
3582 .bootstrapWizard a:hover, .bootstrapWizard a:active, .bootstrapWizard a:focus {
3583 text-decoration: none
3584 }
3585 .bootstrapWizard li {
3586 display: block;
3587 float: left;
3588 width: 25%;
3589 text-align: center;
3590 padding-left: 0;
3591 }
3592 .bootstrapWizard li:before {
3593 border-top: 3px solid #55606E;
3594 content: "";
3595 display: block;
3596 font-size: 0;
3597 overflow: hidden;
3598 position: relative;
3599 top: 11px;
3600 right: 1px;
3601 width: 100%;
3602 z-index: 1;
3603 }
3604 .bootstrapWizard li:first-child:before {
3605 left: 50%;
3606 max-width: 50%;
3607 }
3608 .bootstrapWizard li:last-child:before {
3609 max-width: 50%;
3610 width: 50%;
3611 }
3612
3613 .bootstrapWizard li.complete .step {
3614 background: @wizard-step-complete;
3615 padding: 1px 6px;
3616 border: 3px solid #55606E;
3617 }
3618 .bootstrapWizard li .step i {
3619 font-size: 10px;
3620 font-weight: normal;
3621 position: relative;
3622 top: -1.5px;
3623 }
3624 .bootstrapWizard li .step {
3625 background: #B2B5B9;
3626 color: @white;
3627 display: inline;
3628 font-size: 15px;
3629 font-weight: bold;
3630 line-height: 12px;
3631 padding: 7px 13px;
3632 border: 3px solid transparent;
3633 border-radius: 50%;
3634 line-height: normal;
3635 position: relative;
3636 text-align: center;
3637 z-index: 2;
3638 transition: all 0.1s linear 0s;
3639 }
3640 .bootstrapWizard li.active .step, .bootstrapWizard li.active.complete .step {
3641 background: @wizard-step-active;
3642 color: @white;
3643 font-weight: bold;
3644 padding: 7px 13px;
3645 font-size: 15px;
3646 border-radius: 50%;
3647 border: 3px solid #55606E;
3648 }
3649 .bootstrapWizard li.complete .title, .bootstrapWizard li.active .title {
3650 color: #2B3D53;
3651 }
3652 .bootstrapWizard li .title {
3653 color: @gray-mid-light;
3654 display: block;
3655 font-size: 13px;
3656 line-height: 15px;
3657 max-width: 100%;
3658 position: relative;
3659 table-layout: fixed;
3660 text-align: center;
3661 top: 20px;
3662 word-wrap: break-word;
3663 z-index: 104;
3664 }
3665
3666 .wizard-actions {
3667 display: block;
3668 list-style: none;
3669 padding: 0;
3670 position: relative;
3671 width: 100%;
3672 }
3673 .wizard-actions li {
3674 display: inline;
3675 }
3676
3677 .tab-content.transparent {
3678 background-color: transparent;
3679 }
3680
3681 /*
3682 * FUELUX WIZARD
3683 */
3684
3685 .fuelux .wizard {
3686 position: relative;
3687 overflow: hidden;
3688 background-color: #f9f9f9;
3689 border: 1px solid #d4d4d4;
3690 -webkit-border-radius: 4px;
3691 -moz-border-radius: 4px;
3692 border-radius: 4px;
3693 *zoom: 1;
3694 -webkit-box-shadow: 0 1px 4px rgba(red(@black), green(@black), blue(@black), 0.065);
3695 -moz-box-shadow: 0 1px 4px rgba(red(@black), green(@black), blue(@black), 0.065);
3696 box-shadow: 0 1px 4px rgba(red(@black), green(@black), blue(@black), 0.065);
3697 }
3698
3699 .fuelux .wizard:before,
3700 .fuelux .wizard:after {
3701 display: table;
3702 line-height: 0;
3703 content: "";
3704 }
3705
3706 .fuelux .wizard:after {
3707 clear: both;
3708 }
3709
3710 .fuelux .wizard ul {
3711 width: 4000px;
3712 padding: 0;
3713 margin: 0;
3714 list-style: none outside none;
3715 }
3716
3717 .fuelux .wizard ul.previous-disabled li.complete {
3718 cursor: default;
3719 }
3720
3721 .fuelux .wizard ul.previous-disabled li.complete:hover {
3722 color: @green;
3723 cursor: default;
3724 background: #f3f4f5;
3725 }
3726
3727 .fuelux .wizard ul.previous-disabled li.complete:hover .chevron:before {
3728 border-left-color: #f3f4f5;
3729 }
3730
3731 .fuelux .wizard ul li {
3732 position: relative;
3733 float: left;
3734 height: 46px;
3735 padding: 0 20px 0 30px;
3736 margin: 0;
3737 font-size: 16px;
3738 line-height: 46px;
3739 color: #999999;
3740 cursor: default;
3741 background: #ededed;
3742 }
3743
3744 .fuelux .wizard ul li .chevron {
3745 position: absolute;
3746 top: 0;
3747 right: -14px;
3748 z-index: 1;
3749 display: block;
3750 border: 24px solid transparent;
3751 border-right: 0;
3752 border-left: 14px solid #d4d4d4;
3753 }
3754
3755 .fuelux .wizard ul li .chevron:before {
3756 position: absolute;
3757 top: -24px;
3758 right: 1px;
3759 display: block;
3760 border: 24px solid transparent;
3761 border-right: 0;
3762 border-left: 14px solid #ededed;
3763 content: "";
3764 }
3765
3766 .fuelux .wizard ul li.complete {
3767 color: @state-success-text;
3768 background: #f3f4f5;
3769 }
3770
3771 .fuelux .wizard ul li.complete:hover {
3772 cursor: pointer;
3773 background: #e7eff8;
3774 }
3775
3776 .fuelux .wizard ul li.complete:hover .chevron:before {
3777 border-left: 14px solid #e7eff8;
3778 }
3779
3780 .fuelux .wizard ul li.complete .chevron:before {
3781 border-left: 14px solid #f3f4f5;
3782 }
3783
3784 .fuelux .wizard ul li.active {
3785 color: #3a87ad;
3786 background: #f1f6fc;
3787 }
3788
3789 .fuelux .wizard ul li.active .chevron:before {
3790 border-left: 14px solid #f1f6fc;
3791 }
3792
3793 .fuelux .wizard ul li .badge {
3794 margin-right: 8px;
3795 }
3796
3797 .fuelux .wizard ul li:first-child {
3798 padding-left: 20px;
3799 border-radius: 4px 0 0 4px;
3800 }
3801
3802 .fuelux .wizard .actions {
3803 position: absolute;
3804 right: 0;
3805 z-index: 2;
3806 float: right;
3807 padding-right: 15px;
3808 padding-left: 15px;
3809 line-height: 46px;
3810 vertical-align: middle;
3811 background-color: @gray-lighter;
3812 border-left: 1px solid #d4d4d4;
3813 }
3814
3815 .fuelux .wizard .actions a {
3816 margin-right: 8px;
3817 font-size: 12px;
3818 line-height: 45px;
3819 }
3820
3821 .fuelux .wizard .actions .btn-prev i {
3822 margin-right: 5px;
3823 }
3824
3825 .fuelux .wizard .actions .btn-next i {
3826 margin-left: 5px;
3827 }
3828
3829 .fuelux .step-content .step-pane {
3830 display: none;
3831 }
3832
3833 .fuelux .step-content .active {
3834 display: block;
3835 }
3836
3837 .fuelux .step-content .active .btn-group .active {
3838 display: inline-block;
3839 }
3840
3841
3842 /*
3843 * jarvismetro TILE
3844 */
3845
3846 .jarvismetro-tile {
3847 float:left;
3848 display: block;
3849 background-color: @white;
3850 width: 100px;
3851 height: 70px;
3852 cursor: pointer;
3853 box-shadow: inset 0px 0px 1px #FFFFCC;
3854 border:1px dotted #C5C5C5;
3855 text-decoration: none;
3856 color: @white;
3857 position: relative;
3858 font-weight: 300;
3859 font-smooth: always;
3860 margin: 0 10px 20px 0;
3861 padding:5px;
3862 position: relative;
3863 }
3864
3865 .jarvismetro-tile:hover {
3866 z-index: 10;
3867 -webkit-transform: scale(1.07);
3868 -moz-transform: scale(1.07);
3869 }
3870
3871 .jarvismetro-tile.big-cubes {
3872 width:120px;
3873 height:120px;
3874 }
3875
3876 .jarvismetro-tile.double {
3877 width: 249px;
3878 }
3879
3880 .jarvismetro-tile:active {
3881 top: 1px;
3882 left: 1px;
3883 }
3884
3885 .jarvismetro-tile .iconbox {
3886 text-align:center;
3887 }
3888
3889 .jarvismetro-tile .iconbox i {
3890 display:block;
3891 margin: 15px auto 0;
3892 height: 75px;
3893 }
3894 .jarvismetro-tile .iconbox span {
3895 display:block;
3896 text-align:left;
3897 }
3898
3899 .jarvismetro-tile .iconbox span > span {
3900 position: absolute;
3901 right: -3px;
3902 bottom: -3px;
3903 border-radius: 50%;
3904 padding: 5px 5px;
3905 border: 1px solid @white;
3906 }
3907
3908 .selected {
3909 border: 1px solid @blueSky !important;
3910 }
3911
3912 .selected:before {
3913 display:block;
3914 position: absolute;
3915 content: "\f00c";
3916 color: @white;
3917 right: 4px;
3918 font-family: FontAwesome;
3919 z-index: 1002;
3920 }
3921
3922 .selected:after {
3923 display:block;
3924 width: 0;
3925 height: 0;
3926 border-top: 35px solid @blueSky;
3927 border-left: 35px solid rgba(red(@black), green(@black), blue(@black), 0);
3928 position: absolute;
3929 display: block;
3930 right: 0;
3931 content: ".";
3932 top: 0;
3933 z-index: 1001;
3934 }
3935
3936 /*
3937 * SHORT CUT
3938 */
3939
3940 #shortcut {
3941 display:block;
3942 position:absolute;
3943 top:0px;
3944 left:0;
3945 height:auto;
3946 width:100%;
3947 background-color:#33302F;
3948 background-color: rgba(red(@black), green(@black), blue(@black), 0.85);
3949 z-index: 1009;
3950 display:none;
3951 color:@white;
3952 -webkit-box-sizing:border-box;
3953 -moz-box-sizing:border-box;
3954 box-sizing:border-box;
3955 }
3956
3957 #shortcut ul {
3958 padding: 15px 20px 10px;
3959 list-style:none;
3960 margin:0;
3961 box-shadow: 0px 4px 10px rgba(red(@black), green(@black), blue(@black), 0.3);
3962 -moz-box-shadow: 0px 4px 10px rgba(red(@black), green(@black), blue(@black), 0.3);
3963 border-bottom: 1px solid #423F3F;
3964 }
3965
3966 #shortcut ul li {
3967 display:inline-block;
3968 width:auto;
3969 }
3970
3971 #shortcut ul li .jarvismetro-tile {
3972 margin:0px 3px 3px;
3973 border:none;
3974 border-radius: 0px;
3975 -moz-border-radius:0px;
3976 -webkit-border-radius:0px;
3977 }
3978
3979 #shortcut ul li .jarvismetro-tile:hover {
3980 color:@white;
3981 text-decoration:none;
3982 }
3983
3984 #shortcut ul li .jarvismetro-tile:active, #shortcut ul li .jarvismetro-tile:focus {
3985 left:0;
3986 top:0;
3987 }
3988
3989 .shortcut-on #response-btn {
3990 display:none !important;
3991
3992 }
3993
3994 .shortcut-on #main .navbar, .shortcut-on #left-bar .navbar {
3995 border:none !important;
3996 }
3997
3998 /*
3999 * ARROW BOX
4000 */
4001
4002
4003 .arrow-box-up:after, .arrow-box-up:before {
4004 bottom: 100%;
4005 border: solid transparent;
4006 content: " ";
4007 height: 0;
4008 width: 0;
4009 position: absolute;
4010 pointer-events: none;
4011 }
4012
4013 .arrow-box-up:after {
4014 border-color: rgba(red(@white), green(@white), blue(@white), 0);
4015 border-bottom-color: @white;
4016 border-width: 7px;
4017 left: 50%;
4018 margin-left: -7px;
4019 }
4020
4021 .arrow-box-up:before {
4022 border-color: rgba(131, 131, 131, 0);
4023 border-bottom-color: #838383;
4024 border-width: 8px;
4025 left: 50%;
4026 margin-left: -8px;
4027 }
4028
4029 /*
4030 * right
4031 */
4032
4033 .arrow-box-up-right:after, .arrow-box-up-right:before {
4034 bottom: 100%;
4035 border: solid transparent;
4036 content: " ";
4037 height: 0;
4038 width: 0;
4039 position: absolute;
4040 pointer-events: none;
4041 }
4042
4043 .arrow-box-up-right:after {
4044 border-color: rgba(red(@white), green(@white), blue(@white), 0);
4045 border-bottom-color: @white;
4046 border-width: 7px;
4047 right: 10px;
4048 margin-left: -7px;
4049 }
4050
4051 .arrow-box-up-right:before {
4052 border-color: rgba(131, 131, 131, 0);
4053 border-bottom-color: #838383;
4054 border-width: 8px;
4055 right: 9px;
4056 margin-left: -8px;
4057 }
4058
4059 /*
4060 * BOOTSTRAP TOOLTIP
4061 */
4062 .tooltip-inner {
4063 padding: 5px 10px;
4064 font-size:@tooltip-font-size;
4065 font-family:Arial, Helvetica, sans-serif;
4066 font-weight:bold;
4067 border-radius: 0px;
4068 }
4069
4070
4071 /*
4072 * SPARKLINE
4073 */
4074 .jqstooltip {
4075 padding: 7px !important;
4076 border-radius:3px !important;
4077 -webkit-border-radius:3px !important;
4078 -moz-border-radius:3px !important;
4079 border:none !important;
4080 background-color: rgba(red(@black), green(@black), blue(@black), 1) !important;
4081 box-sizing:content-box;
4082 -moz-box-sizing:content-box;
4083 -webkit-box-sizing:content-box;
4084
4085 }
4086
4087 .jqstooltip .jqsfield {
4088 font-family:"Segoe UI","Open Sans",Calibri,Candara,Arial,sans-serif;
4089 font-size:@sparkline-font-size;
4090 }
4091
4092 #sparks {
4093 display: block;
4094 list-style: none;
4095 margin: 10px 0 0;
4096 padding: 0;
4097 text-align: right;
4098 }
4099
4100 #sparks li {
4101 display: inline-block;
4102 max-height: 47px;
4103 overflow: hidden;
4104 text-align: left;
4105 box-sizing:content-box;
4106 -moz-box-sizing:content-box;
4107 -webkit-box-sizing:content-box;
4108 }
4109
4110 #sparks li h5 {
4111 color: #555;
4112 float: left;
4113 font-size: 11px;
4114 font-weight: normal;
4115 margin: -3px 0 0 0;
4116 padding: 0;
4117 border: none;
4118 text-transform: uppercase;
4119 }
4120
4121 #sparks li span {
4122 color: #636363;
4123 display: block;
4124 }
4125
4126 #sparks li {
4127 border-left: 1px dotted #c7c7c7;
4128 padding: 0 10px;
4129 }
4130
4131 #sparks li:last-child {
4132 padding-right: 0;
4133 }
4134
4135 #sparks li:first-child {
4136 border-left: none;
4137 padding-left: 0;
4138 }
4139
4140 .sparks-info {
4141 min-width: 70px;
4142 }
4143
4144 .sparks-info span {
4145 font-size: 18px;
4146 line-height: 20px;
4147 margin: 0;
4148 text-transform: none;
4149 }
4150
4151 .sparks-info .sparkline {
4152 display: block;
4153 float: right;
4154 margin: 3px 0 0 20px;
4155 }
4156
4157 /*
4158 * WEBKIT SCROLLING CSS
4159 * Reference: http://stackoverflow.com/questions/10592657/scrollbar-stylesheet
4160 * GitHub Source: https://gist.github.com/jambu/2004633
4161 */
4162 .custom-scroll::-webkit-scrollbar {
4163 -webkit-overflow-scrolling: touch;
4164 height: 10px;
4165 width: 10px;
4166 }
4167
4168 .custom-scroll::-webkit-scrollbar:hover {
4169 background-color: #E9E9E9;
4170 border: 1px solid #dbdbdb;
4171 }
4172
4173 .custom-scroll::-webkit-scrollbar-button:start:decrement,
4174 .scrollable::-webkit-scrollbar-button:end:increment {
4175 background: transparent;
4176 display: block;
4177 height: 0;
4178 }
4179
4180 .custom-scroll::-webkit-scrollbar-track {
4181 background-clip: padding-box;
4182 border-width: 0 0 0 4px;
4183 border: solid transparent;
4184 }
4185
4186 .custom-scroll::-webkit-scrollbar-track-piece {
4187 -moz-border-radius: 0;
4188 -ms-border-radius: 0;
4189 -o-border-radius: 0;
4190 -webkit-border-radius: 0;
4191 background-color: transparent;
4192 border-radius: 0;
4193 }
4194
4195 .custom-scroll::-webkit-scrollbar-thumb {
4196 -moz-box-shadow: inset 1px 1px 0 rgba(red(@black), green(@black), blue(@black),0.1), inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black),0.07);
4197 -webkit-box-shadow: inset 1px 1px 0 rgba(red(@black), green(@black), blue(@black),0.1), inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black),0.07);
4198 background-clip: padding-box;
4199 background-color: rgba(red(@black), green(@black), blue(@black),0.2);
4200 border-width: 0;
4201 border: none;
4202 box-shadow: inset 1px 1px 0 rgba(red(@black), green(@black), blue(@black),0.1), inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black),0.07);
4203 }
4204
4205 .custom-scroll::-webkit-scrollbar-thumb:vertical, .scrollable::-webkit-scrollbar-thumb:horizontal {
4206 -moz-border-radius: 0;
4207 -ms-border-radius: 0;
4208 -o-border-radius: 0;
4209 -webkit-border-radius: 0;
4210 background-color: @gray-mid-light;
4211 border-radius: 0;
4212 }
4213
4214 .custom-scroll::-webkit-scrollbar-thumb:active {
4215 -moz-box-shadow: inset 1px 1px 3px rgba(red(@black), green(@black), blue(@black),0.33);
4216 -webkit-box-shadow: inset 1px 1px 3px rgba(red(@black), green(@black), blue(@black),0.33);
4217 background-color: rgba(red(@black), green(@black), blue(@black),0.44);
4218 box-shadow: inset 1px 1px 3px rgba(red(@black), green(@black), blue(@black),0.33);
4219 }
4220
4221 .custom-scroll::-webkit-scrollbar-thumb:hover {
4222 background-color: #959595;
4223 }
4224
4225
4226
4227
4228
4229 /*
4230 * Air fields
4231 * Description: absolute positioned objects
4232 */
4233 .air {
4234 position:absolute;
4235 z-index: 5;
4236 }
4237
4238 .air-bottom {
4239 bottom:0px;
4240 }
4241
4242 .air-top {
4243 top:0px;
4244 }
4245
4246 .air-top-right {
4247 top:0px;
4248 right:0px;
4249 }
4250
4251 .air-top-left {
4252 top:0px;
4253 left:0px;
4254 }
4255
4256 .air-bottom-left {
4257 bottom:0px;
4258 left:0px;
4259 }
4260
4261 .air-bottom-right {
4262 bottom:0px;
4263 right:0px;
4264 }
4265
4266 /*
4267 * Typehead
4268 */
4269
4270 .twitter-typeahead .tt-query,
4271 .twitter-typeahead .tt-hint {
4272 margin-bottom: 0;
4273 }
4274
4275 .tt-dropdown-menu {
4276 min-width: 160px;
4277 margin-top: 2px;
4278 padding: 5px 0;
4279 background-color: @white;
4280 border: 1px solid @gray-mid-light;
4281 border: 1px solid rgba(red(@black), green(@black), blue(@black),.2);
4282 *border-right-width: 2px;
4283 *border-bottom-width: 2px;
4284 -webkit-box-shadow: 0 5px 10px rgba(red(@black), green(@black), blue(@black),.2);
4285 -moz-box-shadow: 0 5px 10px rgba(red(@black), green(@black), blue(@black),.2);
4286 box-shadow: 0 5px 10px rgba(red(@black), green(@black), blue(@black),.2);
4287 -webkit-background-clip: padding-box;
4288 -moz-background-clip: padding;
4289 background-clip: padding-box;
4290 }
4291
4292 .tt-suggestion {
4293 display: block;
4294 padding: 3px 20px;
4295 }
4296
4297 .tt-suggestion.tt-is-under-cursor {
4298 color: @white;
4299 background-color: #0081c2;
4300 }
4301
4302 .tt-suggestion.tt-is-under-cursor a {
4303 color: @white;
4304 }
4305
4306 .tt-suggestion p {
4307 margin: 0;
4308 }
4309
4310
4311
4312
4313 /*
4314 * Google Maps
4315 */
4316
4317 .google_maps {
4318 width:100%;
4319 height:350px;
4320 position:relative;
4321 }
4322
4323 .google_maps * {
4324 box-sizing:content-box;
4325 -webkit-box-sizing:content-box;
4326 -moz-box-sizing:content-box;
4327 }
4328
4329 .google_maps img {
4330 max-width: none; /* needed for google map popup*/
4331 }
4332
4333 /*
4334 * Header btn
4335 */
4336
4337 .header-btn {
4338 margin-top:5px;
4339 }
4340
4341
4342 /*
4343 * TREE
4344 */
4345
4346 .tree {
4347 min-height:20px;
4348 -webkit-border-radius:4px;
4349 -moz-border-radius:4px;
4350 border-radius:4px;
4351 }
4352 .tree li {
4353 list-style-type:none;
4354 margin:0;
4355 padding:5px;
4356 position:relative
4357 }
4358
4359 .tree ul ul li:hover {
4360 background:rgba(red(@black), green(@black), blue(@black),.015);
4361 }
4362
4363 .tree li:before, .tree li:after {
4364 content:'';
4365 left:-20px;
4366 position:absolute;
4367 right:auto
4368 }
4369 .tree li:before {
4370 border-left:1px solid @gray-light;
4371 bottom:50px;
4372 height:100%;
4373 top:-11px;
4374 width:1px;
4375 -webkit-transition: "border-color 0.1s ease 0.1s";
4376 -moz-transition: "border-color 0.1s ease 0.1s";
4377 -o-transition: "border-color 0.1s ease 0.1s";
4378 transition: "border-color 0.1s ease 0.1s";
4379 }
4380 .tree li:after {
4381 border-top:1px solid @gray-light;
4382 height:20px;
4383 top:18px;
4384 width:25px
4385 }
4386 .tree li span {
4387 -moz-border-radius:5px;
4388 -webkit-border-radius:5px;
4389 border:1px dotted @gray-light;
4390 border-radius:5px;
4391 display:inline-block;
4392 padding:3px 8px;
4393 text-decoration:none;
4394 -webkit-transition: color .2s ease .1s,background-color .2s ease .1s,border-color .3s ease .2s;
4395 -moz-transition: color .2s ease .1s,background-color .2s ease .1s,border-color .3s ease .2s;
4396 -o-transition: color .2s ease .1s,background-color .2s ease .1s,border-color .3s ease .2s;
4397 transition: color .2s ease .1s,background-color .2s ease .1s,border-color .3s ease .2s;
4398 }
4399 .tree li.parent_li>span {
4400 cursor:pointer;
4401 padding:7px;
4402 }
4403 .tree>ul>li:before, .tree>ul>li::after {
4404 border:0
4405 }
4406 .tree li:last-child::before {
4407 height:30px
4408 }
4409 .tree li.parent_li>span:hover, .tree li.parent_li>span:hover+ul li span {
4410 background:#eee;
4411 border:1px solid #94a0b4;
4412 color:#000
4413 }
4414
4415 .tree > ul {
4416 padding-left:0px;
4417 }
4418
4419 .tree ul ul {
4420 padding-left: 34px;
4421 padding-top: 10px;
4422 }
4423
4424 .tree li.parent_li>span:hover {
4425 background-color: #DF8505;
4426 border: 1px solid #C67605;
4427 color: @white;
4428 }
4429
4430
4431 .tree li.parent_li>span:hover+ul li::before {
4432 border-left-color: #F89406;
4433 }
4434
4435 .tree li.parent_li>span:hover+ul li::after {
4436 border-top-color: #F89406;
4437 }
4438
4439 .tree li.parent_li>span:hover+ul li span {
4440 background: #FDDFB3 !important;
4441 border: 1px solid #FAA937;
4442 color: #000;
4443 }
4444
4445
4446
4447 /*
4448 * VECTOR MAP
4449 */
4450
4451 .jvectormap-label {
4452 position: absolute;
4453 display: none;
4454 border: solid 1px #CDCDCD;
4455 -webkit-border-radius: 3px;
4456 -moz-border-radius: 3px;
4457 border-radius: 3px;
4458 background: #292929;
4459 color: white;
4460 font-family: sans-serif, Verdana;
4461 font-size: smaller;
4462 padding: 3px;
4463 }
4464
4465 .jvectormap-zoomin, .jvectormap-zoomout {
4466 position: absolute;
4467 background: #292929;
4468 padding: 4px;
4469 width: 22px;
4470 height: 22px;
4471 cursor: pointer;
4472 line-height: 10px;
4473 text-align: center;
4474 font-size: 14px;
4475 border-radius: 2px;
4476 -webkit-border-radius: 2px;
4477 -moz-border-radius: 2px;
4478 box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
4479 -moz-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
4480 -webkit-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
4481 background-color: @white;
4482 border: 1px solid @gray-mid-light;
4483 }
4484
4485 .jvectormap-zoomin:hover, .jvectormap-zoomout:hover {
4486 background:@gray-lighter;
4487 border-color:lighten(@gray-light, 25%);
4488 }
4489
4490
4491 .jvectormap-zoomin {
4492 top: 0px;
4493 }
4494
4495 .jvectormap-zoomout {
4496 top: 24px;
4497 }
4498
4499
4500 .vector-map {
4501 height:300px;
4502 width:100%;
4503 padding:10px;
4504 }
4505
4506 #heat-fill {
4507 display:block;
4508 position: relative;
4509 margin-bottom:20px;
4510 background:@gray-dark;
4511 height:7px;
4512 width:200px;
4513 background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAAABCAIAAAAU3Xa1AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowMDE4MkZGMzMzOTgxMUUzODZBQUNFQUNFOTk0NEUxRiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowMDE4MkZGNDMzOTgxMUUzODZBQUNFQUNFOTk0NEUxRiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAwMTgyRkYxMzM5ODExRTM4NkFBQ0VBQ0U5OTQ0RTFGIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAwMTgyRkYyMzM5ODExRTM4NkFBQ0VBQ0U5OTQ0RTFGIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+rG8MDAAAAM5JREFUeNpUUtESwyAIg8ft9v8/W4ElBPWKV1AIiKEeEWVuVlWjINSVONBnirQDxukNgcuyTQsBzLHMDsLIQQw+nIL71JqNJ5GZJXApFNpmtlagQjfS2xGbkFA4Iwu+hu0sK3Wl3nOwNv7TvPrWk3X0eW9dK1pU9hK2eTuWb2ySJmlziutA3iBxmblPNvA5PNsuUpoDY80+Z0SW1IRpDEqwC58C14tsr1f8le8si0aojdADr/1UjaclsFashX8GGkL9wDxtRsV6ft/PX4ABADRzhOVIOJaAAAAAAElFTkSuQmCC)
4514 }
4515
4516 .fill-a, .fill-b {
4517 width:20px;
4518 text-align: right;
4519 overflow:hidden;
4520 text-overflow:ellipsis;
4521 display:block;
4522 background:@white;
4523 padding-right:4px;
4524 position:absolute;
4525 left:0px;
4526 margin-top:-7px;
4527 font-weight:bold;
4528
4529 }.fill-b {
4530 text-align:left;
4531 position:absolute;
4532 right:0px;
4533 left:auto;
4534 top:0px;
4535 width:60px;
4536 padding-left:4px;
4537 padding-right:0px;
4538
4539 }
4540
4541
4542 /*
4543 * CKEDITOR
4544 */
4545
4546 .cke_top {
4547 background: rgba(248, 248, 248, 0.9) !important;
4548 background-image:none !important;
4549 }
4550
4551
4552 /*
4553 * PACE PROGRESS BAR
4554 */
4555
4556 .pace {
4557 -webkit-pointer-events: none;
4558 pointer-events: none;
4559 -webkit-user-select: none;
4560 -moz-user-select: none;
4561 user-select: none;
4562 }
4563
4564 .pace-inactive {
4565 display: none;
4566 }
4567
4568 .pace .pace-progress {
4569 background: @blueStandard;
4570 position: fixed;
4571 z-index: @pace-zindex;
4572 top: 0;
4573 left: 0;
4574 height: 2px;
4575
4576 -webkit-transition: width 1s;
4577 -moz-transition: width 1s;
4578 -o-transition: width 1s;
4579 transition: width 1s;
4580 }
4581
4582 .pace .pace-progress-inner {
4583 display: block;
4584 position: absolute;
4585 right: 0px;
4586 width: 100px;
4587 height: 100%;
4588 box-shadow: 0 0 10px #29d, 0 0 5px #29d;
4589 opacity: 1.0;
4590 -webkit-transform: rotate(3deg) translate(0px, -4px);
4591 -moz-transform: rotate(3deg) translate(0px, -4px);
4592 -ms-transform: rotate(3deg) translate(0px, -4px);
4593 -o-transform: rotate(3deg) translate(0px, -4px);
4594 transform: rotate(3deg) translate(0px, -4px);
4595 }
4596
4597 .pace .pace-activity {
4598 display: block;
4599 position: fixed;
4600 z-index: 2000;
4601 top: 63px;
4602 right: 40px;
4603 width: 14px;
4604 height: 14px;
4605 border: solid 2px transparent;
4606 border-top-color: #29d;
4607 border-left-color: #29d;
4608 border-radius: 10px;
4609 -webkit-animation: pace-spinner 400ms linear infinite;
4610 -moz-animation: pace-spinner 400ms linear infinite;
4611 -ms-animation: pace-spinner 400ms linear infinite;
4612 -o-animation: pace-spinner 400ms linear infinite;
4613 animation: pace-spinner 400ms linear infinite;
4614 }
4615
4616 @-webkit-keyframes pace-spinner {
4617 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
4618 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
4619 }
4620 @-moz-keyframes pace-spinner {
4621 0% { -moz-transform: rotate(0deg); transform: rotate(0deg); }
4622 100% { -moz-transform: rotate(360deg); transform: rotate(360deg); }
4623 }
4624 @-o-keyframes pace-spinner {
4625 0% { -o-transform: rotate(0deg); transform: rotate(0deg); }
4626 100% { -o-transform: rotate(360deg); transform: rotate(360deg); }
4627 }
4628 @-ms-keyframes pace-spinner {
4629 0% { -ms-transform: rotate(0deg); transform: rotate(0deg); }
4630 100% { -ms-transform: rotate(360deg); transform: rotate(360deg); }
4631 }
4632 @keyframes pace-spinner {
4633 0% { transform: rotate(0deg); transform: rotate(0deg); }
4634 100% { transform: rotate(360deg); transform: rotate(360deg); }
4635 }
4636
4637 /*
4638 * BS Multiselect
4639 * TODO:
4640 */
4641
4642 .multiselect-container {
4643 position: absolute;
4644 list-style-type: none;
4645 margin: 0;
4646 padding: 0
4647 }
4648 .multiselect-container .input-group {
4649 margin: 5px
4650 }
4651 .multiselect-container > li {
4652 padding: 0
4653 }
4654 .multiselect-container > li > a.multiselect-all label {
4655 font-weight: bold
4656 }
4657 .multiselect-container > li > label.multiselect-group {
4658 margin: 0;
4659 padding: 3px 20px 3px 20px;
4660 height: 100%;
4661 font-weight: bold
4662 }
4663 .multiselect-container > li > a > label {
4664 margin: 0;
4665 height: 100%;
4666 cursor: pointer;
4667 font-weight: normal
4668 }
4669 .multiselect-container > li > a > label.radio, .multiselect-container > li > a > label.checkbox {
4670 margin: 0
4671 }
4672 .multiselect-container > li > a > label > input[type="checkbox"] {
4673 margin-bottom: 5px
4674 }
4675 .btn-group > .btn-group:nth-child(2)> .multiselect.btn {
4676 border-top-left-radius: 4px;
4677 border-bottom-left-radius: 4px
4678 }