git.roojs.org Git - xtuple/blob - lib/enyo-x/source/stylesheets/screen.css

   1 /*
   2   To compile this .less file to .css:
   3   lessc screen.less > ../stylesheets/screen.css
   4   Use -compress for a compressed .css with no comments
   5 */
   6 /*!
   7  *  Font Awesome 3.2.1
   8  *  the iconic font designed for Bootstrap
   9  *  ------------------------------------------------------------------------------
  10  *  The full suite of pictographic icons, examples, and documentation can be
  11  *  found at http://fontawesome.io.  Stay up to date on Twitter at
  12  *  http://twitter.com/fontawesome.
  13  *
  14  *  License
  15  *  ------------------------------------------------------------------------------
  16  *  - The Font Awesome font is licensed under SIL OFL 1.1 -
  17  *    http://scripts.sil.org/OFL
  18  *  - Font Awesome CSS, LESS, and SASS files are licensed under MIT License -
  19  *    http://opensource.org/licenses/mit-license.html
  20  *  - Font Awesome documentation licensed under CC BY 3.0 -
  21  *    http://creativecommons.org/licenses/by/3.0/
  22  *  - Attribution is no longer required in Font Awesome 3.0, but much appreciated:
  23  *    "Font Awesome by Dave Gandy - http://fontawesome.io"
  24  *
  25  *  Author - Dave Gandy
  26  *  ------------------------------------------------------------------------------
  27  *  Email: dave@fontawesome.io
  28  *  Twitter: http://twitter.com/davegandy
  29  *  Work: Lead Product Designer @ Kyruus - http://kyruus.com
  30  */
  31 /* FONT PATH
  32  * -------------------------- */
  33 @font-face {
  34   font-family: 'FontAwesome';
  35   src: url('../../lib/font-awesome/font/fontawesome-webfont.eot?v=3.2.1');
  36   src: url('../../lib/font-awesome/font/fontawesome-webfont.eot?#iefix&v=3.2.1') format('embedded-opentype'), url('../../lib/font-awesome/font/fontawesome-webfont.woff?v=3.2.1') format('woff'), url('../../lib/font-awesome/font/fontawesome-webfont.ttf?v=3.2.1') format('truetype'), url('../../lib/font-awesome/font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg');
  37   font-weight: normal;
  38   font-style: normal;
  39 }
  40 /* FONT AWESOME CORE
  41  * -------------------------- */
  42 [class^="icon-"],
  43 [class*=" icon-"] {
  44   font-family: FontAwesome;
  45   font-weight: normal;
  46   font-style: normal;
  47   text-decoration: inherit;
  48   -webkit-font-smoothing: antialiased;
  49   *margin-right: .3em;
  50 }
  51 [class^="icon-"]:before,
  52 [class*=" icon-"]:before {
  53   text-decoration: inherit;
  54   display: inline-block;
  55   speak: none;
  56 }
  57 /* makes the font 33% larger relative to the icon container */
  58 .icon-large:before {
  59   vertical-align: -10%;
  60   font-size: 1.33333333em;
  61 }
  62 /* makes sure icons active on rollover in links */
  63 a [class^="icon-"],
  64 a [class*=" icon-"] {
  65   display: inline;
  66 }
  67 /* increased font size for icon-large */
  68 [class^="icon-"].icon-fixed-width,
  69 [class*=" icon-"].icon-fixed-width {
  70   display: inline-block;
  71   width: 1.14285714em;
  72   text-align: right;
  73   padding-right: 0.28571429em;
  74 }
  75 [class^="icon-"].icon-fixed-width.icon-large,
  76 [class*=" icon-"].icon-fixed-width.icon-large {
  77   width: 1.42857143em;
  78 }
  79 .icons-ul {
  80   margin-left: 2.14285714em;
  81   list-style-type: none;
  82 }
  83 .icons-ul > li {
  84   position: relative;
  85 }
  86 .icons-ul .icon-li {
  87   position: absolute;
  88   left: -2.14285714em;
  89   width: 2.14285714em;
  90   text-align: center;
  91   line-height: inherit;
  92 }
  93 [class^="icon-"].hide,
  94 [class*=" icon-"].hide {
  95   display: none;
  96 }
  97 .icon-muted {
  98   color: #eeeeee;
  99 }
 100 .icon-light {
 101   color: #ffffff;
 102 }
 103 .icon-dark {
 104   color: #333333;
 105 }
 106 .icon-border {
 107   border: solid 1px #eeeeee;
 108   padding: .2em .25em .15em;
 109   -webkit-border-radius: 3px;
 110   -moz-border-radius: 3px;
 111   border-radius: 3px;
 112 }
 113 .icon-2x {
 114   font-size: 2em;
 115 }
 116 .icon-2x.icon-border {
 117   border-width: 2px;
 118   -webkit-border-radius: 4px;
 119   -moz-border-radius: 4px;
 120   border-radius: 4px;
 121 }
 122 .icon-3x {
 123   font-size: 3em;
 124 }
 125 .icon-3x.icon-border {
 126   border-width: 3px;
 127   -webkit-border-radius: 5px;
 128   -moz-border-radius: 5px;
 129   border-radius: 5px;
 130 }
 131 .icon-4x {
 132   font-size: 4em;
 133 }
 134 .icon-4x.icon-border {
 135   border-width: 4px;
 136   -webkit-border-radius: 6px;
 137   -moz-border-radius: 6px;
 138   border-radius: 6px;
 139 }
 140 .icon-5x {
 141   font-size: 5em;
 142 }
 143 .icon-5x.icon-border {
 144   border-width: 5px;
 145   -webkit-border-radius: 7px;
 146   -moz-border-radius: 7px;
 147   border-radius: 7px;
 148 }
 149 .pull-right {
 150   float: right;
 151 }
 152 .pull-left {
 153   float: left;
 154 }
 155 [class^="icon-"].pull-left,
 156 [class*=" icon-"].pull-left {
 157   margin-right: .3em;
 158 }
 159 [class^="icon-"].pull-right,
 160 [class*=" icon-"].pull-right {
 161   margin-left: .3em;
 162 }
 163 /* BOOTSTRAP SPECIFIC CLASSES
 164  * -------------------------- */
 165 /* Bootstrap 2.0 sprites.less reset */
 166 [class^="icon-"],
 167 [class*=" icon-"] {
 168   display: inline;
 169   width: auto;
 170   height: auto;
 171   line-height: normal;
 172   vertical-align: baseline;
 173   background-image: none;
 174   background-position: 0% 0%;
 175   background-repeat: repeat;
 176   margin-top: 0;
 177 }
 178 /* more sprites.less reset */
 179 .icon-white,
 180 .nav-pills > .active > a > [class^="icon-"],
 181 .nav-pills > .active > a > [class*=" icon-"],
 182 .nav-list > .active > a > [class^="icon-"],
 183 .nav-list > .active > a > [class*=" icon-"],
 184 .navbar-inverse .nav > .active > a > [class^="icon-"],
 185 .navbar-inverse .nav > .active > a > [class*=" icon-"],
 186 .dropdown-menu > li > a:hover > [class^="icon-"],
 187 .dropdown-menu > li > a:hover > [class*=" icon-"],
 188 .dropdown-menu > .active > a > [class^="icon-"],
 189 .dropdown-menu > .active > a > [class*=" icon-"],
 190 .dropdown-submenu:hover > a > [class^="icon-"],
 191 .dropdown-submenu:hover > a > [class*=" icon-"] {
 192   background-image: none;
 193 }
 194 /* keeps Bootstrap styles with and without icons the same */
 195 .btn [class^="icon-"].icon-large,
 196 .nav [class^="icon-"].icon-large,
 197 .btn [class*=" icon-"].icon-large,
 198 .nav [class*=" icon-"].icon-large {
 199   line-height: .9em;
 200 }
 201 .btn [class^="icon-"].icon-spin,
 202 .nav [class^="icon-"].icon-spin,
 203 .btn [class*=" icon-"].icon-spin,
 204 .nav [class*=" icon-"].icon-spin {
 205   display: inline-block;
 206 }
 207 .nav-tabs [class^="icon-"],
 208 .nav-pills [class^="icon-"],
 209 .nav-tabs [class*=" icon-"],
 210 .nav-pills [class*=" icon-"],
 211 .nav-tabs [class^="icon-"].icon-large,
 212 .nav-pills [class^="icon-"].icon-large,
 213 .nav-tabs [class*=" icon-"].icon-large,
 214 .nav-pills [class*=" icon-"].icon-large {
 215   line-height: .9em;
 216 }
 217 .btn [class^="icon-"].pull-left.icon-2x,
 218 .btn [class*=" icon-"].pull-left.icon-2x,
 219 .btn [class^="icon-"].pull-right.icon-2x,
 220 .btn [class*=" icon-"].pull-right.icon-2x {
 221   margin-top: .18em;
 222 }
 223 .btn [class^="icon-"].icon-spin.icon-large,
 224 .btn [class*=" icon-"].icon-spin.icon-large {
 225   line-height: .8em;
 226 }
 227 .btn.btn-small [class^="icon-"].pull-left.icon-2x,
 228 .btn.btn-small [class*=" icon-"].pull-left.icon-2x,
 229 .btn.btn-small [class^="icon-"].pull-right.icon-2x,
 230 .btn.btn-small [class*=" icon-"].pull-right.icon-2x {
 231   margin-top: .25em;
 232 }
 233 .btn.btn-large [class^="icon-"],
 234 .btn.btn-large [class*=" icon-"] {
 235   margin-top: 0;
 236 }
 237 .btn.btn-large [class^="icon-"].pull-left.icon-2x,
 238 .btn.btn-large [class*=" icon-"].pull-left.icon-2x,
 239 .btn.btn-large [class^="icon-"].pull-right.icon-2x,
 240 .btn.btn-large [class*=" icon-"].pull-right.icon-2x {
 241   margin-top: .05em;
 242 }
 243 .btn.btn-large [class^="icon-"].pull-left.icon-2x,
 244 .btn.btn-large [class*=" icon-"].pull-left.icon-2x {
 245   margin-right: .2em;
 246 }
 247 .btn.btn-large [class^="icon-"].pull-right.icon-2x,
 248 .btn.btn-large [class*=" icon-"].pull-right.icon-2x {
 249   margin-left: .2em;
 250 }
 251 /* Fixes alignment in nav lists */
 252 .nav-list [class^="icon-"],
 253 .nav-list [class*=" icon-"] {
 254   line-height: inherit;
 255 }
 256 /* EXTRAS
 257  * -------------------------- */
 258 /* Stacked and layered icon */
 259 .icon-stack {
 260   position: relative;
 261   display: inline-block;
 262   width: 2em;
 263   height: 2em;
 264   line-height: 2em;
 265   vertical-align: -35%;
 266 }
 267 .icon-stack [class^="icon-"],
 268 .icon-stack [class*=" icon-"] {
 269   display: block;
 270   text-align: center;
 271   position: absolute;
 272   width: 100%;
 273   height: 100%;
 274   font-size: 1em;
 275   line-height: inherit;
 276   *line-height: 2em;
 277 }
 278 .icon-stack .icon-stack-base {
 279   font-size: 2em;
 280   *line-height: 1em;
 281 }
 282 /* Animated rotating icon */
 283 .icon-spin {
 284   display: inline-block;
 285   -moz-animation: spin 2s infinite linear;
 286   -o-animation: spin 2s infinite linear;
 287   -webkit-animation: spin 2s infinite linear;
 288   animation: spin 2s infinite linear;
 289 }
 290 /* Prevent stack and spinners from being taken inline when inside a link */
 291 a .icon-stack,
 292 a .icon-spin {
 293   display: inline-block;
 294   text-decoration: none;
 295 }
 296 @-moz-keyframes spin {
 297   0% {
 298     -moz-transform: rotate(0deg);
 299   }
 300   100% {
 301     -moz-transform: rotate(359deg);
 302   }
 303 }
 304 @-webkit-keyframes spin {
 305   0% {
 306     -webkit-transform: rotate(0deg);
 307   }
 308   100% {
 309     -webkit-transform: rotate(359deg);
 310   }
 311 }
 312 @-o-keyframes spin {
 313   0% {
 314     -o-transform: rotate(0deg);
 315   }
 316   100% {
 317     -o-transform: rotate(359deg);
 318   }
 319 }
 320 @-ms-keyframes spin {
 321   0% {
 322     -ms-transform: rotate(0deg);
 323   }
 324   100% {
 325     -ms-transform: rotate(359deg);
 326   }
 327 }
 328 @keyframes spin {
 329   0% {
 330     transform: rotate(0deg);
 331   }
 332   100% {
 333     transform: rotate(359deg);
 334   }
 335 }
 336 /* Icon rotations and mirroring */
 337 .icon-rotate-90:before {
 338   -webkit-transform: rotate(90deg);
 339   -moz-transform: rotate(90deg);
 340   -ms-transform: rotate(90deg);
 341   -o-transform: rotate(90deg);
 342   transform: rotate(90deg);
 343   filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
 344 }
 345 .icon-rotate-180:before {
 346   -webkit-transform: rotate(180deg);
 347   -moz-transform: rotate(180deg);
 348   -ms-transform: rotate(180deg);
 349   -o-transform: rotate(180deg);
 350   transform: rotate(180deg);
 351   filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
 352 }
 353 .icon-rotate-270:before {
 354   -webkit-transform: rotate(270deg);
 355   -moz-transform: rotate(270deg);
 356   -ms-transform: rotate(270deg);
 357   -o-transform: rotate(270deg);
 358   transform: rotate(270deg);
 359   filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
 360 }
 361 .icon-flip-horizontal:before {
 362   -webkit-transform: scale(-1, 1);
 363   -moz-transform: scale(-1, 1);
 364   -ms-transform: scale(-1, 1);
 365   -o-transform: scale(-1, 1);
 366   transform: scale(-1, 1);
 367 }
 368 .icon-flip-vertical:before {
 369   -webkit-transform: scale(1, -1);
 370   -moz-transform: scale(1, -1);
 371   -ms-transform: scale(1, -1);
 372   -o-transform: scale(1, -1);
 373   transform: scale(1, -1);
 374 }
 375 /* ensure rotation occurs inside anchor tags */
 376 a .icon-rotate-90:before,
 377 a .icon-rotate-180:before,
 378 a .icon-rotate-270:before,
 379 a .icon-flip-horizontal:before,
 380 a .icon-flip-vertical:before {
 381   display: inline-block;
 382 }
 383 /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
 384    readers do not read off random characters that represent icons */
 385 .icon-glass:before {
 386   content: "\f000";
 387 }
 388 .icon-music:before {
 389   content: "\f001";
 390 }
 391 .icon-search:before {
 392   content: "\f002";
 393 }
 394 .icon-envelope-alt:before {
 395   content: "\f003";
 396 }
 397 .icon-heart:before {
 398   content: "\f004";
 399 }
 400 .icon-star:before {
 401   content: "\f005";
 402 }
 403 .icon-star-empty:before {
 404   content: "\f006";
 405 }
 406 .icon-user:before {
 407   content: "\f007";
 408 }
 409 .icon-film:before {
 410   content: "\f008";
 411 }
 412 .icon-th-large:before {
 413   content: "\f009";
 414 }
 415 .icon-th:before {
 416   content: "\f00a";
 417 }
 418 .icon-th-list:before {
 419   content: "\f00b";
 420 }
 421 .icon-ok:before {
 422   content: "\f00c";
 423 }
 424 .icon-remove:before {
 425   content: "\f00d";
 426 }
 427 .icon-zoom-in:before {
 428   content: "\f00e";
 429 }
 430 .icon-zoom-out:before {
 431   content: "\f010";
 432 }
 433 .icon-power-off:before,
 434 .icon-off:before {
 435   content: "\f011";
 436 }
 437 .icon-signal:before {
 438   content: "\f012";
 439 }
 440 .icon-gear:before,
 441 .icon-cog:before {
 442   content: "\f013";
 443 }
 444 .icon-trash:before {
 445   content: "\f014";
 446 }
 447 .icon-home:before {
 448   content: "\f015";
 449 }
 450 .icon-file-alt:before {
 451   content: "\f016";
 452 }
 453 .icon-time:before {
 454   content: "\f017";
 455 }
 456 .icon-road:before {
 457   content: "\f018";
 458 }
 459 .icon-download-alt:before {
 460   content: "\f019";
 461 }
 462 .icon-download:before {
 463   content: "\f01a";
 464 }
 465 .icon-upload:before {
 466   content: "\f01b";
 467 }
 468 .icon-inbox:before {
 469   content: "\f01c";
 470 }
 471 .icon-play-circle:before {
 472   content: "\f01d";
 473 }
 474 .icon-rotate-right:before,
 475 .icon-repeat:before {
 476   content: "\f01e";
 477 }
 478 .icon-refresh:before {
 479   content: "\f021";
 480 }
 481 .icon-list-alt:before {
 482   content: "\f022";
 483 }
 484 .icon-lock:before {
 485   content: "\f023";
 486 }
 487 .icon-flag:before {
 488   content: "\f024";
 489 }
 490 .icon-headphones:before {
 491   content: "\f025";
 492 }
 493 .icon-volume-off:before {
 494   content: "\f026";
 495 }
 496 .icon-volume-down:before {
 497   content: "\f027";
 498 }
 499 .icon-volume-up:before {
 500   content: "\f028";
 501 }
 502 .icon-qrcode:before {
 503   content: "\f029";
 504 }
 505 .icon-barcode:before {
 506   content: "\f02a";
 507 }
 508 .icon-tag:before {
 509   content: "\f02b";
 510 }
 511 .icon-tags:before {
 512   content: "\f02c";
 513 }
 514 .icon-book:before {
 515   content: "\f02d";
 516 }
 517 .icon-bookmark:before {
 518   content: "\f02e";
 519 }
 520 .icon-print:before {
 521   content: "\f02f";
 522 }
 523 .icon-camera:before {
 524   content: "\f030";
 525 }
 526 .icon-font:before {
 527   content: "\f031";
 528 }
 529 .icon-bold:before {
 530   content: "\f032";
 531 }
 532 .icon-italic:before {
 533   content: "\f033";
 534 }
 535 .icon-text-height:before {
 536   content: "\f034";
 537 }
 538 .icon-text-width:before {
 539   content: "\f035";
 540 }
 541 .icon-align-left:before {
 542   content: "\f036";
 543 }
 544 .icon-align-center:before {
 545   content: "\f037";
 546 }
 547 .icon-align-right:before {
 548   content: "\f038";
 549 }
 550 .icon-align-justify:before {
 551   content: "\f039";
 552 }
 553 .icon-list:before {
 554   content: "\f03a";
 555 }
 556 .icon-indent-left:before {
 557   content: "\f03b";
 558 }
 559 .icon-indent-right:before {
 560   content: "\f03c";
 561 }
 562 .icon-facetime-video:before {
 563   content: "\f03d";
 564 }
 565 .icon-picture:before {
 566   content: "\f03e";
 567 }
 568 .icon-pencil:before {
 569   content: "\f040";
 570 }
 571 .icon-map-marker:before {
 572   content: "\f041";
 573 }
 574 .icon-adjust:before {
 575   content: "\f042";
 576 }
 577 .icon-tint:before {
 578   content: "\f043";
 579 }
 580 .icon-edit:before {
 581   content: "\f044";
 582 }
 583 .icon-share:before {
 584   content: "\f045";
 585 }
 586 .icon-check:before {
 587   content: "\f046";
 588 }
 589 .icon-move:before {
 590   content: "\f047";
 591 }
 592 .icon-step-backward:before {
 593   content: "\f048";
 594 }
 595 .icon-fast-backward:before {
 596   content: "\f049";
 597 }
 598 .icon-backward:before {
 599   content: "\f04a";
 600 }
 601 .icon-play:before {
 602   content: "\f04b";
 603 }
 604 .icon-pause:before {
 605   content: "\f04c";
 606 }
 607 .icon-stop:before {
 608   content: "\f04d";
 609 }
 610 .icon-forward:before {
 611   content: "\f04e";
 612 }
 613 .icon-fast-forward:before {
 614   content: "\f050";
 615 }
 616 .icon-step-forward:before {
 617   content: "\f051";
 618 }
 619 .icon-eject:before {
 620   content: "\f052";
 621 }
 622 .icon-chevron-left:before {
 623   content: "\f053";
 624 }
 625 .icon-chevron-right:before {
 626   content: "\f054";
 627 }
 628 .icon-plus-sign:before {
 629   content: "\f055";
 630 }
 631 .icon-minus-sign:before {
 632   content: "\f056";
 633 }
 634 .icon-remove-sign:before {
 635   content: "\f057";
 636 }
 637 .icon-ok-sign:before {
 638   content: "\f058";
 639 }
 640 .icon-question-sign:before {
 641   content: "\f059";
 642 }
 643 .icon-info-sign:before {
 644   content: "\f05a";
 645 }
 646 .icon-screenshot:before {
 647   content: "\f05b";
 648 }
 649 .icon-remove-circle:before {
 650   content: "\f05c";
 651 }
 652 .icon-ok-circle:before {
 653   content: "\f05d";
 654 }
 655 .icon-ban-circle:before {
 656   content: "\f05e";
 657 }
 658 .icon-arrow-left:before {
 659   content: "\f060";
 660 }
 661 .icon-arrow-right:before {
 662   content: "\f061";
 663 }
 664 .icon-arrow-up:before {
 665   content: "\f062";
 666 }
 667 .icon-arrow-down:before {
 668   content: "\f063";
 669 }
 670 .icon-mail-forward:before,
 671 .icon-share-alt:before {
 672   content: "\f064";
 673 }
 674 .icon-resize-full:before {
 675   content: "\f065";
 676 }
 677 .icon-resize-small:before {
 678   content: "\f066";
 679 }
 680 .icon-plus:before {
 681   content: "\f067";
 682 }
 683 .icon-minus:before {
 684   content: "\f068";
 685 }
 686 .icon-asterisk:before {
 687   content: "\f069";
 688 }
 689 .icon-exclamation-sign:before {
 690   content: "\f06a";
 691 }
 692 .icon-gift:before {
 693   content: "\f06b";
 694 }
 695 .icon-leaf:before {
 696   content: "\f06c";
 697 }
 698 .icon-fire:before {
 699   content: "\f06d";
 700 }
 701 .icon-eye-open:before {
 702   content: "\f06e";
 703 }
 704 .icon-eye-close:before {
 705   content: "\f070";
 706 }
 707 .icon-warning-sign:before {
 708   content: "\f071";
 709 }
 710 .icon-plane:before {
 711   content: "\f072";
 712 }
 713 .icon-calendar:before {
 714   content: "\f073";
 715 }
 716 .icon-random:before {
 717   content: "\f074";
 718 }
 719 .icon-comment:before {
 720   content: "\f075";
 721 }
 722 .icon-magnet:before {
 723   content: "\f076";
 724 }
 725 .icon-chevron-up:before {
 726   content: "\f077";
 727 }
 728 .icon-chevron-down:before {
 729   content: "\f078";
 730 }
 731 .icon-retweet:before {
 732   content: "\f079";
 733 }
 734 .icon-shopping-cart:before {
 735   content: "\f07a";
 736 }
 737 .icon-folder-close:before {
 738   content: "\f07b";
 739 }
 740 .icon-folder-open:before {
 741   content: "\f07c";
 742 }
 743 .icon-resize-vertical:before {
 744   content: "\f07d";
 745 }
 746 .icon-resize-horizontal:before {
 747   content: "\f07e";
 748 }
 749 .icon-bar-chart:before {
 750   content: "\f080";
 751 }
 752 .icon-twitter-sign:before {
 753   content: "\f081";
 754 }
 755 .icon-facebook-sign:before {
 756   content: "\f082";
 757 }
 758 .icon-camera-retro:before {
 759   content: "\f083";
 760 }
 761 .icon-key:before {
 762   content: "\f084";
 763 }
 764 .icon-gears:before,
 765 .icon-cogs:before {
 766   content: "\f085";
 767 }
 768 .icon-comments:before {
 769   content: "\f086";
 770 }
 771 .icon-thumbs-up-alt:before {
 772   content: "\f087";
 773 }
 774 .icon-thumbs-down-alt:before {
 775   content: "\f088";
 776 }
 777 .icon-star-half:before {
 778   content: "\f089";
 779 }
 780 .icon-heart-empty:before {
 781   content: "\f08a";
 782 }
 783 .icon-signout:before {
 784   content: "\f08b";
 785 }
 786 .icon-linkedin-sign:before {
 787   content: "\f08c";
 788 }
 789 .icon-pushpin:before {
 790   content: "\f08d";
 791 }
 792 .icon-external-link:before {
 793   content: "\f08e";
 794 }
 795 .icon-signin:before {
 796   content: "\f090";
 797 }
 798 .icon-trophy:before {
 799   content: "\f091";
 800 }
 801 .icon-github-sign:before {
 802   content: "\f092";
 803 }
 804 .icon-upload-alt:before {
 805   content: "\f093";
 806 }
 807 .icon-lemon:before {
 808   content: "\f094";
 809 }
 810 .icon-phone:before {
 811   content: "\f095";
 812 }
 813 .icon-unchecked:before,
 814 .icon-check-empty:before {
 815   content: "\f096";
 816 }
 817 .icon-bookmark-empty:before {
 818   content: "\f097";
 819 }
 820 .icon-phone-sign:before {
 821   content: "\f098";
 822 }
 823 .icon-twitter:before {
 824   content: "\f099";
 825 }
 826 .icon-facebook:before {
 827   content: "\f09a";
 828 }
 829 .icon-github:before {
 830   content: "\f09b";
 831 }
 832 .icon-unlock:before {
 833   content: "\f09c";
 834 }
 835 .icon-credit-card:before {
 836   content: "\f09d";
 837 }
 838 .icon-rss:before {
 839   content: "\f09e";
 840 }
 841 .icon-hdd:before {
 842   content: "\f0a0";
 843 }
 844 .icon-bullhorn:before {
 845   content: "\f0a1";
 846 }
 847 .icon-bell:before {
 848   content: "\f0a2";
 849 }
 850 .icon-certificate:before {
 851   content: "\f0a3";
 852 }
 853 .icon-hand-right:before {
 854   content: "\f0a4";
 855 }
 856 .icon-hand-left:before {
 857   content: "\f0a5";
 858 }
 859 .icon-hand-up:before {
 860   content: "\f0a6";
 861 }
 862 .icon-hand-down:before {
 863   content: "\f0a7";
 864 }
 865 .icon-circle-arrow-left:before {
 866   content: "\f0a8";
 867 }
 868 .icon-circle-arrow-right:before {
 869   content: "\f0a9";
 870 }
 871 .icon-circle-arrow-up:before {
 872   content: "\f0aa";
 873 }
 874 .icon-circle-arrow-down:before {
 875   content: "\f0ab";
 876 }
 877 .icon-globe:before {
 878   content: "\f0ac";
 879 }
 880 .icon-wrench:before {
 881   content: "\f0ad";
 882 }
 883 .icon-tasks:before {
 884   content: "\f0ae";
 885 }
 886 .icon-filter:before {
 887   content: "\f0b0";
 888 }
 889 .icon-briefcase:before {
 890   content: "\f0b1";
 891 }
 892 .icon-fullscreen:before {
 893   content: "\f0b2";
 894 }
 895 .icon-group:before {
 896   content: "\f0c0";
 897 }
 898 .icon-link:before {
 899   content: "\f0c1";
 900 }
 901 .icon-cloud:before {
 902   content: "\f0c2";
 903 }
 904 .icon-beaker:before {
 905   content: "\f0c3";
 906 }
 907 .icon-cut:before {
 908   content: "\f0c4";
 909 }
 910 .icon-copy:before {
 911   content: "\f0c5";
 912 }
 913 .icon-paperclip:before,
 914 .icon-paper-clip:before {
 915   content: "\f0c6";
 916 }
 917 .icon-save:before {
 918   content: "\f0c7";
 919 }
 920 .icon-sign-blank:before {
 921   content: "\f0c8";
 922 }
 923 .icon-reorder:before {
 924   content: "\f0c9";
 925 }
 926 .icon-list-ul:before {
 927   content: "\f0ca";
 928 }
 929 .icon-list-ol:before {
 930   content: "\f0cb";
 931 }
 932 .icon-strikethrough:before {
 933   content: "\f0cc";
 934 }
 935 .icon-underline:before {
 936   content: "\f0cd";
 937 }
 938 .icon-table:before {
 939   content: "\f0ce";
 940 }
 941 .icon-magic:before {
 942   content: "\f0d0";
 943 }
 944 .icon-truck:before {
 945   content: "\f0d1";
 946 }
 947 .icon-pinterest:before {
 948   content: "\f0d2";
 949 }
 950 .icon-pinterest-sign:before {
 951   content: "\f0d3";
 952 }
 953 .icon-google-plus-sign:before {
 954   content: "\f0d4";
 955 }
 956 .icon-google-plus:before {
 957   content: "\f0d5";
 958 }
 959 .icon-money:before {
 960   content: "\f0d6";
 961 }
 962 .icon-caret-down:before {
 963   content: "\f0d7";
 964 }
 965 .icon-caret-up:before {
 966   content: "\f0d8";
 967 }
 968 .icon-caret-left:before {
 969   content: "\f0d9";
 970 }
 971 .icon-caret-right:before {
 972   content: "\f0da";
 973 }
 974 .icon-columns:before {
 975   content: "\f0db";
 976 }
 977 .icon-sort:before {
 978   content: "\f0dc";
 979 }
 980 .icon-sort-down:before {
 981   content: "\f0dd";
 982 }
 983 .icon-sort-up:before {
 984   content: "\f0de";
 985 }
 986 .icon-envelope:before {
 987   content: "\f0e0";
 988 }
 989 .icon-linkedin:before {
 990   content: "\f0e1";
 991 }
 992 .icon-rotate-left:before,
 993 .icon-undo:before {
 994   content: "\f0e2";
 995 }
 996 .icon-legal:before {
 997   content: "\f0e3";
 998 }
 999 .icon-dashboard:before {
1000   content: "\f0e4";
1001 }
1002 .icon-comment-alt:before {
1003   content: "\f0e5";
1004 }
1005 .icon-comments-alt:before {
1006   content: "\f0e6";
1007 }
1008 .icon-bolt:before {
1009   content: "\f0e7";
1010 }
1011 .icon-sitemap:before {
1012   content: "\f0e8";
1013 }
1014 .icon-umbrella:before {
1015   content: "\f0e9";
1016 }
1017 .icon-paste:before {
1018   content: "\f0ea";
1019 }
1020 .icon-lightbulb:before {
1021   content: "\f0eb";
1022 }
1023 .icon-exchange:before {
1024   content: "\f0ec";
1025 }
1026 .icon-cloud-download:before {
1027   content: "\f0ed";
1028 }
1029 .icon-cloud-upload:before {
1030   content: "\f0ee";
1031 }
1032 .icon-user-md:before {
1033   content: "\f0f0";
1034 }
1035 .icon-stethoscope:before {
1036   content: "\f0f1";
1037 }
1038 .icon-suitcase:before {
1039   content: "\f0f2";
1040 }
1041 .icon-bell-alt:before {
1042   content: "\f0f3";
1043 }
1044 .icon-coffee:before {
1045   content: "\f0f4";
1046 }
1047 .icon-food:before {
1048   content: "\f0f5";
1049 }
1050 .icon-file-text-alt:before {
1051   content: "\f0f6";
1052 }
1053 .icon-building:before {
1054   content: "\f0f7";
1055 }
1056 .icon-hospital:before {
1057   content: "\f0f8";
1058 }
1059 .icon-ambulance:before {
1060   content: "\f0f9";
1061 }
1062 .icon-medkit:before {
1063   content: "\f0fa";
1064 }
1065 .icon-fighter-jet:before {
1066   content: "\f0fb";
1067 }
1068 .icon-beer:before {
1069   content: "\f0fc";
1070 }
1071 .icon-h-sign:before {
1072   content: "\f0fd";
1073 }
1074 .icon-plus-sign-alt:before {
1075   content: "\f0fe";
1076 }
1077 .icon-double-angle-left:before {
1078   content: "\f100";
1079 }
1080 .icon-double-angle-right:before {
1081   content: "\f101";
1082 }
1083 .icon-double-angle-up:before {
1084   content: "\f102";
1085 }
1086 .icon-double-angle-down:before {
1087   content: "\f103";
1088 }
1089 .icon-angle-left:before {
1090   content: "\f104";
1091 }
1092 .icon-angle-right:before {
1093   content: "\f105";
1094 }
1095 .icon-angle-up:before {
1096   content: "\f106";
1097 }
1098 .icon-angle-down:before {
1099   content: "\f107";
1100 }
1101 .icon-desktop:before {
1102   content: "\f108";
1103 }
1104 .icon-laptop:before {
1105   content: "\f109";
1106 }
1107 .icon-tablet:before {
1108   content: "\f10a";
1109 }
1110 .icon-mobile-phone:before {
1111   content: "\f10b";
1112 }
1113 .icon-circle-blank:before {
1114   content: "\f10c";
1115 }
1116 .icon-quote-left:before {
1117   content: "\f10d";
1118 }
1119 .icon-quote-right:before {
1120   content: "\f10e";
1121 }
1122 .icon-spinner:before {
1123   content: "\f110";
1124 }
1125 .icon-circle:before {
1126   content: "\f111";
1127 }
1128 .icon-mail-reply:before,
1129 .icon-reply:before {
1130   content: "\f112";
1131 }
1132 .icon-github-alt:before {
1133   content: "\f113";
1134 }
1135 .icon-folder-close-alt:before {
1136   content: "\f114";
1137 }
1138 .icon-folder-open-alt:before {
1139   content: "\f115";
1140 }
1141 .icon-expand-alt:before {
1142   content: "\f116";
1143 }
1144 .icon-collapse-alt:before {
1145   content: "\f117";
1146 }
1147 .icon-smile:before {
1148   content: "\f118";
1149 }
1150 .icon-frown:before {
1151   content: "\f119";
1152 }
1153 .icon-meh:before {
1154   content: "\f11a";
1155 }
1156 .icon-gamepad:before {
1157   content: "\f11b";
1158 }
1159 .icon-keyboard:before {
1160   content: "\f11c";
1161 }
1162 .icon-flag-alt:before {
1163   content: "\f11d";
1164 }
1165 .icon-flag-checkered:before {
1166   content: "\f11e";
1167 }
1168 .icon-terminal:before {
1169   content: "\f120";
1170 }
1171 .icon-code:before {
1172   content: "\f121";
1173 }
1174 .icon-reply-all:before {
1175   content: "\f122";
1176 }
1177 .icon-mail-reply-all:before {
1178   content: "\f122";
1179 }
1180 .icon-star-half-full:before,
1181 .icon-star-half-empty:before {
1182   content: "\f123";
1183 }
1184 .icon-location-arrow:before {
1185   content: "\f124";
1186 }
1187 .icon-crop:before {
1188   content: "\f125";
1189 }
1190 .icon-code-fork:before {
1191   content: "\f126";
1192 }
1193 .icon-unlink:before {
1194   content: "\f127";
1195 }
1196 .icon-question:before {
1197   content: "\f128";
1198 }
1199 .icon-info:before {
1200   content: "\f129";
1201 }
1202 .icon-exclamation:before {
1203   content: "\f12a";
1204 }
1205 .icon-superscript:before {
1206   content: "\f12b";
1207 }
1208 .icon-subscript:before {
1209   content: "\f12c";
1210 }
1211 .icon-eraser:before {
1212   content: "\f12d";
1213 }
1214 .icon-puzzle-piece:before {
1215   content: "\f12e";
1216 }
1217 .icon-microphone:before {
1218   content: "\f130";
1219 }
1220 .icon-microphone-off:before {
1221   content: "\f131";
1222 }
1223 .icon-shield:before {
1224   content: "\f132";
1225 }
1226 .icon-calendar-empty:before {
1227   content: "\f133";
1228 }
1229 .icon-fire-extinguisher:before {
1230   content: "\f134";
1231 }
1232 .icon-rocket:before {
1233   content: "\f135";
1234 }
1235 .icon-maxcdn:before {
1236   content: "\f136";
1237 }
1238 .icon-chevron-sign-left:before {
1239   content: "\f137";
1240 }
1241 .icon-chevron-sign-right:before {
1242   content: "\f138";
1243 }
1244 .icon-chevron-sign-up:before {
1245   content: "\f139";
1246 }
1247 .icon-chevron-sign-down:before {
1248   content: "\f13a";
1249 }
1250 .icon-html5:before {
1251   content: "\f13b";
1252 }
1253 .icon-css3:before {
1254   content: "\f13c";
1255 }
1256 .icon-anchor:before {
1257   content: "\f13d";
1258 }
1259 .icon-unlock-alt:before {
1260   content: "\f13e";
1261 }
1262 .icon-bullseye:before {
1263   content: "\f140";
1264 }
1265 .icon-ellipsis-horizontal:before {
1266   content: "\f141";
1267 }
1268 .icon-ellipsis-vertical:before {
1269   content: "\f142";
1270 }
1271 .icon-rss-sign:before {
1272   content: "\f143";
1273 }
1274 .icon-play-sign:before {
1275   content: "\f144";
1276 }
1277 .icon-ticket:before {
1278   content: "\f145";
1279 }
1280 .icon-minus-sign-alt:before {
1281   content: "\f146";
1282 }
1283 .icon-check-minus:before {
1284   content: "\f147";
1285 }
1286 .icon-level-up:before {
1287   content: "\f148";
1288 }
1289 .icon-level-down:before {
1290   content: "\f149";
1291 }
1292 .icon-check-sign:before {
1293   content: "\f14a";
1294 }
1295 .icon-edit-sign:before {
1296   content: "\f14b";
1297 }
1298 .icon-external-link-sign:before {
1299   content: "\f14c";
1300 }
1301 .icon-share-sign:before {
1302   content: "\f14d";
1303 }
1304 .icon-compass:before {
1305   content: "\f14e";
1306 }
1307 .icon-collapse:before {
1308   content: "\f150";
1309 }
1310 .icon-collapse-top:before {
1311   content: "\f151";
1312 }
1313 .icon-expand:before {
1314   content: "\f152";
1315 }
1316 .icon-euro:before,
1317 .icon-eur:before {
1318   content: "\f153";
1319 }
1320 .icon-gbp:before {
1321   content: "\f154";
1322 }
1323 .icon-dollar:before,
1324 .icon-usd:before {
1325   content: "\f155";
1326 }
1327 .icon-rupee:before,
1328 .icon-inr:before {
1329   content: "\f156";
1330 }
1331 .icon-yen:before,
1332 .icon-jpy:before {
1333   content: "\f157";
1334 }
1335 .icon-renminbi:before,
1336 .icon-cny:before {
1337   content: "\f158";
1338 }
1339 .icon-won:before,
1340 .icon-krw:before {
1341   content: "\f159";
1342 }
1343 .icon-bitcoin:before,
1344 .icon-btc:before {
1345   content: "\f15a";
1346 }
1347 .icon-file:before {
1348   content: "\f15b";
1349 }
1350 .icon-file-text:before {
1351   content: "\f15c";
1352 }
1353 .icon-sort-by-alphabet:before {
1354   content: "\f15d";
1355 }
1356 .icon-sort-by-alphabet-alt:before {
1357   content: "\f15e";
1358 }
1359 .icon-sort-by-attributes:before {
1360   content: "\f160";
1361 }
1362 .icon-sort-by-attributes-alt:before {
1363   content: "\f161";
1364 }
1365 .icon-sort-by-order:before {
1366   content: "\f162";
1367 }
1368 .icon-sort-by-order-alt:before {
1369   content: "\f163";
1370 }
1371 .icon-thumbs-up:before {
1372   content: "\f164";
1373 }
1374 .icon-thumbs-down:before {
1375   content: "\f165";
1376 }
1377 .icon-youtube-sign:before {
1378   content: "\f166";
1379 }
1380 .icon-youtube:before {
1381   content: "\f167";
1382 }
1383 .icon-xing:before {
1384   content: "\f168";
1385 }
1386 .icon-xing-sign:before {
1387   content: "\f169";
1388 }
1389 .icon-youtube-play:before {
1390   content: "\f16a";
1391 }
1392 .icon-dropbox:before {
1393   content: "\f16b";
1394 }
1395 .icon-stackexchange:before {
1396   content: "\f16c";
1397 }
1398 .icon-instagram:before {
1399   content: "\f16d";
1400 }
1401 .icon-flickr:before {
1402   content: "\f16e";
1403 }
1404 .icon-adn:before {
1405   content: "\f170";
1406 }
1407 .icon-bitbucket:before {
1408   content: "\f171";
1409 }
1410 .icon-bitbucket-sign:before {
1411   content: "\f172";
1412 }
1413 .icon-tumblr:before {
1414   content: "\f173";
1415 }
1416 .icon-tumblr-sign:before {
1417   content: "\f174";
1418 }
1419 .icon-long-arrow-down:before {
1420   content: "\f175";
1421 }
1422 .icon-long-arrow-up:before {
1423   content: "\f176";
1424 }
1425 .icon-long-arrow-left:before {
1426   content: "\f177";
1427 }
1428 .icon-long-arrow-right:before {
1429   content: "\f178";
1430 }
1431 .icon-apple:before {
1432   content: "\f179";
1433 }
1434 .icon-windows:before {
1435   content: "\f17a";
1436 }
1437 .icon-android:before {
1438   content: "\f17b";
1439 }
1440 .icon-linux:before {
1441   content: "\f17c";
1442 }
1443 .icon-dribbble:before {
1444   content: "\f17d";
1445 }
1446 .icon-skype:before {
1447   content: "\f17e";
1448 }
1449 .icon-foursquare:before {
1450   content: "\f180";
1451 }
1452 .icon-trello:before {
1453   content: "\f181";
1454 }
1455 .icon-female:before {
1456   content: "\f182";
1457 }
1458 .icon-male:before {
1459   content: "\f183";
1460 }
1461 .icon-gittip:before {
1462   content: "\f184";
1463 }
1464 .icon-sun:before {
1465   content: "\f185";
1466 }
1467 .icon-moon:before {
1468   content: "\f186";
1469 }
1470 .icon-archive:before {
1471   content: "\f187";
1472 }
1473 .icon-bug:before {
1474   content: "\f188";
1475 }
1476 .icon-vk:before {
1477   content: "\f189";
1478 }
1479 .icon-weibo:before {
1480   content: "\f18a";
1481 }
1482 .icon-renren:before {
1483   content: "\f18b";
1484 }
1485 * .font-onyx {
1486   /**
1487      * Icon size set per Onyx standard:
1488      * https://github.com/enyojs/onyx/blob/master/source/Icon.js#L5
1489      */
1490   width: 32px;
1491   height: 32px;
1492   padding: 3px;
1493   text-align: center;
1494 }
1495 * .font-onyx div {
1496   font-size: 22px;
1497   color: #dddddd;
1498   text-shadow: 3px 3px 5px rgba(34, 34, 34, 0.97), 0px 0px 3px rgba(34, 34, 34, 0.97);
1499 }
1500 * .font-onyx .text {
1501   font-size: 12px;
1502 }
1503 .font-onyx.text-icon {
1504   width: 50px;
1505   height: 40px;
1506 }
1507 .font-onyx.icon.button:not(.disabled) {
1508   cursor: pointer;
1509 }
1510 .font-onyx.icon.button:not(.disabled):active div {
1511   color: white;
1512   text-shadow: 2px 2px 5px #0099ff, -2px -2px 5px #0099ff, 2px -2px 5px #0099ff, -2px 2px 5px #0099ff;
1513 }
1514 body {
1515   font-family: 'Helvetica Neue', Helvetica, 'Nimbus Sans L', Arial, sans-serif;
1516   font-size: 100%;
1517   background-color: #fdfdfd;
1518 }
1519 .enyo-fit {
1520   bottom: 4px !important;
1521 }
1522 .disabled {
1523   opacity: 0.8;
1524   cursor: default;
1525 }
1526 a,
1527 .hyperlink {
1528   color: #357ec7;
1529   cursor: pointer;
1530 }
1531 .xv-invisible-wrapper {
1532   padding: 0;
1533   border: none;
1534 }
1535 .xv-app-panel {
1536   /* Setting this as min-width overrides enyo-narrow 100% */
1537   width: 320px;
1538   background-color: #fdfdfd;
1539   -webkit-box-shadow: -2px -2px 6px rgba(0, 0, 0, 0.2);
1540   -moz-box-shadow: -2px -2px 6px rgba(0, 0, 0, 0.2);
1541   box-shadow: -2px -2px 6px rgba(0, 0, 0, 0.2);
1542 }
1543 /*
1544   Media query for responsive design. This adapts to smaller
1545   displays.
1546 */
1547 @media (max-width: 480px) {
1548   .pullout-menu {
1549     display: block;
1550     margin: 0;
1551   }
1552   .xv-app-panel > * {
1553     min-width: 100%;
1554     max-width: 100%;
1555   }
1556   .enyo-fit {
1557     margin-bottom: -4px !important;
1558   }
1559 }
1560 .wide > * {
1561   min-width: 50%;
1562 }
1563 .scroll-ios {
1564   overflow: auto;
1565   -webkit-overflow-scrolling: touch;
1566 }
1567 .wide > * {
1568   min-width: 50%;
1569 }
1570 .xv-version-label {
1571   padding: 10px;
1572 }
1573 .xv-popup-button {
1574   margin: 4px;
1575 }
1576 .xv-error,
1577 .xv-negative {
1578   color: #ff0000;
1579 }
1580 /**
1581   Default button bar with margins and border-radius
1582 */
1583 .xv-buttons {
1584   margin: 5px;
1585 }
1586 .xv-buttons.center {
1587   text-align: center;
1588 }
1589 .xv-buttons .onyx-button {
1590   margin: 2px;
1591   min-width: 60px;
1592   background: #e1e1e1;
1593   color: #666666;
1594   font-size: 20px;
1595 }
1596 .xv-buttons .onyx-button.text {
1597   font-size: 17px;
1598   font-family: 'Helvetica Neue', Helvetica, 'Nimbus Sans L', Arial, sans-serif;
1599 }
1600 .xv-buttons .onyx-button.selected {
1601   background: #357ec7;
1602   color: #fdfdfd;
1603 }
1604 .xv-assignment-box .xv-flexible-label {
1605   width: 85%;
1606 }
1607 .xv-assignment-box .xv-label {
1608   width: 250px;
1609 }
1610 .xv-parameter-title {
1611   padding-top: 8px;
1612   font-size: large;
1613   text-align: center;
1614 }
1615 /**
1616   Default popup style
1617 */
1618 .xv-popup {
1619   background: #505050;
1620   margin: 0;
1621   max-height: 400px;
1622   width: 400px;
1623   min-width: 320px;
1624   padding: 7px;
1625   text-align: center;
1626 }
1627 .xv-popup.xv-groupbox-popup {
1628   width: 320px;
1629   margin: 0 4px 0 2px;
1630   padding: 0;
1631   background: #f8f8f8;
1632   text-overflow: ellipsis;
1633   border: 1px solid #d7d7d7;
1634   /**
1635         Styles relating to workspace widgets
1636       */
1637   color: #070707;
1638   padding: 7px;
1639 }
1640 .xv-popup.xv-groupbox-popup .onyx-groupbox-header {
1641   padding: 6px 10px;
1642   border-bottom: 1px solid #d7d7d7;
1643   background: #efefef;
1644   color: #0e0e0e;
1645 }
1646 .xv-popup.xv-groupbox-popup .onyx-groupbox-header i {
1647   margin-right: 10px;
1648 }
1649 .xv-popup.xv-groupbox-popup.small-panel {
1650   width: 600px;
1651 }
1652 .xv-popup.xv-groupbox-popup.medium-panel {
1653   width: 700px;
1654 }
1655 .xv-popup.xv-groupbox-popup.large-panel {
1656   width: 800px;
1657 }
1658 .xv-popup.xv-groupbox-popup .xv-label,
1659 .xv-popup.xv-groupbox-popup .xv-decorated-label,
1660 .xv-popup.xv-groupbox-popup .xv-flexible-label {
1661   width: 120px;
1662   max-width: 100%;
1663   text-align: right;
1664   padding: 0 8px 0 6px;
1665   vertical-align: middle;
1666 }
1667 .xv-popup.xv-groupbox-popup .xv-label.disabled,
1668 .xv-popup.xv-groupbox-popup .xv-decorated-label.disabled,
1669 .xv-popup.xv-groupbox-popup .xv-flexible-label.disabled {
1670   color: #777777;
1671 }
1672 .xv-popup.xv-groupbox-popup.xv-assignment-box .xv-flexible-label,
1673 .xv-popup.xv-groupbox-popup.xv-assignment-box .xv-label {
1674   width: 200px !important;
1675 }
1676 .xv-popup.xv-groupbox-popup .xv-input {
1677   padding: 4px 0;
1678   border-bottom: 1px solid rgba(215, 215, 215, 0.5);
1679 }
1680 .xv-popup.xv-groupbox-popup .xv-input .enyo-tool-decorator {
1681   max-width: 180px;
1682   text-align: left;
1683 }
1684 .xv-popup.xv-groupbox-popup .xv-input .enyo-tool-decorator .onyx-icon {
1685   display: inline-block;
1686   width: 16px;
1687   cursor: pointer;
1688 }
1689 .xv-popup.xv-groupbox-popup .xv-input.xv-textarea {
1690   padding: 0;
1691   margin: 8px;
1692 }
1693 .xv-popup.xv-groupbox-popup .xv-input.xv-textarea .enyo-tool-decorator {
1694   max-width: 320px;
1695 }
1696 .xv-popup.xv-groupbox-popup .xv-input input {
1697   width: 164px;
1698 }
1699 .xv-popup.xv-groupbox-popup .xv-input .xv-icon-decorator input {
1700   width: 140px;
1701 }
1702 .xv-popup.xv-groupbox-popup .xv-input .xv-icon-decorator .onyx-icon {
1703   padding: 4px;
1704 }
1705 .xv-popup.xv-groupbox-popup .xv-input .onyx-picker-decorator {
1706   padding: 0;
1707 }
1708 .xv-popup.xv-groupbox-popup .xv-relationwidget .xv-description {
1709   overflow: hidden;
1710   display: -webkit-box;
1711   -webkit-line-clamp: 4;
1712   -webkit-box-orient: vertical;
1713   max-width: 250px;
1714   margin: 5px 5px 5px 80px;
1715   font-size: 0.9em;
1716 }
1717 .xv-popup.xv-groupbox-popup .xv-relationwidget .xv-description.disabled {
1718   color: #777777;
1719 }
1720 .xv-popup.xv-groupbox-popup .xv-spinnerwidget .buttons {
1721   display: block;
1722   padding: 0;
1723   margin: 1px 0 1px 10px;
1724   width: 20px;
1725   height: 20px;
1726   background: transparent;
1727   color: #357ec7;
1728   font-size: 20px;
1729   border: none;
1730 }
1731 .xv-popup.xv-groupbox-popup .xv-spinnerwidget .slider {
1732   margin: 15px 10px;
1733 }
1734 .xv-popup.xv-groupbox-popup .xv-spinnerwidget.xv-numberwidget input {
1735   width: 120px;
1736 }
1737 .xv-popup.xv-groupbox-popup .xv-combobox .icon-sort {
1738   color: #357ec7;
1739   vertical-align: middle;
1740 }
1741 .xv-popup.xv-groupbox-popup .xv-numberwidget input {
1742   text-align: right;
1743 }
1744 .xv-popup.xv-groupbox-popup .xv-moneywidget .enyo-tool-decorator {
1745   min-width: 90px;
1746   max-width: 90px;
1747 }
1748 .xv-popup.xv-groupbox-popup .xv-moneywidget .enyo-tool-decorator input {
1749   width: 90px;
1750 }
1751 .xv-popup.xv-groupbox-popup .xv-currency-picker {
1752   display: inline-block;
1753 }
1754 .xv-popup.xv-groupbox-popup .xv-currency-picker .enyo-tool-decorator {
1755   min-width: 65px;
1756   max-width: 65px;
1757   padding: 10px 4px;
1758 }
1759 .xv-popup.xv-groupbox-popup .xv-currency-picker .enyo-tool-decorator .xv-button-text {
1760   width: 45px;
1761 }
1762 .xv-popup.xv-groupbox-popup .xv-characteristics-widget .xv-characteristic-item {
1763   border-bottom: 1px solid #d7d7d7;
1764 }
1765 .xv-popup.xv-groupbox-popup .xv-characteristics-widget .xv-characteristic-item .xv-input {
1766   border: none;
1767 }
1768 .xv-popup.xv-groupbox-popup .xv-characteristics-widget .xv-characteristic-item .xv-input input {
1769   width: 135px;
1770 }
1771 .xv-popup.xv-groupbox-popup .xv-characteristics-widget .xv-characteristic-button {
1772   text-align: center;
1773 }
1774 .xv-popup.xv-groupbox-popup .enyo-fittable-columns-layout > * {
1775   vertical-align: middle;
1776 }
1777 .xv-popup.xv-groupbox-popup .xv-message {
1778   color: #c51616;
1779   padding: 5px;
1780 }
1781 .xv-my-account-popup {
1782   background-color: #fdfdfd;
1783   color: #000;
1784 }
1785 .xv-my-account-popup .xv-message {
1786   color: red;
1787   padding: 5px;
1788 }
1789 .xv-my-account-popup .onyx-button {
1790   margin: 0 auto 0 auto;
1791 }
1792 .xv-my-account-popup .onyx-input {
1793   padding-left: 10px;
1794   float: right;
1795 }
1796 .xv-sort-popup {
1797   background-color: #fdfdfd;
1798   color: #070707;
1799 }
1800 .xv-sort-popup .xv-groupbox > *:last-child {
1801   text-align: center;
1802   padding: 5px;
1803 }
1804 .xv-sort-popup .xv-groupbox > *:last-child .onyx-button {
1805   margin: 3px;
1806 }
1807 .xv-comment-box {
1808   /* Resets the margin/padding value for blockquote tag in comments */
1809 }
1810 .xv-comment-box .xv-comment-box-repeater {
1811   background: #fdfdfd;
1812 }
1813 .xv-comment-box .xv-comment-box-label {
1814   padding: 5px;
1815   font-size: small;
1816   font-weight: bold;
1817   white-space: nowrap;
1818   overflow: hidden;
1819   text-overflow: ellipsis;
1820 }
1821 .xv-comment-box .xv-comment-box-textblock {
1822   font-size: small;
1823 }
1824 .xv-comment-box .xv-comment-box-textblock.disabled {
1825   color: #777777;
1826 }
1827 .xv-comment-box blockquote {
1828   margin: 0 15px 10px 15px;
1829   padding: 0;
1830 }
1831 .icon-folder-open-alt,
1832 .icon-calendar,
1833 .icon-sort {
1834   color: #357ec7;
1835   vertical-align: middle;
1836 }
1837 .xv-short-textarea .xv-textarea-input {
1838   min-height: 0;
1839 }
1840 .xv-textarea-input {
1841   width: 90%;
1842   min-height: 100px;
1843   margin: 6px;
1844   border: #eee 2px solid;
1845 }
1846 .xv-documents-picker-label {
1847   width: 85px;
1848   padding: 16px 8px 8px 8px;
1849   text-align: right;
1850 }
1851 .xv-documents-picker {
1852   width: 120px;
1853   margin: 6px;
1854 }
1855 .xv-half-check {
1856   background: transparent url(../../../../../../assets/checkbox.png) no-repeat 0 -96px scroll;
1857 }
1858 .xv-menuitem.disabled {
1859   color: #777777;
1860 }
1861 /* This is for styling the moved items in the more toolbar */
1862 .xv-toolbar-moved {
1863   width: 220px;
1864 }
1865 .icon-folder-open-alt,
1866 .icon-calendar,
1867 .icon-sort,
1868 .icon-angle-up,
1869 .icon-angle-down,
1870 .icon-save {
1871   color: #357ec7;
1872   vertical-align: middle;
1873 }
1874 .onyx-toolbar {
1875   height: 55px;
1876   padding: 4px;
1877   background: #505050;
1878   border: none;
1879 }
1880 .onyx-toolbar .onyx-icon-button,
1881 .onyx-toolbar .onyx-popup-decorator {
1882   margin: 0 5px 0 3px;
1883 }
1884 .onyx-toolbar .onyx-icon-button div,
1885 .onyx-toolbar .onyx-popup-decorator div {
1886   text-shadow: none;
1887   color: #fdfdfd;
1888 }
1889 .onyx-toolbar .onyx-icon-button.lock div,
1890 .onyx-toolbar .onyx-popup-decorator.lock div {
1891   color: #ff9c00;
1892 }
1893 .onyx-toolbar .onyx-popup-decorator {
1894   text-align: center;
1895   width: 50px;
1896   height: 40px;
1897 }
1898 .onyx-toolbar .onyx-popup-decorator .onyx-icon-button {
1899   margin: 0;
1900 }
1901 .onyx-toolbar .onyx-menu {
1902   margin-top: 10px;
1903 }
1904 .onyx-toolbar .spacer {
1905   margin: 0;
1906 }
1907 .onyx-toolbar .xv-toolbar-label,
1908 .onyx-toolbar .xv-search {
1909   width: 185px;
1910   margin: 0;
1911   margin-left: 6px;
1912 }
1913 .onyx-toolbar .xv-search {
1914   color: #939393;
1915 }
1916 .xv-navigator .xv-header {
1917   background-color: #fdfdfd;
1918   padding: 6px 12px;
1919   border-bottom: 1px solid #d7d7d7;
1920   height: 28px;
1921   color: #ff6529;
1922   font-size: small;
1923   font-weight: bold;
1924   text-transform: uppercase;
1925   white-space: nowrap;
1926   overflow: hidden;
1927   text-overflow: ellipsis;
1928 }
1929 .xv-navigator > .xv-content-panel {
1930   /**
1931      * The enyo List height calculations really like to override this and make
1932      * the list shorter and not consume all the space available.
1933      */
1934   height: 100%;
1935 }
1936 .xv-navigator .xv-menu-container .xv-panels {
1937   height: 100%;
1938 }
1939 .xv-navigator .xv-menu-container .xv-navigator-menu .xv-list-item {
1940   padding: 12px 10px;
1941   color: #0e0e0e;
1942   background-color: #fdfdfd;
1943   border-bottom: 1px solid #d7d7d7;
1944 }
1945 .xv-navigator .xv-menu-container .xv-navigator-menu .xv-list-item.onyx-selected {
1946   background-color: #357ec7;
1947   color: #fdfdfd;
1948   border-bottom: 2px solid #d8d8d8;
1949 }
1950 /**
1951   Styles for the application startup
1952 */
1953 .xv-startup-panel {
1954   background: #fdfdfd;
1955 }
1956 .xv-startup-panel .xv-startup-divider {
1957   width: 70%;
1958   height: 30px;
1959   line-height: 30px;
1960   margin: 0 auto 10px auto;
1961   top: 200px;
1962   position: relative;
1963   color: #ff6529;
1964   font-family: Segoe UI, Prelude Medium, Helvetica, Verdana, sans-serif;
1965   font-size: 16px;
1966   font-weight: bold;
1967   border: none;
1968 }
1969 .xv-startup-panel .xv-startup-progress {
1970   width: 70%;
1971   margin: 0 auto 0 auto;
1972   top: 200px;
1973   position: relative;
1974 }
1975 .xv-startup-panel .xv-startup-progress.onyx-progress-button {
1976   height: 18px;
1977   line-height: 18px;
1978 }
1979 .xv-startup-panel .xv-startup-progress.onyx-progress-button-bar {
1980   height: 18px;
1981 }
1982 .xv-workspace-container {
1983   background: #fdfdfd;
1984   -webkit-box-shadow: -2px -2px 6px rgba(0, 0, 0, 0.2);
1985   -moz-box-shadow: -2px -2px 6px rgba(0, 0, 0, 0.2);
1986   box-shadow: -2px -2px 6px rgba(0, 0, 0, 0.2);
1987 }
1988 .xv-workspace-container .xv-content-panel .xv-header {
1989   background-color: #fdfdfd;
1990   border-bottom: 1px solid #d7d7d7;
1991   height: 28px;
1992   color: #ff6529;
1993   font-size: small;
1994   font-weight: bold;
1995   text-transform: uppercase;
1996   white-space: nowrap;
1997   overflow: hidden;
1998   text-overflow: ellipsis;
1999   padding: 6px 12px;
2000   border: none;
2001 }
2002 .xv-workspace-container > .xv-menu-container .xv-panels {
2003   height: 100%;
2004 }
2005 .xv-workspace-container > .xv-menu-container .xv-navigator-menu .xv-list-item {
2006   padding: 12px 10px;
2007   color: #0e0e0e;
2008   background-color: #fdfdfd;
2009   border-bottom: 1px solid #d7d7d7;
2010 }
2011 .xv-workspace-container > .xv-menu-container .xv-navigator-menu .xv-list-item.onyx-selected {
2012   background-color: #357ec7;
2013   color: #fdfdfd;
2014   border-bottom: 2px solid #d8d8d8;
2015 }
2016 .xv-workspace-container > .xv-menu-container .xv-header {
2017   background-color: #fdfdfd;
2018   padding: 6px 12px;
2019   border-bottom: 1px solid #d7d7d7;
2020   height: 28px;
2021   color: #ff6529;
2022   font-size: small;
2023   font-weight: bold;
2024   text-transform: uppercase;
2025   white-space: nowrap;
2026   overflow: hidden;
2027   text-overflow: ellipsis;
2028 }
2029 .xv-workspace-container .xv-workspace {
2030   background-color: #fdfdfd;
2031 }
2032 .xv-workspace-container .xv-workspace > .enyo-panels {
2033   width: 100% !important;
2034   height: 100% !important;
2035 }
2036 .xv-workspace-container .xv-workspace .xv-buttons .onyx-button {
2037   border: 1px solid #d7d7d7;
2038 }
2039 .xv-workspace-container .xv-workspace .xv-buttons .onyx-button[disabled] {
2040   opacity: 0.6;
2041   cursor: default;
2042 }
2043 .xv-workspace-container .xv-workspace .panel .xv-buttons {
2044   background-color: #efefef;
2045   margin: 0;
2046 }
2047 .xv-workspace-container .xv-workspace .panel .xv-buttons .onyx-button {
2048   border-radius: 0;
2049   margin: 0;
2050 }
2051 .xv-workspace-container .xv-workspace .xv-workspace-panel {
2052   width: 320px;
2053   margin: 0 4px 0 2px;
2054   padding: 0;
2055   background: #f8f8f8;
2056   text-overflow: ellipsis;
2057   border: 1px solid #d7d7d7;
2058   /**
2059         Styles relating to workspace widgets
2060       */
2061 }
2062 .xv-workspace-container .xv-workspace .xv-workspace-panel .onyx-groupbox-header {
2063   padding: 6px 10px;
2064   border-bottom: 1px solid #d7d7d7;
2065   background: #efefef;
2066   color: #0e0e0e;
2067 }
2068 .xv-workspace-container .xv-workspace .xv-workspace-panel .onyx-groupbox-header i {
2069   margin-right: 10px;
2070 }
2071 .xv-workspace-container .xv-workspace .xv-workspace-panel.small-panel {
2072   width: 600px;
2073 }
2074 .xv-workspace-container .xv-workspace .xv-workspace-panel.medium-panel {
2075   width: 700px;
2076 }
2077 .xv-workspace-container .xv-workspace .xv-workspace-panel.large-panel {
2078   width: 800px;
2079 }
2080 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-label,
2081 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-decorated-label,
2082 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-flexible-label {
2083   width: 120px;
2084   max-width: 100%;
2085   text-align: right;
2086   padding: 0 8px 0 6px;
2087   vertical-align: middle;
2088 }
2089 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-label.disabled,
2090 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-decorated-label.disabled,
2091 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-flexible-label.disabled {
2092   color: #777777;
2093 }
2094 .xv-workspace-container .xv-workspace .xv-workspace-panel.xv-assignment-box .xv-flexible-label,
2095 .xv-workspace-container .xv-workspace .xv-workspace-panel.xv-assignment-box .xv-label {
2096   width: 200px !important;
2097 }
2098 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-input {
2099   padding: 4px 0;
2100   border-bottom: 1px solid rgba(215, 215, 215, 0.5);
2101 }
2102 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-input .enyo-tool-decorator {
2103   max-width: 180px;
2104   text-align: left;
2105 }
2106 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-input .enyo-tool-decorator .onyx-icon {
2107   display: inline-block;
2108   width: 16px;
2109   cursor: pointer;
2110 }
2111 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-input.xv-textarea {
2112   padding: 0;
2113   margin: 8px;
2114 }
2115 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-input.xv-textarea .enyo-tool-decorator {
2116   max-width: 320px;
2117 }
2118 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-input input {
2119   width: 164px;
2120 }
2121 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-input .xv-icon-decorator input {
2122   width: 140px;
2123 }
2124 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-input .xv-icon-decorator .onyx-icon {
2125   padding: 4px;
2126 }
2127 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-input .onyx-picker-decorator {
2128   padding: 0;
2129 }
2130 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-relationwidget .xv-description {
2131   overflow: hidden;
2132   display: -webkit-box;
2133   -webkit-line-clamp: 4;
2134   -webkit-box-orient: vertical;
2135   max-width: 250px;
2136   margin: 5px 5px 5px 80px;
2137   font-size: 0.9em;
2138 }
2139 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-relationwidget .xv-description.disabled {
2140   color: #777777;
2141 }
2142 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-spinnerwidget .buttons {
2143   display: block;
2144   padding: 0;
2145   margin: 1px 0 1px 10px;
2146   width: 20px;
2147   height: 20px;
2148   background: transparent;
2149   color: #357ec7;
2150   font-size: 20px;
2151   border: none;
2152 }
2153 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-spinnerwidget .slider {
2154   margin: 15px 10px;
2155 }
2156 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-spinnerwidget.xv-numberwidget input {
2157   width: 120px;
2158 }
2159 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-combobox .icon-sort {
2160   color: #357ec7;
2161   vertical-align: middle;
2162 }
2163 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-numberwidget input {
2164   text-align: right;
2165 }
2166 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-moneywidget .enyo-tool-decorator {
2167   min-width: 90px;
2168   max-width: 90px;
2169 }
2170 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-moneywidget .enyo-tool-decorator input {
2171   width: 90px;
2172 }
2173 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-currency-picker {
2174   display: inline-block;
2175 }
2176 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-currency-picker .enyo-tool-decorator {
2177   min-width: 65px;
2178   max-width: 65px;
2179   padding: 10px 4px;
2180 }
2181 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-currency-picker .enyo-tool-decorator .xv-button-text {
2182   width: 45px;
2183 }
2184 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-characteristics-widget .xv-characteristic-item {
2185   border-bottom: 1px solid #d7d7d7;
2186 }
2187 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-characteristics-widget .xv-characteristic-item .xv-input {
2188   border: none;
2189 }
2190 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-characteristics-widget .xv-characteristic-item .xv-input input {
2191   width: 135px;
2192 }
2193 .xv-workspace-container .xv-workspace .xv-workspace-panel .xv-characteristics-widget .xv-characteristic-button {
2194   text-align: center;
2195 }
2196 .xv-workspace-container .xv-workspace .xv-workspace-panel .enyo-fittable-columns-layout > * {
2197   vertical-align: middle;
2198 }
2199 .xv-workspace-container .xv-workspace .onyx-input-decorator {
2200   border: 0;
2201 }
2202 .xv-workspace-container .xv-workspace .onyx-input-decorator input {
2203   width: 150px;
2204 }
2205 .xv-workspace-container .xv-workspace .onyx-input-decorator.onyx-disabled {
2206   opacity: 0.8;
2207   cursor: default;
2208 }
2209 .xv-workspace-container .xv-workspace .xv-dependency-picker .onyx-picker-decorator .onyx-button {
2210   width: 280px;
2211   margin-left: 6px;
2212 }
2213 .xv-workspace-container .xv-workspace .xv-dependency-button {
2214   color: #357ec7;
2215   font-size: 24px;
2216   border: none;
2217   background: transparent;
2218 }
2219 .xv-workspace-container .xv-workspace .xv-totals-panel .onyx-input-decorator > input,
2220 .xv-workspace-container .xv-workspace .xv-totals-panel * {
2221   font-size: 14px;
2222 }
2223 .xv-workspace-container .xv-workspace .xv-totals-panel .xv-input {
2224   border: none;
2225 }
2226 /**
2227  * Default ListItem styles when using a ModelDecorator.
2228  */
2229 .xv-list .xv-model-decorator > .xv-list-item .xv-table {
2230   display: table;
2231   width: 100%;
2232   table-layout: fixed;
2233 }
2234 .xv-list .xv-model-decorator > .xv-list-item .xv-table .xv-cell {
2235   display: table-cell;
2236 }
2237 .xv-list .xv-model-decorator > .xv-list-item .xv-list-column.xv-list-attr {
2238   /**
2239         * Default styling for a model's id (as designated by 'idAttribute')
2240         */
2241 }
2242 .xv-list .xv-model-decorator > .xv-list-item .xv-list-column.xv-list-attr.xm-attribute-id {
2243   color: #357ec7;
2244   font-weight: bold;
2245   cursor: pointer;
2246 }
2247 .xv-list .xv-model-decorator > .xv-list-item .xv-list-column.xv-list-attr.xm-attribute-name {
2248   font-weight: bold;
2249 }
2250 .xv-list .xv-model-decorator > .xv-list-item .xv-list-column.xv-list-attr.xm-attributetype-number {
2251   text-align: right;
2252 }
2253 .xv-list .xv-model-decorator > .xv-list-item .xv-list-column.xv-list-attr.xm-attributetype-money {
2254   text-align: right;
2255 }
2256 .xv-list .xv-model-decorator > .xv-list-item .xv-list-column.xv-list-attr.xm-attributetype-date {
2257   text-align: right;
2258 }
2259 .xv-list .xv-model-decorator > .xv-list-item.item-selected .xv-list-attr {
2260   color: white;
2261 }
2262 .xv-list .xv-model-decorator > .xv-list-item.item-selected .xv-list-attr.xm-attribute-id {
2263   color: #ff6529;
2264 }
2265 /**
2266   Styles related to pickers, combo boxes, and relation widgets
2267 */
2268 .onyx-picker-decorator .onyx-button {
2269   padding: 12px 8px 12px 8px;
2270   width: 150px;
2271 }
2272 .onyx-picker .onyx-menu-item {
2273   text-align: left;
2274   text-overflow: ellipsis;
2275 }
2276 .picker-icon {
2277   position: absolute;
2278   right: 0;
2279   margin: 0 10px 0 2px;
2280   color: #070707;
2281 }
2282 .xv-picker-button {
2283   text-align: left;
2284 }
2285 .xv-picker-button .picker-content {
2286   max-width: 100px;
2287   overflow: hidden;
2288 }
2289 .xv-picker-button.disabled {
2290   color: #777777;
2291 }
2292 .xv-picker-label {
2293   color: #070707;
2294   padding: 20px 8px 8px 8px;
2295   text-align: right;
2296   width: 130px;
2297 }
2298 .xv-picker-label.disabled {
2299   color: #777777;
2300 }
2301 .xv-combobox-note {
2302   padding: 14px 3px 8px 3px;
2303   text-align: left;
2304 }
2305 /*
2306   Styles relating to the grid box
2307 */
2308 /* Entire box including the grid and the summary panel */
2309 .xv-grid-box {
2310   /**
2311     This is the most general grid row that
2312     is not specific to read-only or selected
2313   */
2314 }
2315 .xv-grid-box.small-panel {
2316   width: 600px;
2317 }
2318 .xv-grid-box.medium-panel {
2319   width: 700px;
2320 }
2321 .xv-grid-box.large-panel {
2322   width: 800px;
2323 }
2324 .xv-grid-box .enyo-list-page > *:first-child .xv-grid-row {
2325   border-top: 0;
2326 }
2327 .xv-grid-box .xv-above-grid-list {
2328   border: 0;
2329 }
2330 .xv-grid-box .xv-scroller {
2331   background: #f8f8f8;
2332 }
2333 .xv-grid-box .xv-grid-attr {
2334   overflow: hidden;
2335   display: -webkit-box;
2336   -webkit-line-clamp: 4;
2337   -webkit-box-orient: vertical;
2338 }
2339 .xv-grid-box .xv-grid-attr.bold {
2340   font-weight: bold;
2341 }
2342 .xv-grid-box .xv-grid-attr.error {
2343   color: #ff0000;
2344 }
2345 .xv-grid-box .xv-grid-attr.emphasis {
2346   color: #009000;
2347 }
2348 .xv-grid-box .xv-grid-attr.warn {
2349   color: #ff9c00;
2350 }
2351 .xv-grid-box .xv-grid-attr.italic {
2352   font-style: italic;
2353 }
2354 .xv-grid-box .xv-grid-attr.placeholder {
2355   font-style: italic;
2356   color: #93a1a1;
2357 }
2358 .xv-grid-box .xv-grid-attr.hyperlink {
2359   color: blue;
2360 }
2361 .xv-grid-box .xv-gridbox-button {
2362   color: #357ec7;
2363   font-size: 18px;
2364   border: none;
2365   background: transparent;
2366 }
2367 .xv-grid-box .xv-grid-row {
2368   font-size: 12px;
2369   background-color: #d8d8d8;
2370   border-bottom: 1px solid #aaaaaa;
2371   vertical-align: top;
2372   /**
2373       This is the grid header row
2374     */
2375 }
2376 .xv-grid-box .xv-grid-row > * {
2377   display: inline-block;
2378 }
2379 .xv-grid-box .xv-grid-row .xv-grid-header {
2380   background-color: #d7d7d7;
2381   color: #0e0e0e;
2382   font-size: .8em;
2383   font-weight: bold;
2384   text-transform: uppercase;
2385   padding-top: 4px;
2386 }
2387 .xv-grid-box .xv-grid-row .xv-grid-header.last {
2388   border-right: none;
2389 }
2390 .xv-grid-box .xv-grid-row > * {
2391   padding: 6px 4px;
2392   border: none;
2393 }
2394 .xv-grid-box .xv-grid-row .line-number {
2395   vertical-align: top;
2396   width: 30px;
2397   text-align: right;
2398 }
2399 .xv-grid-box .xv-grid-row .grid-actions {
2400   display: block;
2401   padding-left: 30px;
2402   border-radius: 4px;
2403   border-width: 0;
2404   background: #f3f3f3;
2405   margin: 6px;
2406 }
2407 .xv-grid-box .xv-grid-row .grid-actions > * {
2408   display: inline-block;
2409   width: 100%;
2410 }
2411 .xv-grid-box .xv-grid-row .grid-item {
2412   vertical-align: top;
2413   width: 175px;
2414 }
2415 .xv-grid-box .xv-grid-row .quantity {
2416   vertical-align: top;
2417   text-align: right;
2418   width: 100px;
2419 }
2420 .xv-grid-box .xv-grid-row .percent {
2421   vertical-align: top;
2422   text-align: right;
2423   width: 90px;
2424 }
2425 .xv-grid-box .xv-grid-row .price {
2426   vertical-align: top;
2427   text-align: right;
2428   width: 90px;
2429 }
2430 .xv-grid-box .xv-grid-row .date {
2431   vertical-align: top;
2432   width: 105px;
2433 }
2434 .xv-grid-box .xv-grid-row .user {
2435   vertical-align: top;
2436   width: 100px;
2437 }
2438 .xv-grid-box .xv-grid-row.readonly {
2439   background: #f8f8f8;
2440   min-height: 56px;
2441 }
2442 .xv-grid-box .xv-grid-row.selected {
2443   background-color: #fdfdfd;
2444   border: 1px solid #ff6529;
2445 }
2446 .xv-grid-box .xv-grid-row.selected .xv-grid-column .onyx-input-decorator {
2447   padding: 0;
2448   width: 100%;
2449   margin: 0;
2450 }
2451 .xv-grid-box .xv-grid-row.selected .xv-grid-column .onyx-input-decorator input {
2452   width: 100%;
2453   font-size: 13px;
2454 }
2455 .xv-grid-box .xv-grid-row.selected .xv-grid-column .onyx-picker-decorator {
2456   padding-top: 6px;
2457   width: 100%;
2458 }
2459 .xv-grid-box .xv-grid-row.selected .xv-grid-column .onyx-picker-decorator .onyx-button {
2460   height: 26px;
2461   padding-top: 3px;
2462   width: 100%;
2463   font-size: 13px;
2464 }
2465 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-input {
2466   padding-top: 6px;
2467   width: 100%;
2468   border: none;
2469 }
2470 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-label,
2471 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-flexible-label,
2472 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-picker-label {
2473   display: none;
2474 }
2475 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-relationwidget .xv-description {
2476   margin: 0;
2477   margin-top: 5px;
2478 }
2479 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-relationwidget.xv-private-item-site-widget {
2480   border-bottom: 0;
2481 }
2482 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-relationwidget .onyx-input-decorator {
2483   padding: 0;
2484   width: 100%;
2485   margin: 0;
2486 }
2487 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-relationwidget .onyx-input-decorator input {
2488   width: 85%;
2489   font-size: 13px;
2490 }
2491 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-datewidget .onyx-input-decorator {
2492   padding: 0;
2493   width: 100%;
2494   margin: 0;
2495 }
2496 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-datewidget .onyx-input-decorator input {
2497   width: 75%;
2498   font-size: 13px;
2499 }
2500 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-combobox .onyx-input-decorator {
2501   padding: 0;
2502   width: 100%;
2503   margin: 0;
2504 }
2505 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-combobox .onyx-input-decorator input {
2506   width: 60%;
2507   font-size: 13px;
2508 }
2509 .xv-grid-box .xv-grid-row.selected .xv-grid-column .xv-useraccount-widget .xv-input {
2510   width: 80px;
2511   height: 16px;
2512 }
2513 .xv-grid-box.xv-groupbox .xv-sales-summary-panel {
2514   border: none;
2515   margin-top: 0;
2516   padding-left: 0;
2517   padding-right: 0;
2518 }
2519 .xv-grid-box.xv-groupbox .xv-sales-summary-panel .xv-sales-summary-total-group {
2520   padding: 0;
2521   border: none;
2522 }
2523 .xv-grid-box.xv-groupbox .xv-sales-summary-panel .xv-sales-summary-total-group .xv-moneywidget {
2524   padding-bottom: 0;
2525   padding-top: 0;
2526 }
2527 .xv-grid-box.xv-groupbox .xv-sales-summary-panel .xv-sales-summary-total-group .xv-moneywidget .xv-input-decorator {
2528   padding-bottom: 0;
2529   padding-top: 0;
2530 }
2531 .xv-grid-box.xv-groupbox .xv-sales-summary-panel .xv-sales-summary-total-group .xv-numberwidget {
2532   padding-bottom: 0;
2533   padding-top: 0;
2534 }
2535 .xv-grid-box.xv-groupbox .xv-sales-summary-panel .xv-sales-summary-total-group .xv-numberwidget .xv-input-decorator {
2536   width: 163px;
2537   padding-bottom: 0;
2538   padding-top: 0;
2539 }
2540 .xv-grid-list .xv-list-column {
2541   vertical-align: top !important;
2542 }
2543 /*
2544   Styles relating to the dashboard
2545 */
2546 /*
2547   Variables for widths/colors
2548 */
2549 .dashboard {
2550   background-color: #d8d8d8;
2551   /*
2552     These styles will only be used
2553     if the chart is in a dashboard
2554   */
2555 }
2556 .dashboard .charts-panels {
2557   overflow-y: auto;
2558 }
2559 .dashboard .selectable-chart {
2560   width: 500px;
2561   height: 230px;
2562 }
2563 .dashboard .selectable-chart .chart-title-bar {
2564   width: 500px;
2565 }
2566 .dashboard .nvtooltip {
2567   color: black;
2568 }
2569 .selectable-chart {
2570   margin: 10px;
2571   color: #357ec7;
2572   overflow: hidden;
2573   /*  The chart-filters may not be need as we are using the class xv-pullout
2574       for styles.  Delete when finished hacking the filter styles.
2575
2576   .chart-filters {
2577           background-color: @white;
2578
2579           -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
2580           -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
2581           box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
2582   }
2583
2584   .chart-filters .xv-parameter-panel {
2585           background-color: @ghost;
2586           border: 1px solid @smoke;
2587           margin: 0 4px 6px 0;
2588           width: 100%;
2589   }
2590
2591   .chart-filters.xv-parameter-panel .onyx-groupbox-header {
2592           padding: 6px 10px;
2593           border-bottom: 1px solid @smoke;
2594           background: @lightest-gray;
2595           color: @near-black;
2596   }
2597
2598   .chart-filters.xv-parameter-panel .enyo-fittable-columns-layout {
2599           border-bottom: 1px solid @smoke;
2600           background: @white;
2601     color: @near-black;
2602     position: relative;
2603     text-align: left;
2604     white-space: nowrap;
2605   }
2606
2607   .chart-filters.xv-parameter-panel .enyo-fittable-columns-layout > * {
2608     vertical-align: middle;
2609   }
2610
2611   .chart-filters.xv-parameter-panel .xv-label {
2612     text-align: right;
2613   }
2614
2615   */
2616 }
2617 .selectable-chart .xv-list-item {
2618   border-bottom: 1px solid grey;
2619   box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
2620 }
2621 .selectable-chart .xv-list-item .long {
2622   padding-left: 7px;
2623   width: 250px;
2624 }
2625 .selectable-chart .onyx-popup {
2626   margin-top: 40px;
2627   margin-left: 200px;
2628 }
2629 .selectable-chart .chart-title-bar {
2630   height: 48px;
2631   background-color: #efefef;
2632   text-transform: none;
2633   -webkit-border-top-right-radius: 10px;
2634   -moz-border-radius-topright: 10px;
2635   border-top-right-radius: 10px;
2636   -webkit-border-top-left-radius: 10px;
2637   -moz-border-radius-topleft: 10px;
2638   border-top-left-radius: 10px;
2639 }
2640 .selectable-chart .chart-title-bar .chart-title {
2641   padding-top: 8px;
2642   color: #070707;
2643   text-align: center;
2644   /*font-size: 2em;*/
2645   font-weight: normal;
2646   font-family: Helvetica;
2647 }
2648 .selectable-chart .chart-title-bar .chart-sub-title {
2649   /*padding-top: 8px;*/
2650   color: #0000ff;
2651   text-align: center;
2652   font-size: small;
2653   font-weight: normal;
2654   font-family: Helvetica;
2655 }
2656 .selectable-chart .chart-title-bar .remove-icon {
2657   position: absolute;
2658   top: 0;
2659   right: 0;
2660 }
2661 .selectable-chart .chart-title-bar .icon-filter {
2662   color: #070707;
2663   position: absolute;
2664   right: 35px;
2665 }
2666 .selectable-chart .chart-bottom {
2667   background-color: #fdfdfd;
2668   border: 1px solid #444444;
2669   border-top: none;
2670   -webkit-border-bottom-right-radius: 10px;
2671   -moz-border-radius-bottomright: 10px;
2672   border-bottom-right-radius: 10px;
2673   -webkit-border-bottom-left-radius: 10px;
2674   -moz-border-radius-bottomleft: 10px;
2675   border-bottom-left-radius: 10px;
2676 }
2677 .selectable-chart .chart-bottom .xv-picker-label {
2678   width: 100px;
2679   color: #070707;
2680 }
2681 .selectable-chart .chart-bottom .onyx-button {
2682   width: 130px;
2683   padding: 10px 10px;
2684 }
2685 .selectable-chart .chart-filterDrawer {
2686   top: 0px;
2687 }
2688 /**
2689   Styles relating to Lists
2690 */
2691 .xv-list-header {
2692   background-color: #d8d8d8;
2693   color: #fdfdfd;
2694   font-size: .6em;
2695   font-weight: bold;
2696   text-transform: uppercase;
2697   padding-top: 4px;
2698   padding-bottom: 4px;
2699   border-bottom: 1px solid #aaaaaa;
2700 }
2701 .xv-list-header .xv-list-column.last {
2702   border-right: none;
2703 }
2704 .xv-list-header .xv-list-column.name-column,
2705 .xv-list-header .xv-list-column.first,
2706 .xv-list-header .xv-list-column.second,
2707 .xv-list-header .xv-list-column.third,
2708 .xv-list-header .xv-list-column.short,
2709 .xv-list-header .xv-list-column.small,
2710 .xv-list-header .xv-list-column.medium,
2711 .xv-list-header .xv-list-column.descr {
2712   padding-left: 7px;
2713 }
2714 /* List */
2715 .xv-list-column.line-number {
2716   width: 30px;
2717   text-align: right;
2718 }
2719 .xv-list-column.name-column {
2720   width: 200px;
2721 }
2722 .xv-list-column.right-column {
2723   width: 100px;
2724   text-align: right;
2725 }
2726 .xv-list-column.short {
2727   width: 100px;
2728 }
2729 .xv-list-column.small {
2730   width: 125px;
2731 }
2732 .xv-list-column.medium {
2733   width: 150px;
2734 }
2735 .xv-list-column.first {
2736   width: 300px;
2737 }
2738 .xv-list-column.second {
2739   width: 200px;
2740 }
2741 .xv-list-column.third {
2742   width: 100px;
2743 }
2744 .xv-list-column.money,
2745 .xv-list-column.quantity {
2746   width: 75px;
2747   text-align: right;
2748 }
2749 .xv-list-column.descr {
2750   width: 200px;
2751 }
2752 .xv-list-column.icon {
2753   width: 10px;
2754 }
2755 .xv-list {
2756   background: #f8f8f8;
2757 }
2758 .xv-list .xv-list-item > * {
2759   display: inline-block;
2760   vertical-align: middle;
2761 }
2762 .xv-list .xv-list-item {
2763   background-color: #fdfdfd;
2764   border-bottom: 1px solid #d7d7d7;
2765   min-height: 32px;
2766 }
2767 .xv-list .xv-list-item.header {
2768   padding-top: 0;
2769 }
2770 .xv-list .xv-list-item.inactive {
2771   background-color: #d8d8d8;
2772   color: #070707;
2773 }
2774 .xv-list .xv-list-item.inactive .xv-list-column .xv-list-attr {
2775   background: transparent;
2776 }
2777 .xv-list .xv-list-item.inactive .xv-list-column .xv-list-attr.placeholder {
2778   color: #d8d8d8;
2779 }
2780 .xv-list .xv-list-item .xv-list-column .list-icon {
2781   padding: 2px;
2782   color: #666666;
2783   vertical-align: sub;
2784   border: 1px solid #efefef;
2785   -webkit-border-radius: 2px;
2786   -moz-border-radius: 2px;
2787   border-radius: 2px;
2788 }
2789 .xv-list .xv-list-item.item-selected {
2790   background: #226b9a;
2791   background-color: #1f608c;
2792   background-image: -moz-linear-gradient(top, #226b9a, #1a4f77);
2793   background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#226b9a), to(#1a4f77));
2794   background-image: -webkit-linear-gradient(top, #226b9a, #1a4f77);
2795   background-image: -o-linear-gradient(top, #226b9a, #1a4f77);
2796   background-image: linear-gradient(to bottom, #226b9a, #1a4f77);
2797   background-repeat: repeat-x;
2798   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff226b9a', endColorstr='#ff1a4f77', GradientType=0);
2799 }
2800 .xv-list .xv-list-item.item-selected .xv-list-attr {
2801   color: #fdfdfd;
2802 }
2803 .xv-list .xv-list-item.item-selected .xv-list-attr.placeholder {
2804   font-style: italic;
2805   color: #99ccff;
2806 }
2807 .xv-list .xv-list-item.item-selected .xv-list-attr.hyperlink {
2808   color: #ff6529;
2809 }
2810 .xv-list .xv-list-item.item-selected .xv-list-attr.header {
2811   background: #99ccff;
2812 }
2813 .xv-list .xv-list-item .xv-list-item-gear {
2814   position: absolute;
2815   right: 0px;
2816   z-index: 999;
2817 }
2818 .xv-list.xv-grid-list {
2819   background: #f8f8f8;
2820 }
2821 .xv-list.xv-grid-list .xv-list-item > * {
2822   vertical-align: top;
2823 }
2824 .xv-list.xv-grid-list .xv-list-item {
2825   padding-top: 7px !important;
2826   padding-bottom: 9px !important;
2827   border-bottom: 1px solid #aaaaaa !important;
2828   background: #f8f8f8;
2829 }
2830 .xv-list.xv-grid-list .xv-list-item.item-selected {
2831   background: #226b9a;
2832   background-color: #1f608c;
2833   background-image: -moz-linear-gradient(top, #226b9a, #1a4f77);
2834   background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#226b9a), to(#1a4f77));
2835   background-image: -webkit-linear-gradient(top, #226b9a, #1a4f77);
2836   background-image: -o-linear-gradient(top, #226b9a, #1a4f77);
2837   background-image: linear-gradient(to bottom, #226b9a, #1a4f77);
2838   background-repeat: repeat-x;
2839   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff226b9a', endColorstr='#ff1a4f77', GradientType=0);
2840 }
2841 .xv-list.xv-grid-list .xv-list-item.item-selected .xv-list-attr {
2842   color: #fdfdfd;
2843 }
2844 .xv-list.xv-grid-list .xv-list-item.item-selected .xv-list-attr.placeholder {
2845   font-style: italic;
2846   color: #99ccff;
2847 }
2848 .xv-list.xv-grid-list .xv-list-item.item-selected .xv-list-attr.hyperlink {
2849   color: #ff6529;
2850 }
2851 .xv-list.xv-grid-list .xv-list-item.item-selected .xv-list-attr.header {
2852   background: #99ccff;
2853 }
2854 .xv-list.xv-grid-list .xv-list-item .xv-list-column {
2855   vertical-align: top;
2856 }
2857 .xv-list.xv-grid-list .xv-list-item .xv-list-column .xv-list-attr {
2858   font-size: 12px;
2859 }
2860 .xv-list.xv-grid-list .xv-list-item .xv-list-column.last {
2861   border-right: none;
2862 }
2863 .xv-list.xv-grid-list .xv-list-item .xv-list-column.name-column {
2864   padding-left: 7px;
2865 }
2866 .xv-list.xv-grid-list .xv-list-item .xv-list-column.first {
2867   padding-left: 7px;
2868 }
2869 .xv-list.xv-grid-list .xv-list-item .xv-list-column.second {
2870   padding-left: 7px;
2871 }
2872 .xv-list.xv-grid-list .xv-list-item .xv-list-column.third {
2873   padding-left: 7px;
2874 }
2875 .xv-list.xv-grid-list .xv-list-item .xv-list-column.short {
2876   padding-left: 7px;
2877 }
2878 .xv-list.xv-grid-list .xv-list-item .xv-list-column.small {
2879   padding-left: 7px;
2880 }
2881 .xv-list.xv-grid-list .xv-list-item .xv-list-column.medium {
2882   padding-left: 7px;
2883 }
2884 .xv-list.xv-grid-list .xv-list-item .xv-list-column.descr {
2885   padding-left: 7px;
2886 }
2887 .xv-list.xv-grid-list .xv-list-item .xv-list-column .xv-list-attr {
2888   padding: 0px;
2889 }
2890 .xv-list-attr {
2891   padding: 5px;
2892   font-size: .8em;
2893   white-space: nowrap;
2894   overflow: hidden;
2895   text-overflow: ellipsis;
2896   color: #070707;
2897 }
2898 .xv-list-attr.header {
2899   padding: 4px;
2900   background: #d8d8d8;
2901   font-size: .7em;
2902   font-weight: bold;
2903   text-transform: uppercase;
2904   color: #fdfdfd;
2905 }
2906 .xv-list-attr.footer {
2907   padding: 4px;
2908   background: #d8d8d8;
2909   font-size: .7em;
2910   font-weight: bold;
2911   text-transform: uppercase;
2912   color: #070707;
2913 }
2914 .xv-list-attr.right {
2915   position: absolute;
2916   right: 10px;
2917 }
2918 .xv-list-attr.text-align-right {
2919   text-align: right;
2920 }
2921 .xv-list-attr.bold {
2922   font-weight: bold;
2923 }
2924 .xv-list-attr.error {
2925   color: #ff0000;
2926 }
2927 .xv-list-attr.emphasis {
2928   color: #009000;
2929 }
2930 .xv-list-attr.warn {
2931   color: #ff9c00;
2932 }
2933 .xv-list-attr.italic {
2934   font-style: italic;
2935 }
2936 .xv-list-attr.placeholder {
2937   font-style: italic;
2938   color: #777777;
2939 }
2940 .xv-list-attr.hyperlink {
2941   color: #357ec7;
2942   cursor: pointer;
2943 }
2944 .xv-list-attr.disabled {
2945   color: #777777;
2946 }
2947 /* Navigator */
2948 .xv-navigator-header {
2949   font-size: small;
2950   font-weight: bold;
2951   text-transform: uppercase;
2952   color: #ff6600;
2953   padding-left: 20px;
2954   border-bottom: 1px solid #0e0e0e;
2955 }
2956 .xv-workspace-header {
2957   color: #fdfdfd;
2958   white-space: nowrap;
2959   overflow: hidden;
2960   text-overflow: ellipsis;
2961   padding: 8px 0 0 8px;
2962 }
2963 /**
2964   Styles relating to widgets in the pullout
2965 */
2966 /* Pullout */
2967 .xv-pullout {
2968   /* Setting this as min-width overrides enyo-narrow 100% */
2969   width: 320px;
2970   -webkit-box-shadow: -2px -2px 6px rgba(0, 0, 0, 0.2);
2971   -moz-box-shadow: -2px -2px 6px rgba(0, 0, 0, 0.2);
2972   box-shadow: -2px -2px 6px rgba(0, 0, 0, 0.2);
2973   position: absolute;
2974   top: 55px;
2975   left: 0;
2976   bottom: 0;
2977   background-color: #fdfdfd;
2978   -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
2979   -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
2980   box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
2981 }
2982 .xv-pullout .xv-header {
2983   background-color: #fdfdfd;
2984   padding: 6px 12px;
2985   border-bottom: 1px solid #d7d7d7;
2986   height: 28px;
2987   color: #ff6529;
2988   font-size: small;
2989   font-weight: bold;
2990   text-transform: uppercase;
2991   white-space: nowrap;
2992   overflow: hidden;
2993   text-overflow: ellipsis;
2994   height: 15px;
2995   border: none;
2996 }
2997 .xv-pullout .pullout-grabbutton {
2998   position: absolute;
2999   height: 54px;
3000   width: 50px;
3001   bottom: 25px;
3002   right: -50px;
3003   background-color: #d7d7d7;
3004   box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.25);
3005   -webkit-border-top-right-radius: 10px;
3006   -moz-border-radius-topright: 10px;
3007   border-top-right-radius: 10px;
3008   -webkit-border-bottom-right-radius: 10px;
3009   -moz-border-radius-bottomright: 10px;
3010   border-bottom-right-radius: 10px;
3011 }
3012 .xv-pullout .xv-parameter-panel {
3013   width: 320px;
3014   margin: 0 4px 0 2px;
3015   padding: 0;
3016   background: #f8f8f8;
3017   text-overflow: ellipsis;
3018   border: 1px solid #d7d7d7;
3019   /**
3020         Styles relating to workspace widgets
3021       */
3022   width: 100%;
3023   margin: 0 4px 6px 0;
3024 }
3025 .xv-pullout .xv-parameter-panel .onyx-groupbox-header {
3026   padding: 6px 10px;
3027   border-bottom: 1px solid #d7d7d7;
3028   background: #efefef;
3029   color: #0e0e0e;
3030 }
3031 .xv-pullout .xv-parameter-panel .onyx-groupbox-header i {
3032   margin-right: 10px;
3033 }
3034 .xv-pullout .xv-parameter-panel.small-panel {
3035   width: 600px;
3036 }
3037 .xv-pullout .xv-parameter-panel.medium-panel {
3038   width: 700px;
3039 }
3040 .xv-pullout .xv-parameter-panel.large-panel {
3041   width: 800px;
3042 }
3043 .xv-pullout .xv-parameter-panel .xv-label,
3044 .xv-pullout .xv-parameter-panel .xv-decorated-label,
3045 .xv-pullout .xv-parameter-panel .xv-flexible-label {
3046   width: 120px;
3047   max-width: 100%;
3048   text-align: right;
3049   padding: 0 8px 0 6px;
3050   vertical-align: middle;
3051 }
3052 .xv-pullout .xv-parameter-panel .xv-label.disabled,
3053 .xv-pullout .xv-parameter-panel .xv-decorated-label.disabled,
3054 .xv-pullout .xv-parameter-panel .xv-flexible-label.disabled {
3055   color: #777777;
3056 }
3057 .xv-pullout .xv-parameter-panel.xv-assignment-box .xv-flexible-label,
3058 .xv-pullout .xv-parameter-panel.xv-assignment-box .xv-label {
3059   width: 200px !important;
3060 }
3061 .xv-pullout .xv-parameter-panel .xv-input {
3062   padding: 4px 0;
3063   border-bottom: 1px solid rgba(215, 215, 215, 0.5);
3064 }
3065 .xv-pullout .xv-parameter-panel .xv-input .enyo-tool-decorator {
3066   max-width: 180px;
3067   text-align: left;
3068 }
3069 .xv-pullout .xv-parameter-panel .xv-input .enyo-tool-decorator .onyx-icon {
3070   display: inline-block;
3071   width: 16px;
3072   cursor: pointer;
3073 }
3074 .xv-pullout .xv-parameter-panel .xv-input.xv-textarea {
3075   padding: 0;
3076   margin: 8px;
3077 }
3078 .xv-pullout .xv-parameter-panel .xv-input.xv-textarea .enyo-tool-decorator {
3079   max-width: 320px;
3080 }
3081 .xv-pullout .xv-parameter-panel .xv-input input {
3082   width: 164px;
3083 }
3084 .xv-pullout .xv-parameter-panel .xv-input .xv-icon-decorator input {
3085   width: 140px;
3086 }
3087 .xv-pullout .xv-parameter-panel .xv-input .xv-icon-decorator .onyx-icon {
3088   padding: 4px;
3089 }
3090 .xv-pullout .xv-parameter-panel .xv-input .onyx-picker-decorator {
3091   padding: 0;
3092 }
3093 .xv-pullout .xv-parameter-panel .xv-relationwidget .xv-description {
3094   overflow: hidden;
3095   display: -webkit-box;
3096   -webkit-line-clamp: 4;
3097   -webkit-box-orient: vertical;
3098   max-width: 250px;
3099   margin: 5px 5px 5px 80px;
3100   font-size: 0.9em;
3101 }
3102 .xv-pullout .xv-parameter-panel .xv-relationwidget .xv-description.disabled {
3103   color: #777777;
3104 }
3105 .xv-pullout .xv-parameter-panel .xv-spinnerwidget .buttons {
3106   display: block;
3107   padding: 0;
3108   margin: 1px 0 1px 10px;
3109   width: 20px;
3110   height: 20px;
3111   background: transparent;
3112   color: #357ec7;
3113   font-size: 20px;
3114   border: none;
3115 }
3116 .xv-pullout .xv-parameter-panel .xv-spinnerwidget .slider {
3117   margin: 15px 10px;
3118 }
3119 .xv-pullout .xv-parameter-panel .xv-spinnerwidget.xv-numberwidget input {
3120   width: 120px;
3121 }
3122 .xv-pullout .xv-parameter-panel .xv-combobox .icon-sort {
3123   color: #357ec7;
3124   vertical-align: middle;
3125 }
3126 .xv-pullout .xv-parameter-panel .xv-numberwidget input {
3127   text-align: right;
3128 }
3129 .xv-pullout .xv-parameter-panel .xv-moneywidget .enyo-tool-decorator {
3130   min-width: 90px;
3131   max-width: 90px;
3132 }
3133 .xv-pullout .xv-parameter-panel .xv-moneywidget .enyo-tool-decorator input {
3134   width: 90px;
3135 }
3136 .xv-pullout .xv-parameter-panel .xv-currency-picker {
3137   display: inline-block;
3138 }
3139 .xv-pullout .xv-parameter-panel .xv-currency-picker .enyo-tool-decorator {
3140   min-width: 65px;
3141   max-width: 65px;
3142   padding: 10px 4px;
3143 }
3144 .xv-pullout .xv-parameter-panel .xv-currency-picker .enyo-tool-decorator .xv-button-text {
3145   width: 45px;
3146 }
3147 .xv-pullout .xv-parameter-panel .xv-characteristics-widget .xv-characteristic-item {
3148   border-bottom: 1px solid #d7d7d7;
3149 }
3150 .xv-pullout .xv-parameter-panel .xv-characteristics-widget .xv-characteristic-item .xv-input {
3151   border: none;
3152 }
3153 .xv-pullout .xv-parameter-panel .xv-characteristics-widget .xv-characteristic-item .xv-input input {
3154   width: 135px;
3155 }
3156 .xv-pullout .xv-parameter-panel .xv-characteristics-widget .xv-characteristic-button {
3157   text-align: center;
3158 }
3159 .xv-pullout .xv-parameter-panel .enyo-fittable-columns-layout > * {
3160   vertical-align: middle;
3161 }
3162 .xv-pullout .xv-parameter-panel .xv-input .onyx-input-decorator,
3163 .xv-pullout .xv-parameter-panel .xv-pickerwidget .onyx-input-decorator {
3164   border: none;
3165 }
3166 .xv-pullout .xv-parameter-panel .xv-buttons {
3167   text-align: center;
3168 }
3169 .xv-pullout .xv-parameter-panel .xv-filter-form .xv-list {
3170   height: 150px;
3171 }
3172 .xv-pullout .help-panel {
3173   border: none;
3174   height: 100%;
3175   width: 100%;
3176 }
3177 .xv-pullout .history-panel .xv-list-item {
3178   padding: 12px 10px;
3179   color: #0e0e0e;
3180   background-color: #fdfdfd;
3181   border-bottom: 1px solid #d7d7d7;
3182 }
3183 .xv-pullout .history-panel .xv-list-item.onyx-selected {
3184   background-color: #357ec7;
3185   color: #fdfdfd;
3186   border-bottom: 2px solid #d8d8d8;
3187 }
3188 /**
3189   Styles relating to RelationWidgets
3190 */
3191 .xv-relationwidget-completer {
3192   left: -200px;
3193   top: 15px;
3194 }
3195 .xv-completer-sidecar {
3196   color: #93a1a1;
3197 }
3198 .xv-relationwidget-icon {
3199   top: 1px;
3200   left: 8px;
3201   height: 30px;
3202   position: relative;
3203 }
3204 .xv-private-item-site-widget {
3205   border-bottom-color: #aaaaaa;
3206   border-bottom-width: 1px;
3207   border-bottom-style: solid;
3208 }
3209 /* RelationsEditorBox */
3210 .xv-relations-editor-box .xv-groupbox {
3211   margin-right: 0;
3212   padding: 0;
3213   border: none;
3214 }
3215 .xv-relations-editor-box.panel {
3216   width: 350px;
3217 }
3218 /* ListRelationsBox */
3219 .xv-list-relations-box.panel {
3220   width: 625px;
3221 }
3222 .xv-short-relations-box.panel {
3223   width: 500px;
3224 }
3225 .xv-addresswidget {
3226   background-color: #fdfdfd;
3227   padding: 4px;
3228 }
3229 .xv-addresswidget .xv-addresswidget-viewer {
3230   border: 0;
3231   font-size: medium;
3232   display: inline;
3233 }
3234 .xv-addresswidget .xv-addresswidget-viewer.placeholder {
3235   font-style: italic;
3236   color: #93a1a1;
3237 }
3238 .xv-addresswidget .xv-addresswidget-viewer.disabled {
3239   color: #777777;
3240 }
3241 .xv-addresswidget .xv-addresswidget-buttons {
3242   margin-top: 4px;
3243 }
3244 .xv-addresswidget .xv-addresswidget-buttons .xv-addresswidget-button {
3245   margin-right: 4px;
3246 }
3247 .xv-addresswidget-input-decorator,
3248 .xv-addresswidget-combobox-decorator {
3249   background: #fdfdfd;
3250   display: block;
3251   margin: 4px;
3252 }
3253 .xv-addresswidget-input-decorator input,
3254 .xv-addresswidget-combobox-decorator input {
3255   width: 100%;
3256 }
3257 .xv-addresswidget-input-decorator .enyo-fittable-columns-layout > *,
3258 .xv-addresswidget-combobox-decorator .enyo-fittable-columns-layout > * {
3259   vertical-align: middle;
3260 }
3261 .xv-addresswidget-input-decorator.short,
3262 .xv-addresswidget-combobox-decorator.short {
3263   width: 40%;
3264 }
3265 .xv-addresswidget-combobox-decorator {
3266   width: 60%;
3267 }
3268 .xv-button-section .xv-addresswidget-buttons {
3269   margin: 0;
3270   background-color: #666666;
3271 }
3272 .xv-addresswidget-editor-header {
3273   padding: 4px;
3274 }
3275 .xv-addresswidget-editor {
3276   width: 320px;
3277   padding: 8px;
3278   padding-right: 16px;
3279 }
3280 .xv-addresslist-attr {
3281   padding: 5px;
3282   font-size: 13px;
3283   white-space: normal;
3284   overflow: auto;
3285   color: #070707;
3286   background-color: #fdfdfd;
3287 }
3288 .xv-search .xv-header {
3289   background-color: #fdfdfd;
3290   padding: 6px 12px;
3291   border-bottom: 1px solid #d7d7d7;
3292   height: 28px;
3293   color: #ff6529;
3294   font-size: small;
3295   font-weight: bold;
3296   text-transform: uppercase;
3297   white-space: nowrap;
3298   overflow: hidden;
3299   text-overflow: ellipsis;
3300   border: none;
3301 }
3302 .xv-search .xv-search-container {
3303   width: 320px;
3304   margin: 0 4px 0 2px;
3305   padding: 0;
3306   background: #f8f8f8;
3307   text-overflow: ellipsis;
3308   border: 1px solid #d7d7d7;
3309   /**
3310         Styles relating to workspace widgets
3311       */
3312   width: 100%;
3313   margin: 0 4px 6px 0;
3314 }
3315 .xv-search .xv-search-container .onyx-groupbox-header {
3316   padding: 6px 10px;
3317   border-bottom: 1px solid #d7d7d7;
3318   background: #efefef;
3319   color: #0e0e0e;
3320 }
3321 .xv-search .xv-search-container .onyx-groupbox-header i {
3322   margin-right: 10px;
3323 }
3324 .xv-search .xv-search-container.small-panel {
3325   width: 600px;
3326 }
3327 .xv-search .xv-search-container.medium-panel {
3328   width: 700px;
3329 }
3330 .xv-search .xv-search-container.large-panel {
3331   width: 800px;
3332 }
3333 .xv-search .xv-search-container .xv-label,
3334 .xv-search .xv-search-container .xv-decorated-label,
3335 .xv-search .xv-search-container .xv-flexible-label {
3336   width: 120px;
3337   max-width: 100%;
3338   text-align: right;
3339   padding: 0 8px 0 6px;
3340   vertical-align: middle;
3341 }
3342 .xv-search .xv-search-container .xv-label.disabled,
3343 .xv-search .xv-search-container .xv-decorated-label.disabled,
3344 .xv-search .xv-search-container .xv-flexible-label.disabled {
3345   color: #777777;
3346 }
3347 .xv-search .xv-search-container.xv-assignment-box .xv-flexible-label,
3348 .xv-search .xv-search-container.xv-assignment-box .xv-label {
3349   width: 200px !important;
3350 }
3351 .xv-search .xv-search-container .xv-input {
3352   padding: 4px 0;
3353   border-bottom: 1px solid rgba(215, 215, 215, 0.5);
3354 }
3355 .xv-search .xv-search-container .xv-input .enyo-tool-decorator {
3356   max-width: 180px;
3357   text-align: left;
3358 }
3359 .xv-search .xv-search-container .xv-input .enyo-tool-decorator .onyx-icon {
3360   display: inline-block;
3361   width: 16px;
3362   cursor: pointer;
3363 }
3364 .xv-search .xv-search-container .xv-input.xv-textarea {
3365   padding: 0;
3366   margin: 8px;
3367 }
3368 .xv-search .xv-search-container .xv-input.xv-textarea .enyo-tool-decorator {
3369   max-width: 320px;
3370 }
3371 .xv-search .xv-search-container .xv-input input {
3372   width: 164px;
3373 }
3374 .xv-search .xv-search-container .xv-input .xv-icon-decorator input {
3375   width: 140px;
3376 }
3377 .xv-search .xv-search-container .xv-input .xv-icon-decorator .onyx-icon {
3378   padding: 4px;
3379 }
3380 .xv-search .xv-search-container .xv-input .onyx-picker-decorator {
3381   padding: 0;
3382 }
3383 .xv-search .xv-search-container .xv-relationwidget .xv-description {
3384   overflow: hidden;
3385   display: -webkit-box;
3386   -webkit-line-clamp: 4;
3387   -webkit-box-orient: vertical;
3388   max-width: 250px;
3389   margin: 5px 5px 5px 80px;
3390   font-size: 0.9em;
3391 }
3392 .xv-search .xv-search-container .xv-relationwidget .xv-description.disabled {
3393   color: #777777;
3394 }
3395 .xv-search .xv-search-container .xv-spinnerwidget .buttons {
3396   display: block;
3397   padding: 0;
3398   margin: 1px 0 1px 10px;
3399   width: 20px;
3400   height: 20px;
3401   background: transparent;
3402   color: #357ec7;
3403   font-size: 20px;
3404   border: none;
3405 }
3406 .xv-search .xv-search-container .xv-spinnerwidget .slider {
3407   margin: 15px 10px;
3408 }
3409 .xv-search .xv-search-container .xv-spinnerwidget.xv-numberwidget input {
3410   width: 120px;
3411 }
3412 .xv-search .xv-search-container .xv-combobox .icon-sort {
3413   color: #357ec7;
3414   vertical-align: middle;
3415 }
3416 .xv-search .xv-search-container .xv-numberwidget input {
3417   text-align: right;
3418 }
3419 .xv-search .xv-search-container .xv-moneywidget .enyo-tool-decorator {
3420   min-width: 90px;
3421   max-width: 90px;
3422 }
3423 .xv-search .xv-search-container .xv-moneywidget .enyo-tool-decorator input {
3424   width: 90px;
3425 }
3426 .xv-search .xv-search-container .xv-currency-picker {
3427   display: inline-block;
3428 }
3429 .xv-search .xv-search-container .xv-currency-picker .enyo-tool-decorator {
3430   min-width: 65px;
3431   max-width: 65px;
3432   padding: 10px 4px;
3433 }
3434 .xv-search .xv-search-container .xv-currency-picker .enyo-tool-decorator .xv-button-text {
3435   width: 45px;
3436 }
3437 .xv-search .xv-search-container .xv-characteristics-widget .xv-characteristic-item {
3438   border-bottom: 1px solid #d7d7d7;
3439 }
3440 .xv-search .xv-search-container .xv-characteristics-widget .xv-characteristic-item .xv-input {
3441   border: none;
3442 }
3443 .xv-search .xv-search-container .xv-characteristics-widget .xv-characteristic-item .xv-input input {
3444   width: 135px;
3445 }
3446 .xv-search .xv-search-container .xv-characteristics-widget .xv-characteristic-button {
3447   text-align: center;
3448 }
3449 .xv-search .xv-search-container .enyo-fittable-columns-layout > * {
3450   vertical-align: middle;
3451 }
3452 .xv-search .xv-search-container .xv-input .onyx-input-decorator,
3453 .xv-search .xv-search-container .xv-pickerwidget .onyx-input-decorator {
3454   border: none;
3455 }
3456 .xv-search .xv-search-container .xv-buttons {
3457   text-align: center;
3458 }
3459 .xv-search .xv-search-container .xv-filter-form .xv-list {
3460   height: 150px;
3461 }