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

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