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

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