resources/lib/oojs-ui/oojs-ui-widgets-apex.css

   1 /*!
   2  * OOjs UI v0.16.0
   3  * https://www.mediawiki.org/wiki/OOjs_UI
   4  *
   5  * Copyright 2011–2016 OOjs UI Team and other contributors.
   6  * Released under the MIT license
   7  * http://oojs.mit-license.org
   8  *
   9  * Date: 2016-02-22T22:33:37Z
  10  */
  11 .oo-ui-draggableElement-handle.oo-ui-widget-enabled {
  12         cursor: move;
  13         cursor: url(images/grab.cur );
  14         cursor: -webkit-grab;
  15         cursor:    -moz-grab;
  16         cursor:         grab;
  17 }
  18 .oo-ui-draggableElement-placeholder {
  19         opacity: 0.2;
  20 }
  21 .oo-ui-draggableElement.oo-ui-widget-enabled:active {
  22         cursor: move;
  23         cursor: url(images/grabbing.cur );
  24         cursor: -webkit-grabbing;
  25         cursor:    -moz-grabbing;
  26         cursor:         grabbing;
  27 }
  28 .oo-ui-draggableGroupElement-horizontal .oo-ui-draggableElement.oo-ui-optionWidget {
  29         display: inline-block;
  30 }
  31 .oo-ui-lookupElement > .oo-ui-menuSelectWidget {
  32         z-index: 1;
  33         width: 100%;
  34 }
  35 .oo-ui-bookletLayout-stackLayout.oo-ui-stackLayout-continuous > .oo-ui-panelLayout-scrollable {
  36         overflow-y: hidden;
  37 }
  38 .oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout {
  39         width: 100%;
  40         -webkit-box-sizing: border-box;
  41            -moz-box-sizing: border-box;
  42                 box-sizing: border-box;
  43 }
  44 .oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout-scrollable {
  45         overflow-y: auto;
  46 }
  47 .oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout-padded {
  48         padding: 2em;
  49 }
  50 .oo-ui-bookletLayout-outlinePanel-editable > .oo-ui-outlineSelectWidget {
  51         position: absolute;
  52         top: 0;
  53         left: 0;
  54         right: 0;
  55         bottom: 3em;
  56         overflow-y: auto;
  57 }
  58 .oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget {
  59         position: absolute;
  60         bottom: 0;
  61         left: 0;
  62         right: 0;
  63 }
  64 .oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout {
  65         padding: 1.5em;
  66 }
  67 .oo-ui-bookletLayout-outlinePanel {
  68         border-right: 1px solid #dddddd;
  69 }
  70 .oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget {
  71         box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.25);
  72 }
  73 .oo-ui-indexLayout > .oo-ui-menuLayout-menu {
  74         height: 3em;
  75 }
  76 .oo-ui-indexLayout > .oo-ui-menuLayout-content {
  77         top: 3em;
  78 }
  79 .oo-ui-indexLayout-stackLayout > .oo-ui-panelLayout {
  80         padding: 1.5em;
  81 }
  82 .oo-ui-menuLayout {
  83         position: absolute;
  84         top: 0;
  85         left: 0;
  86         right: 0;
  87         bottom: 0;
  88 }
  89 .oo-ui-menuLayout-menu,
  90 .oo-ui-menuLayout-content {
  91         position: absolute;
  92         -webkit-transition: all 200ms ease;
  93            -moz-transition: all 200ms ease;
  94                 transition: all 200ms ease;
  95 }
  96 .oo-ui-menuLayout-menu {
  97         height: 18em;
  98         width: 18em;
  99 }
 100 .oo-ui-menuLayout-content {
 101         top: 18em;
 102         left: 18em;
 103         right: 18em;
 104         bottom: 18em;
 105 }
 106 .oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-menu {
 107         width: 0 !important;
 108         height: 0 !important;
 109         overflow: hidden;
 110 }
 111 .oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-content {
 112         top: 0 !important;
 113         left: 0 !important;
 114         right: 0 !important;
 115         bottom: 0 !important;
 116 }
 117 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-menu {
 118         width: auto !important;
 119         left: 0;
 120         top: 0;
 121         right: 0;
 122 }
 123 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-content {
 124         right: 0 !important;
 125         bottom: 0 !important;
 126         left: 0 !important;
 127 }
 128 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-menu {
 129         height: auto !important;
 130         top: 0;
 131         right: 0;
 132         bottom: 0;
 133 }
 134 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-content {
 135         bottom: 0 !important;
 136         left: 0 !important;
 137         top: 0 !important;
 138 }
 139 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-menu {
 140         width: auto !important;
 141         right: 0;
 142         bottom: 0;
 143         left: 0;
 144 }
 145 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-content {
 146         left: 0 !important;
 147         top: 0 !important;
 148         right: 0 !important;
 149 }
 150 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-menu {
 151         height: auto !important;
 152         bottom: 0;
 153         left: 0;
 154         top: 0;
 155 }
 156 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-content {
 157         top: 0 !important;
 158         right: 0 !important;
 159         bottom: 0 !important;
 160 }
 161 .oo-ui-stackLayout-continuous > .oo-ui-panelLayout {
 162         display: block;
 163         position: relative;
 164 }
 165 .oo-ui-buttonSelectWidget {
 166         display: inline-block;
 167         white-space: nowrap;
 168         border-radius: 0.3em;
 169         margin-right: 0.5em;
 170 }
 171 .oo-ui-buttonSelectWidget:last-child {
 172         margin-right: 0;
 173 }
 174 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonElement-button {
 175         border-radius: 0;
 176         margin-left: -1px;
 177 }
 178 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonElement-button {
 179         border-bottom-left-radius: 0.3em;
 180         border-top-left-radius: 0.3em;
 181         margin-left: 0;
 182 }
 183 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:last-child .oo-ui-buttonElement-button {
 184         border-bottom-right-radius: 0.3em;
 185         border-top-right-radius: 0.3em;
 186 }
 187 .oo-ui-buttonOptionWidget {
 188         display: inline-block;
 189         padding: 0;
 190         background-color: transparent;
 191 }
 192 .oo-ui-buttonOptionWidget .oo-ui-buttonElement-button {
 193         position: relative;
 194 }
 195 .oo-ui-buttonOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon,
 196 .oo-ui-buttonOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
 197         position: static;
 198         display: inline-block;
 199         vertical-align: middle;
 200 }
 201 .oo-ui-buttonOptionWidget .oo-ui-buttonElement-button {
 202         height: 1.875em;
 203 }
 204 .oo-ui-buttonOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon {
 205         margin-top: 0;
 206 }
 207 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected,
 208 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
 209 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-highlighted {
 210         background-color: transparent;
 211 }
 212 .oo-ui-toggleButtonWidget {
 213         display: inline-block;
 214         vertical-align: middle;
 215         margin-right: 0.5em;
 216 }
 217 .oo-ui-toggleButtonWidget:last-child {
 218         margin-right: 0;
 219 }
 220 .oo-ui-toggleSwitchWidget {
 221         position: relative;
 222         display: inline-block;
 223         vertical-align: middle;
 224         overflow: hidden;
 225         -webkit-box-sizing: border-box;
 226            -moz-box-sizing: border-box;
 227                 box-sizing: border-box;
 228         -webkit-transform: translateZ(0);
 229            -moz-transform: translateZ(0);
 230             -ms-transform: translateZ(0);
 231                 transform: translateZ(0);
 232         height: 2em;
 233         width: 4em;
 234         border-radius: 1em;
 235         box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #dddddd;
 236         border: 1px solid #cccccc;
 237         margin-right: 0.5em;
 238         background-color: #eeeeee;
 239         background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0, #dddddd), color-stop(100%, #ffffff));
 240         background-image: -webkit-linear-gradient(top, #dddddd 0, #ffffff 100%);
 241         background-image:    -moz-linear-gradient(top, #dddddd 0, #ffffff 100%);
 242         background-image:         linear-gradient(to bottom, #dddddd 0, #ffffff 100%);
 243         -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffdddddd', endColorstr='#ffffffff' )";
 244 }
 245 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled {
 246         cursor: pointer;
 247 }
 248 .oo-ui-toggleSwitchWidget-grip {
 249         position: absolute;
 250         display: block;
 251         -webkit-box-sizing: border-box;
 252            -moz-box-sizing: border-box;
 253                 box-sizing: border-box;
 254 }
 255 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
 256         position: absolute;
 257         top: 0;
 258         bottom: 0;
 259         right: 0;
 260         left: 0;
 261         -webkit-touch-callout: none;
 262         -webkit-user-select: none;
 263            -moz-user-select: none;
 264             -ms-user-select: none;
 265                 user-select: none;
 266 }
 267 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
 268         display: none;
 269 }
 270 .oo-ui-toggleSwitchWidget:last-child {
 271         margin-right: 0;
 272 }
 273 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
 274         opacity: 0.5;
 275 }
 276 .oo-ui-toggleSwitchWidget-grip {
 277         top: 0.25em;
 278         left: 0.25em;
 279         width: 1.5em;
 280         height: 1.5em;
 281         margin-top: -1px;
 282         border-radius: 1em;
 283         box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
 284         border: 1px #c9c9c9 solid;
 285         -webkit-transition: left 250ms ease, margin-left 250ms ease;
 286            -moz-transition: left 250ms ease, margin-left 250ms ease;
 287                 transition: left 250ms ease, margin-left 250ms ease;
 288         background-color: #eeeeee;
 289         background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0, #ffffff), color-stop(100%, #dddddd));
 290         background-image: -webkit-linear-gradient(top, #ffffff 0, #dddddd 100%);
 291         background-image:    -moz-linear-gradient(top, #ffffff 0, #dddddd 100%);
 292         background-image:         linear-gradient(to bottom, #ffffff 0, #dddddd 100%);
 293         -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffffff', endColorstr='#ffdddddd' )";
 294 }
 295 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover,
 296 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
 297         border-color: #aaaaaa;
 298 }
 299 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
 300         border-radius: 1em;
 301         box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
 302         -webkit-transition: opacity 250ms ease;
 303            -moz-transition: opacity 250ms ease;
 304                 transition: opacity 250ms ease;
 305         background-color: #cde7f4;
 306         background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0, #b0d9ee), color-stop(100%, #eaf4fa));
 307         background-image: -webkit-linear-gradient(top, #b0d9ee 0, #eaf4fa 100%);
 308         background-image:    -moz-linear-gradient(top, #b0d9ee 0, #eaf4fa 100%);
 309         background-image:         linear-gradient(to bottom, #b0d9ee 0, #eaf4fa 100%);
 310         -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffb0d9ee', endColorstr='#ffeaf4fa' )";
 311 }
 312 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-glow {
 313         opacity: 1;
 314 }
 315 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
 316         left: 2.25em;
 317         margin-left: -2px;
 318 }
 319 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
 320         display: block;
 321         opacity: 0;
 322 }
 323 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
 324         left: 0.25em;
 325         margin-left: 0;
 326 }
 327 .oo-ui-progressBarWidget {
 328         max-width: 50em;
 329         background-color: #ffffff;
 330         border: 1px solid #cccccc;
 331         border-radius: 0.25em;
 332         overflow: hidden;
 333 }
 334 .oo-ui-progressBarWidget-bar {
 335         height: 1em;
 336         border-right: 1px solid #cccccc;
 337         -webkit-transition: width 250ms ease, margin-left 250ms ease;
 338            -moz-transition: width 250ms ease, margin-left 250ms ease;
 339                 transition: width 250ms ease, margin-left 250ms ease;
 340         background-color: #cde7f4;
 341         background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0, #eaf4fa), color-stop(100%, #b0d9ee));
 342         background-image: -webkit-linear-gradient(top, #eaf4fa 0, #b0d9ee 100%);
 343         background-image:    -moz-linear-gradient(top, #eaf4fa 0, #b0d9ee 100%);
 344         background-image:         linear-gradient(to bottom, #eaf4fa 0, #b0d9ee 100%);
 345         -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffeaf4fa', endColorstr='#ffb0d9ee' )";
 346 }
 347 .oo-ui-progressBarWidget-indeterminate .oo-ui-progressBarWidget-bar {
 348         -webkit-animation: oo-ui-progressBarWidget-slide 2s infinite linear;
 349            -moz-animation: oo-ui-progressBarWidget-slide 2s infinite linear;
 350                 animation: oo-ui-progressBarWidget-slide 2s infinite linear;
 351         width: 40%;
 352         margin-left: -10%;
 353         border-left: 1px solid #a6cee1;
 354 }
 355 .oo-ui-progressBarWidget.oo-ui-widget-disabled {
 356         opacity: 0.6;
 357 }
 358 @-webkit-keyframes oo-ui-progressBarWidget-slide {
 359         from {
 360                 margin-left: -40%;
 361         }
 362         to {
 363                 margin-left: 100%;
 364         }
 365 }
 366 @-moz-keyframes oo-ui-progressBarWidget-slide {
 367         from {
 368                 margin-left: -40%;
 369         }
 370         to {
 371                 margin-left: 100%;
 372         }
 373 }
 374 @keyframes oo-ui-progressBarWidget-slide {
 375         from {
 376                 margin-left: -40%;
 377         }
 378         to {
 379                 margin-left: 100%;
 380         }
 381 }
 382 .oo-ui-selectFileWidget {
 383         display: inline-block;
 384         vertical-align: middle;
 385         width: 100%;
 386         max-width: 50em;
 387         margin-right: 0.5em;
 388 }
 389 .oo-ui-selectFileWidget-selectButton {
 390         display: table-cell;
 391         vertical-align: middle;
 392 }
 393 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button {
 394         position: relative;
 395         overflow: hidden;
 396 }
 397 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button > input[type="file"] {
 398         position: absolute;
 399         margin: 0;
 400         top: 0;
 401         bottom: 0;
 402         left: 0;
 403         right: 0;
 404         width: 100%;
 405         height: 100%;
 406         opacity: 0;
 407         z-index: 1;
 408         cursor: pointer;
 409         padding-top: 100px;
 410 }
 411 .oo-ui-selectFileWidget-selectButton.oo-ui-widget-disabled > .oo-ui-buttonElement-button > input[type="file"] {
 412         display: none;
 413 }
 414 .oo-ui-selectFileWidget-info {
 415         width: 100%;
 416         display: table-cell;
 417         vertical-align: middle;
 418         position: relative;
 419         overflow: hidden;
 420         -webkit-box-sizing: border-box;
 421            -moz-box-sizing: border-box;
 422                 box-sizing: border-box;
 423 }
 424 .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label {
 425         position: absolute;
 426         top: 0;
 427         bottom: 0;
 428         left: 0;
 429         right: 0;
 430         text-overflow: ellipsis;
 431 }
 432 .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileName {
 433         float: left;
 434 }
 435 .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType {
 436         float: right;
 437 }
 438 .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator,
 439 .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon,
 440 .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton {
 441         position: absolute;
 442 }
 443 .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton {
 444         z-index: 2;
 445 }
 446 .oo-ui-selectFileWidget-dropTarget {
 447         cursor: default;
 448         height: 5.5em;
 449         text-align: left;
 450         padding: 0;
 451 }
 452 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-dropLabel,
 453 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton {
 454         display: none;
 455 }
 456 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail {
 457         height: 5.5em;
 458         width: 5.5em;
 459         position: absolute;
 460         background-size: cover;
 461         background-position: center center;
 462 }
 463 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail.oo-ui-pendingElement-pending {
 464         background-size: auto;
 465 }
 466 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail > .oo-ui-selectFileWidget-noThumbnail-icon {
 467         opacity: 0.4;
 468         background-color: #cccccc;
 469         height: 5.5em;
 470         width: 5.5em;
 471 }
 472 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
 473         border: none;
 474         background: none;
 475         display: block;
 476         height: 100%;
 477         width: auto;
 478         margin-left: 5.5em;
 479 }
 480 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label {
 481         position: relative;
 482 }
 483 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileName {
 484         display: block;
 485         float: none;
 486 }
 487 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType {
 488         display: block;
 489         float: none;
 490 }
 491 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton {
 492         position: absolute;
 493         right: 0.5em;
 494 }
 495 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget {
 496         text-align: center;
 497 }
 498 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-dropLabel {
 499         display: block;
 500 }
 501 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail,
 502 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
 503         display: none;
 504 }
 505 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton {
 506         display: block;
 507         margin: 0.7em;
 508 }
 509 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget,
 510 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget {
 511         text-align: center;
 512 }
 513 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info,
 514 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
 515         margin: 0;
 516 }
 517 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-clearButton,
 518 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-clearButton {
 519         display: none;
 520 }
 521 .oo-ui-selectFileWidget:last-child {
 522         margin-right: 0;
 523 }
 524 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button {
 525         margin-left: 0.5em;
 526 }
 527 .oo-ui-selectFileWidget-info {
 528         height: 2.4em;
 529         background-color: #ffffff;
 530         border: 1px solid rgba(0, 0, 0, 0.1);
 531         border-radius: 0.25em;
 532 }
 533 .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator {
 534         right: 0;
 535 }
 536 .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon {
 537         left: 0;
 538 }
 539 .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label {
 540         line-height: 2.3em;
 541         margin: 0;
 542         overflow: hidden;
 543         white-space: nowrap;
 544         -webkit-box-sizing: border-box;
 545            -moz-box-sizing: border-box;
 546                 box-sizing: border-box;
 547         text-overflow: ellipsis;
 548         left: 0.5em;
 549         right: 0.5em;
 550 }
 551 .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType {
 552         color: #888888;
 553 }
 554 .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton {
 555         top: 0;
 556         width: 1.875em;
 557         margin-right: 0;
 558 }
 559 .oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
 560         height: 2.3em;
 561 }
 562 .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator {
 563         top: 0;
 564         width: 0.9375em;
 565         height: 2.3em;
 566         margin-right: 0.775em;
 567 }
 568 .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon {
 569         top: 0;
 570         width: 1.875em;
 571         height: 2.3em;
 572         margin-left: 0.3em;
 573 }
 574 .oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info {
 575         color: #cccccc;
 576         text-shadow: 0 1px 1px #ffffff;
 577         border-color: #dddddd;
 578         background-color: #f3f3f3;
 579 }
 580 .oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon,
 581 .oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator {
 582         opacity: 0.2;
 583 }
 584 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-label {
 585         color: #cccccc;
 586 }
 587 .oo-ui-selectFileWidget.oo-ui-iconElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label {
 588         left: 2.475em;
 589 }
 590 .oo-ui-selectFileWidget .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label {
 591         right: 2.175em;
 592 }
 593 .oo-ui-selectFileWidget .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-clearButton {
 594         right: 0;
 595 }
 596 .oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label {
 597         right: 4.2625em;
 598 }
 599 .oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-clearButton {
 600         right: 2.0875em;
 601 }
 602 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label,
 603 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label {
 604         right: 0.5em;
 605 }
 606 .oo-ui-selectFileWidget-empty.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label,
 607 .oo-ui-selectFileWidget-notsupported.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label {
 608         right: 2em;
 609 }
 610 .oo-ui-selectFileWidget-supported.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop .oo-ui-selectFileWidget-dropTarget {
 611         background-color: #e1f3ff;
 612 }
 613 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget,
 614 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget {
 615         color: #cccccc;
 616         text-shadow: 0 1px 1px #ffffff;
 617         border-color: #dddddd;
 618         background-color: #f3f3f3;
 619 }
 620 .oo-ui-selectFileWidget-dropTarget {
 621         background-color: #ffffff;
 622         border: 1px solid #aaaaaa;
 623         margin-bottom: 0.5em;
 624         vertical-align: middle;
 625         border-radius: 0.25em;
 626 }
 627 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-dropTarget {
 628         border-style: dashed;
 629 }
 630 .oo-ui-outlineOptionWidget {
 631         position: relative;
 632         cursor: pointer;
 633         -webkit-touch-callout: none;
 634         -webkit-user-select: none;
 635            -moz-user-select: none;
 636             -ms-user-select: none;
 637                 user-select: none;
 638         font-size: 1.1em;
 639         padding: 0.75em;
 640 }
 641 .oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label {
 642         padding-right: 1.5em;
 643 }
 644 .oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
 645         opacity: 0.5;
 646 }
 647 .oo-ui-outlineOptionWidget-level-0 {
 648         padding-left: 3.5em;
 649 }
 650 .oo-ui-outlineOptionWidget-level-0 .oo-ui-iconElement-icon {
 651         left: 1em;
 652 }
 653 .oo-ui-outlineOptionWidget-level-1 {
 654         padding-left: 5em;
 655 }
 656 .oo-ui-outlineOptionWidget-level-1 .oo-ui-iconElement-icon {
 657         left: 2.5em;
 658 }
 659 .oo-ui-outlineOptionWidget-level-2 {
 660         padding-left: 6.5em;
 661 }
 662 .oo-ui-outlineOptionWidget-level-2 .oo-ui-iconElement-icon {
 663         left: 4em;
 664 }
 665 .oo-ui-selectWidget-depressed .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected {
 666         background-color: #a7dcff;
 667         text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
 668 }
 669 .oo-ui-outlineOptionWidget.oo-ui-flaggedElement-important {
 670         font-weight: bold;
 671 }
 672 .oo-ui-outlineOptionWidget.oo-ui-flaggedElement-placeholder {
 673         font-style: italic;
 674 }
 675 .oo-ui-outlineOptionWidget.oo-ui-flaggedElement-empty .oo-ui-iconElement-icon {
 676         opacity: 0.5;
 677 }
 678 .oo-ui-outlineOptionWidget.oo-ui-flaggedElement-empty .oo-ui-labelElement-label {
 679         color: #777777;
 680 }
 681 .oo-ui-outlineControlsWidget {
 682         height: 3em;
 683         background-color: #ffffff;
 684 }
 685 .oo-ui-outlineControlsWidget-items,
 686 .oo-ui-outlineControlsWidget-movers {
 687         float: left;
 688         -webkit-box-sizing: border-box;
 689            -moz-box-sizing: border-box;
 690                 box-sizing: border-box;
 691 }
 692 .oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon {
 693         float: left;
 694         background-position: right center;
 695 }
 696 .oo-ui-outlineControlsWidget-items {
 697         float: left;
 698 }
 699 .oo-ui-outlineControlsWidget-items .oo-ui-buttonWidget {
 700         float: left;
 701 }
 702 .oo-ui-outlineControlsWidget-movers {
 703         float: right;
 704 }
 705 .oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget {
 706         float: right;
 707 }
 708 .oo-ui-outlineControlsWidget-items,
 709 .oo-ui-outlineControlsWidget-movers {
 710         height: 2em;
 711         margin: 0.5em 0.5em 0.5em 0;
 712         padding: 0;
 713 }
 714 .oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon {
 715         width: 1.5em;
 716         height: 2em;
 717         margin: 0.5em 0 0.5em 0.5em;
 718         opacity: 0.2;
 719 }
 720 .oo-ui-tabSelectWidget {
 721         text-align: left;
 722         white-space: nowrap;
 723         overflow: hidden;
 724         background-color: #eeeeee;
 725         box-shadow: inset 0 -0.015em 0.1em rgba(0, 0, 0, 0.1);
 726 }
 727 .oo-ui-tabOptionWidget {
 728         display: inline-block;
 729         vertical-align: bottom;
 730         padding: 0.5em 1em;
 731         margin: 0.5em 0 0 0.75em;
 732         border: 1px solid transparent;
 733         border-bottom: none;
 734         border-top-left-radius: 0.5em;
 735         border-top-right-radius: 0.5em;
 736 }
 737 .oo-ui-tabOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label {
 738         padding-right: 1.5em;
 739 }
 740 .oo-ui-tabOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
 741         opacity: 0.5;
 742 }
 743 .oo-ui-selectWidget-pressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-pressed {
 744         background-color: transparent;
 745 }
 746 .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
 747         background-color: rgba(255, 255, 255, 0.2);
 748         border-color: #dddddd;
 749 }
 750 .oo-ui-tabOptionWidget.oo-ui-widget-enabled:active {
 751         background-color: #ffffff;
 752         border-color: #dddddd;
 753 }
 754 .oo-ui-selectWidget-pressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected,
 755 .oo-ui-selectWidget-depressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected,
 756 .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected:hover {
 757         background-color: #ffffff;
 758         border-color: #dddddd;
 759 }
 760 .oo-ui-capsuleMultiSelectWidget {
 761         display: inline-block;
 762         position: relative;
 763         width: 100%;
 764         max-width: 50em;
 765 }
 766 .oo-ui-capsuleMultiSelectWidget-handle {
 767         width: 100%;
 768         display: block;
 769         position: relative;
 770 }
 771 .oo-ui-capsuleMultiSelectWidget-content {
 772         position: relative;
 773 }
 774 .oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-content > input {
 775         display: none;
 776 }
 777 .oo-ui-capsuleMultiSelectWidget-group {
 778         display: inline;
 779 }
 780 .oo-ui-capsuleMultiSelectWidget > .oo-ui-menuSelectWidget {
 781         z-index: 1;
 782         width: 100%;
 783 }
 784 .oo-ui-capsuleMultiSelectWidget-handle {
 785         background-color: #ffffff;
 786         cursor: text;
 787         min-height: 2.4em;
 788         margin-right: 0.5em;
 789         padding: 0.15em 0.25em;
 790         border: 1px solid rgba(0, 0, 0, 0.1);
 791         border-radius: 0.25em;
 792         -webkit-box-sizing: border-box;
 793            -moz-box-sizing: border-box;
 794                 box-sizing: border-box;
 795 }
 796 .oo-ui-capsuleMultiSelectWidget-handle:last-child {
 797         margin-right: 0;
 798 }
 799 .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator,
 800 .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon {
 801         position: absolute;
 802         background-position: center center;
 803         background-repeat: no-repeat;
 804 }
 805 .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-capsuleMultiSelectWidget-content > input {
 806         border: none;
 807         line-height: 1.675em;
 808         margin: 0;
 809         margin-left: 0.2em;
 810         padding: 0;
 811         font-size: inherit;
 812         font-family: inherit;
 813         background-color: transparent;
 814         color: black;
 815         vertical-align: middle;
 816 }
 817 .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-capsuleMultiSelectWidget-content > input:focus {
 818         outline: none;
 819 }
 820 .oo-ui-capsuleMultiSelectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiSelectWidget-handle {
 821         padding-right: 2.4875em;
 822 }
 823 .oo-ui-capsuleMultiSelectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator {
 824         right: 0;
 825         top: 0;
 826         width: 0.9375em;
 827         height: 0.9375em;
 828         margin: 0.775em;
 829 }
 830 .oo-ui-capsuleMultiSelectWidget.oo-ui-iconElement .oo-ui-capsuleMultiSelectWidget-handle {
 831         padding-left: 2.475em;
 832 }
 833 .oo-ui-capsuleMultiSelectWidget.oo-ui-iconElement .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon {
 834         left: 0;
 835         top: 0;
 836         width: 1.875em;
 837         height: 1.875em;
 838         margin: 0.3em;
 839 }
 840 .oo-ui-capsuleMultiSelectWidget:hover .oo-ui-capsuleMultiSelectWidget-handle {
 841         border-color: rgba(0, 0, 0, 0.2);
 842 }
 843 .oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle {
 844         color: #cccccc;
 845         text-shadow: 0 1px 1px #ffffff;
 846         border-color: #dddddd;
 847         background-color: #f3f3f3;
 848         cursor: default;
 849 }
 850 .oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon,
 851 .oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator {
 852         opacity: 0.2;
 853 }
 854 .oo-ui-capsuleItemWidget {
 855         position: relative;
 856         display: inline-block;
 857         cursor: default;
 858         white-space: nowrap;
 859         width: auto;
 860         max-width: 100%;
 861         -webkit-box-sizing: border-box;
 862            -moz-box-sizing: border-box;
 863                 box-sizing: border-box;
 864         vertical-align: middle;
 865         padding: 0 0.4em;
 866         margin: 0.1em;
 867         height: 1.7em;
 868         line-height: 1.7em;
 869         background-color: #eeeeee;
 870         background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0, #ffffff), color-stop(100%, #dddddd));
 871         background-image: -webkit-linear-gradient(top, #ffffff 0, #dddddd 100%);
 872         background-image:    -moz-linear-gradient(top, #ffffff 0, #dddddd 100%);
 873         background-image:         linear-gradient(to bottom, #ffffff 0, #dddddd 100%);
 874         -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffffff', endColorstr='#ffdddddd' )";
 875         border: 1px solid #cccccc;
 876         color: #555555;
 877         border-radius: 0.25em;
 878 }
 879 .oo-ui-capsuleItemWidget.oo-ui-labelElement .oo-ui-labelElement-label {
 880         display: inline-block;
 881         text-overflow: ellipsis;
 882         overflow: hidden;
 883 }
 884 .oo-ui-capsuleItemWidget:focus {
 885         outline: none;
 886         border-color: #087ecc;
 887 }
 888 .oo-ui-capsuleItemWidget.oo-ui-widget-disabled {
 889         opacity: 0.5;
 890         -webkit-transform: translate3d(0, 0, 0);
 891         box-shadow: none;
 892         color: #333333;
 893         background: #eeeeee;
 894         border-color: #cccccc;
 895 }
 896 .oo-ui-capsuleItemWidget > .oo-ui-buttonElement {
 897         float: right;
 898         margin-top: -0.1em;
 899         margin-right: -0.4em;
 900 }
 901 .oo-ui-searchWidget-query {
 902         position: absolute;
 903         top: 0;
 904         left: 0;
 905         right: 0;
 906 }
 907 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
 908         width: 100%;
 909 }
 910 .oo-ui-searchWidget-results {
 911         position: absolute;
 912         bottom: 0;
 913         left: 0;
 914         right: 0;
 915         overflow-x: hidden;
 916         overflow-y: auto;
 917 }
 918 .oo-ui-searchWidget-query {
 919         height: 4em;
 920         padding: 0 1em;
 921         box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.2);
 922 }
 923 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
 924         margin: 0.75em 0;
 925 }
 926 .oo-ui-searchWidget-results {
 927         top: 4em;
 928         padding: 1em;
 929         line-height: 0;
 930 }
 931 .oo-ui-numberInputWidget {
 932         display: inline-block;
 933         position: relative;
 934         max-width: 50em;
 935 }
 936 .oo-ui-numberInputWidget-field {
 937         display: table;
 938         table-layout: fixed;
 939         width: 100%;
 940 }
 941 .oo-ui-numberInputWidget-field > .oo-ui-buttonWidget,
 942 .oo-ui-numberInputWidget-field > .oo-ui-textInputWidget {
 943         display: table-cell;
 944         vertical-align: middle;
 945 }
 946 .oo-ui-numberInputWidget-field > .oo-ui-textInputWidget {
 947         width: 100%;
 948 }
 949 .oo-ui-numberInputWidget-field > .oo-ui-buttonWidget {
 950         white-space: nowrap;
 951 }
 952 .oo-ui-numberInputWidget-field > .oo-ui-buttonWidget > .oo-ui-buttonElement-button {
 953         -webkit-box-sizing: border-box;
 954            -moz-box-sizing: border-box;
 955                 box-sizing: border-box;
 956 }
 957 .oo-ui-numberInputWidget-field > .oo-ui-buttonWidget {
 958         width: 2.25em;
 959 }
 960 .oo-ui-numberInputWidget-minusButton.oo-ui-buttonElement-framed > .oo-ui-buttonElement-button {
 961         border-top-right-radius: 0;
 962         border-bottom-right-radius: 0;
 963         border-right-width: 0;
 964 }
 965 .oo-ui-numberInputWidget-plusButton.oo-ui-buttonElement-framed > .oo-ui-buttonElement-button {
 966         border-top-left-radius: 0;
 967         border-bottom-left-radius: 0;
 968         border-left-width: 0;
 969 }
 970 .oo-ui-numberInputWidget .oo-ui-textInputWidget input {
 971         border-radius: 0;
 972 }