Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(391)

Side by Side Diff: remoting/webapp/main.css

Issue 9586016: Removed unused CSS. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Created 8 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
« no previous file with comments | « remoting/webapp/connection_history.css ('k') | remoting/webapp/util.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. 1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
2 * Use of this source code is governed by a BSD-style license that can be 2 * Use of this source code is governed by a BSD-style license that can be
3 * found in the LICENSE file. 3 * found in the LICENSE file.
4 */ 4 */
5 5
6 html,body,div,span,applet,object,iframe, 6 html,body,div,span,applet,object,iframe,
7 h1,h2,h3,h4,h5,h6,p,blockquote,pre, 7 h1,h2,h3,h4,h5,h6,p,blockquote,pre,
8 a,abbr,acronym,address,big,cite,code, 8 a,abbr,acronym,address,big,cite,code,
9 del,dfn,em,font,img,ins,kbd,q,s,samp, 9 del,dfn,em,font,img,ins,kbd,q,s,samp,
10 small,strike,strong,sub,sup,tt,var, 10 small,strike,strong,sub,sup,tt,var,
11 dl,dt,dd,ol,ul,li, 11 dl,dt,dd,ol,ul,li,
12 fieldset,form,label,legend, 12 fieldset,form,label,legend,
13 table,caption,tbody,tfoot,thead,tr,th,td { 13 table,caption,tbody,tfoot,thead,tr,th,td {
14 margin: 0; 14 margin: 0;
15 padding: 0; 15 padding: 0;
16 border: 0; 16 border: 0;
17 outline: 0; 17 outline: 0;
18 font-weight: inherit; 18 font-weight: inherit;
19 font-style: inherit; 19 font-style: inherit;
20 font-size: 100%; 20 font-size: 100%;
21 font-family: inherit; 21 font-family: inherit;
22 vertical-align: baseline; 22 vertical-align: baseline;
23 } 23 }
24 body { 24 body {
25 line-height: 1.3; 25 line-height: 1.3;
26 color: black; 26 color: black;
27 background: white; 27 background: white;
28 } 28 }
29 ol,ul {
30 list-style: none;
31 }
32 table { 29 table {
33 border-collapse: separate; 30 border-collapse: separate;
34 border-spacing: 0; 31 border-spacing: 0;
35 } 32 }
36 blockquote:before,blockquote:after,
37 q:before,q:after {
38 content: "";
39 }
40 blockquote,q {
41 quotes: "" "";
42 }
43 input::-moz-focus-inner {
44 border: 0;
45 }
46
47 33
48 /*------------------------------------------------------------------ 34 /*------------------------------------------------------------------
49 @global Type 35 @global Type
50 ------------------------------------------------------------------*/ 36 ------------------------------------------------------------------*/
51 body,body input,body button,body td { 37 body,body input,body button,body td {
52 font-family: "Arial", "Helvetica", sans-serif; 38 font-family: "Arial", "Helvetica", sans-serif;
53 color: #222; 39 color: #222;
54 font-size: 13px; 40 font-size: 13px;
55 -webkit-tap-highlight-color: rgba(0,0,0,0); 41 -webkit-tap-highlight-color: rgba(0,0,0,0);
56 } 42 }
57 h1,h2,h3,h4,h5 { 43 h1,h2,h3,h4,h5 {
58 font-size: 16px; 44 font-size: 16px;
59 line-height:24px; 45 line-height:24px;
60 font-weight: normal; 46 font-weight: normal;
61 color: #222; 47 color: #222;
62 } 48 }
63 p { 49 p {
64 margin: 0 0 1em; 50 margin: 0 0 1em;
65 font-size: 13px; 51 font-size: 13px;
66 line-height: 18px; 52 line-height: 18px;
67 } 53 }
68 p.nonLatin {
69 font-size: 14px;
70 line-height: 21px;
71 }
72 li {
73 line-height: 17px;
74 }
75 a { 54 a {
76 text-decoration: none; 55 text-decoration: none;
77 color: #15c; 56 color: #15c;
78 cursor: pointer; 57 cursor: pointer;
79 } 58 }
80 a:visited { 59 a:visited {
81 color: #61c; 60 color: #61c;
82 } 61 }
83 a:active { 62 a:active {
84 color: #d14836; 63 color: #d14836;
85 } 64 }
86 a.secondary {
87 text-decoration: none;
88 color: #2D9AE3;
89 }
90 iframe {
91 border: 0px;
92 }
93 strong, b { 65 strong, b {
94 color: #000; 66 color: #000;
95 font-weight:bold; 67 font-weight:bold;
96 } 68 }
97 em { 69 em {
98 font-style: italic; 70 font-style: italic;
99 } 71 }
100 72
101 div.mobile {
102 width:320px;
103 }
104
105 .clearfix:after { clear: both; }
106 .clearfix { zoom: 1; }
107
108 /*------------------------------------------------------------------
109 Stickersheet global styles
110 ------------------------------------------------------------------*/
111 #stickersheet #siteTitle {
112 padding: 30px 40px;
113 }
114 #stickers > ul > li {
115 padding: 30px 0;
116 border-bottom: 1px solid #DDD;
117 position: relative;
118 }
119 .componentName {
120 display: block;
121 height: 29px;
122 float: none;
123 font-size: 20px;
124 line-height: 24px;
125 color: #222;
126 margin-bottom: 21px;
127 margin-left: 0px;
128 margin-right: 0px;
129 }
130 .option {
131 float: left;
132 width: 336px;
133 margin-right: 16px;
134 }
135 .option .componentName {
136 margin-bottom: 0;
137 }
138 #stickersheet h2.componentName a {
139 color: #222;
140 }
141 #stickers > ul {
142 margin: 0 44px;
143 }
144 /* stickersheet specific positioning */
145 .kd-modaldialog.demo,
146 .kd-settings.demo {
147 position: relative;
148 top: 0;
149 left: 0;
150 margin-left: 0;
151 -webkit-transform: scale(1.0);
152 z-index: 0;
153 }
154 #stickers #kd-tooltip {
155 top: 75px;
156 margin-left: 0;
157 }
158 #wrap {
159 overflow: auto;
160 height: 100%;
161 }
162 #stickers > ul > li ol {
163 margin: 5px 10px;
164 }
165 #stickers > ul > li ol li {
166 margin-bottom: 5px;
167 }
168 #stickers .kd-buttonbar {
169 margin-bottom: 16px;
170 }
171 #modaldemo {
172 display: none;
173 }
174 .sectionTitle {
175 float: left;
176 width: 160px;
177 margin-right: 16px;
178 clear: left;
179 margin-bottom: 16px;
180 }
181 .sectionContent {
182 float: left;
183 clear: right;
184 margin-bottom: 16px;
185 }
186
187 /*------------------------------------------------------------------
188 Styleguide container
189 ------------------------------------------------------------------*/
190 .styleguide {
191 padding: 0 44px 44px;
192 }
193 .styleguide .section {
194 position:relative;
195 padding: 44px 0;
196 height: 100%;
197 overflow:visible;
198 border-bottom: 1px solid #ebebeb;
199 }
200 .styleguide .section.clearfix {
201 overflow:hidden;
202 }
203 .styleguide .section .section {
204 padding: 16px 0;
205 border-bottom: 0;
206 }
207 .styleguide .section h3 {
208 /* margin: 16px 0;*/
209 }
210 #styleGuideNav {
211 width:156px;
212 position:fixed;
213 left:0;
214 top:28px;
215 }
216 #styleGuideNav li li a{
217 width:144px;
218 overflow:hidden;
219 white-space:nowrap;
220 text-overflow:ellipsis;
221 }
222 #styleGuideNav li li a.selected{
223 color:#d14836;
224 }
225
226 /*------------------------------------------------------------------
227 Notes And Metrics
228 ------------------------------------------------------------------*/
229 .notesBox .kd-zippy{
230 margin-top:-20px;
231 }
232 .notesBox .kd-zippy .row{
233 float:right;
234 display: block;
235 clear:both;
236 }
237 .notesBox .kd-disclosureindicator {
238 position:relative;
239 top:-2px;
240 cursor:default;
241 }
242 .notesBox .kd-disclosureindicator + h3{
243 display: inline;
244 margin-left:6px;
245 cursor:default;
246 }
247 .notesBox .kd-zippycontent{
248 height:100%;
249 overflow:hidden;
250 margin-bottom: 20px;
251 margin-left:16px;
252 background-color: #F5F5F5;
253 clear:both;
254 }
255 .notesBox .notes{
256 width:320px;
257 float:left;
258 padding-top:10px;
259 padding-bottom:10px;
260 padding-left:16px;
261 }
262
263 .notesBox h3{
264 margin-bottom:10px;
265 margin-top:10px;
266 }
267
268 .notesBox .metrics{
269 width:320px;
270 float:left;
271 padding-top:10px;
272 padding-bottom:10px;
273 padding-left:16px;
274
275 }
276
277 .notesBox ul {
278 list-style:disc outside;
279 padding: 0 16px 16px;
280 }
281
282 .notesBox ul li {
283 margin-bottom: 5px;
284 }
285
286 /*------------------------------------------------------------------
287 Grid
288 ------------------------------------------------------------------*/
289 #grid {
290 border-left: 44px solid rgba(255,255,0,0.1);
291 border-right: 44px solid rgba(255,255,0,0.1);
292 left: 0;
293 top: 0;
294 bottom: 0;
295 z-index: 100;
296 -webkit-box-sizing: content-box;
297 overflow: hidden;
298 -webkit-transition: all 0.218s;
299 }
300 html.x-expand #grid {
301 border-left: 72px solid rgba(255,255,0,0.05);
302 border-right: 72px solid rgba(255,255,0,0.05);
303 }
304 .gridline {
305 width: 72px;
306 height: 117px;
307 background-color: rgba(0,0,127,0.04);
308 border-left: 28px solid rgba(0,0,127,0.01);
309 border-right: 28px solid rgba(0,0,127,0.01);
310 margin-right: 16px;
311 float: left;
312 -webkit-box-sizing: border-box;
313 }
314 .gridline-right {
315 float: right;
316 margin-right: 0;
317 margin-left: 16px;
318 }
319 .gridfill {
320 background: red;
321 }
322
323 /*------------------------------------------------------------------
324 Component: Typography
325 ------------------------------------------------------------------*/
326 .productName{
327 font-size: 20px;
328 line-height: 24px;
329 color: #DD4B39;
330 }
331 .title{
332 color:#1155CC;
333 font-weight:normal;
334 }
335 .greytext{
336 color:#777777;
337 }
338 .bodylink{
339 color:#1155CC;
340 }
341 .searchlink{
342 color:#1122CC;
343 }
344 .visitedlink{
345 color:#6611CC;
346 }
347 .redlink{
348 color:#DD4B39;
349 }
350 .secondary{
351 font-size:11px;
352 color:#777777;
353 }
354 .secondary.nonLatin{
355 font-size:12px;
356 color:#777777;
357 }
358 .source{
359 color:#009933;
360 }
361
362 #typography p {
363 line-height: 170%;
364 margin-bottom: 0;
365 }
366
367 /*------------------------------------------------------------------
368 Component: Colors
369 ------------------------------------------------------------------*/
370 #colorTable {
371 border-left:1px solid #ebebeb;
372 border-bottom:1px solid #ebebeb;
373 }
374 #colorTable th{
375 background:#f5f5f5;
376 border:1px solid #e5e5e5;
377 border-right:1px solid #e5e5e5;
378 border-top:1px solid #e5e5e5;
379 font-weight:bold;
380 color:#222;
381 }
382 #colorTable td, #colorTable th{
383 text-align:left;
384 border-top:1px solid #ebebeb;
385 border-right:1px solid #ebebeb;
386 padding:4px 4px;
387 }
388 .colorBlock {
389 color: #FFF;
390 font-weight: bold;
391 }
392 .colorBlock.dark {
393 color: #222;
394 }
395 .colorBlock span {
396 text-align: left;
397 display: inline-block;
398 width: 100%;
399 }
400 .colorBlock:first-child {
401 margin-left: 0;
402 }
403
404
405 /* Background Color Changer */
406 #bgColorChanger{
407 display:block;
408 position: relative;
409 width:250px;
410 margin-bottom:40px;
411
412 background: #FFF;
413 outline: 1px solid rgba(0,0,0,0.2);
414 -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
415 -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
416 box-shadow: 0 2px 4px rgba(0,0,0,0.2);
417 padding: 16px;
418 -webkit-border-radius: 2px;
419 -moz-border-radius: 2px;
420 border-radius: 2px;
421 }
422 #bgColorChanger .title {
423 padding-right:10px;
424 }
425
426 #otherColor{
427 display:none;
428 width:auto;
429 margin-top:16px;
430 }
431 #otherColor input[type=text]{
432 width:auto;
433 }
434 #otherColor ul li, #otherColor label{display:inline-block; margin-bottom:0;}
435 #otherColor ul li{margin-left:8px;}
436 #otherColor ul li:first-child{margin-left:0;}
437
438 /*------------------------------------------------------------------
439 Component: Horizontal Rules
440 ------------------------------------------------------------------*/
441 .whiteBox,.greyBox {
442 padding: 16px 0;
443 margin-bottom: 16px;
444 }
445 .greyBox {
446 background: #f1f1f1;
447 }
448 .kd-ruledBox {
449 width: 100%;
450 }
451 .kd-greyRuled {
452 border-top: 1px solid #e5e5e5;
453 }
454 .kd-whiteRuled {
455 border-top: 1px solid #ebebeb;
456 }
457
458 /*------------------------------------------------------------------
459 Component: Shadows
460 ------------------------------------------------------------------*/
461 .shadowList{
462 padding:16px;
463 list-style:disc inside;
464 }
465 .shadowList > li{
466 margin-bottom:16px;
467 position:relative;
468 }
469 .shadowList .kd-modaldialog{
470 display:block;
471 position:relative;
472 top:0;
473 left:0;
474 opacity:1;
475 margin:16px 0;
476 -webkit-transform:none;
477 }
478
479 /*------------------------------------------------------------------
480 Component: Search Bar (Google Bar)
481 ------------------------------------------------------------------*/
482 #kd-searchbar,
483 #kd-googlebar{
484 position:relative;
485 background:#f1f1f1;
486 height:29px;
487 padding:21px 0;
488 border-bottom:1px solid #e5e5e5;
489 z-index:40;
490 }
491 #kd-googlebar.alternate{
492 z-index:30;
493 }
494
495 /* Search area */
496 #kd-search {
497 position:absolute;
498 left:220px;
499 right:308px;
500 bottom:21px;
501 max-width:600px;
502 height:29px;
503 }
504 #kd-searchfield {
505 position:absolute;
506 left:0;
507 right:88px;
508 margin:0;
509 font-size:16px;
510 color:#000;
511 }
512 ::-webkit-input-placeholder{
513 color:#999;
514 }
515 #kd-searchfield:-moz-placeholder, input:-moz-placeholder{
516 color:#999;
517 }
518 #kd-searchbutton {
519 position:absolute;
520 top:0;
521 right:0;
522 }
523 #kd-searchbutton img {
524 opacity:1;
525 }
526 #kd-googlebar.alternate #kd-search {
527 left:414px;
528 max-width:406px;
529 }
530 .kd-googlebuttonbar .kd-button{
531 min-width:0;
532 width:28px;
533 }
534 .kd-googlebuttonbar .kd-button .maskedIcon{
535 background:#7b7b7b;
536 display:inline-block;
537 width:21px;
538 height:21px;
539 margin:4px 0 0;
540 -moz-transition: all 0.218s;
541 -webkit-transition: all 0.218s;
542 -o-transition: all 0.218s;
543 }
544 .kd-googlebuttonbar .kd-button:hover .maskedIcon,
545 .kd-googlebuttonbar .kd-button:active .maskedIcon,
546 .kd-googlebuttonbar .kd-button.selected .maskedIcon{
547 background:#DD4B39;
548 }
549 .kd-googlebuttonbar .kd-button .maskedIcon img{visibility:hidden;}
550 .kd-googlebuttonbar.kd-segmentedcontrol{
551 display:inline-block;
552 float:none;
553 margin-left:0;
554 }
555
556
557 /* Mobile variations */
558 .mobile #kd-searchbar,
559 .mobile #kd-googlebar {
560 height:29px;
561 padding:14px 0;
562 }
563 .mobile #kd-searchbar .kd-buttonbar.right,
564 .mobile #kd-googlebar .kd-buttonbar.right{
565 margin-right:7px;
566 }
567 .mobile #kd-searchbar #kd-social .kd-share,
568 .mobile #kd-googlebar #kd-social .kd-share{
569 padding-left:0;
570 margin-left:9px;
571 }
572 .mobile #kd-searchbar #kd-social .kd-notifications,
573 .mobile #kd-googlebar #kd-social .kd-notifications{
574 min-width:19px;
575 width:19px;
576 }
577 .mobile #kd-searchbar #kd-social .kd-share,
578 .mobile #kd-googlebar #kd-social .kd-share{
579 min-width:19px;
580 width:19px;
581 }
582 .mobile #kd-searchbar #kd-social .kd-avatar,
583 .mobile #kd-googlebar #kd-social .kd-avatar{
584 margin-left:9px;
585 }
586
587 /*------------------------------------------------------------------
588 Subcomponent: App Switcher
589 ------------------------------------------------------------------*/
590 .kd-appswitcher {
591 position:relative;
592 top:-21px;
593 width:160px;
594 height:71px;
595 margin:0 0 0 44px;
596 float:left;
597 }
598 .kd-appswitcher .logo {
599 display:block;
600 width:160px;
601 height:71px;
602 cursor:pointer;
603 }
604 .kd-appswitcher .logo img {
605 display:block;
606 margin-top:1px;
607 width:117px;
608 height:71px;
609 float:left;
610 image-rendering:optimizeQuality;
611 }
612 .kd-appswitcher .logo .kd-disclosureindicator {
613 display:block;
614 position:relative;
615 top:50%;
616 float:left;
617 margin-top:-2px;
618 margin-left:6px;
619 background-position:0 0;
620 -webkit-transform:rotate(90deg);
621 -moz-transform:rotate(90deg);
622 transform:rotate(90deg);
623 opacity:0.3;
624
625 -webkit-transition:opacity 0.218s;
626 -moz-transition:opacity 0.218s;
627 transition:opacity 0.218s;
628 }
629 .kd-appswitcher:hover .logo .kd-disclosureindicator {
630 opacity:1;
631 -webkit-transition:opacity 0.18s;
632 -moz-transition:opacity 0.18s;
633 transition:opacity 0.18s;
634 }
635 .kd-appswitcher.open span.logo {
636 cursor:default;
637 }
638
639 .kd-appswitcher-menu {
640 position:absolute;
641 top:71px;
642 left:-4000px;
643 max-height:44px;
644 margin-top:-10px;
645
646 background:#2d2d2d;
647 border-bottom:1px solid #686868;
648
649 -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
650 -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
651 box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
652
653 z-index:9999;
654 opacity:0;
655 -webkit-transition-property:opacity, max-height, margin, left;
656 -webkit-transition-duration:0.218s, 0.218s, 0.218s, 0s;
657 -webkit-transition-delay:0s, 0s, 0s, 0.218s;
658 -moz-transition-property:opacity, max-height, margin, left;
659 -moz-transition-duration:0.218s, 0.218s, 0.218s, 0s;
660 -moz-transition-delay:0s, 0s, 0s, 0.218s;
661 transition-property:opacity, max-height, margin, left;
662 transition-duration:0.218s, 0.218s, 0.218s, 0s;
663 transition-delay:0s, 0s, 0s, 0.218s;
664 }
665 .kd-appswitcher.open .kd-appswitcher-menu {
666 left:-18px;
667 max-height:400px;
668 opacity:1;
669 margin-top:0;
670 -webkit-transition-property:opacity, max-height, margin, left;
671 -webkit-transition-duration:0s, 0s, 0.218s, 0s;
672 -webkit-transition-delay:0s;
673 -moz-transition-property:opacity, max-height, margin, left;
674 -moz-transition-duration:0s, 0s, 0.218s, 0s;
675 -moz-transition-delay:0s;
676 transition-property:opacity, max-height, margin, left;
677 transition-duration:0s, 0s, 0.218s, 0s;
678 transition-delay:0s;
679 }
680 .kd-appswitcher-menu:before {
681 content:"";
682 display:block;
683 position:absolute;
684 top:-12px;
685 left:133px;
686 margin-left:-1px;
687 border-style:solid;
688 border-color:#777 transparent;
689 border-width:0 12px 12px;
690 z-index:20;
691 }
692 .kd-appswitcher-menu:after {
693 content:"";
694 display:block;
695 position:absolute;
696 top:-11px;
697 left:133px;
698 border-style:solid;
699 border-color:#2d2d2d transparent;
700 border-width:0 11px 11px;
701 z-index:21;
702 }
703 .kd-app {
704 width:192px;
705 height:43px;
706 border-top:1px solid #7d7d7d;
707 }
708 .kd-app:first-child {
709 border-top-color:#2d2d2d;
710 }
711 .kd-app > a {
712 display:block;
713 width:135px;
714 height:43px;
715 line-height:43px;
716 padding-left:57px;
717 background-position:12px center;
718 background-repeat:no-repeat;
719 color:#fff;
720 }
721 .kd-app:hover > a,
722 a.logo:hover + .kd-appswitcher-menu .kd-app-search > a {
723 background-color:#4c4c4c;
724 }
725 .kd-app-double > a {
726 height:34px;
727 padding-top:9px;
728 line-height:13px;
729 }
730 .app-caption {
731 font-size:10px;
732 color:rgba(255,255,255,0.5);
733 }
734
735 .killTransition {
736 -webkit-transition-duration:0;
737 -moz-transition-duration:0;
738 transition:0;
739 }
740 .kd-more-menu {
741 position:absolute;
742 top:0;
743 bottom:-1px;
744 left:-1000%;
745 width:0;
746 overflow:hidden;
747
748 background:#fff;
749 border:1px solid #e5e5e5;
750
751 -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
752 -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
753 box-shadow: 0 2px 4px rgba(0,0,0,0.2);
754
755 -webkit-transition-property:width, left;
756 -webkit-transition-duration:0.218s, 0s;
757 -webkit-transition-easing-function:ease-in, linear;
758 -webkit-transition-delay:0.2s, 0.418s;
759 -moz-transition-property:width, left;
760 -moz-transition-duration:0.218s, 0s;
761 -moz-transition-easing-function:ease-in, linear;
762 -moz-transition-delay:0.2s, 0.418s;
763 -o-transition-property:width, left;
764 -o-transition-duration:0.218s, 0s;
765 -o-transition-easing-function:ease-in, linear;
766 -o-transition-delay:0.2s, 0.418s;
767 transition-property:width, left;
768 transition-duration:0.218s, 0s;
769 transition-easing-function:ease-in, linear;
770 transition-delay:0.2s, 0.418s;
771 }
772 .kd-app:hover > .kd-more-menu,
773 .kd-app .kd-more-menu.open {
774 width:192px;
775 left:100%;
776
777 -webkit-transition-easing-function:ease-out, linear;
778 -webkit-transition-delay:0.2s;
779 -moz-transition-easing-function:ease-out, linear;
780 -moz-transition-delay:0.2s;
781 -o-transition-easing-function:ease-out, linear;
782 -o-transition-delay:0.2s;
783 transition-easing-function:ease-out, linear;
784 transition-delay:0.2s;
785 }
786 .kd-more-menu .kd-more-container {
787 position:absolute;
788 top:0;
789 right:0;
790 width:192px;
791 }
792 .kd-more-container ul{
793 float:left;
794 }
795 .kd-appswitcher-menu .kd-app-more:hover .kd-more-menu,
796 .kd-appswitcher-menu .kd-app-more .kd-more-container {
797 width:576px;
798 }
799 .kd-more-menu .kd-app { border-top:1px solid #e5e5e5; }
800 .kd-more-menu .kd-app:first-child { border-top:none; }
801 .kd-more-menu .kd-app:hover > a { background-color:rgba(0,0,0,0.05); }
802
803 .kd-more-menu .kd-app > a { color:#2d2d2d; }
804
805
806 .mobile .kd-appswitcher {
807 position:absolute;
808 top:0;
809 left:0;
810 margin:0 0 0 16px;
811 float:none;
812 width:120px;
813 height:57px;
814 }
815 .mobile .kd-appswitcher .kd-appswitcher-menu { top:57px; }
816 .mobile .kd-appswitcher.open .kd-appswitcher-menu { left:-10px; }
817
818 .mobile .kd-appswitcher .kd-appswitcher-menu:before {
819 top:-8px;
820 left:15px;
821 border-width:0 8px 8px;
822 }
823 .mobile .kd-appswitcher .kd-appswitcher-menu:after {
824 top:-7px;
825 left:15px;
826 border-width:0 7px 7px;
827 }
828 .mobile .kd-appswitcher .logo { width:120px; height:60px; }
829 .mobile .kd-appswitcher .logo img { width:99px; height:60px; }
830
831 .mobile .kd-more-menu { left:-9999px; }
832 .mobile .kd-appswitcher-menu .kd-app-more .kd-more-container { width:192px; }
833
834 .mobile .kd-app:hover > .kd-more-menu,
835 .mobile .kd-app .kd-more-menu.open {
836 width:192px;
837 left:50px;
838 }
839
840 /*------------------------------------------------------------------
841 Component: Sidebars
842 ------------------------------------------------------------------*/
843 #styleguide #sidebars {
844 overflow: visible;
845 height: 544px;
846 }
847 .sidebarHolder {
848 width: 220px;
849 float: left;
850 /* border-left:1px solid #ebebeb;
851 border-right:1px solid #ebebeb;*/
852 }
853 .sidebarHolder h4 {
854 padding: 16px 0;
855 }
856
857 .kd-content-sidebar {
858 width:160px;
859 padding:16px 0px 16px 44px;
860 border-left:1px solid #ebebeb;
861 }
862 .kd-content-sidebar li {
863 position:relative;
864 margin-left: -16px;
865 border-bottom:1px solid transparent;
866 }
867 .kd-content-sidebar li a {
868 display: block;
869 line-height: 29px;
870 color: #333;
871 font-size: 13px;
872 cursor:default;
873 }
874
875 .kd-content-sidebar .kd-zippy .row a {
876 margin-left: 16px;
877 }
878 .kd-content-sidebar li
879 .kd-content-sidebar ul ul{
880 margin-left:28px;
881 }
882 .kd-content-sidebar ul ul li,
883 .kd-content-sidebar ul ul li a{
884 line-height:19px;
885 }
886 .kd-content-sidebar ul ul li a{
887 padding-left: 12px;
888 margin-left: 32px;
889 }
890 .kd-content-sidebar ul ul li .kd-disclosureindicator{
891 top:0;
892 height:19px;
893 }
894 .kd-content-sidebar ul ul li:hover .kd-disclosureindicator{
895 /* height:16px;*/
896 }
897 .kd-content-sidebar li.selected .kd-disclosureindicator,
898
899 .kd-content-sidebar li .kd-disclosureindicator {
900 position: relative;
901 display: block;
902 float: left;
903 width:15px;
904 height:29px;
905 background-position:center;
906 margin-left:-1px;
907 opacity: 0.8;
908 filter: alpha(opacity=80);
909 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
910 -moz-transition: none;
911 -o-transition: none;
912 -webkit-transition: none;
913 cursor:default;
914 }
915 .kd-content-sidebar li:hover > .kd-disclosureindicator {
916 opacity: 1.0;
917 filter: alpha(opacity=80);
918 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
919 }
920
921 .kd-content-sidebar ul > li > a {
922 padding-left: 16px;
923 }
924
925 .kd-content-sidebar ul > li > a:hover {
926 background-color: #eee;
927 }
928 .kd-content-sidebar span.row {
929 display: block;
930 }
931 .kd-content-sidebar span.row.split:hover {
932 background-color: transparent;
933 }
934
935 .kd-content-sidebar span.row:hover,
936 .kd-content-sidebar .kd-zippycontent li a:hover,
937 .kd-content-sidebar span.row.split a:hover,
938 .kd-content-sidebar span.row.split .kd-disclosureindicator:hover {
939 background-color: #eee;
940 color: #222;
941 }
942
943 .kd-content-sidebar .kd-zippy span.row:hover .kd-disclosureindicator,
944 .kd-content-sidebar .kd-zippy span.row.split .kd-disclosureindicator:hover {
945 opacity: 1.0;
946 filter: alpha(opacity=80);
947 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
948 }
949
950 .kd-content-sidebar li.selected a {
951 color: #d14836;
952 }
953 ul.iconlist li a, li.kd-labellistitem a {
954 background-position: 25px 50%;
955 background-repeat: no-repeat;
956 }
957 li.kd-labellistitem.selected a{
958 background-position:20px 50%;
959 }
960 ul.iconlist li.kd-sidebarlistitem a{
961 background-position: 44px 50%;
962 padding-left:75px;
963 }
964 ul.iconlist li.kd-sidebarlistitem.selected a{
965 background-position: 39px 50%;
966 padding-left:70px;
967 }
968 .kd-menulabel{
969 position:absolute;
970 height:11px;
971 width:11px;
972 top:11px;
973 right:11px;
974 cursor:default;
975 border-radius:1px;
976 -moz-border-radius:1px;
977 -webkit-border-radius:1px;
978 }
979 .kd-menulabel.red{
980 background:#DD4B39;
981 }
982 .kd-menulabel.grey{
983 background:#999999;
984 }
985 .kd-menulabel.blue{
986 background:#4D90F0;
987 }
988
989 .kd-content-sidebar .kd-menulist li{
990 margin-left:0;
991 }
992 .kd-flyouttrigger.selected .kd-menulist{
993 display:block;
994 }
995 .kd-flyouttrigger.selected .kd-menulist.clip{
996 overflow-y:auto;
997 }
998 /*sidebars - extended hover and selected states*/
999 .kd-content-sidebar .kd-sidebarlistitem{
1000 margin-left:-44px;
1001 }
1002 .kd-content-sidebar .kd-sidebarlistitem > a{
1003 padding-left:44px;
1004 }
1005 .kd-content-sidebar .kd-sidebarlistitem.selected > a/*, .kd-content-sidebar .kd- sidebarlistitem.kd-zippy.expanded > .row*/{
1006 border-left:5px solid #999;
1007 padding-left:39px;
1008 }
1009 .kd-content-sidebar .kd-sidebarlistitem > .row{
1010 padding-left:28px;
1011 }
1012 /*sidebar zippy*/
1013 .kd-content-sidebar .kd-sidebarlistitem.kd-zippy .kd-zippycontent{
1014 margin-left:29px;
1015 }
1016
1017 .kd-content-sidebar .kd-sidebarlistitem.kd-zippy.split:hover .row{
1018 background-color:transparent;
1019 }
1020 .kd-content-sidebar .kd-sidebarlistitem.kd-zippy.split .row{
1021 padding-left:0;
1022 }
1023 .kd-content-sidebar .kd-sidebarlistitem.kd-zippy.split .kd-disclosureindicator{
1024 padding-left:28px;
1025 background-position:34px center;
1026 margin-left:0;
1027 }
1028
1029 .kd-content-sidebar .kd-sidebarlistitem.kd-zippy.split .kd-disclosureindicator{
1030 width:13px;
1031 border-right:1px solid #FFF;
1032 }
1033 .kd-content-sidebar .kd-sidebarlistitem.kd-zippy.split .label > a{
1034 margin-left:41px;
1035 padding-left:3px;
1036 }
1037 .kd-content-sidebar .kd-sidebarlistitem.kd-zippy.split .kd-disclosureindicator:h over,
1038 /*.kd-content-sidebar .kd-sidebarlistitem.kd-zippy.split .kd-disclosureindicator .down,*/
1039 .kd-content-sidebar .kd-sidebarlistitem.kd-zippy.split .label:hover{
1040 background-color:#EEE;
1041 color: #222;
1042 }
1043 .kd-content-sidebar .kd-sidebarlistitem.kd-zippy.split .label{
1044 display:block;
1045 }
1046 .kd-content-sidebar .kd-sidebarlistitem.kd-zippy.split .kd-disclosureindicator.d own{
1047 background-position:32px center;
1048 }
1049
1050 /*------------------------------------------------------------------
1051 Component: App bars
1052 ------------------------------------------------------------------*/
1053 .kd-appbar {
1054 position:relative;
1055 padding: 21px 0;
1056 border-bottom: 1px solid #ebebeb;
1057 height: 29px;
1058 z-index:20;
1059 background:#fff;
1060 }
1061 .kd-appbar .kd-appname {
1062 width: 160px;
1063 margin-right: 16px;
1064 margin-left: 44px;
1065 height: 29px;
1066 float: left;
1067 font-size: 20px;
1068 font-weight: normal;
1069 line-height: 29px;
1070 color: #666;
1071 white-space:nowrap;
1072 }
1073 .kd-appbar .kd-appname a { color: #666; cursor:pointer; }
1074 #stickers .kd-appbar .kd-buttonbar {
1075 margin-bottom: 0;
1076 }
1077 .kd-buttonbar{
1078 height:29px;
1079 line-height:29px;
1080 }
1081 .kd-buttonbar.right {
1082 float: right;
1083 margin-right: 44px;
1084 }
1085 .kd-buttonbar.left {
1086 float: left;
1087 }
1088 .kd-buttonbar span.kd-count, .kd-buttonbar span.kd-count strong {
1089 line-height: 29px;
1090 color: #666;
1091 }
1092 .kd-buttonbar.right span.kd-count {
1093 float: left;
1094 }
1095 .kd-buttonbar.left span.kd-count {
1096 float: right;
1097 margin-left: 16px;
1098 }
1099 #styleguide .section .kd-appbar h4 {
1100 margin-bottom: 16px;
1101 }
1102
1103 /* Maps (mini) app bar */
1104 .maps .kd-appbar { width:380px; }
1105 .maps .kd-appbar .kd-appname { width:auto; }
1106 .maps .kd-maps-collapser {
1107 display:block;
1108 position:absolute;
1109 top:0;
1110 bottom:0;
1111 right:0;
1112 width:15px;
1113 line-height:71px;
1114 vertical-align:middle;
1115 text-align:center;
1116 border: 1px solid #ebebeb;
1117 border-width:0 1px;
1118 background:#fff;
1119 cursor:pointer;
1120 -webkit-transition:line-height 0.18s;
1121 -moz-transition:line-height 0.18s;
1122 transition:line-height 0.18s;
1123 }
1124 .maps .kd-maps-collapser .kd-disclosureindicator {
1125 -webkit-transform: rotate(-180deg);
1126 -moz-transform: rotate(-180deg);
1127 transform: rotate(-180deg);
1128 }
1129 .maps .kd-maps-collapser:hover {
1130 background:#f1f1f1;
1131 }
1132
1133 /* Mobile app bar */
1134 .mobile .kd-appbar {
1135 padding:7px 0;
1136 }
1137 .mobile .kd-appbar .kd-appname{
1138 width:auto;
1139 margin-left:16px;
1140 margin-right:7px;
1141
1142 font-size:16px;
1143 }
1144 .mobile .kd-appbar .kd-appname.arrowed:before {
1145 display:inline-block;
1146 content:"‹";
1147 text-align:right;
1148 width:12px;
1149 margin:0 4px 0 -16px;
1150 }
1151 .mobile .kd-appbar .kd-buttonbar.right{
1152 margin-right:7px;
1153 }
1154 .mobile .kd-appbar .kd-button-action img,
1155 .mobile .kd-appbar .kd-button-share img,
1156 .mobile .kd-appbar .kd-button-submit img{
1157 opacity:1;
1158 }
1159 .mobile .kd-appbar .kd-button.mid { margin-left:-1px; }
1160 .mobile .kd-appbar .kd-button.right { margin-left:-1px; }
1161 .mobile .kd-appbar .kd-button:first-child { margin-left:0; }
1162 .mobile .kd-appbar .cancel-button{
1163 display:inline-block;
1164 height:27px;
1165 width:34px;
1166 line-height:27px;
1167 padding:4px 0;
1168 text-align:center;
1169 margin-left:6px;
1170 margin-right:-6px;
1171 }
1172 .mobile .kd-appbar .cancel-button img{
1173 opacity:.667;
1174 }
1175
1176 /*------------------------------------------------------------------
1177 Component: Toolbar
1178 ------------------------------------------------------------------*/
1179 .kd-toolbar {
1180 height: 29px;
1181 background: #f1f1f1;
1182 border-top: 1px solid #e5e5e5;
1183 border-bottom: 1px solid #ebebeb;
1184 margin-bottom: 44px;
1185 padding: 8px 44px 4px;
1186 }
1187 .kd-toolbar .kd-select .kd-disclosureindicator{
1188 margin-top:7px;
1189 }
1190 .kd-toolbarbutton {
1191 border-color: transparent;
1192 background: 0;
1193 }
1194 .kd-toolbar .kd-button{
1195 margin-left:0;
1196 }
1197 .kd-toolbar .kd-button.right{
1198 margin-left:0;
1199 }
1200 .kd-toolbarbutton.small, .kd-toolbar .kd-button.small{
1201 width:24px;
1202 min-width:24px;
1203 }
1204 .kd-toolbarbutton, .kd-toolbar .kd-button{
1205 height:24px;
1206 line-height:24px;
1207 }
1208 .kd-toolbar .kd-menubutton.small{
1209 width:34px;
1210 }
1211 .kd-toolbar .kd-button{
1212 min-width: 72px;
1213 }
1214 .kd-toolbarbutton:hover {
1215 border: 1px solid #C6C6C6;
1216 color: #333;
1217 -webkit-transition: all 0.0s;
1218 -moz-transition: all 0.0s;
1219 -o-transition: all 0.0s;
1220 transition: all 0.0s;
1221 background-color: #f8f8f8;
1222 background-image: -webkit-gradient(linear,left top,left bottom,from(#f8f8f8) ,to(#f1f1f1));
1223 background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1);
1224 background-image: -moz-linear-gradient(top,#f8f8f8,#f1f1f1);
1225 background-image: -ms-linear-gradient(top,#f8f8f8,#f1f1f1);
1226 background-image: -o-linear-gradient(top,#f8f8f8,#f1f1f1);
1227 background-image: linear-gradient(top,#f8f8f8,#f1f1f1);
1228 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f8f8f8',E ndColorStr='#f1f1f1');
1229 -webkit-box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
1230 -moz-box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
1231 box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
1232 }
1233 .kd-toolbarbutton:active {
1234 background-color: #f6f6f6;
1235 background-image: -webkit-gradient(linear,left top,left bottom,from(#f6f6f6) ,to(#f1f1f1));
1236 background-image: -webkit-linear-gradient(top,#f6f6f6,#f1f1f1);
1237 background-image: -moz-linear-gradient(top,#f6f6f6,#f1f1f1);
1238 background-image: -ms-linear-gradient(top,#f6f6f6,#f1f1f1);
1239 background-image: -o-linear-gradient(top,#f6f6f6,#f1f1f1);
1240 background-image: linear-gradient(top,#f6f6f6,#f1f1f1);
1241 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f6f6f6',E ndColorStr='#f1f1f1');
1242 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1243 -moz-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1244 box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1245 }
1246 .kd-toolbarbutton:visited {
1247 color: #666;
1248 }
1249 .kd-toolbarbutton.focus {
1250 outline: none;
1251 border: 1px solid #4d90fe;
1252 }
1253
1254 .kd-toolbarbutton.selected, .kd-toolbar .kd-menubutton.selected {
1255 background-color: #EEEEEE;
1256 background-image: -webkit-gradient(linear,left top,left bottom,from(#EEEEEE) ,to(#E0E0E0));
1257 background-image: -webkit-linear-gradient(top,#EEEEEE,#E0E0E0);
1258 background-image: -moz-linear-gradient(top,#EEEEEE,#E0E0E0);
1259 background-image: -ms-linear-gradient(top,#EEEEEE,#E0E0E0);
1260 background-image: -o-linear-gradient(top,#EEEEEE,#E0E0E0);
1261 background-image: linear-gradient(top,#EEEEEE,#E0E0E0);
1262 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#EEEEEE',E ndColorStr='#E0E0E0');
1263 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1264 -moz-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1265 box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1266 border: 1px solid #CCC;
1267 color: #333;
1268 }
1269
1270 .kd-toolbar .kd-select,
1271 .kd-toolbar .kd-menubutton {
1272 /* background: #fdfdfd;*/
1273 border-color:transparent;
1274 }
1275 .kd-toolbar .kd-select:hover, .kd-toolbar .kd-menubutton:hover{
1276 border: 1px solid #C6C6C6;
1277 }
1278
1279 .kd-toolbarseparator {
1280 display: inline-block;
1281 float: left;
1282 height: 17px;
1283 margin: 5px 6px 0 6px;
1284 border-left: 1px solid #CCC;
1285 }
1286 .kd-toolbarseparator.no-margin{
1287 margin:5px 0 0 0;
1288 }
1289 .buttongroup{
1290 margin:0 6px;
1291 float:left;
1292 }
1293 .buttongroup.first{
1294 margin-left:0;
1295 }
1296 .kd-toolbarseparator + .kd-select.kd-menubutton {
1297 margin-left: -1px;
1298 }
1299 .kd-select.kd-menubutton + .kd-toolbarseparator {
1300 margin-left: -1px;
1301 }
1302 .kd-toolbar .kd-select.kd-menubutton {
1303 background-color: transparent;
1304 background-image: none;
1305 }
1306
1307 /*------------------------------------------------------------------
1308 Component: Tabs
1309 ------------------------------------------------------------------*/
1310 #stickersheet .kd-tabbar-horz {
1311 margin-bottom: 40px;
1312 }
1313 .kd-tabbar-horz {
1314 border-bottom: 1px solid #ccc;
1315 height: 28px;
1316 }
1317 .kd-tabbar-vert {
1318 border-right: 1px solid #ccc;
1319 display: inline-block;
1320 width: 71px;
1321 height: 100%;
1322 }
1323 .kd-tabbutton {
1324 display: inline-block;
1325 min-width: 54px;*min-width:70px;/*hello,IE7!*/
1326 text-align: center;
1327 color: #666;
1328 font-size: 11px;
1329 font-weight: bold;
1330 height: 27px;
1331 padding: 0 8px;
1332 line-height: 27px;
1333 -webkit-transition: all 0.218s;
1334 -moz-transition: all 0.218s;
1335 -o-transition: all 0.218s;
1336 transition: all 0.218s;
1337 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f5f5f5',E ndColorStr='#f1f1f1');
1338 -webkit-user-select:none;
1339 -moz-user-select:none;
1340 cursor:default;
1341
1342 border: 1px solid transparent;
1343 }
1344
1345 .kd-tabbutton:hover {
1346 color: #222;
1347 }
1348
1349 .kd-tabbutton:active {
1350 color: #333;
1351 }
1352
1353 .kd-tabbutton.selected {
1354 color: #202020;
1355 border: 1px solid #ccc;
1356 }
1357
1358 .kd-tabbar-horz .kd-tabbutton {
1359 -webkit-border-top-left-radius:2px;
1360 -webkit-border-top-right-radius:2px;
1361 -moz-border-radius-topleft: 2px;
1362 -moz-border-radius-topright: 2px;
1363 border-top-left-radius: 2px;
1364 border-top-right-radius: 2px;
1365 }
1366
1367 .kd-tabbar-vert .kd-tabbutton {
1368 -webkit-border-top-left-radius:2px;
1369 -webkit-border-bottom-left-radius:2px;
1370 -moz-border-radius-topleft: 2px;
1371 -moz-border-radius-bottomleft: 2px;
1372 border-top-left-radius: 2px;
1373 border-bottom-left-radius: 2px;
1374 }
1375
1376 .kd-tabbar-horz .kd-tabbutton.selected {
1377 border-bottom: 1px solid #fff;
1378
1379 }
1380
1381 .kd-tabbar-vert .kd-tabbutton.selected {
1382 border-right: 1px solid #fff;
1383 }
1384 73
1385 /*------------------------------------------------------------------ 74 /*------------------------------------------------------------------
1386 Component: Buttons 75 Component: Buttons
1387 ------------------------------------------------------------------*/ 76 ------------------------------------------------------------------*/
1388 .kd-button { 77 .kd-button {
1389 display: inline-block; 78 display: inline-block;
1390 min-width: 72px;*min-width:70px;/*hello,IE7!*/ 79 min-width: 72px;*min-width:70px;/*hello,IE7!*/
1391 border:1px solid #DCDCDC; 80 border:1px solid #DCDCDC;
1392 border: 1px solid rgba(0,0,0,0.1); 81 border: 1px solid rgba(0,0,0,0.1);
1393 text-align: center; 82 text-align: center;
1394 color: #444; 83 color: #444;
1395 font-size: 11px; 84 font-size: 11px;
1396 font-weight: bold; 85 font-weight: bold;
1397 height: 27px; 86 height: 27px;
1398 padding: 0 8px; 87 padding: 0 8px;
1399 line-height: 27px; 88 line-height: 27px;
1400 -webkit-border-radius:2px; 89 -webkit-border-radius:2px;
1401 -moz-border-radius: 2px;
1402 border-radius: 2px;
1403 -webkit-transition: all 0.218s; 90 -webkit-transition: all 0.218s;
1404 -moz-transition: all 0.218s;
1405 -o-transition: all 0.218s;
1406 transition: all 0.218s;
1407 background-color: #f5f5f5; 91 background-color: #f5f5f5;
1408 background-image: -webkit-gradient(linear,left top,left bottom,from(#f5f5f5) ,to(#f1f1f1)); 92 background-image: -webkit-gradient(linear,left top,left bottom,from(#f5f5f5) ,to(#f1f1f1));
1409 background-image: -webkit-linear-gradient(top,#f5f5f5,#f1f1f1);
1410 background-image: -moz-linear-gradient(top,#f5f5f5,#f1f1f1);
1411 background-image: -ms-linear-gradient(top,#f5f5f5,#f1f1f1);
1412 background-image: -o-linear-gradient(top,#f5f5f5,#f1f1f1);
1413 background-image: linear-gradient(top,#f5f5f5,#f1f1f1);
1414 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f5f5f5',E ndColorStr='#f1f1f1');
1415 -webkit-user-select:none; 93 -webkit-user-select:none;
1416 -moz-user-select:none;
1417 cursor:default; 94 cursor:default;
1418 } 95 }
1419 .kd-button:hover, .kd-button.hover { 96 .kd-button:hover, .kd-button.hover {
1420 border: 1px solid #C6C6C6; 97 border: 1px solid #C6C6C6;
1421 color: #222; 98 color: #222;
1422 -webkit-transition: all 0.0s; 99 -webkit-transition: all 0.0s;
1423 -moz-transition: all 0.0s;
1424 -o-transition: all 0.0s;
1425 transition: all 0.0s; 100 transition: all 0.0s;
1426 background-color: #f8f8f8; 101 background-color: #f8f8f8;
1427 background-image: -webkit-gradient(linear,left top,left bottom,from(#f8f8f8) ,to(#f1f1f1)); 102 background-image: -webkit-gradient(linear,left top,left bottom,from(#f8f8f8) ,to(#f1f1f1));
1428 background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1);
1429 background-image: -moz-linear-gradient(top,#f8f8f8,#f1f1f1);
1430 background-image: -ms-linear-gradient(top,#f8f8f8,#f1f1f1);
1431 background-image: -o-linear-gradient(top,#f8f8f8,#f1f1f1);
1432 background-image: linear-gradient(top,#f8f8f8,#f1f1f1);
1433 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f8f8f8',E ndColorStr='#f1f1f1');
1434 -webkit-box-shadow: 0px 1px 1px rgba(0,0,0,0.1); 103 -webkit-box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
1435 -moz-box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
1436 box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
1437 }
1438 .kd-button:active, .kd-button.active {
1439 background-color: #f6f6f6;
1440 background-image: -webkit-gradient(linear,left top,left bottom,from(#f6f6f6) ,to(#f1f1f1));
1441 background-image: -webkit-linear-gradient(top,#f6f6f6,#f1f1f1);
1442 background-image: -moz-linear-gradient(top,#f6f6f6,#f1f1f1);
1443 background-image: -ms-linear-gradient(top,#f6f6f6,#f1f1f1);
1444 background-image: -o-linear-gradient(top,#f6f6f6,#f1f1f1);
1445 background-image: linear-gradient(top,#f6f6f6,#f1f1f1);
1446 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f6f6f6',E ndColorStr='#f1f1f1');
1447 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1448 -moz-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1449 box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1450 }
1451 .kd-button.active{
1452 border: 1px solid #C6C6C6;
1453 color: #333;
1454 }
1455
1456 .kd-button:visited {
1457 color: #666;
1458 }
1459 .kd-button.focus, .kd-button.right.focus, .kd-button.mid.focus, .kd-button.left. focus{
1460 outline: none;
1461 border: 1px solid #4d90fe;
1462 z-index:4 !important;
1463 }
1464
1465 .kd-button.selected {
1466 background-color: #EEEEEE;
1467 background-image: -webkit-gradient(linear,left top,left bottom,from(#EEEEEE) ,to(#E0E0E0));
1468 background-image: -webkit-linear-gradient(top,#EEEEEE,#E0E0E0);
1469 background-image: -moz-linear-gradient(top,#EEEEEE,#E0E0E0);
1470 background-image: -ms-linear-gradient(top,#EEEEEE,#E0E0E0);
1471 background-image: -o-linear-gradient(top,#EEEEEE,#E0E0E0);
1472 background-image: linear-gradient(top,#EEEEEE,#E0E0E0);
1473 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#EEEEEE',E ndColorStr='#E0E0E0');
1474 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1475 -moz-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1476 box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1477 border: 1px solid #CCC;
1478 color: #333;
1479 }
1480 .kd-button input[type=checkbox] {
1481 position: relative;
1482 top: 3px;
1483 }
1484
1485 .kd-button img {
1486 display: inline-block;
1487 margin: -3px 0 0;
1488 opacity: 0.55;
1489 *margin:4px 0 0; /*IE7*/
1490 /* -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; //IE CANN OT HANDLE OPACITY ON PNGS, SO WE ARE JUST GONNA REMOVE THESE FILTERS
1491 filter: alpha(opacity=80);*/
1492
1493 margin-left: 0px;
1494 margin-right: 0px;
1495 vertical-align: middle;
1496 }
1497
1498 .kd-button.selected img {
1499 opacity: 0.9;
1500 /* -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
1501 filter: alpha(opacity=90);*/
1502 }
1503 .kd-button:hover img {
1504 opacity: 0.72;
1505 /* -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
1506 filter: alpha(opacity=90);*/
1507 }
1508 .kd-button:active img {
1509 opacity: 1.0;
1510 /* -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
1511 filter: alpha(opacity=100);*/
1512 } 104 }
1513 105
1514 /* Disabled buttons */ 106 /* Disabled buttons */
1515 .kd-button.disabled, .kd-button.disabled:hover, .kd-button.disabled:active { 107 .kd-button.disabled, .kd-button.disabled:hover, .kd-button.disabled:active {
1516 background: none; 108 background: none;
1517 color: #b8b8b8; 109 color: #b8b8b8;
1518 border: 1px solid #f3f3f3; 110 border: 1px solid #f3f3f3;
1519 border: 1px solid rgba(0,0,0,0.05); 111 border: 1px solid rgba(0,0,0,0.05);
1520 cursor: default; 112 cursor: default;
1521 pointer-events: none; 113 pointer-events: none;
1522 } 114 }
1523 .kd-button.disabled.active{ 115 .kd-button-share.disabled, .kd-button-share.disabled:hover, .kd-button-share.dis abled:active {
1524 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1525 -moz-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1526 box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
1527 }
1528 .kd-button-submit.disabled, .kd-button-submit.disabled:hover, .kd-button-submit. disabled:active,
1529 .kd-button-share.disabled, .kd-button-share.disabled:hover, .kd-button-share.dis abled:active,
1530 .kd-button-action.disabled, .kd-button-action.disabled:hover, .kd-button-action. disabled:active {
1531 border: 1px solid #505050; 116 border: 1px solid #505050;
1532 background-color: #666; 117 background-color: #666;
1533 color: #FFF; 118 color: #FFF;
1534 opacity: 0.5; 119 opacity: 0.5;
1535 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
1536 filter: alpha(opacity=50);
1537 }
1538 .kd-button.disabled img {
1539 opacity: 0.5;
1540 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
1541 filter: alpha(opacity=50); 120 filter: alpha(opacity=50);
1542 } 121 }
1543 122
1544 /* Colored Buttons */ 123 /* Colored Buttons */
1545 .kd-button-submit:focus, .kd-button-submit.focus, 124 .kd-button-share:focus, .kd-button-share.focus {
1546 .kd-button-share:focus, .kd-button-share.focus,
1547 .kd-button-action:focus, .kd-button-action.focus{
1548 box-shadow:inset 0 0 0 1px rgba(255,255,255,0.5);
1549 -webkit-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.5); 125 -webkit-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.5);
1550 -moz-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.5);
1551 } 126 }
1552 .kd-button-submit:focus, .kd-button-submit.focus, 127 .kd-button-share:focus, .kd-button-share.focus {
1553 .kd-button-share:focus, .kd-button-share.focus,
1554 .kd-button-action:focus, .kd-button-action.focus {
1555 border-color:#404040; 128 border-color:#404040;
1556 } 129 }
1557 130
1558 .kd-button-submit:focus:hover, .kd-button-submit.focus:hover, 131 .kd-button-share:focus:hover, .kd-button-share.focus:hover {
1559 .kd-button-share:focus:hover, .kd-button-share.focus:hover,
1560 .kd-button-action:focus:hover, .kd-button-action.focus:hover{
1561 box-shadow:inset 0 0 0 1px #fff, 0px 1px 1px rgba(0,0,0,0.1);
1562 -webkit-box-shadow:inset 0 0 0 1px #fff, 0px 1px 1px rgba(0,0,0,0.1); 132 -webkit-box-shadow:inset 0 0 0 1px #fff, 0px 1px 1px rgba(0,0,0,0.1);
1563 -moz-box-shadow:inset 0 0 0 1px #fff, 0px 1px 1px rgba(0,0,0,0.1);
1564 } 133 }
1565 134
1566 .kd-button-submit, 135 .kd-button-share {
1567 .kd-button-share,
1568 .kd-button-action {
1569 border: 1px solid #505050; 136 border: 1px solid #505050;
1570 color: #FFF; 137 color: #FFF;
1571 background-color: #666; 138 background-color: #666;
1572 background-image: -webkit-gradient(linear,left top,left bottom,from(#777),to (#555)); 139 background-image: -webkit-gradient(linear,left top,left bottom,from(#777),to (#555));
1573 background-image: -webkit-linear-gradient(top,#777,#555);
1574 background-image: -moz-linear-gradient(top,#777,#555);
1575 background-image: -ms-linear-gradient(top,#777,#555);
1576 background-image: -o-linear-gradient(top,#777,#555);
1577 background-image: linear-gradient(top,#777,#555);
1578 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#777777',E ndColorStr='#555555');
1579 } 140 }
1580 .kd-button-submit:hover, 141 .kd-button-share:hover {
1581 .kd-button-share:hover,
1582 .kd-button-action:hover {
1583 border: 1px solid #404040; 142 border: 1px solid #404040;
1584 color: #FFF; 143 color: #FFF;
1585 background-color: #555; 144 background-color: #555;
1586 background-image: -webkit-gradient(linear,left top,left bottom,from(#666),to (#444)); 145 background-image: -webkit-gradient(linear,left top,left bottom,from(#666),to (#444));
1587 background-image: -webkit-linear-gradient(top,#666,#444);
1588 background-image: -moz-linear-gradient(top,#666,#444);
1589 background-image: -ms-linear-gradient(top,#666,#444);
1590 background-image: -o-linear-gradient(top,#666,#444);
1591 background-image: linear-gradient(top,#666,#444);
1592 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#666666',E ndColorStr='#444444');
1593 } 146 }
1594 .kd-button-submit:active, .kd-button-submit:focus:active, .kd-button-submit.focu s:active, 147 .kd-button-share:active, .kd-button-share:focus:active, .kd-button-share.focus:a ctive {
1595 .kd-button-share:active, .kd-button-share:focus:active, .kd-button-share.focus:a ctive,
1596 .kd-button-action:active, .kd-button-action:focus:active, .kd-button-action.focu s:active {
1597 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.3); 148 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.3);
1598 -moz-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.3);
1599 box-shadow: inset 0px 1px 2px rgba(0,0,0,0.3);
1600 } 149 }
1601 150
1602 .kd-button-share { 151 .kd-button-share {
1603 text-shadow: 0px 1px rgba(0,0,0,0.1); 152 text-shadow: 0px 1px rgba(0,0,0,0.1);
1604 } 153 }
1605 .kd-button-share:hover { 154 .kd-button-share:hover {
1606 text-shadow: 0px 1px rgba(0,0,0,0.3); 155 text-shadow: 0px 1px rgba(0,0,0,0.3);
1607 } 156 }
1608 .kd-button-action {
1609 margin-bottom: 16px;
1610 text-transform: uppercase;
1611 letter-spacing:1;
1612 text-shadow: 0px 1px rgba(0,0,0,0.1);
1613 }
1614 .kd-button-action:hover {
1615 -webkit-box-shadow: 0px 1px 1px rgba(0,0,0,0.2);
1616 -moz-box-shadow: 0px 1px 1px rgba(0,0,0,0.2);
1617 box-shadow: 0px 1px 1px rgba(0,0,0,0.2);
1618 }
1619 .kd-button-action:visited,
1620 .kd-button-share:visited,
1621 .kd-button-submit:visited {
1622 color: #FFF;
1623 }
1624 .kd-button.kd-button-action img,
1625 .kd-button.kd-button-action.selected img,
1626 .kd-button.kd-button-action:hover img,
1627 .kd-button.kd-button-action:active img,
1628 .kd-button.kd-button-submit img,
1629 .kd-button.kd-button-submit.selected img,
1630 .kd-button.kd-button-submit:hover img,
1631 .kd-button.kd-button-submit:active img,
1632 .kd-button.kd-button-share img,
1633 .kd-button.kd-button-share.selected img,
1634 .kd-button.kd-button-share:hover img,
1635 .kd-button.kd-button-share:active img {
1636 opacity: 1.0;
1637 }
1638
1639 /* Buttons of all styles */
1640 .kd-buttonbar .kd-button,
1641 .kd-buttonbar .kd-combobutton,
1642 .kd-buttonbar .kd-expandbutton {
1643 float: left;
1644 margin: 0;
1645 margin-left: 16px;
1646 position: relative;
1647 z-index: 1;
1648 }
1649 .left + .kd-combobutton{
1650 margin-left:0;
1651 }
1652
1653 .kd-buttonbar .kd-button:hover {
1654 z-index: 2;
1655 }
1656 .kd-buttonbar .kd-button:first-child,
1657 .kd-buttonbar .kd-combobutton:first-child,
1658 .kd-buttonbar .kd-expandbutton:first-child {
1659 margin-left: 0;
1660 }
1661
1662 .kd-button.small,
1663 .mobile .kd-button.small {
1664 min-width: 34px;
1665 width: 34px;
1666 padding: 0;
1667 }
1668 .mobile .kd-button {
1669 min-width:30px;
1670 width:30px;
1671 padding:0 8px;
1672 margin-left:7px;
1673 }
1674 .kd-menubutton {
1675 position: relative;
1676 }
1677 .kd-menubutton .kd-disclosureindicator {
1678 float: right;
1679 margin-top: 10px;
1680 margin-left: 7px;
1681 -webkit-transform: rotate(90deg);
1682 -moz-transform: rotate(90deg);
1683 transform: rotate(90deg);
1684 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
1685 opacity: .8;
1686 -webkit-transition: none;
1687 -moz-transition: none;
1688 -o-transition: none;
1689 transition: none;
1690
1691 /* ie hacks*/
1692 *float:none;
1693 *position:relative;
1694 *top:-3px;
1695 margin-top:12px\0/;
1696 }
1697 .kd-select { position:relative; }
1698 .kd-select .kd-disclosureindicator{
1699 width:7px;
1700 height:11px;
1701 -webkit-transform: none;
1702 -moz-transform: none;
1703 transform: none;
1704 margin-top:8px;
1705 }
1706
1707 .kd-menubutton.small img {
1708 margin-left: -8px;
1709 }
1710 .kd-menubutton.small .kd-disclosureindicator {
1711 position: absolute;
1712 margin: 10px 0;
1713 right: 4px;
1714 }
1715 .kd-menubutton .kd-menulist .kd-disclosureindicator {
1716 float: none;
1717 -webkit-transform: rotate(0);
1718 -moz-transform: rotate(0);
1719 transform: rotate(0);
1720 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);
1721 opacity: .8;
1722 }
1723 .kd-menubutton img + .label{
1724 margin-left:5px;
1725 }
1726
1727 .kd-menubutton img {
1728 display: inline-block;
1729 }
1730 .kd-menubutton:hover .kd-disclosureindicator {
1731 border-left-color: #999;
1732 opacity: 1;
1733 }
1734 .kd-menubutton span.label {
1735 display: inline-block;
1736 }
1737 .kd-combobutton .kd-menubutton:first-child {
1738 -webkit-border-radius: 2px 0 0 2px;
1739 -moz-border-radius: 2px 0 0 2px;
1740 border-radius: 2px 0 0 2px;
1741 }
1742 .kd-combobutton .kd-menutrigger,
1743 .mobile .kd-combobutton .kd-menutrigger {
1744 margin-left: -1px;
1745 border-left-color: transparent;
1746 padding: 0 8px 0 2px;
1747 width:auto;
1748 min-width: 0;
1749 -webkit-border-radius: 0 2px 2px 0;
1750 -moz-border-radius: 0 2px 2px 0;
1751 border-radius: 0 2px 2px 0;
1752 z-index: 0;
1753 }
1754 .kd-combobutton .kd-menutrigger:hover {
1755 border-left-color: #c6c6c6;
1756 }
1757
1758 .kd-expandbutton {
1759 display: inline-block;
1760 overflow: hidden;
1761 z-index: 0;
1762 width: 88px;
1763 height: 29px;
1764 position: relative;
1765 -webkit-transition: all 0.218s;
1766 -moz-transition: all 0.218s;
1767 -o-transition: all 0.218s;
1768 transition: all 0.218s;
1769 cursor:pointer;
1770 }
1771 .kd-expandbutton:hover {
1772 width: 210px;
1773 margin-left: -100px;
1774 }
1775 .kd-expandbutton:hover .expand-options{
1776 border-color: #e5e5e5;
1777 }
1778 .kd-expandbutton .expand-options {
1779 display: inline-block;
1780 background: #f7f7f7;
1781 border: 1px solid #f0f0f0;
1782 padding-left: 16px;
1783 -webkit-border-radius: 2px 0 0 2px;
1784 -moz-border-radius: 2px 0 0 2px;
1785 border-radius: 2px 0 0 2px;
1786 position: absolute;
1787 left: 0;
1788 width: 144px;
1789 font-size:11px;
1790 }
1791 .kd-expandbutton .expand-options span {
1792 float:left;
1793 padding: 0 8px;
1794 line-height: 27px;
1795 color:#666;
1796 /* border-left:1px solid transparent;*/
1797 }
1798
1799 .kd-expandbutton .expand-options span:hover, .kd-expandbutton .expand-options sp an.selected{
1800 background-color:#e5e5e5;
1801 color: #222;
1802 }
1803 .kd-expandbutton .expand-options .kd-disclosureindicator {
1804 position: absolute;
1805 top: 50%;
1806 margin-top: -3px;
1807 left: -3px;
1808 opacity: .5;
1809 -webkit-transform: rotate(180deg);
1810 -moz-transform: rotate(180deg);
1811 transform: rotate(180deg);
1812 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
1813
1814 }
1815 .kd-expandbutton .main {
1816 z-index: 1;
1817 position: absolute;
1818 right: 0;
1819 }
1820 .kd-expandbutton:hover .kd-button.main{
1821 border: 1px solid #C6C6C6;
1822 color: #333;
1823 -webkit-transition: all 0.0s;
1824 -moz-transition: all 0.0s;
1825 -o-transition: all 0.0s;
1826 transition: all 0.0s;
1827 background-color: #f8f8f8;
1828 background-image: -webkit-gradient(linear,left top,left bottom,from(#f8f8f8) ,to(#f1f1f1));
1829 background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1);
1830 background-image: -moz-linear-gradient(top,#f8f8f8,#f1f1f1);
1831 background-image: -ms-linear-gradient(top,#f8f8f8,#f1f1f1);
1832 background-image: -o-linear-gradient(top,#f8f8f8,#f1f1f1);
1833 background-image: linear-gradient(top,#f8f8f8,#f1f1f1);
1834 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f8f8f8',E ndColorStr='#f1f1f1');
1835 -webkit-box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
1836 -moz-box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
1837 box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
1838 }
1839
1840 /* Combo/segmented buttons */
1841 .kd-combobutton .kd-button-action.small {
1842 margin: 0 0 0 1px;
1843 }
1844 .kd-button.left {
1845 border-right-color: transparent;
1846 margin-right: 0;
1847 -webkit-border-radius: 2px 0 0 2px;
1848 -moz-border-radius: 2px 0 0 2px;
1849 border-radius: 2px 0 0 2px;
1850 }
1851 .kd-button.left:hover {
1852 border-right: 1px solid #c6c6c6;
1853 }
1854 .kd-button.mid {
1855 -webkit-border-radius: 0;
1856 -moz-border-radius: 0;
1857 border-radius: 0;
1858 margin-left:0;
1859 margin-right:0;
1860 }
1861 .kd-button.mid + .kd-button.mid, .kd-button.left + .kd-button.mid{
1862 margin-left: -1px;
1863 }
1864 .kd-button.right {
1865 margin-left: 0;
1866 -webkit-border-radius: 0 2px 2px 0;
1867 -moz-border-radius: 0 2px 2px 0;
1868 border-radius: 0 2px 2px 0;
1869 margin-left:-1px;
1870 }
1871 .kd-button.right:hover {
1872 border-left: 1px solid #c6c6c6;
1873 }
1874 .kd-segmentedcontrol{
1875 float:left;
1876 margin-left:16px;
1877 }
1878 .kd-segmentedcontrol:first-child{
1879 margin-left:0;
1880 }
1881 .kd-button.left.kd-button-action:hover {
1882 border-right: 1px solid transparent;
1883 }
1884 .kd-button.right.kd-button-action:hover {
1885 border-left: 1px solid transparent;
1886 }
1887
1888 /* Mini buttons */
1889 .kd-button.mini{
1890 height:17px;
1891 line-height:17px;
1892 min-width:0;
1893 }
1894 /* Mini text input */
1895 input[type="text"].mini{
1896 height:17px;
1897 line-height:17px;
1898 display:inline-block;
1899 padding:0 2px;
1900 -webkit-box-sizing:content-box;
1901 font-size:11px;
1902 }
1903
1904 /* View toggle buttonset */
1905 .kd-viewtoggle{
1906 display:block;
1907 height:29px;
1908 position:relative;
1909 }
1910 .kd-viewtoggle .kd-button{
1911 position:absolute;
1912 margin:0;
1913 -webkit-transition: right 0.13s;
1914 -moz-transition: right 0.13s;
1915 -o-transition: right 0.13s;
1916 transition: right 0.13s;
1917
1918 -webkit-transition-delay:0.4s;
1919 -moz-transition-delay:0.4s;
1920 -o-transition-delay:0.4s;
1921 transition-delay:0.4s;
1922 }
1923 .kd-viewtoggle .kd-button.selected{
1924 z-index:3;
1925 }
1926 .kd-viewtoggle .tab{
1927 position: absolute;
1928 top: 0;
1929 right: 36px;
1930 display:block;
1931 height:27px;
1932 width:16px;
1933 border: 1px solid #ebebeb;
1934 -webkit-border-radius: 2px 0 0 2px;
1935 -moz-border-radius: 2px 0 0 2px;
1936 border-radius: 2px 0 0 2px;
1937 -webkit-transition: all 0.218s linear 0.4s;
1938 -moz-transition: all 0.218s linear 0.4s;
1939 -o-transition: all 0.218s linear 0.4s;
1940 transition: all 0.218s linear 0.4s;
1941 }
1942 .kd-viewtoggle.wide .tab{
1943 right:72px;
1944 }
1945 .kd-viewtoggle:hover .kd-button{
1946 -webkit-transition-delay:0;
1947 -moz-transition-delay:0;
1948 -o-transition-delay:0;
1949 transition-delay:0;
1950 }
1951 .kd-viewtoggle:hover .tab{
1952 right:0;
1953 }
1954 .kd-viewtoggle .kd-button.selected{
1955 border-color:#CCC;
1956 -webkit-border-radius: 2px;
1957 -moz-border-radius: 2px;
1958 border-radius: 2px;
1959 }
1960
1961 /* Colored button bar */
1962 .kd-buttonbar-colored {
1963 padding:10px;
1964 height:19px;
1965 background: #4D90FE;
1966 }
1967 .kd-buttonbar-colored span {
1968 font-size: 13px;
1969 font-weight: bold;
1970 color: white;
1971 float: left;
1972 line-height: 19px;
1973 height:19px;
1974 background: #4D90FE;
1975 text-shadow: 0px 1px 0px rgba(0,0,0,0.3);
1976 }
1977 .kd-buttonbar-colored .kd-button{
1978 color: white;
1979 height:19px;
1980 font-size: 11px;
1981 margin-top:-1px;
1982 background: none;
1983 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba( 0,0,0,0.16)), to(rgba(0,0,0,0.2)));
1984 background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.16), rgba(0,0,0, 0.2));
1985 background-image: -moz-linear-gradient(top, rgba(0,0,0,0.16), rgba(0,0,0, 0.2));
1986 background-image: -ms-linear-gradient(top, rgba(0,0,0,0.16), rgba(0,0,0, 0.2));
1987 background-image: -o-linear-gradient(top, rgba(0,0,0,0.16), rgba(0,0,0, 0.2));
1988 background-image: linear-gradient(top, rgba(0,0,0,0.16), rgba(0,0,0, 0.2));
1989 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#160000FF, endColorstr=#220000FF);
1990 -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#160000 FF, endColorstr=#220000FF);
1991 }
1992 .kd-buttonbar-colored .kd-button:hover,
1993 .kd-buttonbar-colored .kd-button.hover {
1994 color: white;
1995 background: none;
1996 border: 1px solid rgba(0,0,0,0.2);
1997
1998 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba( 0,0,0,0.14)), to(rgba(0,0,0,0.2)));
1999 background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.14), rgba(0,0,0, 0.2));
2000 background-image: -moz-linear-gradient(top, rgba(0,0,0,0.14), rgba(0,0,0, 0.2));
2001 background-image: -ms-linear-gradient(top, rgba(0,0,0,0.14), rgba(0,0,0, 0.2));
2002 background-image: -o-linear-gradient(top, rgba(0,0,0,0.14), rgba(0,0,0, 0.2));
2003 background-image: linear-gradient(top, rgba(0,0,0,0.14), rgba(0,0,0, 0.2));
2004 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#14000000, endColorstr=#22000000);
2005 -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#140000 00, endColorstr=#22000000);
2006 }
2007 .kd-buttonbar-colored .kd-button.focus, .kd-button.right.focus,
2008 .kd-buttonbar-colored .kd-button.mid.focus, .kd-button.left.focus{
2009 outline: none;
2010 border: 1px solid white;
2011 z-index:4 !important;
2012 }
2013 .kd-buttonbar-colored .kd-button.disabled,
2014 .kd-buttonbar-colored .kd-button.disabled:hover,
2015 .kd-buttonbar-colored .kd-button.disabled:active {
2016 color: rgba(255, 255, 255, 0.5);
2017 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#50FFFFFF, endColorstr=#50FFFFFF);
2018 -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#50FFFF FF, endColorstr=#50FFFFFF);
2019 }
2020
2021 /* Slide toggle button */
2022 .kd-slidetoggle{
2023 height: 27px;
2024 line-height: 27px;
2025 width:94px;
2026 padding:0;
2027 -webkit-border-radius:2px;
2028 -moz-border-radius: 2px;
2029 border-radius: 2px;
2030 border:1px solid #CCC;
2031 font-weight:bold;
2032 color:#666;
2033 position:relative;
2034 overflow:hidden;
2035
2036 background-image: -webkit-gradient(linear, left top, left bottom, from(#EEEE EE), to(#e0e0e0));
2037 background-image: -webkit-linear-gradient(top, #EEEEEE, #e0e0e0);
2038 background-image: -moz-linear-gradient(top, #EEEEEE, #e0e0e0);
2039 background-image: -ms-linear-gradient(top, #EEEEEE, #e0e0e0);
2040 background-image: -o-linear-gradient(top, #EEEEEE, #e0e0e0);
2041 background-image: linear-gradient(top, #EEEEEE, #e0e0e0);
2042 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#EEEEEE, en dColorstr=#e0e0e0);
2043 -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#EEEEEE , endColorstr=#e0e0e0);
2044
2045 -webkit-box-shadow: inset 0px 1px 2px 0 rgba(0,0,0,0.1);
2046 -moz-box-shadow: inset 0px 1px 2px 0 rgba(0,0,0,0.1);
2047 box-shadow: inset 0px 1px 2px 0 rgba(0,0,0,0.1);
2048 }
2049 .kd-slidetoggle span {
2050 display: inline-block;
2051 width: 45px;
2052 text-align: center;
2053
2054 -webkit-border-radius:2px 2px 0 0;
2055 -moz-border-radius: 2px 2px 0 0;
2056 border-radius: 2px 2px 0 0;
2057 }
2058 .kd-slidetoggle span.on{
2059 background-image: -webkit-gradient(linear, left top, left bottom, from(#3b93 ff), to(#3689EE));
2060 background-image: -webkit-linear-gradient(top, #3b93ff, #3689EE);
2061 background-image: -moz-linear-gradient(top, #3b93ff, #3689EE);
2062 background-image: -ms-linear-gradient(top, #3b93ff, #3689EE);
2063 background-image: -o-linear-gradient(top, #3b93ff, #3689EE);
2064 background-image: linear-gradient(top, #3b93ff, #3689EE);
2065 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#3b93ff, en dColorstr=#3689EE);
2066 -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#3b93ff , endColorstr=#3689EE);
2067
2068 color:#FFF;
2069
2070 width:47px;
2071 margin-right:-2px;
2072
2073 -webkit-box-shadow: inset 0px 1px 2px 0 rgba(0,0,0,0.1);
2074 -moz-box-shadow: inset 0px 1px 2px 0 rgba(0,0,0,0.1);
2075 box-shadow: inset 0px 1px 2px 0 rgba(0,0,0,0.1);
2076
2077 -webkit-border-radius:2px 0 0 2px;
2078 -moz-border-radius: 2px 0 0 2px;
2079 border-radius: 2px 0 0 2px;
2080 }
2081 .kd-slidetoggle .thumb{
2082 content:'';
2083 position:absolute;
2084 display:block;
2085 top:-1px;
2086 left:-1px;
2087 height:27px;
2088 width:47px;
2089 border:1px solid #CCC;
2090 -webkit-border-radius:2px;
2091 -moz-border-radius: 2px;
2092 border-radius: 2px;
2093
2094 -webkit-box-shadow: 0px 1px 2px 0 rgba(0,0,0,0.1);
2095 -moz-box-shadow: 0px 1px 2px 0 rgba(0,0,0,0.1);
2096 box-shadow: 0px 1px 2px 0 rgba(0,0,0,0.1);
2097
2098 background-image: -webkit-gradient(linear, left top, left bottom, from(#f8f8 f8), to(#f1f1f1));
2099 background-image: -webkit-linear-gradient(top, #f8f8f8, #f1f1f1);
2100 background-image: -moz-linear-gradient(top, #f8f8f8, #f1f1f1);
2101 background-image: -ms-linear-gradient(top, #f8f8f8, #f1f1f1);
2102 background-image: -o-linear-gradient(top, #f8f8f8, #f1f1f1);
2103 background-image: linear-gradient(top, #f8f8f8, #f1f1f1);
2104 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#f8f8f8, en dColorstr=#f1f1f1);
2105 -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#f8f8f8 , endColorstr=#f1f1f1);
2106
2107 -webkit-transition: all 0.130s ease-out;
2108 -moz-transition: all 0.130s ease-out;
2109 -o-transition: all 0.130s ease-out;
2110 transition: all 0.130s ease-out;
2111 }
2112 .kd-slidetoggle.on .thumb{
2113 left:46px;
2114 }
2115 .kd-slidetoggle .thumb::after{
2116 content:"";
2117 position:absolute;
2118 display:block;
2119 top:9px;
2120 left:15px;
2121 height:9px;
2122 width:17px;
2123 background-image:
2124 -webkit-linear-gradient(left, #ccc 50%, transparent 50%),
2125 -webkit-linear-gradient(left, #ccc 50%, transparent 50%),
2126 -webkit-linear-gradient(left, #ccc 50%, transparent 50%),
2127 -webkit-linear-gradient(left, #ccc 50%, transparent 50%),
2128 -webkit-linear-gradient(left, #ccc 50%, transparent 50%);
2129 background-size:2px 0;
2130 background-position:0 0, 0 2px, 0 4px, 0 6px, 0 8px;
2131 background-repeat:repeat-x;
2132 }
2133
2134 /*------------------------------------------------------------------
2135 Component: Butter Bar
2136 ------------------------------------------------------------------*/
2137 .kd-butterbar {
2138 position: absolute;
2139 text-align:center;
2140 bottom:0;
2141 padding:0 16px;
2142 background:#F9EDBE;
2143 border:1px solid #F0C36D;
2144 margin-bottom:-15px;
2145 left:-1000%;
2146
2147 -webkit-border-radius:2px;
2148 -moz-border-radius:2px;
2149 border-radius:2px;
2150
2151 margin-left:-190px;
2152 opacity:0;
2153
2154 -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
2155 -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
2156 box-shadow: 0 2px 4px rgba(0,0,0,0.2);
2157
2158 -webkit-transform:scale(.2);
2159 -moz-transform:scale(.2);
2160 -o-transform:scale(.2);
2161 transform:scale(.2);
2162
2163 -webkit-transition: opacity 1s, -webkit-transform 0 linear 1s, left 0 linear 1s;
2164 -moz-transition: opacity 0.130s;
2165 -o-transition: opacity 0.130s;
2166 transition: opacity 0.130s;
2167 }
2168 .kd-butterbar.shown{
2169 opacity:1;
2170 left:496px;
2171 -webkit-transform:scale(1.00);
2172
2173 -webkit-transition: all 0.130s, left 0 linear 0;
2174 -moz-transition: all 0.218s;
2175 -o-transition: all 0.218s;
2176 /* transition: all 0.218s, left 0;*/
2177 }
2178 .kd-butterbar p{
2179 margin-bottom:0;
2180 line-height:29px;
2181 font-size:11px;
2182 }
2183
2184 .kd-butterbar a{
2185 color:#333;
2186 text-decoration:underline;
2187 }
2188 .kd-butterbar a:hover{
2189 color:#202020;
2190 }
2191
2192 .kd-butterbar.mini{
2193 margin-bottom:-5px;
2194 }
2195 .kd-butterbar.mini p{
2196 line-height:19px;
2197 }
2198 157
2199 /*------------------------------------------------------------------ 158 /*------------------------------------------------------------------
2200 Component: Text Field, Autocomplete 159 Component: Text Field, Autocomplete
2201 ------------------------------------------------------------------*/ 160 ------------------------------------------------------------------*/
2202 input[type=text] { 161 input[type=text] {
2203 height: 29px; 162 height: 29px;
2204 background-color: #FFF; 163 background-color: #FFF;
2205 line-height: 27px; 164 line-height: 27px;
2206 padding-left: 8px; 165 padding-left: 8px;
2207 color: #333; 166 color: #333;
2208 border: 1px solid #d9d9d9; 167 border: 1px solid #d9d9d9;
2209 border-top: 1px solid #c0c0c0; 168 border-top: 1px solid #c0c0c0;
2210 display: inline-block; 169 display: inline-block;
2211 vertical-align: top; 170 vertical-align: top;
2212 -webkit-box-sizing: border-box; 171 -webkit-box-sizing: border-box;
2213 box-sizing: border-box;
2214 -webkit-border-radius: 1px; 172 -webkit-border-radius: 1px;
2215 } 173 }
2216 input[type=text]:hover { 174 input[type=text]:hover {
2217 border: 1px solid #b9b9b9; 175 border: 1px solid #b9b9b9;
2218 border-top: 1px solid #a0a0a0; 176 border-top: 1px solid #a0a0a0;
2219 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1); 177 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
2220 -moz-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
2221 box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
2222 } 178 }
2223 input[type=text]:focus { 179 input[type=text]:focus {
2224 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.3); 180 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.3);
2225 -moz-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.3);
2226 box-shadow: inset 0px 1px 2px rgba(0,0,0,0.3);
2227 outline: none; 181 outline: none;
2228 border: 1px solid #4d90fe; 182 border: 1px solid #4d90fe;
2229 } 183 }
2230 input#fakesearch {
2231 width: 512px;
2232 font-size: 16px;
2233 }
2234 input#fakesearch:focus + .kd-autocomplete {
2235 display: block;
2236 }
2237 .kd-search-form {
2238 position: relative;
2239 }
2240 .kd-autocomplete {
2241 width: 510px;
2242 padding: 0;
2243 display: none;
2244 position: absolute;
2245 left: 1px;
2246 top: 29px;
2247 z-index: 100;
2248 }
2249 .kd-autocompletelistitem {
2250 font-size: 16px;
2251 line-height: 30px;
2252 padding-left: 10px;
2253 }
2254 .kd-autocompletelistitem:hover {
2255 background: #eee;
2256 }
2257
2258 /*------------------------------------------------------------------
2259 Component: Zippy
2260 ------------------------------------------------------------------*/
2261 .kd-zippycontent {
2262 position: relative;
2263 overflow: hidden;
2264 height: 0;
2265 -webkit-transition: all 0.218s;
2266 -moz-transition: all 0.218s;
2267 -o-transition: all 0.218s;
2268 transition: all 0.218s;
2269 }
2270 .kd-zippycontent > *{position:absolute;bottom:0; left:0; width:100%;}
2271 .kd-zippy.expanded .kd-zippycontent{}
2272
2273 .kd-zippycontent ul.iconList li a {
2274 padding-left: 30px;
2275 margin-left: 32px;
2276 background-repeat: no-repeat;
2277 background-position: 2px center;
2278 line-height: 23px;
2279 }
2280
2281 /* zippy as folder */
2282 .kd-zippy.kd-parent img.icon{ float:left; position:relative; top:2px; margin-rig ht:5px; opacity:.6;}
2283 .kd-zippy.kd-parent ul li a{line-height:23px; padding-left:0;}
2284 .kd-zippy.kd-parent.has_icon ul li a{padding-left:23px;}
2285 .kd-zippy.kd-parent ul li img.icon{top:-1px;}
2286
2287 /*------------------------------------------------------------------
2288 Component: Accordion
2289 ------------------------------------------------------------------*/
2290 .kd-accordion .kd-zippy{
2291 border-bottom:1px solid #ebebeb;
2292 }
2293 .kd-accordion label{
2294 display:block;
2295 }
2296 .kd-accordion .kd-zippycontent{
2297 }
2298 .kd-accordion .kd-zippycontent > ul{
2299 bottom:auto;
2300 top:0;
2301 }
2302 .kd-accordion .kd-zippycontent ul li{
2303 margin-left:28px;
2304 line-height:29px;
2305 }
2306 .kd-accordion .kd-zippycontent ul li input[type=radio]{
2307 margin-bottom:-2px;
2308 }
2309 .kd-accordion .row > a{
2310 -webkit-transition: color 0.130s linear;
2311 -moz-transition: color 0.130s linear;
2312 -o-transition: color 0.130s linear;
2313 transition: color 0.130s linear;
2314 }
2315 .kd-accordion .expanded .row > a{
2316 color:#222;
2317 font-weight:bold;
2318 }
2319 .kd-accordion .expanded .row .kd-disclosureindicator{
2320
2321
2322 }
2323
2324 /*------------------------------------------------------------------
2325 Compondent: Slider
2326 ------------------------------------------------------------------*/
2327 .kd-slider {
2328 position:relative;
2329 width:137px;
2330 height:5px;
2331 padding:5px 0;
2332 margin-bottom:20px;
2333
2334 cursor:default;
2335 -webkit-user-select:none;
2336 -moz-user-select:none;
2337 }
2338 .kd-slider:before {
2339 content:"";
2340 display:block;
2341 width:141px;
2342 height:5px;
2343 margin-left:-2px;
2344 -webkit-border-radius:3px;
2345 -moz-border-radius:3px;
2346 border-radius:3px;
2347 background:#e5e5e5;
2348 }
2349 .kd-slider:hover:before {
2350 background:#d1d1d1;
2351 }
2352
2353 .kd-slider .kd-sliderhandle {
2354 display:block;
2355 position:absolute;
2356 top:50%;
2357 left:0;
2358 z-index:1;
2359
2360 background:#999;
2361 cursor:pointer;
2362 cursor:col-resize;
2363
2364 -webkit-box-shadow:0px 1px 1px rgba(0,0,0,0.1);
2365 -moz-box-shadow:0px 1px 1px rgba(0,0,0,0.1);
2366 box-shadow:0px 1px 1px rgba(0,0,0,0.1);
2367
2368 -webkit-transition: left 0.218s;
2369 -moz-transition: left 0.218s;
2370 -o-transition: left 0.218s;
2371 transition: left 0.218s;
2372 }
2373 .kd-slider .kd-sliderhandle-inner {
2374 display:block;
2375 position:absolute;
2376 top:1px;
2377 left:1px;
2378
2379 background:#999;
2380 text-align:center;
2381 text-indent:-9999px;
2382 line-height:15px;
2383 }
2384 .kd-slider:hover .kd-sliderhandle-inner {
2385 background:#fff;
2386 }
2387 .kd-slider .kd-sliderhandle:active {
2388 background:#535252;
2389 }
2390 .kd-slider:active .kd-sliderhandle {
2391 -webkit-transition: left 0;
2392 -moz-transition: left 0;
2393 -o-transition: left 0;
2394 transition: left 0;
2395 }
2396 .kd-slider .kd-sliderhandle:active .kd-sliderhandle-inner {
2397 background:#535252;
2398 }
2399 .kd-slider.kd-slider-range .kd-sliderambit {
2400 display:block;
2401 position:absolute;
2402 top:0;
2403 left:0;
2404 height:5px;
2405 margin-top:5px;
2406
2407 background:#c6c6c6;
2408 cursor:pointer;
2409 cursor:move;
2410 }
2411 .kd-slider.kd-slider-range:hover .kd-sliderambit {
2412 background:#535252;
2413 }
2414 .kd-slider.kd-slider-range:active .kd-sliderambit {
2415 background-color:#999;
2416 background-size:6px 6px;
2417 background-position:left -1px;
2418 background-repeat:repeat-x;
2419 background-image:-webkit-linear-gradient(135deg, transparent, transparent 3p x, #fff 3px, #fff 4px, transparent 4px, transparent);
2420 background-image:-moz-linear-gradient(135deg, transparent, transparent 3px, #fff 3px, #fff 4px, transparent 4px, transparent);
2421 background-image:-o-linear-gradient(135deg, transparent, transparent 3px, #f ff 3px, #fff 4px, transparent 4px, transparent);
2422 background-image:linear-gradient(135deg, transparent, transparent 3px, #fff 3px, #fff 4px, transparent 4px, transparent);
2423 }
2424
2425 .kd-slider-continuous .kd-sliderhandle {
2426 width:17px;
2427 height:17px;
2428 margin-top:-8px;
2429 margin-left:-8px;
2430
2431 -webkit-border-radius:8px;
2432 -moz-border-radius:8px;
2433 border-radius:8px;
2434 }
2435 .kd-slider-continuous .kd-sliderhandle-inner {
2436 width:15px;
2437 height:15px;
2438
2439 -webkit-border-radius:7px;
2440 -moz-border-radius:7px;
2441 border-radius:7px;
2442 }
2443 .kd-slider-continuous.kd-slider-range .kd-sliderhandle {
2444 width:9px;
2445
2446 -webkit-border-radius:0;
2447 -moz-border-radius:0;
2448 border-radius:0;
2449 }
2450 .kd-slider-continuous.kd-slider-range .kd-sliderhandle-inner {
2451 width:7px;
2452
2453 -webkit-border-radius:0;
2454 -moz-border-radius:0;
2455 border-radius:0;
2456 }
2457 .kd-slider-continuous.kd-slider-range .kd-sliderhandle-min {
2458 -webkit-border-top-left-radius: 8px;
2459 -webkit-border-bottom-left-radius: 8px;
2460 -moz-border-radius-topleft: 8px;
2461 -moz-border-radius-bottomleft: 8px;
2462 border-top-left-radius: 8px;
2463 border-bottom-left-radius: 8px;
2464 }
2465 .kd-slider-continuous.kd-slider-range .kd-sliderhandle-min .kd-sliderhandle-inne r {
2466 -webkit-border-top-left-radius: 6px;
2467 -webkit-border-bottom-left-radius: 6px;
2468 -moz-border-radius-topleft: 6px;
2469 -moz-border-radius-bottomleft: 6px;
2470 border-top-left-radius: 6px;
2471 border-bottom-left-radius: 6px;
2472 }
2473 .kd-slider-continuous.kd-slider-range .kd-sliderhandle-max {
2474 margin-left:0;
2475 -webkit-border-top-right-radius: 8px;
2476 -webkit-border-bottom-right-radius: 8px;
2477 -moz-border-radius-topright: 8px;
2478 -moz-border-radius-bottomright: 8px;
2479 border-top-right-radius: 8px;
2480 border-bottom-right-radius: 8px;
2481 }
2482 .kd-slider-continuous.kd-slider-range .kd-sliderhandle-max .kd-sliderhandle-inne r {
2483 -webkit-border-top-right-radius: 6px;
2484 -webkit-border-bottom-right-radius: 6px;
2485 -moz-border-radius-topright: 6px;
2486 -moz-border-radius-bottomright: 6px;
2487 border-top-right-radius: 6px;
2488 border-bottom-right-radius: 6px;
2489 }
2490
2491 .kd-slider-discrete {
2492 padding-bottom:26px;
2493 }
2494 .kd-slider-discrete .kd-sliderhandle {
2495 width:16px;
2496 height:9px;
2497 margin-top:-18px;
2498 margin-left:-8px;
2499
2500 -webkit-border-top-left-radius: 3px;
2501 -webkit-border-top-right-radius: 3px;
2502 -moz-border-radius-topleft: 3px;
2503 -moz-border-radius-topright: 3px;
2504 border-top-left-radius: 3px;
2505 border-top-right-radius: 3px;
2506 }
2507 .kd-slider-discrete .kd-sliderhandle:before {
2508 content:"";
2509 display:block;
2510 position:absolute;
2511 top:9px;
2512 border-style:solid;
2513 border-color:#999 transparent;
2514 border-width:8px 8px 0;
2515 }
2516 .kd-slider-discrete .kd-sliderhandle:active:before {
2517 border-color:#535252 transparent;
2518 }
2519 .kd-slider-discrete .kd-sliderhandle-inner {
2520 width:14px;
2521 height:8px;
2522
2523 -webkit-border-top-left-radius: 2px;
2524 -webkit-border-top-right-radius: 2px;
2525 -moz-border-radius-topleft: 2px;
2526 -moz-border-radius-topright: 2px;
2527 border-top-left-radius: 2px;
2528 border-top-right-radius: 2px;
2529 }
2530 .kd-slider-discrete .kd-sliderhandle-inner:before {
2531 content:"";
2532 display:block;
2533 position:absolute;
2534 top:8px;
2535 border-style:solid;
2536 border-color:#999 transparent;
2537 border-width:7px 7px 0;
2538 }
2539 .kd-slider-discrete:hover .kd-sliderhandle-inner {
2540 background:#fff;
2541 }
2542 .kd-slider-discrete:hover .kd-sliderhandle-inner:before {
2543 border-color:#fff transparent;
2544 }
2545 .kd-slider-discrete .kd-sliderhandle:active .kd-sliderhandle-inner:before {
2546 border-color:#535252 transparent;
2547 }
2548
2549 .kd-slider-discrete.kd-slider-range .kd-sliderhandle {
2550 width:8px;
2551 }
2552 .kd-slider-discrete.kd-slider-range .kd-sliderhandle-inner {
2553 width:6px;
2554 }
2555 .kd-slider-discrete.kd-slider-range .kd-sliderhandle-min {
2556 margin-left:-7px;
2557 -webkit-border-top-right-radius: 0;
2558 -moz-border-radius-topright: 0;
2559 border-top-right-radius: 0;
2560 }
2561 .kd-slider-discrete.kd-slider-range .kd-sliderhandle-min:before {
2562 border-width:8px 0 0 8px;
2563 }
2564 .kd-slider-discrete.kd-slider-range .kd-sliderhandle-min .kd-sliderhandle-inner {
2565 -webkit-border-top-right-radius: 0;
2566 -moz-border-radius-topright: 0;
2567 border-top-right-radius: 0;
2568 }
2569 .kd-slider-discrete.kd-slider-range .kd-sliderhandle-min .kd-sliderhandle-inner: before {
2570 border-width:6px 0 0 6px;
2571 }
2572 .kd-slider-discrete.kd-slider-range .kd-sliderhandle-max {
2573 margin-left:0;
2574 -webkit-border-top-left-radius: 0;
2575 -moz-border-radius-topleft: 0;
2576 border-top-left-radius: 0;
2577 }
2578 .kd-slider-discrete.kd-slider-range .kd-sliderhandle-max:before {
2579 border-width:8px 8px 0 0;
2580 }
2581 .kd-slider-discrete.kd-slider-range .kd-sliderhandle-max .kd-sliderhandle-inner {
2582 -webkit-border-top-left-radius: 0;
2583 -moz-border-radius-topleft: 0;
2584 border-top-left-radius: 0;
2585 }
2586 .kd-slider-discrete.kd-slider-range .kd-sliderhandle-max .kd-sliderhandle-inner: before {
2587 border-width:6px 6px 0 0;
2588 }
2589
2590 .kd-slider-discrete .kd-sliderruler {
2591 position:absolute;
2592 top:18px;
2593 left:0;
2594 width:100%;
2595 height:18px;
2596 }
2597 .kd-slider-discrete .kd-sliderstep {
2598 display:block;
2599 position:relative;
2600 float:left;
2601 width:9px;
2602 height:10px;
2603 padding-top:8px;
2604 margin-left:12px;
2605 margin-right:-4px;
2606
2607 text-align:center;
2608 font-size:12px;
2609 color:#343434;
2610 }
2611 .kd-slider-discrete .kd-sliderstep:first-child {
2612 margin-left:-4px;
2613 }
2614 .kd-slider-discrete .kd-sliderstep:before {
2615 content:"";
2616 display:block;
2617 position:absolute;
2618 top:0;
2619 left:4px;
2620 width:1px;
2621 height:5px;
2622
2623 background:#d0d0d0;
2624 }
2625 .kd-slider-discrete .kd-sliderstep-minor {
2626 text-indent:-9999px;
2627 }
2628 .kd-slider-discrete .kd-sliderstep-minor:before {
2629 height:2px;
2630 }
2631
2632 /*------------------------------------------------------------------
2633 Component: Checkboxes and Radio buttons
2634 ------------------------------------------------------------------*/
2635 input[type=checkbox], input[type=radio], .fakecheckbox, .fakeradio{
2636 -webkit-appearance: none;
2637 width: 13px;
2638 height: 13px;
2639 border: 1px solid #C6C6C6;
2640 margin:0;
2641 -webkit-border-radius:1px;
2642 -moz-border-radius:1px;
2643 border-radius:1px;
2644 -webkit-box-sizing: border-box;
2645 -moz-box-sizing: border-box;
2646 box-sizing: border-box;
2647 cursor:default;
2648 position:relative;
2649 }
2650 input[type=checkbox]:active, input[type=radio]:active, .fakecheckbox:active, .fa keradio:active{
2651 border-color:#666;
2652 background:#ebebeb;
2653 }
2654 input[type=checkbox]:hover, input[type=radio]:hover, .fakecheckbox:hover, .faker adio:hover{
2655 border-color:#666;
2656 -webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.1);
2657 -moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.1);
2658 box-shadow: inset 0px 1px 1px rgba(0,0,0,0.1);
2659 }
2660 input[type=radio], .fakeradio{
2661 border-radius:50%;
2662 width: 15px;
2663 height: 15px;
2664 }
2665
2666 input[type=checkbox].disabled, input[type=radio].disabled, .fakecheckbox.disable d, .fakeradio.disabled{
2667 border-color:#f1f1f1;
2668 background:#FFF;
2669 -webkit-box-shadow: none;
2670 -moz-box-shadow: none;
2671 box-shadow: none;
2672 }
2673 .disabledtext{
2674 color:#B8B8B8;
2675 }
2676
2677 input[type=radio]:checked::after, .fakeradio.checked::after{
2678 content:'';
2679 display:block;
2680 position:relative;
2681 top:3px;
2682 left:3px;
2683 width:7px;
2684 height:7px;
2685 background:#666;
2686 border-radius:50%;
2687 }
2688
2689 input[type=checkbox]:checked::after, .fakecheckbox.checked::after {
2690 content:url('../images/check_no_box.png');
2691 display:block;
2692 position:absolute;
2693 top:-6px;
2694 left:-5px;
2695 }
2696
2697 input[type=checkbox]:focus, .fakecheckbox.focus {
2698 outline: none;
2699 border-color:#4d90fe;
2700 }
2701 .fakecheckbox, .fakeradio{
2702 display:inline-block;
2703 }
2704
2705 /*------------------------------------------------------------------
2706 Component: Menus
2707 ------------------------------------------------------------------*/
2708 .kd-menulist {
2709 background: #FFF;
2710 /* border:1px solid #CCC;/*THIS SHOULD BE USED IN NON-WEBKIT BROWSERS ONLY - OTHER BROWSERS DO NOT INTERPRET THE OUTLINE STYLE CORRECTLY*/
2711 outline:1px solid rgba(0,0,0,0.2);
2712 padding:0 0 6px;
2713 white-space: nowrap;
2714 -moz-transition: opacity 0.218s;
2715 -o-transition: opacity 0.218s;
2716 -webkit-transition: opacity 0.218s;
2717 transition: opacity 0.218s;
2718 -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
2719 -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
2720 box-shadow: 0 2px 4px rgba(0,0,0,0.2);
2721 }
2722 .kd-menulist-bubble {
2723 margin-top:11px;
2724 padding-top:6px;
2725 }
2726 .kd-menulist-bubble:after{
2727 content:"";
2728 outline: none;
2729 display: block;
2730 position: absolute;
2731 top: -11px;
2732 left: 24px;
2733 margin: 0 0 0 -5px;
2734 width: 17px;
2735 height: 11px;
2736
2737 }
2738 .kd-menulistitem {
2739 display: block;
2740 padding: 6px 44px 6px 16px;
2741 position: relative;
2742 color: #333;
2743 font-size:13px;
2744 font-weight:normal;
2745 cursor: default;
2746 margin: 0;
2747 }
2748 .kd-menuchecklistitem {
2749 padding-left: 30px;
2750 }
2751
2752 .kd-shortcutitem{
2753 padding-right:72px;
2754 }
2755
2756 .kd-shortcut{
2757 position:absolute;
2758 right:16px;
2759 text-align:right;
2760 color:#CCC;
2761 }
2762
2763 .kd-menulistitem.kd-menuchecklistitem.selected {
2764 background-position: left center;
2765 background-repeat: no-repeat;
2766 background-color: #FFF;
2767 }
2768 .kd-menulistitem.kd-menuchecklistitem.selected:hover {
2769 background-color: #EEE;
2770 }
2771 .kd-menulistitem.disabled, .kd-menulistitem.disabled:hover, .kd-menulistitem.dis abled {
2772 color: #ccc;
2773 background-color: #FFF;
2774 cursor: default;
2775 }
2776
2777 .kd-menulist .kd-flyout {
2778 position: absolute;
2779 left: 100%;
2780 top: 0;
2781 width: 1px;
2782 overflow: hidden;
2783 opacity: 0.0;
2784 -moz-opacity: 0.0;
2785 filter: alpha(opacity=00);
2786 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)";
2787 /* -moz-transition: opacity 0.218s;
2788 -o-transition: opacity 0.218s;
2789 -webkit-transition: opacity 0.218s;
2790 transition: opacity 0.218s;*/
2791 }
2792
2793 .kd-menulistitem:hover .kd-flyout {
2794 width: auto;
2795 overflow: visible;
2796 opacity: 1.0;
2797 -moz-opacity: 1.0;
2798 filter: alpha(opacity=100);
2799 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
2800 -moz-transition: opacity 0s;
2801 -webkit-transition: opacity 0s;
2802 transition: opacity 0s;
2803 -moz-transition-delay:0.130s;
2804 -webkit-transition-delay:0.130s;
2805 transition-delay:0.130s;
2806 }
2807
2808 .kd-menulistitem .kd-disclosureindicator {
2809 position: absolute;
2810 right: 10px;
2811 top: 50%;
2812 margin-top: -3px;
2813 opacity: .5;
2814 }
2815
2816 .kd-menulistitem:hover, .kd-menulistitem.selected {
2817 background-color: #f1f1f1;
2818 color: #222;
2819
2820 -moz-transition: background 0s;
2821 -o-transition: background 0s;
2822 -webkit-transition: background 0s;
2823 transition: background 0s;
2824 }
2825 .kd-menulistitem:hover .kd-disclosureindicator {
2826 border-left-color: #999;
2827 opacity: 1;
2828 -webkit-transition: none;
2829 -moz-transition: none;
2830 transition: none;
2831 }
2832 .kd-menurule {
2833 border-top: 1px solid #ebebeb;
2834 margin-top: 9px;
2835 margin-bottom: 10px;
2836 }
2837
2838 /*------------------------------------------------------------------
2839 Component: Menu Button
2840 ------------------------------------------------------------------*/
2841 .kd-menubutton .kd-menulist {
2842 text-align: left;
2843 position: absolute;
2844 z-index: 99;
2845 background: #FFF;
2846 height: 0;
2847 width:auto;
2848 left:-9999px;
2849 /*overflow: hidden;*/
2850
2851 -moz-transition: 0;
2852 -o-transition: 0;
2853 -webkit-transition: 0;
2854 transition: 0;
2855
2856 opacity: 0.0;
2857 -moz-opacity: 0.0;
2858 filter: alpha(opacity=00);
2859 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)";
2860 }
2861 .kd-menubutton .kd-menulist.shown {
2862 left:0;
2863 height: auto;
2864 opacity: 1.0;
2865 -moz-opacity: 1.0;
2866 filter: alpha(opacity=100);
2867 -moz-transition: 0;
2868 -o-transition: 0;
2869 -webkit-transition: 0;
2870 transition: 0;
2871 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
2872 }
2873 .kd-menubutton .kd-menulist.scroll.shown {
2874 max-height: 174px;
2875 overflow: auto;
2876 }
2877 184
2878 /*------------------------------------------------------------------ 185 /*------------------------------------------------------------------
2879 Component: Modal Dialog 186 Component: Modal Dialog
2880 ------------------------------------------------------------------*/ 187 ------------------------------------------------------------------*/
2881 #kd-modalshield {
2882 background: #FFF;
2883 position: fixed;
2884 left: 0;
2885 right: 0;
2886 bottom: 0;
2887 z-index: 99;
2888 opacity: 0.0;
2889 opacity: 0.0;
2890 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)";
2891 filter: alpha(opacity=00);
2892 -webkit-transition: all 0.218s;
2893 -moz-transition: all 0.218s;
2894 -o-transition: all 0.218s;
2895 transition: all 0.218s;
2896 }
2897 html.x-mobile #kd-modalshield {
2898 display: none;
2899 }
2900 html.x-mobile #kd-modaldialog {
2901 display: none;
2902 }
2903 body.strawman #kd-modalshield {
2904 top: 44px;
2905 }
2906 body.kd-compact #kd-modalshield {
2907 top: 72px;
2908 }
2909 html.y-expand #kd-modalshield {
2910 top: 80px;
2911 }
2912 #kd-modalshield.visible {
2913 opacity: .75;
2914 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
2915 filter: alpha(opacity=75);
2916 opacity: .75;
2917 }
2918 .kd-modaldialog.visible { 188 .kd-modaldialog.visible {
2919 opacity: 1.0; 189 opacity: 1.0;
2920 -webkit-transform: scale(1.0); 190 -webkit-transform: scale(1.0);
2921 -moz-transform: scale(1.0);
2922 transform: scale(1.0);
2923 } 191 }
2924 .kd-modaldialog { 192 .kd-modaldialog {
2925 -webkit-box-shadow: 0 4px 16px rgba(0,0,0,0.2); 193 -webkit-box-shadow: 0 4px 16px rgba(0,0,0,0.2);
2926 -moz-box-shadow: 0 4px 16px rgba(0,0,0,0.2);
2927 -ms-box-shadow: 0 4px 16px rgba(0,0,0,0.2);
2928 box-shadow: 0 4px 16px rgba(0,0,0,0.2);
2929 background: white; 194 background: white;
2930 outline:1px solid rgba(0,0,0,0.2);/* border:1px solid #CCC;/*THIS IS FOR NON -WEBKIT BROWSERS ONLY - OTHER BROWSERS DO NOT INTERPRET THE OUTLINE STYLE CORREC TLY*/ 195 outline:1px solid rgba(0,0,0,0.2);/* border:1px solid #CCC;/*THIS IS FOR NON -WEBKIT BROWSERS ONLY - OTHER BROWSERS DO NOT INTERPRET THE OUTLINE STYLE CORREC TLY*/
2931 padding:30px 42px; 196 padding:30px 42px;
2932 width: 500px; 197 width: 500px;
2933 height: auto; 198 height: auto;
2934 overflow: hidden; 199 overflow: hidden;
2935 z-index: 100; 200 z-index: 100;
2936 opacity: 0.0; 201 opacity: 0.0;
2937 -webkit-transform: scale(1.05); 202 -webkit-transform: scale(1.05);
2938 -moz-transform: scale(1.05);
2939 transform: scale(1.05);
2940 -webkit-transition: all 0.218s; 203 -webkit-transition: all 0.218s;
2941 -moz-transition: all 0.218s;
2942 transition: all 0.218s;
2943 }
2944 .kd-modaldialog.medium {
2945 padding:28px 32px;
2946
2947 width: 384px;
2948 }
2949 .kd-modaldialog.small {
2950 padding:16px 20px;
2951
2952 width: 256px;
2953 }
2954 .kd-modaldialog h1 {
2955 margin-bottom: 1em;
2956 }
2957
2958 .kd-modaldialog.small h1 {
2959 margin-bottom: 8px;
2960 }
2961 .kd-formbuttons{
2962 margin-top:16px;
2963 }
2964 .kd-formbuttons .kd-button.primary{
2965 float:left;
2966 margin-right:16px;
2967 }
2968 .kd-modaldialog .kd-confirmation {
2969 display: inline-block;
2970 padding-top: 7px;
2971 }
2972 .kd-modaldialog input[type=checkbox] {
2973 margin-left: 0;
2974 margin-right: 6px;
2975 margin-bottom: -1px;
2976 }
2977 .kd-closebutton {
2978 width: 44px;
2979 height: 44px;
2980 background: url('../images/icons/x.png') center no-repeat;
2981 position: absolute;
2982 top: 0;
2983 right: 0;
2984 opacity: .7;
2985 -moz-opacity: .7;
2986 filter: alpha(opacity=70);
2987 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
2988 cursor:default;
2989 }
2990 .kd-closebutton:hover {
2991 opacity: 1;
2992 -moz-opacity: 1;
2993 filter: alpha(opacity=100);
2994 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
2995 }
2996
2997 /*------------------------------------------------------------------
2998 Component: Prompt
2999 ------------------------------------------------------------------*/
3000 .kd-prompt label {
3001 display: block;
3002 margin-bottom: 16px;
3003 }
3004 .kd-prompt input[type=text] {
3005 width: 100%;
3006 }
3007
3008 /*------------------------------------------------------------------
3009 Component: Settings
3010 ------------------------------------------------------------------*/
3011 .kd-settings {
3012 -webkit-box-shadow: 0 4px 16px rgba(0,0,0,0.2);
3013 -moz-box-shadow: 0 4px 16px rgba(0,0,0,0.2);
3014 -ms-box-shadow: 0 4px 16px rgba(0,0,0,0.2);
3015 box-shadow: 0 4px 16px rgba(0,0,0,0.2);
3016 background: white;
3017 left: 50%;
3018 outline:1px solid rgba(0,0,0,0.2);/* border:1px solid #CCC;/*THIS IS FOR NON -WEBKIT BROWSERS ONLY - OTHER BROWSERS DO NOT INTERPRET THE OUTLINE STYLE CORREC TLY*/
3019 position: fixed;
3020 right: auto;
3021 width: 800px;
3022 height: auto;
3023 overflow: hidden;
3024 z-index: 100;
3025 top: 72px;
3026 margin-left: -256px;
3027 opacity: 0.0;
3028 -webkit-transform: scale(1.05);
3029 -moz-transform: scale(1.05);
3030 transform: scale(1.05);
3031 -webkit-transition: all 0.218s;
3032 -moz-transition: all 0.218s;
3033 transition: all 0.218s;
3034 }
3035 .kd-settings.visible {
3036 opacity: 1.0;
3037 -webkit-transform: scale(1.0);
3038 -moz-transform: scale(1.0);
3039 transform: scale(1.0);
3040 }
3041 .kd-settings-hd {
3042 background-color: #f1f1f1;
3043 border-bottom: 1px solid #ccc;
3044 height: 71px;
3045 }
3046 .kd-settings-hd h1 {
3047 padding-top: 26px;
3048 padding-left: 42px;
3049 }
3050 .kd-settings-hd .kd-formbuttons {
3051 float: right;
3052 padding-right: 26px;
3053 padding-top: 22px;
3054 margin: 0;
3055 }
3056 .kd-settings-nav {
3057 padding: 36px 20px 36px 42px;
3058 border-right: 1px solid #ebebeb;
3059 width: 108px;
3060 float: left;
3061 overflow: auto;
3062 }
3063 .kd-settings-nav li {
3064 margin-bottom: 13px;
3065 }
3066 .kd-settings-nav li a {
3067 display: block;
3068 color: #333;
3069 cursor: default;
3070 }
3071 .kd-settings-nav li a:hover {
3072 color: #111;
3073 }
3074 .kd-settings-nav li a.selected {
3075 color: #DD4B39;
3076 font-weight: bold;
3077 }
3078 .kd-settings-content {
3079 width: 629px;
3080 margin-left: 171px;
3081 height: auto;
3082 overflow: hidden;
3083 padding-bottom: 20px;
3084 }
3085 .kd-settings-content .kd-settings-pane {
3086 display: none;
3087 padding: 16px 32px;
3088 height: auto;
3089 max-height: 400px;
3090 overflow: auto;
3091 }
3092 .kd-settings-content .kd-settings-pane.selected {
3093 display: block;
3094 }
3095
3096 .kd-settings-pane-section {
3097 clear: both;
3098 border-bottom: 1px solid #ebebeb;
3099 padding: 20px 0;
3100 height: 100%;
3101 overflow: hidden;
3102 }
3103 .kd-settings-pane-section p {
3104 line-height: 13px;
3105 }
3106 .kd-settings-pane-section .setting-label {
3107 display: block;
3108 width: 185px;
3109 float: left;
3110 font-weight: bold;
3111 }
3112 .kd-settings-pane-section .setting-label .info {
3113 font-size: 11px;
3114 color: #666;
3115 font-weight: normal;
3116 }
3117 .kd-settings-pane-section .setting {
3118 margin-left: 210px;
3119 }
3120 .kd-settings-pane-section .kd-button.kd-select {
3121 float: none;
3122 margin-left: 0;
3123 min-width: 0;
3124 margin-right: 5px;
3125 }
3126
3127 .kd-settings-pane-section .setting input[type=checkbox] {
3128 margin-right: 5px;
3129 bottom: -1px;
3130 }
3131
3132 /*------------------------------------------------------------------
3133 Component: Bubble Panel
3134 ------------------------------------------------------------------*/
3135 .kd-bubble {
3136 position: relative;
3137 background: #FFF;
3138 outline: 1px solid rgba(0,0,0,0.2);
3139 -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
3140 -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
3141 box-shadow: 0 2px 4px rgba(0,0,0,0.2);
3142 padding: 16px;
3143 width: 146px;
3144 -webkit-border-radius: 2px;
3145 -moz-border-radius: 2px;
3146 border-radius: 2px;
3147 }
3148 .kd-bubble .pointer {
3149 outline: none;
3150 display: block;
3151 position: absolute;
3152 top: -11px;
3153 left: 24px;
3154 margin: 0 0 0 -5px;
3155 width: 17px;
3156 height: 11px;
3157 }
3158
3159 .kd-bubble p {
3160 margin-bottom: 0;
3161 color: #666;
3162 }
3163
3164 .kd-bubble p.links {
3165 margin-top: 10px;
3166 }
3167 .kd-bubble p.links a:hover{
3168 text-decoration:underline;
3169 }
3170
3171 .kd-bubble.alert{
3172 background: #F9EDBE;
3173 outline: 1px solid #f0c36d;
3174 }
3175
3176 .kd-profilebox{
3177 width:336px;
3178 }
3179 .kd-profilebox .kd-disclaimer{
3180 background:#F9EDBE;
3181 padding:16px;
3182 margin:-16px -16px 0 -16px;
3183 border-bottom:1px solid #ddd8c0;
3184 }
3185 .kd-profilebox .kd-disclaimer p{
3186 color:#202020;
3187 }
3188 .kd-profile{
3189 padding:22px 0;
3190 height:100%;
3191 overflow:hidden;
3192 }
3193 .kd-profileimage{
3194 float:left;
3195 width:160px;
3196 }
3197 .kd-profileimage img{
3198 border:1px solid #CCC;
3199 }
3200 .kd-profileinfo{
3201 float:right;
3202 width:160px;
3203 }
3204 .kd-profileinfo .email{
3205 color:#999;
3206 }
3207 .kd-profileinfo ul{
3208 margin-top:6px;
3209 }
3210 .kd-profileinfo ul li{
3211 line-height:24px;
3212 }
3213 .kd-profileinfo .kd-profilename{
3214 font-size:13px;
3215 line-height:13px;
3216 color:#202020;
3217 font-weight:bold;
3218 }
3219 .kd-accountlist{
3220 background:#f1f1f1;
3221 padding:3px 16px 0;
3222 margin:0 -16px 0;
3223 border-top:1px solid #CCC;
3224 -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
3225 -moz-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
3226 box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
3227 }
3228 .kd-accountlist h3{
3229 font-size:13px;
3230 font-weight:bold;
3231 }
3232 .kd-accountlist img{
3233 border:1px solid #CCC;
3234 position:absolute;
3235 left:0;
3236 top:2px;
3237 }
3238 .kd-accountlist ul{
3239 margin-top:3px;
3240 }
3241 .kd-accountlist ul li{
3242 height:44px;
3243 position:relative;
3244 }
3245 .kd-accountlist ul li p{
3246 margin-left:44px;
3247 }
3248 .kd-bubble .bottomlinks{
3249 margin:0 -16px;
3250 padding:16px 16px 0;
3251 border-top:1px solid #CCC;
3252 }
3253 .kd-bubble .bottomlinks a{
3254 float:right;
3255 }
3256 .kd-bubble .bottomlinks a:first-child{
3257 float:left;
3258 }
3259 #stickers .kd-bubble{
3260 margin-right:44px;
3261 float:left;
3262 }
3263 .kd-bubble.dark{background:#2d2d2d;width:auto;outline: 1px solid rgba(255,255,25 5,0.5);}
3264 .kd-bubble.dark ul{height:100%; overflow:hidden;}
3265 .kd-bubble.dark li{float:left; margin-left:16px;}
3266 .kd-bubble.dark li img{display:block;}
3267 .kd-bubble.dark li:first-child{margin-left:0;}
3268
3269 /*------------------------------------------------------------------
3270 Component: Hovercard
3271 ------------------------------------------------------------------*/
3272 .kd-hovercard {
3273 outline:1px solid rgba(0,0,0,0.2);
3274 width: 160px;
3275 -moz-transition: opacity 0.218s;
3276 -o-transition: opacity 0.218s;
3277 -webkit-transition: opacity 0.218s;
3278 transition: opacity 0.218s;
3279 -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
3280 -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
3281 box-shadow: 0 2px 4px rgba(0,0,0,0.2);
3282 }
3283
3284 .kd-hovercard .kd-cardprofile {
3285 padding: 16px 16px 0;
3286 border-bottom: 1px solid #ebebeb;
3287 }
3288
3289 .kd-hovercard .kd-menulist {
3290 outline: 0;
3291 width: auto;
3292 -moz-transition: none;
3293 -o-transition: none;
3294 -webkit-transition: none;
3295 transition: none;
3296 -webkit-box-shadow: 0;
3297 -moz-box-shadow: 0;
3298 box-shadow: 0;
3299 }
3300
3301 /*------------------------------------------------------------------
3302 Component: Date Picker
3303 ------------------------------------------------------------------*/
3304 .kd-datepicker{
3305 padding:16px;
3306 outline: 1px solid rgba(0,0,0,0.2);
3307 opacity:0;
3308 width:144px;
3309 position:absolute;
3310 left:-9999px;
3311 z-index:3;
3312 background:#FFF;
3313
3314 -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
3315 -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
3316 box-shadow: 0 2px 4px rgba(0,0,0,0.2);
3317 -webkit-border-radius: 2px;
3318 -moz-border-radius: 2px;
3319 border-radius: 2px;
3320 -webkit-transition: all 0.13s linear, left 0 linear .13s;
3321 -moz-transition: all 0.13s linear;
3322 -o-transition: all 0.13s linear;
3323 transition: all 0.13s linear;
3324 }
3325 .kd-minicalendar{
3326 width:148px;
3327 margin-left:-4px;
3328 }
3329 .kd-datepicker .kd-minicalendar{
3330 width:144px;
3331 margin:0;
3332
3333 }
3334 .kd-datepicker.shown{
3335 opacity:1;
3336 -webkit-transition:0, left 0 linear 0;
3337 -moz-transition:0
3338 -o-transition:0;
3339 transition:0;
3340 }
3341 .kd-minicalendar h2{
3342 font-size:13px;
3343 color:#666;
3344 padding-left:4px;
3345 }
3346 .kd-minicalendar h2 .links{
3347 float:right;
3348 margin-right:2px;
3349 }
3350 .kd-minicalendar h2 .links img{
3351 cursor:default;
3352 }
3353 .kd-minicalendar td, .kd-minicalendar th{
3354 width:20px;
3355 height:20px;
3356 line-height:20px;
3357 padding-left:4px;
3358 font-size:11px;
3359 color:#666;
3360 cursor:default;
3361 }
3362 .kd-minicalendar td:hover, .kd-minicalendar td.selected, .kd-minicalendar h2 .li nks img:hover{
3363 background:#eee;
3364 color:#333;
3365 }
3366
3367 .kd-minicalendar td.disabled{
3368 color:#ccc;
3369 }
3370 .kd-minicalendar td.disabled:hover{
3371 background:none;
3372 cursor:default;
3373 }
3374
3375 /*------------------------------------------------------------------
3376 Component: Color Picker
3377 ------------------------------------------------------------------*/
3378 .kd-colorpicker{
3379 width:140px;
3380 padding:16px;
3381 outline: 1px solid rgba(0,0,0,0.2);
3382 -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
3383 -moz-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
3384 box-shadow: 0 2px 4px rgba(0,0,0,0.2);
3385 -webkit-border-radius: 2px;
3386 -moz-border-radius: 2px;
3387 border-radius: 2px;
3388 }
3389 .kd-menubutton .kd-colorpicker{
3390 padding:0;
3391 }
3392 .kd-menubutton.selected .kd-colorpicker{
3393 padding:16px;
3394 }
3395 .kd-colortable{
3396 width:140px;
3397 }
3398 .kd-colortable.primaries{
3399 margin-bottom:8px;
3400 }
3401 .kd-colortable td{
3402 width:16px;
3403 height:16px;
3404 border:1px solid #FFF;
3405 cursor:default;
3406 position:relative;
3407 }
3408 .kd-colortable td:hover{
3409 border-color:#333;
3410 }
3411 .kd-colortable td.selected:after{
3412 content:'';
3413 display:block;
3414 position:absolute;
3415 top:-3px;
3416 right:0;
3417 width:18px;
3418 height:18px;
3419 }
3420
3421 /*------------------------------------------------------------------
3422 Component: Activity Indicator
3423 ------------------------------------------------------------------*/
3424 #loader {
3425 position:relative;
3426 width:19px;
3427 height:19px;
3428 }
3429 #loader * {
3430 display:block;
3431 position:absolute;
3432 }
3433 #loader .circle {
3434 width:100%;
3435 height:100%;
3436 -webkit-border-radius:50%;
3437 -moz-border-radius:50%;
3438 border-radius:50%;
3439 opacity:0;
3440 overflow:hidden;
3441 }
3442
3443 #loader .mask {
3444 height:100%;
3445 width:100%;
3446 opacity:0;
3447 overflow:hidden;
3448 }
3449
3450 #loader .mask.first {
3451 -webkit-transition-property:border-color;
3452 -webkit-transition-duration:0s;
3453 -webkit-transition-delay:0.22s;
3454 -moz-transition-property:border-color;
3455 -moz-transition-duration:0s;
3456 -moz-transition-delay:0.22s;
3457 transition-property:border-color;
3458 transition-duration:0s;
3459 transition-delay:0.22s;
3460 }
3461
3462 #loader .circle.initial .mask { top:0; height:50%; }
3463
3464 #loader .circle.red .mask.first { top:0; height:50%; border-bottom:1px solid #55 5; }
3465 #loader .circle.red .mask.second { bottom:0; height:50%; }
3466
3467 #loader .circle.yellow .mask.first { right:0; width:50%; border-left:1px solid # 888; }
3468 #loader .circle.yellow .mask.second { left:0; width:50%; }
3469
3470 #loader .circle.green .mask.first { bottom:0; height:50%; border-top:1px solid # 555; }
3471 #loader .circle.green .mask.second { top:0; height:50%; }
3472
3473 #loader .circle.blue .mask.first { left:0; width:50%; border-right:1px solid #88 8;}
3474 #loader .circle.blue .mask.second { right:0; width:50%; }
3475
3476 #loader .circle .mask .base {
3477 height:100%;
3478 width:100%;
3479 opacity:0;
3480 -webkit-border-radius:50%;
3481 -moz-border-radius:50%;
3482 border-radius:50%;
3483 -webkit-transition-property:opacity;
3484 -webkit-transition-timing-function:linear;
3485 -webkit-transition-duration:0s;
3486 -webkit-transition-delay:0s;
3487 -moz-transition-property:opacity;
3488 -moz-transition-timing-function:linear;
3489 -moz-transition-duration:0s;
3490 -moz-transition-delay:0s;
3491 transition-property:opacity;
3492 transition-timing-function:linear;
3493 transition-duration:0s;
3494 transition-delay:0s;
3495 }
3496
3497 #loader .circle .mask .mover {
3498 height:100%;
3499 width:100%;
3500 -webkit-border-radius:50%;
3501 -moz-border-radius:50%;
3502 border-radius:50%;
3503 -webkit-transition-property:background-color, left, top, right, bottom, widt h, height;
3504 -webkit-transition-timing-function:ease-in;
3505 -webkit-transition-duration:0.22s;
3506 -webkit-transition-delay:0s;
3507 -moz-transition-property:background-color, left, top, right, bottom, width, height;
3508 -moz-transition-timing-function:ease-in;
3509 -moz-transition-duration:0.22s;
3510 -moz-transition-delay:0s;
3511 transition-property:background-color, left, top, right, bottom, width, heigh t;
3512 transition-timing-function:ease-in;
3513 transition-duration:0.22s;
3514 transition-delay:0s;
3515 }
3516 #loader .circle .mask.second .mover,
3517 #loader .circle.initial .mask .mover {
3518 -webkit-transition-timing-function:ease-out;
3519 -webkit-transition-delay:0.22s;
3520 -moz-transition-timing-function:ease-out;
3521 -moz-transition-delay:0.22s;
3522 transition-timing-function:ease-out;
3523 transition-delay:0.22s;
3524 }
3525
3526 #loader .circle.red .mask.first .base { top:0; height:200%; background-color:#88 8; }
3527 #loader .circle.red .mask.second .base { bottom:0; height:200%; background-color :#555; }
3528
3529 #loader .circle.yellow .mask.first .base { right:0; width:200%; background-color :#555; }
3530 #loader .circle.yellow .mask.second .base { left:0; width:200%; background-color :#888; }
3531
3532 #loader .circle.green .mask.first .base { bottom:0; height:200%; background-colo r:#888; }
3533 #loader .circle.green .mask.second .base { top:0; height:200%; background-color: #555; }
3534
3535 #loader .circle.blue .mask.first .base { left:0; width:200%; background-color:#5 55; }
3536 #loader .circle.blue .mask.second .base { right:0; width:200%; background-color: #888; }
3537
3538 #loader .circle.initial .mask .mover {
3539 top:100%;
3540 height:0;
3541 background-color:#363636;
3542 }
3543 #loader .circle.red .mask.first .mover { top:0; height:200%; background-color:#5 55; }
3544 #loader .circle.red .mask.second .mover { bottom:100%; height:0; background-colo r:#6a6a6a }
3545
3546 #loader .circle.yellow .mask.first .mover { right:0; width:200%; background-colo r:#888; }
3547 #loader .circle.yellow .mask.second .mover { left:100%; width:0; background-colo r:#363636; }
3548
3549 #loader .circle.green .mask.first .mover { bottom:0; height:200%; background-col or:#555; }
3550 #loader .circle.green .mask.second .mover { top:100%; height:0; background-color :#6a6a6a; }
3551
3552 #loader .circle.blue .mask.first .mover { left:0; width:200%; background-color:# 888; }
3553 #loader .circle.blue .mask.second .mover { right:100%; width:0; background-color :#363636; }
3554
3555 /* Initial State */
3556 #loader.initial .circle.initial,
3557 #loader.initial .circle.initial .mask {
3558 opacity:1;
3559 }
3560 #loader.initial .circle.initial .mask .mover {
3561 top:0;
3562 height:200%;
3563 background-color:#555;
3564 }
3565
3566 /* Moving from Red to Yellow */
3567 #loader.yellow .circle.yellow,
3568 #loader.yellow .circle.yellow .mask,
3569 #loader.yellow .circle.yellow .mask .base {
3570 opacity:1;
3571 }
3572 #loader.yellow .circle.yellow .mask.first {
3573 border-color:#555;
3574 }
3575 #loader.yellow .circle.yellow .mask.first .mover {
3576 right:100%;
3577 width:0;
3578 background-color:#6a6a6a;
3579 }
3580 #loader.yellow .circle.yellow .mask.second .mover {
3581 left:0;
3582 width:200%;
3583 background-color:#555;
3584 }
3585
3586 /* Moving from Yellow to Green */
3587 #loader.green .circle.green,
3588 #loader.green .circle.green .mask,
3589 #loader.green .circle.green .mask .base {
3590 opacity:1;
3591 }
3592 #loader.green .circle.green .mask.first {
3593 border-color:#888;
3594 }
3595 #loader.green .circle.green .mask.first .mover {
3596 bottom:100%;
3597 height:0;
3598 background-color:#363636;
3599 }
3600 #loader.green .circle.green .mask.second .mover {
3601 top:0;
3602 height:200%;
3603 background-color:#888;
3604 }
3605
3606
3607 /* Moving from Green to Blue */
3608 #loader.blue .circle.blue,
3609 #loader.blue .circle.blue .mask,
3610 #loader.blue .circle.blue .mask .base {
3611 opacity:1;
3612 }
3613 #loader.blue .circle.blue .mask.first {
3614 border-color:#555;
3615 }
3616 #loader.blue .circle.blue .mask.first .mover {
3617 left:100%;
3618 width:0;
3619 background-color:#6a6a6a;
3620 }
3621 #loader.blue .circle.blue .mask.second .mover {
3622 right:0;
3623 width:200%;
3624 background-color:#555;
3625 }
3626
3627 /* Moving from Blue to Red */
3628 #loader.red .circle.red,
3629 #loader.red .circle.red .mask,
3630 #loader.red .circle.red .mask .base {
3631 opacity:1;
3632 }
3633 #loader.red.firstTime .circle.red .mask.second .base {
3634 opacity:0;
3635 }
3636 #loader.red .circle.red .mask.first {
3637 border-color:#888;
3638 }
3639 #loader.red .circle.red .mask.first .mover {
3640 top:100%;
3641 height:0;
3642 background-color:#363636;
3643 }
3644 #loader.red .circle.red .mask.second .mover {
3645 bottom:0;
3646 height:200%;
3647 background-color:#888;
3648 }
3649 #loader.offline .mask.first .base,
3650 #loader.offline .mask.second .mover,
3651 #loader.readyOn .base,
3652 #loader.readyOn .mover,
3653 #loader.transitionOn .mask.second .base{
3654 background-color:#999 !important;
3655 }
3656 #loader.offline .mask.first,
3657 #loader.readyOn .mask.first{
3658 border-color:#999 !important;
3659 }
3660 #loader .bolt{
3661 position:absolute;
3662 top:50%;
3663 left:50%;
3664 margin-top:-6px;
3665 margin-left:-3px;
3666 opacity:0;
3667 width:8px;
3668 height:14px;
3669
3670 -webkit-transition: opacity .218s linear .44s;
3671 -moz-transition: opacity .218s linear .44s;
3672 -o-transition: opacity .218s linear .44s;
3673 transition: opacity .218s linear .44s;
3674 }
3675 #loader.offline .bolt{
3676 opacity:1;
3677 }
3678 /*#loader.transitionOn .mask.first .mover{
3679 background-color:#999 !important;
3680 }*/
3681
3682 #loader.stopped .mask.first .base,
3683 #loader.finishing .mask.first .base,
3684 #loader.finishing .mask.second .base,
3685 #loader.finishing .mask.first .mover{
3686 opacity:0 !important;
3687 }
3688
3689 #loader.finishing .mask.first{
3690 border-color:transparent !important;
3691 }
3692 #loader.finishing.blue .circle.blue .mask.second .mover{
3693 width:0;
3694 right:100%;
3695 }
3696 #loader.finishing.green .circle.green .mask.second .mover{
3697 height:0;
3698 top:100%;
3699 }
3700 #loader.finishing.yellow .circle.yellow .mask.second .mover{
3701 width:0;
3702 left:100%;
3703 }
3704 #loader.finishing.red .circle.red .mask.second .mover{
3705 height:0;
3706 bottom:100%;
3707 }
3708 #loader.finishing .mover{
3709 -webkit-transition-delay:0s !important;
3710 -moz-transition-delay:0s !important;
3711 transition-delay:0s !important;
3712 }
3713
3714 /*------------------------------------------------------------------
3715 Component: Progress Bar
3716 ------------------------------------------------------------------*/
3717 .kd-progressstatus{
3718 color:#202020;
3719 margin-bottom:0;
3720 }
3721 .kd-progresstext{
3722 color:#999;
3723 }
3724 .kd-progressbar{
3725 width:320px;
3726 border:1px solid #999;
3727 padding:1px;
3728 }
3729 .kd-progresstrack {
3730 background-color:#ccc;
3731 width:170px;
3732 height:5px;
3733 }
3734 .kd-progressbar-blue .kd-progresstrack { background-color:#6188f5; }
3735
3736 .kd-progressbar-tall .kd-progresstrack,
3737 .kd-progressbar-tall .kd-quantitytrack {
3738 height:8px;
3739 }
3740
3741 .kd-progressbar-animated .kd-progresstrack {
3742 -webkit-box-shadow:inner 0 0 0 1px rgba(0,0,0,0.1);
3743 -moz-box-shadow:inner 0 0 0 1px rgba(0,0,0,0.1);
3744 box-shadow:inner 0 0 0 1px rgba(0,0,0,0.1);
3745
3746 background-repeat:repeat-x;
3747 background-position:0 0;
3748 background-size:16px 8px;
3749 background-image:-webkit-linear-gradient(315deg, transparent, transparent 33 %, rgba(0,0,0,0.12) 33%, rgba(0,0,0,0.12) 66%, transparent 66%, transparent);
3750 background-image:-moz-linear-gradient(315deg, transparent, transparent 33%, rgba(0,0,0,0.12) 33%, rgba(0,0,0,0.12) 66%, transparent 66%, transparent);
3751 background-image:-o-linear-gradient(315deg, transparent, transparent 33%, rg ba(0,0,0,0.12) 33%, rgba(0,0,0,0.12) 66%, transparent 66%, transparent);
3752 background-image:linear-gradient(315deg, transparent, transparent 33%, rgba( 0,0,0,0.12) 33%, rgba(0,0,0,0.12) 66%, transparent 66%, transparent);
3753
3754 -webkit-animation-name: bg;
3755 -webkit-animation-duration: 0.8s;
3756 -webkit-animation-iteration-count: infinite;
3757 -webkit-animation-timing-function: linear;
3758 }
3759 .kd-progressbar-animated.kd-progressbar-tall .kd-progresstrack {
3760 background-size:20px 10px;
3761 -webkit-animation-name: bg-tall;
3762 }
3763
3764 @-webkit-keyframes bg {
3765 0% { background-position:0 0; }
3766 100% { background-position:-16px 0; }
3767 }
3768 @-webkit-keyframes bg-tall {
3769 0% { background-position:0 0; }
3770 100% { background-position:-20px 0; }
3771 }
3772
3773 /*------------------------------------------------------------------
3774 Component: Quantity Bar
3775 ------------------------------------------------------------------*/
3776 .kd-quantitytrack{
3777 width:170px;
3778 height:5px;
3779 background-color: #CCC;
3780 background-image: -webkit-linear-gradient(0, transparent 50%, white 50%);
3781 background-image: -moz-linear-gradient(0, transparent 50%, white 50%);
3782 background-image: linear-gradient(0, transparent 50%, white 50%);
3783 -o-background-size: 5px;
3784 -moz-background-size: 5px;
3785 -webkit-background-size: 5px;
3786 background-size: 5px;
3787 }
3788
3789 /*------------------------------------------------------------------
3790 Component: Scrollbars
3791 ------------------------------------------------------------------*/
3792 .scrollBarBox{
3793 width:144px;
3794 margin-right:44px;
3795 position:relative;
3796 display:inline-block;
3797 -webkit-box-sizing:border-box;
3798 }
3799 .scrollBarInner{
3800 height:300px;
3801 overflow:auto;
3802 padding-top:20px;
3803 padding-right:16px;
3804 }
3805 .scrollBarInner .shadowTop{
3806 width:100%;
3807 margin-right:0;
3808 height:6px;
3809 position:absolute;
3810 top:0;
3811 left:0;
3812 background:-webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,. 2)), to(rgba(0,0,0,0)));
3813 -webkit-mask-box-image:-webkit-gradient(linear, left top, right top, color-s top(0.0, rgba(0,0,0,0.1)), color-stop(0.5, rgba(0,0,0,.8)), color-stop(1.0, rgba (0,0,0,0.1)));
3814 opacity:0;
3815 }
3816 .scrollBarInner .shadowTop:after {
3817 content:"";
3818 display:block;
3819 position:absolute;
3820 top:0px;
3821 left:0;
3822 width:100%;
3823 height:0;
3824 border-top:1px solid #ebebeb; /*FOR IE*/
3825 border-top:1px solid rgba(0, 0, 0, 0.3);
3826 }
3827
3828 .scrollBarInner .shadowBottom{
3829 width:100%;
3830 margin-right:0;
3831 height:4px;
3832 position:absolute;
3833 bottom:0;
3834 left:0;
3835 background:-webkit-gradient(linear, left bottom, left top, from(rgba(0,0,0,. 2)), to(rgba(0,0,0,0)));
3836 -webkit-mask-box-image:-webkit-gradient(linear, left top, right top, color-s top(0.0, rgba(0,0,0,0.1)), color-stop(0.5, rgba(0,0,0,.8)), color-stop(1.0, rgba (0,0,0,0.1)));
3837 opacity:1;
3838 }
3839 .scrollBarInner .shadowBottom:after {
3840 content:"";
3841 display:block;
3842 position:absolute;
3843 bottom:0px;
3844 left:0;
3845 width:100%;
3846 height:0;
3847 border-bottom:1px solid #ebebeb; /*FOR IE*/
3848 border-bottom:1px solid rgba(0, 0, 0, 0.3);
3849 } 204 }
3850 205
3851 ::-webkit-scrollbar { 206 ::-webkit-scrollbar {
3852 width: 16px; 207 width: 16px;
3853 height: 16px; 208 height: 16px;
3854 } 209 }
3855 210
3856 ::-webkit-scrollbar-button { 211 ::-webkit-scrollbar-button {
3857 height: 0px; 212 height: 0px;
3858 width: 0px; 213 width: 0px;
3859 } 214 }
3860 215
3861 ::-webkit-scrollbar-button:start:decrement,
3862 ::-webkit-scrollbar-button:end:increment {
3863 display: block;
3864 }
3865
3866 ::-webkit-scrollbar-button:vertical:start:increment,
3867 ::-webkit-scrollbar-button:vertical:end:decrement {
3868 display: none;
3869 }
3870 ::-webkit-scrollbar-track:vertical {
3871 border-right: 0px solid transparent;
3872 border-left: 5px solid transparent;
3873 background-clip:padding-box;
3874 background-color: white;
3875 }
3876 ::-webkit-scrollbar-track:horizontal {
3877 border-bottom: 0px solid transparent;
3878 border-top: 5px solid transparent;
3879 background-clip:padding-box;
3880 background-color: white;
3881
3882 }
3883
3884 ::-webkit-scrollbar-thumb { 216 ::-webkit-scrollbar-thumb {
3885 min-height: 28px; 217 min-height: 28px;
3886 padding-top:100px; 218 padding-top:100px;
3887 background-clip:padding-box; 219 background-clip:padding-box;
3888 background-color: rgba(0,0,0,0.2); 220 background-color: rgba(0,0,0,0.2);
3889 -webkit-box-shadow: inset 1px 1px 0px rgba(0,0,0,0.10), 221 -webkit-box-shadow: inset 1px 1px 0px rgba(0,0,0,0.10),
3890 inset 0px -1px 0px rgba(0,0,0,0.07); 222 inset 0px -1px 0px rgba(0,0,0,0.07);
3891 } 223 }
3892 224
3893 ::-webkit-scrollbar-thumb:hover { 225 ::-webkit-scrollbar-thumb:hover {
3894 background-color: rgba(0,0,0,0.4); 226 background-color: rgba(0,0,0,0.4);
3895 -webkit-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.25); 227 -webkit-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.25);
3896 } 228 }
3897 229
3898 ::-webkit-scrollbar-thumb:active { 230 ::-webkit-scrollbar-thumb:active {
3899 -webkit-box-shadow: inset 1px 1px 3px rgba(0,0,0,0.35); 231 -webkit-box-shadow: inset 1px 1px 3px rgba(0,0,0,0.35);
3900 background-color: rgba(0,0,0,0.5); 232 background-color: rgba(0,0,0,0.5);
3901 } 233 }
3902 ::-webkit-scrollbar-thumb:vertical {
3903 border-top: 0px solid transparent;
3904 border-bottom: 0px solid transparent;
3905 border-right: 0px solid transparent;
3906 border-left: 5px solid transparent;
3907 }
3908 ::-webkit-scrollbar-thumb:horizontal {
3909 border-top: 5px solid transparent;
3910 border-bottom: 0px solid transparent;
3911 border-right: 0px solid transparent;
3912 border-left: 0px solid transparent;
3913 }
3914
3915 .inline-scroller .scrollBarInner::-webkit-scrollbar-track:vertical {
3916 border-left: 6px solid transparent;
3917 border-right: 1px solid transparent;
3918 }
3919 .inline-scroller .scrollBarInner::-webkit-scrollbar-track:horizontal {
3920 border-top: 6px solid transparent;
3921 border-bottom: 1px solid transparent;
3922 }
3923
3924 .inline-scroller .scrollBarInner::-webkit-scrollbar-thumb:vertical {
3925 border-left: 6px solid transparent;
3926 border-right: 1px solid transparent;
3927 border-top: 0px solid transparent;
3928 border-bottom: 0px solid transparent;
3929 }
3930 .inline-scroller .scrollBarInner::-webkit-scrollbar-thumb:horizontal {
3931 border-left: 0px solid transparent;
3932 border-right: 0px solid transparent;
3933 border-top: 6px solid transparent;
3934 border-bottom: 1px solid transparent;
3935 }
3936 234
3937 ::-webkit-scrollbar-track:hover { 235 ::-webkit-scrollbar-track:hover {
3938 background-color:rgba(0,0,0,0.05); 236 background-color:rgba(0,0,0,0.05);
3939 -webkit-box-shadow: inset 1px 0px 0px rgba(0,0,0,0.10); 237 -webkit-box-shadow: inset 1px 0px 0px rgba(0,0,0,0.10);
3940 } 238 }
3941 239
3942 ::-webkit-scrollbar-track:active { 240 ::-webkit-scrollbar-track:active {
3943 background-color:rgba(0,0,0,0.05); 241 background-color:rgba(0,0,0,0.05);
3944 -webkit-box-shadow: inset 1px 0px 0px rgba(0,0,0,0.14), 242 -webkit-box-shadow: inset 1px 0px 0px rgba(0,0,0,0.14),
3945 inset -1px -1px 0px rgba(0,0,0,0.07); 243 inset -1px -1px 0px rgba(0,0,0,0.07);
3946 } 244 }
3947
3948 /*------------------------------------------------------------------
3949 Component: Tooltips
3950 ------------------------------------------------------------------*/
3951 #kd-tooltip {
3952 display: block;
3953 position: absolute;
3954 background: #2d2d2d;
3955 top: -5px;
3956 color: #FFF;
3957 font-weight: bold;
3958 text-align: center;
3959 outline: 1px solid rgba(255,255,255,0.5);
3960 height: 29px;
3961 line-height: 29px;
3962 margin-left: -20px;
3963 padding: 0 10px;
3964 font-size: 11px;
3965 z-index: 2000;
3966 opacity: 0.0;
3967 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
3968 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
3969 -webkit-box-shadow: 0px 1px 4px rgba(0,0,0,0.2);
3970 -moz-box-shadow: 0px 1px 4px rgba(0,0,0,0.2);
3971 box-shadow: 1px 2px 4px rgba(0,0,0,0.2);
3972 -webkit-box-sizing: border-box;
3973 -moz-box-sizing: border-box;
3974 box-sizing: border-box;
3975 -webkit-transition: opacity 0.13s;
3976 -moz-transition: opacity 0.13s;
3977 -o-transition: opacity 0.13s;
3978 transition: opacity 0.13s;
3979 }
3980 #kd-tooltip .pointer {
3981 outline: none;
3982 display: block;
3983 position: absolute;
3984 top: -5px;
3985 left: 24px;
3986 margin: 0 0 0 -5px;
3987 width: 0;
3988 height: 0;
3989 line-height: 0px;
3990 font-size: 0px;
3991 /* This sets the tooptip pointer color */
3992 border-top: transparent;
3993 border-left: 5px solid transparent;
3994 border-right: 5px solid transparent;
3995 border-bottom: 5px solid #2d2d2d;
3996 }
3997 #kd-tooltip.visible {
3998 opacity: 1.0;
3999 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
4000 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
4001 }
4002
4003 /*------------------------------------------------------------------
4004 Component: Form Errors
4005 ------------------------------------------------------------------*/
4006 #errorDemo{
4007 width:280px;
4008 }
4009
4010 input[type=text].kd-formerror{
4011 border:1px solid #DD4B39;
4012 }
4013 .kd-errormessage{
4014 color:#DD4B39;
4015 padding:9px 0 ;
4016 }
4017 .kd-errormessage .qm{
4018 background:#DD4B39;
4019 color:#FFF;
4020 font-weight:bold;
4021 display:inline-block;
4022 padding: 0 5px ;
4023 -webkit-border-radius:10px;
4024 -moz-border-radius:10px;
4025 border-radius:10px;
4026
4027 position: relative;
4028 top: -1px;
4029 }
4030 .kd-textlabel{
4031 color:#666;
4032 }
4033
4034 /*------------------------------------------------------------------
4035 Component: List
4036 ------------------------------------------------------------------*/
4037
4038 .kd-list table,
4039 .kd-list tbody {
4040 display:block;
4041 width:100%;
4042 overflow:visible;
4043 }
4044 .kd-list table tr {
4045 display:block;
4046 position:relative;
4047 height:39px;
4048 margin-top:-1px;
4049 background-color:#f8f8f8;
4050 border:1px solid;
4051 border-color:#ebebea transparent;
4052 z-index:1;
4053 }
4054 .kd-list table tr.highlighted {
4055 background:#fff;
4056 }
4057 .kd-list table tr.checked {
4058 background-color: #f6ebae;
4059 border-color:#ebdb84 transparent;
4060 z-index:2;
4061 }
4062 .kd-list table tr:hover {
4063 z-index:3;
4064 border-color:#ccc;
4065 -webkit-box-shadow: 0 4px 16px rgba(0,0,0,0.2);
4066 -moz-box-shadow: 0 4px 16px rgba(0,0,0,0.2);
4067 -ms-box-shadow: 0 4px 16px rgba(0,0,0,0.2);
4068 box-shadow: 0 4px 16px rgba(0,0,0,0.2);
4069 }
4070 .kd-list table tr.checked:hover {
4071 border-color:#e5d36f;
4072 }
4073 .kd-list table tr:hover input[type=checkbox],
4074 .kd-list table tr:hover .fakecheckbox,
4075 .kd-list table tr.checked input[type=checkbox],
4076 .kd-list table tr.checked .fakecheckbox {
4077 background:#fff;
4078 }
4079 .kd-list table tr td {
4080 display:block;
4081 position:absolute;
4082 }
4083 .kd-list table tr td a {
4084 display:block;
4085 text-overflow:ellipsis;
4086 overflow:hidden;
4087 white-space:nowrap;
4088 line-height:39px;
4089 font-size:13px;
4090 color:#333;
4091 }
4092
4093 .y-crush .kd-list table tr {
4094 height:29px;
4095 }
4096 .y-crush .kd-list table tr.two-line,
4097 .mobile .kd-list table tr.two-line {
4098 height:51px;
4099 }
4100 .y-crush .kd-list table tr td a,
4101 .mobile .kd-list table .two-line td a {
4102 line-height:29px;
4103 }
4104 .mobile .kd-list table tr td:first-child {
4105 left:16px;
4106 padding-left:0;
4107 }
4108
4109 /* KNURLING */
4110 .kd-list table.knurling tr:hover:after {
4111 content:"";
4112 position:absolute;
4113 top:2px;
4114 bottom:2px;
4115 left:2px;
4116 width:7px;
4117 background-image:-webkit-linear-gradient(top, #ddd, #ddd 50%, transparent 50 %, transparent);
4118 background-image:-moz-linear-gradient(top, #ddd, #ddd 50%, transparent 50%, transparent);
4119 background-image:linear-gradient(top, #ddd, #ddd 50%, transparent 50%, trans parent);
4120 background-size:1px 2px;
4121 cursor:pointer;
4122 z-index:3;
4123 }
4124 .kd-list table.knurling tr.checked:after {
4125 background-image:-webkit-linear-gradient(top, #dcc961, #dcc961 50%, transpar ent 50%, transparent);
4126 background-image:-moz-linear-gradient(top, #dcc961, #dcc961 50%, transparent 50%, transparent);
4127 background-image:linear-gradient(top, #dcc961, #dcc961 50%, transparent 50%, transparent);
4128 }
4129
4130 /* Responsive resize transitions */
4131 .kd-list table tr {
4132 -webkit-transition:height 0.18s;
4133 -moz-transition:height 0.18s;
4134 transition:height 0.18s;
4135 }
4136 .kd-list table tr td {
4137 -webkit-transition-property:top, left, right;
4138 -webkit-transition-duration:0.18s;
4139 -moz-transition-property:top, left, right;
4140 -moz-transition-duration:0.18s;
4141 transition-property:top, left, right;
4142 transition-duration:0.18s;
4143 }
4144 .kd-list table tr td a {
4145 -webkit-transition-property:padding, line-height;
4146 -webkit-transition-duration:0.18s;
4147 -moz-transition-property:padding, line-height;
4148 -moz-transition-duration:0.18s;
4149 transition-property:padding, line-height;
4150 transition-duration:0.18s;
4151 }
4152
4153 /*------------------------------------------------------------------
4154 Component: Footers
4155 ------------------------------------------------------------------*/
4156 .pageFooter{
4157 padding:11px 44px;
4158 border-top:1px solid #ebebeb;
4159 font-size:12px;
4160 }
4161 .pageFooter a:hover{
4162 text-decoration:underline;
4163 }
4164 .pageFooter, .pageFooter a{color:#999;}
4165 .pageFooter ul.linklist.right{
4166 float:right;
4167 }
4168 .pageFooter ul.linklist.left{
4169 float:left;
4170 }
4171 .pageFooter ul.linklist > li, .pageFooter ul.linklist{
4172 /* display:inline;*/
4173 float:left;
4174 }
4175 .pageFooter ul.linklist > li{
4176 margin:0 8px;
4177 }
4178 .pageFooter ul.linklist .kd-menubutton{
4179 border-left:1px solid;
4180 border-right:1px solid;
4181 border-color:transparent;
4182 margin:-11px 0 0;
4183 padding:11px 7px;
4184 }
4185 .pageFooter ul.linklist .chatbutton{
4186 padding-top:8px;
4187 padding-bottom:6px;
4188 margin-right:60px;
4189 }
4190 .pageFooter ul.linklist .kd-menubutton.selected a{
4191 color:#000;
4192 }
4193 .pageFooter ul.linklist .kd-menubutton.selected .kd-disclosureindicator{
4194 -webkit-transform:rotate(-90deg);
4195 }
4196 .pageFooter ul.linklist .kd-menubutton:hover, .pageFooter ul.linklist .kd-menubu tton.selected{
4197 border-color:#ebebeb;
4198 }
4199 .pageFooter ul.linklist .kd-menubutton:hover a{
4200 text-decoration:none;
4201 }
4202 .pageFooter .kd-menubutton a{margin:0;}
4203
4204 .pageFooter .kd-menubutton .kd-disclosureindicator{
4205 margin:4px 0 0 4px;
4206 opacity:.6;
4207 }
4208 .pageFooter .kd-menubutton img{
4209 opacity:.6;
4210 }
4211 .pageFooter .kd-menubutton:hover .kd-disclosureindicator, .pageFooter .kd-menubu tton:hover img, .pageFooter .kd-menubutton.selected img{
4212 opacity:.8;
4213 }
4214 .pageFooter .kd-menulist{
4215 -webkit-box-shadow: 0px -2px 4px rgba(0,0,0,0.2);
4216 -moz-box-shadow: 0px -2px 4px rgba(0,0,0,0.2);
4217 box-shadow: 0 -2px 4px rgba(0,0,0,0.2);
4218 outline:0;
4219 border:1px solid #a7a7a7;
4220 border-bottom:0;
4221 }
4222
4223 .componentName, #stickersheet h2.componentName a { color: #DD4B39; }
4224 .kd-content-sidebar .kd-sidebarlistitem.selected > a { border-left-color:#dd4b39 ; }
4225 .kd-appbar .kd-appname, .kd-appbar .kd-appname a { color:#DD4B39; }
4226
4227
4228
4229 .kd-button-submit.disabled, .kd-button-submit.disabled:hover, .kd-button-submit. disabled:active {
4230 border-color:#3079ed;
4231 background-color: #4d90fe;
4232 }
4233 .kd-button-share.disabled, .kd-button-share.disabled:hover, .kd-button-share.dis abled:active { 245 .kd-button-share.disabled, .kd-button-share.disabled:hover, .kd-button-share.dis abled:active {
4234 border-color:#29691d; 246 border-color:#29691d;
4235 background-color: #3d9400; 247 background-color: #3d9400;
4236 } 248 }
4237 .kd-button-action.disabled, .kd-button-action.disabled:hover, .kd-button-action. disabled:active {
4238 border-color: #b0281a;
4239 background-color: #d14836;
4240 }
4241
4242 .kd-button-submit:focus, .kd-button-submit.focus{
4243 border-color:#4D90FE
4244 }
4245 .kd-button-share:focus, .kd-button-share.focus{ 249 .kd-button-share:focus, .kd-button-share.focus{
4246 border-color:#29691d; 250 border-color:#29691d;
4247 } 251 }
4248 .kd-button-action:focus, .kd-button-action.focus{
4249 border-color:#d14836;
4250 }
4251
4252 .kd-button-submit {
4253 border-color: #3079ed;
4254 background-color: #4d90fe;
4255 background-image: -webkit-gradient(linear,left top,left bottom,from(#4d90fe) ,to(#4787ed));
4256 background-image: -webkit-linear-gradient(top,#4d90fe,#4787ed);
4257 background-image: -moz-linear-gradient(top,#4d90fe,#4787ed);
4258 background-image: -ms-linear-gradient(top,#4d90fe,#4787ed);
4259 background-image: -o-linear-gradient(top,#4d90fe,#4787ed);
4260 background-image: linear-gradient(top,#4d90fe,#4787ed);
4261 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#4d90fe',E ndColorStr='#4787ed');
4262 }
4263 .kd-button-submit:hover {
4264 border-color: #2f5bb7;
4265 background-color: #357ae8;
4266 background-image: -webkit-gradient(linear,left top,left bottom,from(#4d90fe) ,to(#357ae8));
4267 background-image: -webkit-linear-gradient(top,#4d90fe,#357ae8);
4268 background-image: -moz-linear-gradient(top,#4d90fe,#357ae8);
4269 background-image: -ms-linear-gradient(top,#4d90fe,#357ae8);
4270 background-image: -o-linear-gradient(top,#4d90fe,#357ae8);
4271 background-image: linear-gradient(top,#4d90fe,#357ae8);
4272 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#4d90fe',E ndColorStr='#357ae8');
4273 }
4274
4275 .kd-button-share { 252 .kd-button-share {
4276 border-color: #29691d; 253 border-color: #29691d;
4277 background-color: #3d9400; 254 background-color: #3d9400;
4278 background-image: -webkit-gradient(linear,left top,left bottom,from(#3d9400) ,to(#398a00)); 255 background-image: -webkit-gradient(linear,left top,left bottom,from(#3d9400) ,to(#398a00));
4279 background-image: -webkit-linear-gradient(top,#3d9400,#398a00);
4280 background-image: -moz-linear-gradient(top,#3d9400,#398a00);
4281 background-image: -ms-linear-gradient(top,#3d9400,#398a00);
4282 background-image: -o-linear-gradient(top,#3d9400,#398a00);
4283 background-image: linear-gradient(top,#3d9400,#398a00);
4284 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#3d9400',E ndColorStr='#398a00');
4285 } 256 }
4286 .kd-button-share:hover { 257 .kd-button-share:hover {
4287 border-color: #2D6200; 258 border-color: #2D6200;
4288 background-color: #368200; 259 background-color: #368200;
4289 background-image: -webkit-gradient(linear,left top,left bottom,from(#3d9400) ,to(#368200)); 260 background-image: -webkit-gradient(linear,left top,left bottom,from(#3d9400) ,to(#368200));
4290 background-image: -webkit-linear-gradient(top,#3d9400,#368200);
4291 background-image: -moz-linear-gradient(top,#3d9400,#368200);
4292 background-image: -ms-linear-gradient(top,#3d9400,#368200);
4293 background-image: -o-linear-gradient(top,#3d9400,#368200);
4294 background-image: linear-gradient(top,#3d9400,#368200);
4295 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#3d9400',E ndColorStr='#368200');
4296 } 261 }
4297 262
4298 .kd-button-action {
4299 margin-bottom: 16px;
4300 border: 1px solid transparent;
4301 color: #FFF;
4302 text-transform: uppercase;
4303 letter-spacing:1;
4304 background-color: #d14836;
4305 background-image: -webkit-gradient(linear,left top,left bottom,from(#dd4b39) ,to(#d14836));
4306 background-image: -webkit-linear-gradient(top,#dd4b39,#d14836);
4307 background-image: -moz-linear-gradient(top,#dd4b39,#d14836);
4308 background-image: -ms-linear-gradient(top,#dd4b39,#d14836);
4309 background-image: -o-linear-gradient(top,#dd4b39,#d14836);
4310 background-image: linear-gradient(top,#dd4b39,#d14836);
4311 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#dd4b39',E ndColorStr='#d14836');
4312 }
4313 .kd-button-action:hover {
4314 border-color: #b0281a;
4315 border-bottom-color: #AF301F;
4316 background-color: #c53727;
4317 background-image: -webkit-gradient(linear,left top,left bottom,from(#dd4b39) ,to(#c53727));
4318 background-image: -webkit-linear-gradient(top,#dd4b39,#c53727);
4319 background-image: -moz-linear-gradient(top,#dd4b39,#c53727);
4320 background-image: -ms-linear-gradient(top,#dd4b39,#c53727);
4321 background-image: -o-linear-gradient(top,#dd4b39,#c53727);
4322 background-image: linear-gradient(top,#dd4b39,#c53727);
4323 filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#dd4b39',E ndColorStr='#c53727');
4324 }
4325 .kd-button-action:active,
4326 .kd-button-action:focus:active,
4327 .kd-button-action.focus:active {
4328 border-color: #992A1B;
4329 background-color: #b0281a;
4330 background-image: -webkit-gradient(linear,left top,left bottom,from(#dd4b39) ,to(#b0281a));
4331 background-image: -webkit-linear-gradient(top,#dd4b39,#b0281a);
4332 background-image: -moz-linear-gradient(top,#dd4b39,#b0281a);
4333 background-image: -ms-linear-gradient(top,#dd4b39,#b0281a);
4334 background-image: -o-linear-gradient(top,#dd4b39,#b0281a);
4335 background-image: linear-gradient(top,#dd4b39,#b0281a);
4336 }
4337
4338 .kd-accordion .expanded .row > a { color:#d14836; }
4339
4340 /*------------------------------------------------------------------
4341 Component: Activity Indicator
4342 ------------------------------------------------------------------*/
4343 #loader .circle.red .mask.first { border-bottom-color:rgb(60,120,248); }
4344 #loader .circle.yellow .mask.first { border-left-color:rgb(250,36,36); }
4345 #loader .circle.green .mask.first { border-top-color:rgb(255,211,75); }
4346 #loader .circle.blue .mask.first { border-right-color:rgb(0,177,95);}
4347
4348 #loader .circle.red .mask.first .base { background-color:rgb(250,36,36); }
4349 #loader .circle.red .mask.second .base { background-color:rgb(60,120,248); }
4350
4351 #loader .circle.yellow .mask.first .base { background-color:rgb(255,211,75); }
4352 #loader .circle.yellow .mask.second .base { background-color:rgb(250,36,36); }
4353
4354 #loader .circle.green .mask.first .base { background-color:rgb(0,177,95); }
4355 #loader .circle.green .mask.second .base { background-color:rgb(255,211,75); }
4356
4357 #loader .circle.blue .mask.first .base { background-color:rgb(60,120,248); }
4358 #loader .circle.blue .mask.second .base { background-color:rgb(0,177,95); }
4359
4360 #loader .circle.initial .mask .mover { background-color:rgb(33,89,189); }
4361
4362 #loader .circle.red .mask.first .mover { background-color:rgb(60,120,248); }
4363 #loader .circle.red .mask.second .mover { background-color:rgb(158,18,18); }
4364
4365 #loader .circle.yellow .mask.first .mover { background-color:rgb(250,36,36); }
4366 #loader .circle.yellow .mask.second .mover { background-color:rgb(222,161,26); }
4367
4368 #loader .circle.green .mask.first .mover { background-color:rgb(255,211,75); }
4369 #loader .circle.green .mask.second .mover { background-color:rgb(0,137,72); }
4370
4371 #loader .circle.blue .mask.first .mover { background-color:rgb(0,177,95); }
4372 #loader .circle.blue .mask.second .mover { background-color:rgb(33,89,189); }
4373
4374 #loader.initial .circle.initial .mask .mover { background-color:rgb(60,120,248); }
4375
4376 #loader.yellow .circle.yellow .mask.first { border-color:rgb(255,211,75); }
4377 #loader.yellow .circle.yellow .mask.first .mover { background-color:rgb(158,18,1 8); }
4378 #loader.yellow .circle.yellow .mask.second .mover { background-color:rgb(255,211 ,75); }
4379
4380 #loader.green .circle.green .mask.first { border-color:rgb(0,177,95); }
4381 #loader.green .circle.green .mask.first .mover { background-color:rgb(222,161,26 ); }
4382 #loader.green .circle.green .mask.second .mover { background-color:rgb(0,177,95) ; }
4383
4384 #loader.blue .circle.blue .mask.first { border-color:rgb(60,120,248); }
4385 #loader.blue .circle.blue .mask.first .mover { background-color:rgb(0,137,72); }
4386 #loader.blue .circle.blue .mask.second .mover { background-color:rgb(60,120,248) ; }
4387
4388 #loader.red .circle.red .mask.first { border-color:rgb(250,36,36); }
4389 #loader.red .circle.red .mask.first .mover { background-color:rgb(33,89,189); }
4390 #loader.red .circle.red .mask.second .mover { background-color:rgb(250,36,36); }
4391
4392 a { 263 a {
4393 color: rgb(0, 102, 204); 264 color: rgb(0, 102, 204);
4394 text-decoration: none; 265 text-decoration: none;
4395 } 266 }
4396 267
4397 body { 268 body {
4398 margin: 0; 269 margin: 0;
4399 padding: 20px; 270 padding: 20px;
4400 direction: __MSG_@@bidi_dir__; 271 direction: __MSG_@@bidi_dir__;
4401 } 272 }
(...skipping 78 matching lines...) Expand 10 before | Expand all | Expand 10 after
4480 /* Classes */ 351 /* Classes */
4481 352
4482 .access-code-digit-group { 353 .access-code-digit-group {
4483 /* 354 /*
4484 Used for each of the four-digit components of the access code as 355 Used for each of the four-digit components of the access code as
4485 displayed by the host. 356 displayed by the host.
4486 */ 357 */
4487 padding: 0px 6px; 358 padding: 0px 6px;
4488 } 359 }
4489 360
4490 .big-button {
4491 height: 2em;
4492 font-size: 16px;
4493 padding: 6px;
4494 }
4495
4496 .box-spacer { 361 .box-spacer {
4497 -webkit-box-flex: 1; 362 -webkit-box-flex: 1;
4498 } 363 }
4499 364
4500 .centered-button { 365 .centered-button {
4501 /* 366 /*
4502 Used to force buttons to center correctly on Chrome due to a quirk 367 Used to force buttons to center correctly on Chrome due to a quirk
4503 with laying out buttons. http://crbug.com/84654 368 with laying out buttons. http://crbug.com/84654
4504 369
4505 TODO(ajwong): Either fix Chrome layout behavior, or if Chrome is actually 370 TODO(ajwong): Either fix Chrome layout behavior, or if Chrome is actually
4506 conforming correctly to the standard, remove this comment. 371 conforming correctly to the standard, remove this comment.
4507 */ 372 */
4508 text-align: center; 373 text-align: center;
4509 } 374 }
4510 375
4511 .collapsed { 376 .collapsed {
4512 opacity: 0; 377 opacity: 0;
4513 height: 0 !important; 378 height: 0 !important;
4514 } 379 }
4515 380
4516 .choice-footer {
4517 font-size: 14px;
4518 }
4519
4520 .choice-panel {
4521 margin-top: 17px;
4522 padding-bottom: 20px;
4523 }
4524
4525 .clickable { 381 .clickable {
4526 cursor: pointer; 382 cursor: pointer;
4527 } 383 }
4528 384
4529 .selectable { 385 .selectable {
4530 -webkit-user-select: text; 386 -webkit-user-select: text;
4531 cursor: text; 387 cursor: text;
4532 } 388 }
4533 389
4534 .section-row { 390 .section-row {
(...skipping 36 matching lines...) Expand 10 before | Expand all | Expand 10 after
4571 background-color: #f9edbe; 427 background-color: #f9edbe;
4572 border: 1px solid #f0c36d; 428 border: 1px solid #f0c36d;
4573 -webkit-border-radius: 2px; 429 -webkit-border-radius: 2px;
4574 -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2); 430 -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
4575 color: #222; 431 color: #222;
4576 padding: 8px 16px; 432 padding: 8px 16px;
4577 text-align: center; 433 text-align: center;
4578 font-size: 12px; 434 font-size: 12px;
4579 } 435 }
4580 436
4581 .information-box-centerer {
4582 width: 100%;
4583 bottom: 8px;
4584 position: absolute;
4585 display: -webkit-box;
4586 }
4587
4588 .message { 437 .message {
4589 text-align:center; 438 text-align:center;
4590 margin-bottom: 24px; 439 margin-bottom: 24px;
4591 } 440 }
4592 441
4593 .mode-select-button-column { 442 .mode-select-button-column {
4594 text-align: __MSG_@@bidi_end_edge__; 443 text-align: __MSG_@@bidi_end_edge__;
4595 } 444 }
4596 445
4597 .mode-select-button-column button { 446 .mode-select-button-column button {
4598 min-width: 72px; 447 min-width: 72px;
4599 } 448 }
4600 449
4601 .mode-select-table {
4602 border-collapse: collapse;
4603 margin-top: 30px;
4604 width: 100%;
4605 }
4606
4607 .mode-select-table-spacer {
4608 height: 13px;
4609 }
4610
4611 .mode-select-table-underline td {
4612 border-bottom: 1px solid #ebebeb;
4613 }
4614
4615 .hide-scrollbars {
4616 overflow-y: hidden;
4617 }
4618
4619 .host-list-table { 450 .host-list-table {
4620 width: 100%; 451 width: 100%;
4621 border-spacing: 0; 452 border-spacing: 0;
4622 } 453 }
4623 454
4624 td { 455 td {
4625 vertical-align: middle; 456 vertical-align: middle;
4626 } 457 }
4627 458
4628 .host-online:hover { 459 .host-online:hover {
(...skipping 90 matching lines...) Expand 10 before | Expand all | Expand 10 after
4719 margin-left: -200px; 550 margin-left: -200px;
4720 border: 1px solid black; 551 border: 1px solid black;
4721 background-color: #fff; 552 background-color: #fff;
4722 padding: 0 20px; 553 padding: 0 20px;
4723 } 554 }
4724 555
4725 #cancel-connect-button, #cancel-share-button { 556 #cancel-connect-button, #cancel-share-button {
4726 float: __MSG_@@bidi_end_edge__; 557 float: __MSG_@@bidi_end_edge__;
4727 } 558 }
4728 559
4729 #client-footer-text, #host-footer-text {
4730 text-align: center;
4731 }
4732
4733 #current-email { 560 #current-email {
4734 color: rgba(0, 0, 0, 0.5); 561 color: rgba(0, 0, 0, 0.5);
4735 } 562 }
4736 563
4737 #daemon-plugin-container { 564 #daemon-plugin-container {
4738 width: 0; 565 width: 0;
4739 height: 0; 566 height: 0;
4740 } 567 }
4741 568
4742 #dialog-container { 569 #dialog-container {
4743 position: absolute; 570 position: absolute;
4744 top: 200px; 571 top: 200px;
4745 left: 0; 572 left: 0;
4746 width: 100%; 573 width: 100%;
4747 display: -webkit-box; 574 display: -webkit-box;
4748 } 575 }
4749 576
4750 #dialog-screen { 577 #dialog-screen {
4751 position: absolute; 578 position: absolute;
4752 top: 0; 579 top: 0;
4753 left: 0; 580 left: 0;
4754 width: 100%; 581 width: 100%;
4755 height: 100%; 582 height: 100%;
4756 background-color: #fff; 583 background-color: #fff;
4757 opacity: 0.75; 584 opacity: 0.75;
4758 } 585 }
4759 586
4760 #email-status {
4761 margin-__MSG_@@bidi_end_edge__: 0.5ex;
4762 }
4763
4764 #host-plugin-container { 587 #host-plugin-container {
4765 width: 0; 588 width: 0;
4766 height: 0; 589 height: 0;
4767 } 590 }
4768 591
4769 #icon {
4770 height: 64px;
4771 width: 64px;
4772 }
4773
4774 #nat-box { 592 #nat-box {
4775 margin-top: 30px; 593 margin-top: 30px;
4776 } 594 }
4777 595
4778 /* The NAT traversal state is independent of the app mode, and both need 596 /* The NAT traversal state is independent of the app mode, and both need
4779 * to be combined to determine the visibility of the butter bar. We use 597 * to be combined to determine the visibility of the butter bar. We use
4780 * a style for the former and the 'hidden' property for the latter. */ 598 * a style for the former and the 'hidden' property for the latter. */
4781 #nat-box.traversal-enabled { 599 #nat-box.traversal-enabled {
4782 display: none; 600 display: none;
4783 } 601 }
(...skipping 15 matching lines...) Expand all
4799 line-height: 0; 617 line-height: 0;
4800 } 618 }
4801 619
4802 #top-secondary { 620 #top-secondary {
4803 margin-top: 10px 621 margin-top: 10px
4804 } 622 }
4805 623
4806 * { 624 * {
4807 box-sizing: border-box; 625 box-sizing: border-box;
4808 } 626 }
OLDNEW
« no previous file with comments | « remoting/webapp/connection_history.css ('k') | remoting/webapp/util.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698