resources/oojs-ui/oojs-ui.svg.css

   1 /*!
   2  * OOjs UI v0.1.0-pre-svg (a290673bbd)
   3  * https://www.mediawiki.org/wiki/OOjs_UI
   4  *
   5  * Copyright 2011–2014 OOjs Team and other contributors.
   6  * Released under the MIT license
   7  * http://oojs.mit-license.org
   8  *
   9  * Date: Wed Feb 12 2014 13:52:08 GMT-0800 (PST)
  10  */
  11 /*csslint vendor-prefix:false */
  12
  13 /* Textures */
  14
  15 .oo-ui-texture-pending {
  16         /* @embed */
  17         background-image: url(images/textures/pending.gif);
  18 }
  19
  20 .oo-ui-texture-transparency {
  21         /* @embed */
  22         background-image: url(images/textures/transparency.png);
  23 }
  24
  25 /* Animation */
  26
  27 @-webkit-keyframes oo-ui-zoom-in {
  28         from { -webkit-transform: scale(0.5); }
  29         to { -webkit-transform: scale(1); }
  30 }
  31
  32 @-moz-keyframes oo-ui-zoom-in {
  33         from { -moz-transform: scale(0.5); }
  34         to { -moz-transform: scale(1); }
  35 }
  36
  37 @-o-keyframes oo-ui-zoom-in {
  38         from { -o-transform: scale(0.5); }
  39         to { -o-transform: scale(1); }
  40 }
  41
  42 @keyframes oo-ui-zoom-in {
  43         from { transform: scale(0.5); }
  44         to { transform: scale(1); }
  45 }
  46
  47 @-webkit-keyframes oo-ui-fade-in {
  48         from { opacity: 0; }
  49         to { opacity: 1; }
  50 }
  51
  52 @-moz-keyframes oo-ui-fade-in {
  53         from { opacity: 0; }
  54         to { opacity: 1; }
  55 }
  56
  57 @-o-keyframes oo-ui-fade-in {
  58         from { opacity: 0; }
  59         to { opacity: 1; }
  60 }
  61
  62 @keyframes oo-ui-fade-in {
  63         from { opacity: 0; }
  64         to { opacity: 1; }
  65 }
  66
  67 /* RTL Definitions */
  68
  69 /* @noflip */
  70 .oo-ui-rtl {
  71         direction: rtl;
  72 }
  73 /* @noflip */
  74 .oo-ui-ltr {
  75         direction: ltr;
  76 }
  77 .oo-ui-dialog {
  78         position: fixed;
  79         top: 0;
  80         right: 0;
  81         bottom: 0;
  82         left: 0;
  83         padding: 1em;
  84         line-height: 1em;
  85         background-color: #fff;
  86         background-color: rgba(255,255,255,0.5);
  87         -webkit-animation: oo-ui-fade-in 250ms ease-in-out 0 1 normal;
  88         -moz-animation: oo-ui-fade-in 250ms ease-in-out 0 1 normal;
  89         -o-animation: oo-ui-fade-in 250ms ease-in-out 0 1 normal;
  90         animation: oo-ui-fade-in 250ms ease-in-out 0 1 normal;
  91 }
  92
  93 .oo-ui-dialog-closing {
  94         -webkit-animation: oo-ui-fade-in 250ms ease-in-out 0 1 reverse;
  95         -moz-animation: oo-ui-fade-in 250ms ease-in-out 0 1 reverse;
  96         -o-animation: oo-ui-fade-in 250ms ease-in-out 0 1 reverse;
  97         animation: oo-ui-fade-in 250ms ease-in-out 0 1 reverse;
  98 }
  99
 100 .oo-ui-dialog .oo-ui-window-frame {
 101         position: fixed;
 102         top: 1em;
 103         right: 0;
 104         bottom: 1em;
 105         left: 0;
 106         margin: auto;
 107         width: 800px;
 108         min-height: 12em;
 109         max-height: 600px;
 110         background-color: #fff;
 111         border: solid 1px #ccc;
 112         border-radius: 0.5em;
 113         box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.3);
 114         overflow: hidden;
 115         -webkit-animation: oo-ui-zoom-in 250ms ease-in-out 0 1 normal;
 116         -moz-animation: oo-ui-zoom-in 250ms ease-in-out 0 1 normal;
 117         -o-animation: oo-ui-zoom-in 250ms ease-in-out 0 1 normal;
 118         animation: oo-ui-zoom-in 250ms ease-in-out 0 1 normal;
 119 }
 120
 121 .oo-ui-dialog .oo-ui-window-frame.oo-ui-window-frame-small {
 122         max-width: 600px;
 123         max-height: 400px;
 124 }
 125
 126 .oo-ui-dialog-closing .oo-ui-window-frame {
 127         -webkit-animation: oo-ui-zoom-in 250ms ease-in-out 0 1 reverse;
 128         -moz-animation: oo-ui-zoom-in 250ms ease-in-out 0 1 reverse;
 129         -o-animation: oo-ui-zoom-in 250ms ease-in-out 0 1 reverse;
 130         animation: oo-ui-zoom-in 250ms ease-in-out 0 1 reverse;
 131 }
 132
 133 .oo-ui-dialog .oo-ui-frame {
 134         width: 100%;
 135         height: 100%;
 136 }
 137
 138 .oo-ui-dialog-content .oo-ui-window-head,
 139 .oo-ui-dialog-content .oo-ui-window-body,
 140 .oo-ui-dialog-content .oo-ui-window-foot {
 141         position: absolute;
 142         left: 0;
 143         right: 0;
 144         -webkit-box-sizing: border-box;
 145         -moz-box-sizing: border-box;
 146         box-sizing: border-box;
 147         overflow: hidden;
 148 }
 149
 150 .oo-ui-dialog-content .oo-ui-window-head {
 151         top: 0;
 152         height: 3.8em;
 153         padding: 0.5em;
 154 }
 155
 156 .oo-ui-dialog-content .oo-ui-window-foot {
 157         bottom: 0;
 158         height: 4.8em;
 159         padding: 1em;
 160 }
 161
 162 .oo-ui-dialog-content .oo-ui-window-body {
 163         box-shadow: 0 0 0.66em rgba(0,0,0,0.25);
 164         top: 3.8em;
 165         bottom: 4.8em;
 166 }
 167
 168 .oo-ui-dialog-content-footless .oo-ui-window-body {
 169         bottom: 0;
 170 }
 171
 172 .oo-ui-dialog-content-footless .oo-ui-window-foot {
 173         display: none;
 174 }
 175
 176 .oo-ui-dialog-content .oo-ui-window-icon {
 177         width: 2.4em;
 178         height: 2.8em;
 179         line-height: 2.8em;
 180 }
 181
 182 .oo-ui-dialog-content .oo-ui-window-title {
 183         line-height: 2.8em;
 184 }
 185
 186 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-buttonedElement-framed {
 187         float: left;
 188         margin: 0.125em 0.25em;
 189 }
 190
 191 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary,
 192 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive,
 193 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-destructive {
 194         float: right;
 195 }
 196
 197 .oo-ui-dialog-content .oo-ui-window-closeButton {
 198         float: right;
 199         margin: 0.25em 0.25em;
 200 }
 201
 202 /* OO.ui.ButtonedElement */
 203
 204 a.oo-ui-buttonedElement-button {
 205         color: #333;
 206         cursor: pointer;
 207         display: inline-block;
 208         vertical-align: middle;
 209         -webkit-touch-callout: none;
 210         -webkit-user-select: none;
 211         -moz-user-select: none;
 212         -ms-user-select: none;
 213         user-select: none;
 214 }
 215
 216 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator,
 217 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 218         display: none;
 219 }
 220
 221 .oo-ui-buttonedElement.oo-ui-indicatedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator,
 222 .oo-ui-buttonedElement.oo-ui-iconedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 223         opacity: 0.8;
 224         display: inline-block;
 225         vertical-align: middle;
 226         background-position: center center;
 227         background-repeat: no-repeat;
 228         width: 1.9em;
 229         height: 1.9em;
 230 }
 231
 232 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 233         margin-left: 0;
 234 }
 235
 236 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator {
 237         margin-right: -0.75em;
 238 }
 239
 240 .oo-ui-buttonedElement-frameless {
 241         display: inline-block;
 242         position: relative;
 243         -webkit-transition: opacity 200ms;
 244         -moz-transition: opacity 200ms;
 245         -o-transition: opacity 200ms;
 246         transition: opacity 200ms;
 247 }
 248
 249 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button:hover > .oo-ui-iconedElement-icon,
 250 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button:focus > .oo-ui-iconedElement-icon {
 251         opacity: 1;
 252 }
 253
 254 .oo-ui-buttonedElement-frameless.oo-ui-widget-disabled .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 255         opacity: 0.2;
 256 }
 257
 258 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 259         display: inline-block;
 260         vertical-align: middle;
 261         margin-left: 0.25em;
 262         color: #333;
 263 }
 264
 265 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button:hover > .oo-ui-labeledElement-label,
 266 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button:focus > .oo-ui-labeledElement-label {
 267         color: #000;
 268 }
 269
 270 .oo-ui-buttonedElement-frameless.oo-ui-widget-disabled .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 271         color: #ccc;
 272 }
 273
 274 /* OO.ui.ButtonWidget */
 275
 276 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
 277         display: inline-block;
 278         font-size: 1em;
 279         margin: 0.1em 0;
 280         padding: 0.2em 0.8em;
 281         border-radius: 0.3em;
 282         vertical-align: top;
 283         text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
 284         box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
 285         text-align: center;
 286
 287         /* Animation */
 288         -webkit-transition: border-color 100ms;
 289         -moz-transition: border-color 100ms;
 290         -o-transition: border-color 100ms;
 291         transition: border-color 100ms;
 292
 293         /* Gray */
 294         border: 1px #c9c9c9 solid;
 295         background-color: #dddddd;
 296         filter: progid:DXImageTransform.Microsoft.gradient(
 297                 GradientType=0,startColorstr=#ffffff, endColorstr=#dddddd
 298         );
 299         background-image: -webkit-gradient(
 300                 linear, right top, right bottom, color-stop(0%,#ffffff), color-stop(100%,#dddddd)
 301         );
 302         background-image: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 303         background-image: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 304         background-image: -ms-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 305         background-image: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 306         background-image: linear-gradient(top, #ffffff 0%, #dddddd 100%);
 307 }
 308
 309 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button:hover,
 310 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button:focus {
 311         border-color: #aaa;
 312 }
 313
 314 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button:active,
 315 .oo-ui-buttonedElement-framed.oo-ui-buttonedElement-active .oo-ui-buttonedElement-button {
 316         box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
 317         color: black;
 318
 319         /* Gray */
 320         border-color: #c9c9c9;
 321         background-color: #dddddd;
 322         filter: progid:DXImageTransform.Microsoft.gradient(
 323                 GradientType=0,startColorstr=#dddddd, endColorstr=#ffffff
 324         );
 325         background-image: -webkit-gradient(
 326                 linear, right top, right bottom, color-stop(0%,#dddddd), color-stop(100%,#ffffff)
 327         );
 328         background-image: -webkit-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 329         background-image: -moz-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 330         background-image: -ms-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 331         background-image: -o-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 332         background-image: linear-gradient(top, #dddddd 0%, #ffffff 100%);
 333 }
 334
 335 .oo-ui-buttonedElement-framed.oo-ui-iconedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 336         margin-left: -0.5em;
 337         margin-right: -0.5em;
 338 }
 339
 340 .oo-ui-buttonedElement-framed.oo-ui-iconedElement.oo-ui-labeledElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 341         margin-left: -0.5em;
 342         margin-right: 0;
 343 }
 344
 345 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 346         display: inline-block;
 347         vertical-align: middle;
 348         line-height: 1.9em;
 349 }
 350
 351 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-destructive .oo-ui-buttonedElement-button {
 352         /* Red text */
 353         color: #d45353;
 354 }
 355
 356 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive .oo-ui-buttonedElement-button {
 357         /* Green */
 358         border: solid 1px #b8d892;
 359         background-color: #f0fbe1;
 360         filter: progid:DXImageTransform.Microsoft.gradient(
 361                 GradientType=0,startColorstr=#f0fbe1, endColorstr=#c3e59a
 362         );
 363         background-image: -webkit-gradient(
 364                 linear, right top, right bottom, color-stop(0%,#f0fbe1), color-stop(100%,#c3e59a)
 365         );
 366         background-image: -webkit-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 367         background-image: -moz-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 368         background-image: -ms-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 369         background-image: -o-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 370         background-image: linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 371 }
 372
 373 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive .oo-ui-buttonedElement-button:hover,
 374 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive .oo-ui-buttonedElement-button:focus {
 375         border-color: #adcb89;
 376 }
 377
 378 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive .oo-ui-buttonedElement-button:active,
 379 .oo-ui-buttonedElement-framed.oo-ui-buttonedElement-active.oo-ui-flaggableElement-constructive .oo-ui-buttonedElement-button {
 380         /* Green */
 381         border: solid 1px #b8d892;
 382         background-color: #c3e59a;
 383         filter: progid:DXImageTransform.Microsoft.gradient(
 384                 GradientType=0,startColorstr=#c3e59a, endColorstr=#f0fbe1
 385         );
 386         background-image: -webkit-gradient(
 387                 linear, right top, right bottom, color-stop(0%,#c3e59a), color-stop(100%,#f0fbe1)
 388         );
 389         background-image: -webkit-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 390         background-image: -moz-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 391         background-image: -ms-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 392         background-image: -o-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 393         background-image: linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 394 }
 395
 396 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button {
 397         /* Blue */
 398         border: solid 1px #a6cee1;
 399         background-color: #eaf4fa;
 400         filter: progid:DXImageTransform.Microsoft.gradient(
 401                 GradientType=0,startColorstr=#eaf4fa, endColorstr=#b0d9ee
 402         );
 403         background-image: -webkit-gradient(
 404                 linear, right top, right bottom, color-stop(0%,#eaf4fa), color-stop(100%,#b0d9ee)
 405         );
 406         background-image: -webkit-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 407         background-image: -moz-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 408         background-image: -ms-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 409         background-image: -o-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 410         background-image: linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 411 }
 412
 413 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button:hover,
 414 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button:focus {
 415         border-color: #9dc2d4;
 416 }
 417
 418 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button:active,
 419 .oo-ui-buttonedElement-framed.oo-ui-buttonedElement-active.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button {
 420         /* Blue */
 421         border: solid 1px #a6cee1;
 422         background-color: #b0d9ee;
 423         filter: progid:DXImageTransform.Microsoft.gradient(
 424                 GradientType=0,startColorstr=#b0d9ee, endColorstr=#eaf4fa
 425         );
 426         background-image: -webkit-gradient(
 427                 linear, right top, right bottom, color-stop(0%,#b0d9ee), color-stop(100%,#eaf4fa)
 428         );
 429         background-image: -webkit-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 430         background-image: -moz-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 431         background-image: -ms-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 432         background-image: -o-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 433         background-image: linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 434 }
 435
 436 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button,
 437 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button:active,
 438 .oo-ui-buttonedElement-framed.oo-ui-buttonedElement-active.oo-ui-widget-disabled .oo-ui-buttonedElement-button:active {
 439         opacity: 0.5;
 440         cursor: default;
 441         box-shadow: none;
 442         color: #333;
 443         background: #eee;
 444 }
 445
 446 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button:hover,
 447 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button:focus {
 448         border-color: #ccc;
 449         box-shadow: none;
 450 }
 451
 452 /* OO.ui.LabeledElement */
 453
 454 .oo-ui-labeledElement-label {
 455         display: block;
 456 }
 457
 458 .oo-ui-clippableElement-clippable {
 459         -webkit-box-sizing: border-box;
 460         -moz-box-sizing: border-box;
 461         box-sizing: border-box;
 462 }
 463 .oo-ui-frame {
 464         margin: 0;
 465         padding: 0;
 466 }
 467
 468 .oo-ui-frame-body {
 469         margin: 0;
 470         padding: 0;
 471         background: none;
 472 }
 473
 474 .oo-ui-frame-content {
 475         font-family: sans-serif;
 476         font-size: 0.8em;
 477 }
 478 /* OO.ui.GridLayout */
 479 /* OO.ui.PanelLayout */
 480
 481 .oo-ui-gridLayout,
 482 .oo-ui-panelLayout {
 483         position: absolute;
 484         top: 0;
 485         left: 0;
 486         right: 0;
 487         bottom: 0;
 488 }
 489
 490 .oo-ui-panelLayout-scrollable {
 491         overflow-y: auto;
 492 }
 493
 494 .oo-ui-panelLayout-padded {
 495         padding: 2em;
 496 }
 497
 498 /* OO.ui.FieldsetLayout */
 499
 500 .oo-ui-fieldsetLayout {
 501         border: none;
 502         margin: 0;
 503         padding: 0;
 504 }
 505
 506 .oo-ui-fieldsetLayout + .oo-ui-fieldsetLayout {
 507         margin-top: 2em;
 508 }
 509
 510 .oo-ui-fieldsetLayout-labeled {
 511         margin-top: -0.75em;
 512 }
 513
 514 .oo-ui-fieldsetLayout > legend.oo-ui-labeledElement-label {
 515         font-size: 1.5em;
 516         margin-bottom: 0.5em;
 517 }
 518
 519 .oo-ui-fieldsetLayout-decorated > legend.oo-ui-labeledElement-label {
 520         padding-left: 1.75em;
 521         background-position: left center;
 522         background-repeat: no-repeat;
 523 }
 524
 525 /* OO.ui.BookletLayout */
 526
 527 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout {
 528         padding: 1.5em;
 529         width: 100%;
 530         -webkit-box-sizing: border-box;
 531         -moz-box-sizing: border-box;
 532         box-sizing: border-box;
 533 }
 534
 535 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-scrollable {
 536         overflow-y: auto;
 537 }
 538
 539 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-padded {
 540         padding: 2em;
 541 }
 542
 543 .oo-ui-bookletLayout-outlinePanel {
 544         border-right: solid 1px #ddd;
 545 }
 546
 547 .oo-ui-bookletLayout-outlinePanel-editable .oo-ui-outlineWidget {
 548         position: absolute;
 549         top: 0;
 550         left: 0;
 551         right: 0;
 552         bottom: 3em;
 553         overflow-y: auto;
 554 }
 555
 556 .oo-ui-bookletLayout-outlinePanel .oo-ui-outlineControlsWidget {
 557         position: absolute;
 558         bottom: 0;
 559         left: 0;
 560         right: 0;
 561         box-shadow: 0 0 0.25em rgba(0,0,0,0.25);
 562 }
 563
 564 .oo-ui-stackLayout > .oo-ui-panelLayout {
 565         display: none;
 566 }
 567
 568 .oo-ui-stackLayout-continuous > .oo-ui-panelLayout {
 569         display: block;
 570         position: relative;
 571         margin-bottom: 1em;
 572         box-shadow: 0 0 0.5em rgba(0,0,0,0.25);
 573 }
 574
 575 .oo-ui-stackLayout-continuous > .oo-ui-panelLayout:last-child {
 576         margin-bottom: 0;
 577 }
 578 /* OO.ui.PopupTool */
 579
 580 .oo-ui-popupTool .oo-ui-popupWidget {
 581         margin-left: 1.25em;
 582         font-size: 0.8em;
 583 }
 584
 585 .oo-ui-popupTool .oo-ui-popupWidget-popup,
 586 .oo-ui-popupTool .oo-ui-popupWidget-tail {
 587         z-index: 4;
 588 }
 589 .oo-ui-toolbar {
 590         clear: both;
 591 }
 592
 593 .oo-ui-toolbar-bar {
 594         border-bottom: solid 1px #ccc;
 595         background-color: white;
 596         /* @embed */
 597         background-image: url(images/fade-up.png);
 598         background-position: left bottom;
 599         background-repeat: repeat-x;
 600         padding-bottom: 1px;
 601         line-height: 1em;
 602 }
 603
 604 .oo-ui-toolbar-bar .oo-ui-toolbar-bar {
 605         border: none;
 606         background: none;
 607 }
 608
 609 .oo-ui-toolbar-bottom .oo-ui-toolbar-bar {
 610         position: absolute;
 611 }
 612
 613 .oo-ui-toolbar-actions {
 614         float: right;
 615 }
 616
 617 .oo-ui-toolbar-tools {
 618         float: left;
 619 }
 620
 621 .oo-ui-toolbar-tools,
 622 .oo-ui-toolbar-actions,
 623 .oo-ui-toolbar-shadow {
 624         -webkit-user-select: none;
 625         -moz-user-select: none;
 626         -ms-user-select: none;
 627         -o-user-select: none;
 628         user-select: none;
 629 }
 630
 631 .oo-ui-toolbar-actions .oo-ui-popupWidget {
 632         -webkit-touch-callout: default;
 633         -webkit-user-select: all;
 634         -moz-user-select: all;
 635         -ms-user-select: all;
 636         user-select: all;
 637 }
 638
 639 .oo-ui-toolbar-shadow {
 640         /* @embed */
 641         background-image: url(images/toolbar-shadow.png);
 642         background-position: left top;
 643         background-repeat: repeat-x;
 644         position: absolute;
 645         bottom: -9px;
 646         height: 9px;
 647         width: 100%;
 648         pointer-events: none;
 649         -webkit-transition: opacity 500ms ease-in-out;
 650         -moz-transition: opacity 500ms ease-in-out;
 651         -o-transition: opacity 500ms ease-in-out;
 652         transition: opacity 500ms ease-in-out;
 653         opacity: 0.125;
 654 }
 655 /* OO.ui.ToolGroup */
 656
 657 .oo-ui-toolGroup {
 658         display: inline-block;
 659         margin: 0.3em;
 660         vertical-align: middle;
 661         border-radius: 0.25em;
 662         border: solid 1px transparent;
 663         -webkit-transition: border-color 300ms;
 664         -moz-transition: border-color 300ms;
 665         -o-transition: border-color 300ms;
 666         transition: border-color 300ms;
 667 }
 668
 669 .oo-ui-toolGroup:hover {
 670         border-color: rgba(0,0,0,0.1);
 671 }
 672
 673 .oo-ui-toolGroup-empty {
 674         display: none;
 675 }
 676
 677 .oo-ui-toolGroup .oo-ui-tool-link .oo-ui-tool-title {
 678         color: #000;
 679 }
 680
 681 .oo-ui-toolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 682         background-position: center center;
 683         background-repeat: no-repeat;
 684 }
 685
 686 /* OO.ui.BarToolGroup */
 687
 688 .oo-ui-barToolGroup > .oo-ui-iconedElement-icon,
 689 .oo-ui-barToolGroup > .oo-ui-iconedElement-label {
 690         display: none;
 691 }
 692
 693 .oo-ui-barToolGroup .oo-ui-tool {
 694         display: inline-block;
 695         position: relative;
 696         vertical-align: top;
 697         margin: -1px 0 -1px -1px;
 698         border: solid 1px transparent;
 699 }
 700
 701 .oo-ui-barToolGroup .oo-ui-tool-link {
 702         display: block;
 703         height: 1.5em;
 704         padding: 0.25em;
 705         cursor: pointer;
 706 }
 707
 708 .oo-ui-barToolGroup
 709         .oo-ui-tool-active:not(.oo-ui-widget-disabled) +
 710         .oo-ui-tool-active:not(.oo-ui-widget-disabled)
 711 {
 712         border-left-color: rgba(0,0,0,0.1);
 713 }
 714
 715 .oo-ui-barToolGroup .oo-ui-tool:first-child {
 716         border-top-left-radius: 0.25em;
 717         border-bottom-left-radius: 0.25em;
 718 }
 719
 720 .oo-ui-barToolGroup .oo-ui-tool:last-child {
 721         margin-right: -1px;
 722         border-top-right-radius: 0.25em;
 723         border-bottom-right-radius: 0.25em;
 724 }
 725
 726 .oo-ui-barToolGroup .oo-ui-tool:hover:not(.oo-ui-widget-disabled) {
 727         border-color: rgba(0,0,0,0.2);
 728 }
 729
 730 .oo-ui-barToolGroup .oo-ui-tool-active:not(.oo-ui-widget-disabled) {
 731         border-color: rgba(0,0,0,0.2);
 732 }
 733
 734 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 735         display: block;
 736         height: 1.5em;
 737         width: 1.5em;
 738         opacity: 0.8;
 739 }
 740
 741 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-tool-title {
 742         display: none;
 743 }
 744
 745 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
 746         cursor: default;
 747 }
 748
 749 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 750         opacity: 0.2;
 751 }
 752
 753 .oo-ui-barToolGroup .oo-ui-tool:not(.oo-ui-widget-disabled) .oo-ui-tool-link .oo-ui-iconedElement-icon {
 754         opacity: 0.8;
 755 }
 756
 757 .oo-ui-barToolGroup .oo-ui-tool:hover:not(.oo-ui-widget-disabled) .oo-ui-tool-link .oo-ui-iconedElement-icon {
 758         opacity: 1;
 759 }
 760
 761 .oo-ui-barToolGroup .oo-ui-tool-title {
 762         display: none;
 763 }
 764
 765 /* OO.ui.PopupToolGroup */
 766
 767 .oo-ui-popupToolGroup {
 768         position: relative;
 769         height: 2em;
 770         min-width: 2.5em;
 771 }
 772
 773 .oo-ui-popupToolGroup.oo-ui-indicatedElement.oo-ui-iconedElement {
 774         min-width: 3.5em;
 775 }
 776
 777 .oo-ui-popupToolGroup-handle {
 778         display: block;
 779         cursor: pointer;
 780 }
 781
 782 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator,
 783 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
 784         position: absolute;
 785         top: 0;
 786         width: 2em;
 787         height: 2em;
 788         background-position: center center;
 789         background-repeat: no-repeat;
 790         opacity: 0.8;
 791 }
 792
 793 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator {
 794         right: 0;
 795 }
 796
 797 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
 798         left: 0.25em;
 799 }
 800
 801 .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
 802         line-height: 2.6em;
 803         font-size: 0.8em;
 804         margin: 0 1em;
 805 }
 806
 807 .oo-ui-popupToolGroup.oo-ui-iconedElement .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
 808         margin-left: 3.25em;
 809 }
 810
 811 .oo-ui-popupToolGroup.oo-ui-indicatedElement .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
 812         margin-right: 2.25em;
 813 }
 814
 815 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
 816         display: none;
 817         position: absolute;
 818         top: 2em;
 819         left: -1px;
 820         z-index: 4;
 821         border: solid 1px #ccc;
 822         background-color: white;
 823         box-shadow: 0 0.25em 1em rgba(0,0,0,0.25);
 824 }
 825
 826 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools .oo-ui-iconedElement-icon {
 827         background-repeat: no-repeat;
 828         background-position: center center;
 829 }
 830
 831 .oo-ui-popupToolGroup-active:not(.oo-ui-widget-disabled) > .oo-ui-toolGroup-tools {
 832         display: block;
 833 }
 834
 835 .oo-ui-popupToolGroup-active:not(.oo-ui-widget-disabled) {
 836         border-bottom-left-radius: 0;
 837         border-bottom-right-radius: 0;
 838 }
 839
 840 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 841         display: inline-block;
 842         vertical-align: middle;
 843         height: 2em;
 844         width: 2em;
 845         margin-right: 0.5em;
 846 }
 847
 848 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title {
 849         display: inline-block;
 850         vertical-align: middle;
 851         line-height: 2em;
 852         font-size: 0.8em;
 853 }
 854
 855 .oo-ui-popupToolGroup .oo-ui-tool-accel {
 856         display: none;
 857 }
 858
 859 /* OO.ui.ListToolGroup */
 860
 861 .oo-ui-listToolGroup .oo-ui-toolGroup-tools {
 862         padding: 0.25em;
 863 }
 864
 865 .oo-ui-listToolGroup .oo-ui-tool {
 866         display: inline-block;
 867         width: 100%;
 868         -webkit-box-sizing: border-box;
 869         -moz-box-sizing: border-box;
 870         box-sizing: border-box;
 871         border: solid 1px transparent;
 872         margin: -1px 0;
 873 }
 874
 875 .oo-ui-listToolGroup .oo-ui-tool-link {
 876         display: block;
 877         cursor: pointer;
 878         white-space: nowrap;
 879         padding-right: 0.5em;
 880 }
 881
 882 .oo-ui-listToolGroup.oo-ui-popupToolGroup-active {
 883         border-color: rgba(0,0,0,0.2);
 884 }
 885
 886 .oo-ui-listToolGroup
 887         .oo-ui-tool-active:not(.oo-ui-widget-disabled) +
 888         .oo-ui-tool-active:not(.oo-ui-widget-disabled)
 889 {
 890         border-top-color: rgba(0,0,0,0.1);
 891 }
 892
 893 .oo-ui-listToolGroup .oo-ui-tool:hover:not(.oo-ui-widget-disabled) {
 894         border-color: rgba(0,0,0,0.2);
 895 }
 896
 897 .oo-ui-listToolGroup .oo-ui-tool-active:not(.oo-ui-widget-disabled) {
 898         border-color: rgba(0,0,0,0.2);
 899 }
 900
 901 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
 902         cursor: default;
 903 }
 904
 905 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title {
 906         color: #ccc;
 907 }
 908
 909 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 910         opacity: 0.2;
 911 }
 912
 913 .oo-ui-listToolGroup .oo-ui-tool:not(.oo-ui-widget-disabled) .oo-ui-tool-link .oo-ui-iconedElement-icon {
 914         opacity: 0.8;
 915 }
 916
 917 .oo-ui-listToolGroup .oo-ui-tool:hover:not(.oo-ui-widget-disabled) .oo-ui-tool-link .oo-ui-iconedElement-icon {
 918         opacity: 1;
 919 }
 920
 921 /* OO.ui.MenuToolGroup */
 922
 923 .oo-ui-menuToolGroup {
 924         border-color: rgba(0,0,0,0.1);
 925 }
 926
 927 .oo-ui-menuToolGroup:hover {
 928         border-color: rgba(0,0,0,0.2);
 929 }
 930
 931 .oo-ui-menuToolGroup.oo-ui-popupToolGroup-active {
 932         border-color: rgba(0,0,0,0.25);
 933 }
 934
 935 .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle {
 936         min-width: 8em;
 937 }
 938
 939 .oo-ui-menuToolGroup .oo-ui-tool {
 940         display: block;
 941 }
 942
 943 .oo-ui-menuToolGroup .oo-ui-tool-link {
 944         display: block;
 945         cursor: pointer;
 946         white-space: nowrap;
 947         padding: 0.25em 1em 0.25em 0.25em;
 948 }
 949
 950 .oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 951         background-image: none;
 952 }
 953
 954 .oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconedElement-icon {
 955         /* @embed */
 956         background-image: url(images/icons/check.png);
 957 }
 958
 959 .oo-ui-menuToolGroup .oo-ui-tool:hover {
 960         background-color: #e1f3ff;
 961 }
 962
 963 /* Common */
 964
 965 .oo-ui-barToolGroup .oo-ui-tool-active:not(.oo-ui-widget-disabled),
 966 .oo-ui-listToolGroup .oo-ui-tool-active:not(.oo-ui-widget-disabled),
 967 .oo-ui-popupToolGroup-active:not(.oo-ui-widget-disabled) {
 968         /* @embed */
 969         background-image: url(images/fade-down.png);
 970         background-position: left top;
 971         background-repeat: repeat-x;
 972         box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 973 }
 974 /* OO.ui.ButtonWidget */
 975
 976 .oo-ui-buttonWidget {
 977         display: inline-block;
 978         vertical-align: middle;
 979 }
 980
 981 /* OO.ui.PopupButtonWidget */
 982
 983 .oo-ui-popupButtonWidget {
 984         position: relative;
 985 }
 986
 987 .oo-ui-popupButtonWidget .oo-ui-popupWidget {
 988         position: absolute;
 989         left: 1em;
 990         cursor: auto;
 991 }
 992
 993 /* OO.ui.ButtonGroupWidget */
 994
 995 .oo-ui-buttonGroupWidget {
 996         display: inline-block;
 997         border-radius: 0.3em;
 998         box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
 999 }
1000
1001 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
1002         border-radius: 0;
1003         margin-bottom: -1px;
1004         margin-left: -1px;
1005         box-shadow: none;
1006 }
1007
1008 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:first-child .oo-ui-buttonedElement-button {
1009         border-bottom-left-radius: 0.3em;
1010         border-top-left-radius: 0.3em;
1011         margin-left: 0;
1012 }
1013
1014 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:last-child .oo-ui-buttonedElement-button {
1015         border-bottom-right-radius: 0.3em;
1016         border-top-right-radius: 0.3em;
1017 }
1018
1019 /* OO.ui.SelectWidget */
1020
1021 .oo-ui-selectWidget {
1022         list-style: none;
1023         margin: 0;
1024         padding: 0;
1025 }
1026
1027 /* OO.ui.OptionWidget */
1028
1029 .oo-ui-optionWidget {
1030         position: relative;
1031         display: block;
1032         border: none;
1033         list-style: none;
1034         margin: 0;
1035         padding: 0.5em 2em 0.5em 3em;
1036         cursor: pointer;
1037 }
1038
1039 .oo-ui-optionWidget .oo-ui-labeledElement-label {
1040         line-height: 1.5em;
1041         white-space: nowrap;
1042         text-overflow: ellipsis;
1043         overflow: hidden;
1044 }
1045
1046 .oo-ui-optionWidget-highlighted {
1047         background-color: #e1f3ff;
1048 }
1049
1050 .oo-ui-optionWidget-selected {
1051         background-color: #a7dcff;
1052 }
1053
1054 .oo-ui-optionWidget.oo-ui-widget-disabled {
1055         cursor: default;
1056 }
1057
1058 .oo-ui-optionWidget .oo-ui-iconedElement-icon,
1059 .oo-ui-optionWidget .oo-ui-indicatedElement-indicator {
1060         position: absolute;
1061         top: 50%;
1062         width: 2em;
1063         height: 2em;
1064         margin-top: -1em;
1065         background-repeat: no-repeat;
1066         background-position: center center;
1067 }
1068
1069 .oo-ui-optionWidget .oo-ui-iconedElement-icon {
1070         left: 0.5em;
1071 }
1072
1073 .oo-ui-optionWidget .oo-ui-indicatedElement-indicator {
1074         right: 0.5em;
1075 }
1076
1077 /* OO.ui.OutlineItemWidget */
1078
1079 .oo-ui-outlineItemWidget {
1080         position: relative;
1081         padding: 0.75em 0.75em 0.75em 3.5em;
1082         -webkit-user-select: none;
1083         -moz-user-select: none;
1084         -ms-user-select: none;
1085         user-select: none;
1086         cursor: pointer;
1087         font-size: 1.1em;
1088 }
1089
1090 .oo-ui-outlineItemWidget-level-1 {
1091         padding-left: 5em;
1092 }
1093
1094 .oo-ui-outlineItemWidget-level-2 {
1095         padding-left: 6.5em;
1096 }
1097
1098 .oo-ui-outlineItemWidget.oo-ui-optionWidget-selected {
1099         background-color: #a7dcff;
1100         text-shadow: 0 1px 1px rgba(255,255,255,0.5);
1101 }
1102
1103 .oo-ui-outlineItemWidget-level-0 .oo-ui-iconedElement-icon {
1104         left: 1em;
1105 }
1106
1107 .oo-ui-outlineItemWidget-level-1 .oo-ui-iconedElement-icon {
1108         left: 2.5em;
1109 }
1110
1111 .oo-ui-outlineItemWidget-level-2 .oo-ui-iconedElement-icon {
1112         left: 4em;
1113 }
1114
1115 /* OO.ui.OutlineControlsWidget */
1116
1117 .oo-ui-outlineControlsWidget {
1118         height: 3em;
1119         background-color: #fff;
1120 }
1121
1122 .oo-ui-outlineControlsWidget-adders,
1123 .oo-ui-outlineControlsWidget-movers {
1124         float: left;
1125         -webkit-box-sizing: border-box;
1126         -moz-box-sizing: border-box;
1127         box-sizing: border-box;
1128         height: 3em;
1129         padding: 0.5em;
1130 }
1131
1132 .oo-ui-outlineControlsWidget-adders {
1133         float: left;
1134 }
1135 .oo-ui-outlineControlsWidget-movers {
1136         float: right;
1137 }
1138
1139 .oo-ui-outlineControlsWidget-adders .oo-ui-buttonWidget {
1140         float: left;
1141 }
1142
1143 .oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget {
1144         float: right;
1145 }
1146
1147 .oo-ui-outlineControlsWidget-adders .oo-ui-buttonWidget:first-child,
1148 .oo-ui-outlineControlsWidget-adders .oo-ui-buttonWidget:first-child:hover {
1149         opacity: 0.25;
1150         cursor: default;
1151 }
1152
1153 /* OO.ui.InputLabelWidget */
1154
1155 .oo-ui-inputLabelWidget {
1156         padding: 0.5em 0;
1157 }
1158
1159 /* OO.ui.TextInputWidget */
1160
1161 .oo-ui-textInputWidget {
1162         -webkit-box-sizing: border-box;
1163         -moz-box-sizing: border-box;
1164         box-sizing: border-box;
1165         width: 20em;
1166         position: relative;
1167 }
1168
1169 .oo-ui-textInputWidget input,
1170 .oo-ui-textInputWidget input:focus[readonly],
1171 .oo-ui-widget-disabled.oo-ui-textInputWidget input:focus,
1172 .oo-ui-textInputWidget textarea,
1173 .oo-ui-textInputWidget textarea:focus[readonly],
1174 .oo-ui-widget-disabled.oo-ui-textInputWidget textarea:focus {
1175         display: inline-block;
1176         font-size: 1em;
1177         font-family: sans-serif;
1178         background-color: #f7f7f7;
1179         border: solid 1px #ccc;
1180         box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd;
1181         padding: 0.5em;
1182         border-radius: 0.25em;
1183         -webkit-box-sizing: border-box;
1184         -moz-box-sizing: border-box;
1185         box-sizing: border-box;
1186         width: 100%;
1187         resize: none;
1188
1189         /* Animation */
1190         -webkit-transition: border-color 200ms, box-shadow 200ms, background-color 200ms;
1191         -moz-transition: border-color 200ms, box-shadow 200ms, background-color 200ms;
1192         -o-transition: border-color 200ms, box-shadow 200ms, background-color 200ms;
1193         transition: border-color 200ms, box-shadow 200ms, background-color 200ms;
1194 }
1195
1196 .oo-ui-textInputWidget-pending input,
1197 .oo-ui-textInputWidget-pending textarea {
1198         background-color: transparent;
1199 }
1200
1201 .oo-ui-textInputWidget input:focus,
1202 .oo-ui-textInputWidget textarea:focus {
1203         outline: none;
1204         border-color: #a7dcff;
1205         box-shadow: 0 0 0.3em #a7dcff, 0 0 0 white;
1206         background-color: #fff;
1207 }
1208
1209 .oo-ui-textInputWidget input[readonly],
1210 .oo-ui-textInputWidget textarea[readonly] {
1211         color: #777;
1212         text-shadow: 0 1px 1px #fff;
1213 }
1214
1215 .oo-ui-widget-disabled.oo-ui-textInputWidget input,
1216 .oo-ui-widget-disabled.oo-ui-textInputWidget input:focus,
1217 .oo-ui-widget-disabled.oo-ui-textInputWidget textarea,
1218 .oo-ui-widget-disabled.oo-ui-textInputWidget textarea:focus {
1219         color: #ccc;
1220         text-shadow: 0 1px 1px #fff;
1221 }
1222
1223 .oo-ui-textInputWidget-decorated input,
1224 .oo-ui-textInputWidget-decorated textarea {
1225         padding-left: 2em;
1226 }
1227
1228 .oo-ui-textInputWidget-icon {
1229         position: absolute;
1230         top: 0;
1231         left: 0;
1232         width: 2em;
1233         height: 100%;
1234         background-position: right center;
1235         background-repeat: no-repeat;
1236 }
1237
1238 /* OO.ui.CheckboxWidget */
1239 .oo-ui-checkboxWidget .oo-ui-labeledElement-label {
1240         display: inline-block;
1241         vertical-align: middle;
1242         padding-left: 0.5em;
1243 }
1244
1245 .oo-ui-checkboxWidget input {
1246         vertical-align: middle;
1247 }
1248
1249 .oo-ui-checkboxWidget.oo-ui-widget-disabled .oo-ui-labeledElement-label {
1250         opacity: 0.5;
1251 }
1252
1253 /* OO.ui.MenuWidget */
1254
1255 .oo-ui-menuWidget {
1256         position: absolute;
1257         background: #fff;
1258         margin-top: -1px;
1259         border: solid 1px #ccc;
1260         border-radius: 0 0 0.25em 0.25em;
1261         box-shadow: 0 0.15em 1em 0 rgba(0, 0, 0, 0.2);
1262 }
1263
1264 .oo-ui-menuWidget input {
1265         position: absolute;
1266         width: 0;
1267         height: 0;
1268         overflow: hidden;
1269         opacity: 0;
1270 }
1271
1272 /* OO.ui.MenuItemWidget */
1273
1274 .oo-ui-menuItemWidget {
1275         position: relative;
1276 }
1277
1278 .oo-ui-menuItemWidget .oo-ui-iconedElement-icon {
1279         display: none;
1280 }
1281
1282 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected .oo-ui-iconedElement-icon {
1283         display: block;
1284 }
1285
1286 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
1287         background-color: transparent;
1288 }
1289
1290 .oo-ui-menuItemWidget.oo-ui-optionWidget-highlighted {
1291         background-color: #e1f3ff;
1292 }
1293
1294 /* OO.ui.MenuSectionItemWidget */
1295
1296 .oo-ui-menuSectionItemWidget {
1297         padding: 0.33em 0.75em;
1298         color: #888;
1299         cursor: default;
1300 }
1301
1302 /* OO.ui.ButtonSelectWidget */
1303
1304 .oo-ui-buttonSelectWidget {
1305         display: inline-block;
1306         border-radius: 0.3em;
1307         box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
1308 }
1309
1310 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
1311         border-radius: 0;
1312         margin-left: -1px;
1313         box-shadow: none;
1314 }
1315
1316 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonedElement-button {
1317         border-bottom-left-radius: 0.3em;
1318         border-top-left-radius: 0.3em;
1319         margin-left: 0;
1320 }
1321
1322 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:last-child .oo-ui-buttonedElement-button {
1323         border-bottom-right-radius: 0.3em;
1324         border-top-right-radius: 0.3em;
1325 }
1326
1327 /* OO.ui.ButtonOptionWidget */
1328
1329 .oo-ui-buttonOptionWidget {
1330         display: inline-block;
1331         padding: 0;
1332         background-color: transparent;
1333 }
1334
1335 .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
1336         position: relative;
1337         height: 1.9em;
1338 }
1339
1340 .oo-ui-buttonOptionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon,
1341 .oo-ui-buttonOptionWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
1342         position: static;
1343         display: inline-block;
1344         vertical-align: middle;
1345         height: 1.9em;
1346         margin-top: 0;
1347 }
1348
1349 /* OO.ui.PopupWidget */
1350
1351 .oo-ui-popupWidget-popup {
1352         position: absolute;
1353         overflow: hidden;
1354         border: solid 1px #ccc;
1355         border-radius: 0.25em;
1356         background-color: #fff;
1357         box-shadow: 0 0.15em 0.5em 0 rgba(0, 0, 0, 0.2);
1358 }
1359
1360 .oo-ui-popupWidget-tail {
1361         display: none;
1362 }
1363
1364 .oo-ui-popupWidget-tailed .oo-ui-popupWidget-popup {
1365         margin-top: 7px;
1366 }
1367
1368 .oo-ui-popupWidget-tailed .oo-ui-popupWidget-tail {
1369         display: block;
1370         position: absolute;
1371         /* @embed */
1372         background-image: url(images/tail.svg);
1373         background-repeat: no-repeat;
1374         width: 15px;
1375         height: 8px;
1376         margin-left: -7px;
1377 }
1378
1379 .oo-ui-popupWidget-transitioning .oo-ui-popupWidget-popup {
1380         -webkit-transition: width 100ms, height 100ms, left 100ms;
1381         -moz-transition: width 100ms, height 100ms, left 100ms;
1382         -o-transition: width 100ms, height 100ms, left 100ms;
1383         transition: width 100ms, height 100ms, left 100ms;
1384         -webkit-transition-timing-function: ease-in-out;
1385         -moz-transition-timing-function: ease-in-out;
1386         -o-transition-timing-function: ease-in-out;
1387         transition-timing-function: ease-in-out;
1388 }
1389
1390 .oo-ui-popupWidget-head {
1391         height: 2.5em;
1392         -webkit-touch-callout: none;
1393         -webkit-user-select: none;
1394         -moz-user-select: none;
1395         -ms-user-select: none;
1396         user-select: none;
1397 }
1398
1399 .oo-ui-popupWidget-head .oo-ui-buttonWidget {
1400         float: right;
1401         margin: 0.25em;
1402 }
1403
1404 .oo-ui-popupWidget-head .oo-ui-labeledElement-label {
1405         float: left;
1406         margin: 0.75em 1em;
1407         cursor: default;
1408 }
1409
1410 .oo-ui-popupWidget-body {
1411         box-shadow: 0 0 0.66em rgba(0,0,0,0.25);
1412 }
1413
1414 /* OO.ui.SearchWidget */
1415
1416 .oo-ui-searchWidget-query {
1417         position: absolute;
1418         top: 0;
1419         left: 0;
1420         right: 0;
1421         height: 4em;
1422         padding: 0 1em;
1423         box-shadow: 0 0 0.5em rgba(0,0,0,0.2);
1424 }
1425
1426 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
1427         width: 100%;
1428         margin: 0.75em 0;
1429 }
1430
1431 .oo-ui-searchWidget-results {
1432         position: absolute;
1433         top: 4em;
1434         bottom: 0;
1435         left: 0;
1436         right: 0;
1437         padding: 1em;
1438         overflow-x: hidden;
1439         overflow-y: auto;
1440         line-height: 0;
1441 }
1442
1443 /* OO.ui.ToggleSwitchWidget */
1444
1445 .oo-ui-toggleSwitchWidget {
1446         position: relative;
1447         display: inline-block;
1448         vertical-align: middle;
1449         height: 2em;
1450         width: 3em;
1451         border-radius: 1em;
1452         overflow: hidden;
1453         box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd;
1454         border: solid 1px #ccc;
1455         cursor: pointer;
1456         -webkit-box-sizing: border-box;
1457         -moz-box-sizing: border-box;
1458         box-sizing: border-box;
1459         -webkit-transform: translateZ(0px);
1460         -moz-transform: translateZ(0px);
1461         -ms-transform: translateZ(0px);
1462         -o-transform: translateZ(0px);
1463         transform: translateZ(0px);
1464
1465         /* Gray */
1466         background-color: #dddddd;
1467         filter: progid:DXImageTransform.Microsoft.gradient(
1468                 GradientType=0,startColorstr=#dddddd, endColorstr=#ffffff
1469         );
1470         background-image: -webkit-gradient(
1471                 linear, right top, right bottom, color-stop(0%,#dddddd), color-stop(100%,#ffffff)
1472         );
1473         background-image: -webkit-linear-gradient(top, #dddddd 0%, #ffffff 100%);
1474         background-image: -moz-linear-gradient(top, #dddddd 0%, #ffffff 100%);
1475         background-image: -ms-linear-gradient(top, #dddddd 0%, #ffffff 100%);
1476         background-image: -o-linear-gradient(top, #dddddd 0%, #ffffff 100%);
1477         background-image: linear-gradient(top, #dddddd 0%, #ffffff 100%);
1478 }
1479
1480 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
1481         opacity: 0.5;
1482 }
1483
1484 .oo-ui-toggleSwitchWidget-grip {
1485         -webkit-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1486         -moz-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1487         -o-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1488         transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1489 }
1490
1491 .oo-ui-toggleSwitchWidget-grip {
1492         position: absolute;
1493         display: block;
1494         top: 0.25em;
1495         left: 0.25em;
1496         width: 1.5em;
1497         height: 1.5em;
1498         border-radius: 1em;
1499         box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
1500         -webkit-box-sizing: border-box;
1501         -moz-box-sizing: border-box;
1502         box-sizing: border-box;
1503
1504         /* Gray */
1505         border: 1px #c9c9c9 solid;
1506         background-color: #ffffff;
1507         filter: progid:DXImageTransform.Microsoft.gradient(
1508                 GradientType=0,startColorstr=#ffffff, endColorstr=#dddddd
1509         );
1510         background-image: -webkit-gradient(
1511                 linear, right top, right bottom, color-stop(0%,#ffffff), color-stop(100%,#dddddd)
1512         );
1513         background-image: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 100%);
1514         background-image: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%);
1515         background-image: -ms-linear-gradient(top, #ffffff 0%, #dddddd 100%);
1516         background-image: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%);
1517         background-image: linear-gradient(top, #ffffff 0%, #dddddd 100%);
1518 }
1519
1520 .oo-ui-toggleSwitchWidget:not(.oo-ui-widget-disabled):hover,
1521 .oo-ui-toggleSwitchWidget:not(.oo-ui-widget-disabled):hover .oo-ui-toggleSwitchWidget-grip {
1522         border-color: #aaa;
1523 }
1524
1525 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
1526         left: 1.25em;
1527         margin-left: -2px;
1528 }
1529
1530 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
1531         left: 0.25em;
1532         margin-left: 0;
1533 }
1534
1535 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-on {
1536         position: absolute;
1537         top: 0;
1538         bottom: 0;
1539         right: 0;
1540         left: 0;
1541         border-radius: 1em;
1542         box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
1543         cursor: pointer;
1544         -webkit-touch-callout: none;
1545         -webkit-user-select: none;
1546         -moz-user-select: none;
1547         -ms-user-select: none;
1548         user-select: none;
1549
1550         -webkit-transition: opacity 200ms ease-in-out;
1551         -moz-transition: opacity 200ms ease-in-out;
1552         -o-transition: opacity 200ms ease-in-out;
1553         transition: opacity 200ms ease-in-out;
1554
1555         /* Blue */
1556         background-color: #eaf4fa;
1557         filter: progid:DXImageTransform.Microsoft.gradient(
1558                 GradientType=0,startColorstr=#b0d9ee, endColorstr=#eaf4fa
1559         );
1560         background-image: -webkit-gradient(
1561                 linear, right top, right bottom, color-stop(0%,#b0d9ee), color-stop(100%,#eaf4fa)
1562         );
1563         background-image: -webkit-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
1564         background-image: -moz-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
1565         background-image: -ms-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
1566         background-image: -o-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
1567         background-image: linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
1568 }
1569
1570 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-on {
1571         opacity: 1;
1572 }
1573
1574 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-on {
1575         opacity: 0;
1576 }
1577 .oo-ui-window-head {
1578         -webkit-touch-callout: none;
1579         -webkit-user-select: none;
1580         -moz-user-select: none;
1581         -ms-user-select: none;
1582         user-select: none;
1583 }
1584
1585 .oo-ui-window-body {
1586         padding: 0 0.75em;
1587 }
1588
1589 .oo-ui-window-icon {
1590         float: left;
1591         width: 2em;
1592         height: 2em;
1593         line-height: 2em;
1594         margin-right: 0.5em;
1595         background-position: right center;
1596         background-repeat: no-repeat;
1597 }
1598
1599 .oo-ui-window-title {
1600         float: left;
1601         line-height: 2em;
1602         color: #333;
1603         white-space: nowrap;
1604         cursor: default;
1605 }
1606
1607 .oo-ui-window-overlay {
1608         font-family: sans-serif;
1609         line-height: 1.5em;
1610         font-size: 1em;
1611         position: absolute;
1612         top: 0;
1613         left: 0;
1614 }
1615 /* Icons */
1616
1617 .oo-ui-icon-add-item {
1618         /* @embed */
1619         background-image: url(images/icons/add-item.png);
1620 }
1621
1622 .oo-ui-icon-advanced {
1623         /* @embed */
1624         background-image: url(images/icons/advanced.png);
1625 }
1626
1627 .oo-ui-icon-alert {
1628         /* @embed */
1629         background-image: url(images/icons/alert.png);
1630 }
1631
1632 .oo-ui-icon-check {
1633         /* @embed */
1634         background-image: url(images/icons/check.png);
1635 }
1636
1637 .oo-ui-icon-clear {
1638         /* @embed */
1639         background-image: url(images/icons/clear.png);
1640 }
1641
1642 .oo-ui-icon-close {
1643         /* @embed */
1644         background-image: url(images/icons/close.png);
1645 }
1646
1647 .oo-ui-icon-code {
1648         /* @embed */
1649         background-image: url(images/icons/code.png);
1650 }
1651
1652 .oo-ui-icon-collapse {
1653         /* @embed */
1654         background-image: url(images/icons/collapse.png);
1655 }
1656
1657 .oo-ui-icon-comment {
1658         /* @embed */
1659         background-image: url(images/icons/comment.png);
1660 }
1661
1662 .oo-ui-icon-expand {
1663         /* @embed */
1664         background-image: url(images/icons/expand.png);
1665 }
1666
1667 .oo-ui-icon-help {
1668         /* @embed */
1669         background-image: url(images/icons/help.png);
1670 }
1671
1672 .oo-ui-icon-link {
1673         /* @embed */
1674         background-image: url(images/icons/link.png);
1675 }
1676
1677 .oo-ui-icon-menu {
1678         /* @embed */
1679         background-image: url(images/icons/menu.png);
1680 }
1681
1682 .oo-ui-icon-next {
1683         /* @embed */
1684         background-image: url(images/icons/move-ltr.png);
1685 }
1686
1687 .oo-ui-icon-picture {
1688         /* @embed */
1689         background-image: url(images/icons/picture.png);
1690 }
1691
1692 .oo-ui-icon-previous {
1693         /* @embed */
1694         background-image: url(images/icons/move-rtl.png);
1695 }
1696
1697 .oo-ui-icon-redo {
1698         /* @embed */
1699         background-image: url(images/icons/arched-arrow-ltr.png);
1700 }
1701
1702 .oo-ui-icon-remove {
1703         /* @embed */
1704         background-image: url(images/icons/remove.png);
1705 }
1706
1707 .oo-ui-icon-search {
1708         /* @embed */
1709         background-image: url(images/icons/search.png);
1710 }
1711
1712 .oo-ui-icon-settings {
1713         /* @embed */
1714         background-image: url(images/icons/settings.png);
1715 }
1716
1717 .oo-ui-icon-tag {
1718         /* @embed */
1719         background-image: url(images/icons/tag.png);
1720 }
1721
1722 .oo-ui-icon-undo {
1723         /* @embed */
1724         background-image: url(images/icons/arched-arrow-rtl.png);
1725 }
1726
1727 .oo-ui-icon-window {
1728         /* @embed */
1729         background-image: url(images/icons/window.png);
1730 }
1731
1732 /* Indicators */
1733
1734 .oo-ui-indicator-down {
1735         /* @embed */
1736         background-image: url(images/indicators/down.png);
1737 }
1738
1739 .oo-ui-indicator-required {
1740         /* @embed */
1741         background-image: url(images/indicators/required.png);
1742 }
1743
1744 .oo-ui-indicator-up {
1745         /* @embed */
1746         background-image: url(images/indicators/up.png);
1747 }
1748 /* Icons */
1749
1750 .oo-ui-icon-add-item {
1751         /* @embed */
1752         background-image: url(images/icons/add-item.svg);
1753 }
1754
1755 .oo-ui-icon-advanced {
1756         /* @embed */
1757         background-image: url(images/icons/advanced.svg);
1758 }
1759
1760 .oo-ui-icon-alert {
1761         /* @embed */
1762         background-image: url(images/icons/alert.svg);
1763 }
1764
1765 .oo-ui-icon-check {
1766         /* @embed */
1767         background-image: url(images/icons/check.svg);
1768 }
1769
1770 .oo-ui-icon-clear {
1771         /* @embed */
1772         background-image: url(images/icons/clear.svg);
1773 }
1774
1775 .oo-ui-icon-close {
1776         /* @embed */
1777         background-image: url(images/icons/close.svg);
1778 }
1779
1780 .oo-ui-icon-code {
1781         /* @embed */
1782         background-image: url(images/icons/code.svg);
1783 }
1784
1785 .oo-ui-icon-collapse {
1786         /* @embed */
1787         background-image: url(images/icons/collapse.svg);
1788 }
1789
1790 .oo-ui-icon-comment {
1791         /* @embed */
1792         background-image: url(images/icons/comment.svg);
1793 }
1794
1795 .oo-ui-icon-expand {
1796         /* @embed */
1797         background-image: url(images/icons/expand.svg);
1798 }
1799
1800 .oo-ui-icon-help {
1801         /* @embed */
1802         background-image: url(images/icons/help.svg);
1803 }
1804
1805 .oo-ui-icon-link {
1806         /* @embed */
1807         background-image: url(images/icons/link.svg);
1808 }
1809
1810 .oo-ui-icon-menu {
1811         /* @embed */
1812         background-image: url(images/icons/menu.svg);
1813 }
1814
1815 .oo-ui-icon-next {
1816         /* @embed */
1817         background-image: url(images/icons/move-ltr.svg);
1818 }
1819
1820 .oo-ui-icon-picture {
1821         /* @embed */
1822         background-image: url(images/icons/picture.svg);
1823 }
1824
1825 .oo-ui-icon-previous {
1826         /* @embed */
1827         background-image: url(images/icons/move-rtl.svg);
1828 }
1829
1830 .oo-ui-icon-redo {
1831         /* @embed */
1832         background-image: url(images/icons/arched-arrow-ltr.svg);
1833 }
1834
1835 .oo-ui-icon-remove {
1836         /* @embed */
1837         background-image: url(images/icons/remove.svg);
1838 }
1839
1840 .oo-ui-icon-search {
1841         /* @embed */
1842         background-image: url(images/icons/search.svg);
1843 }
1844
1845 .oo-ui-icon-settings {
1846         /* @embed */
1847         background-image: url(images/icons/settings.svg);
1848 }
1849
1850 .oo-ui-icon-tag {
1851         /* @embed */
1852         background-image: url(images/icons/tag.svg);
1853 }
1854
1855 .oo-ui-icon-undo {
1856         /* @embed */
1857         background-image: url(images/icons/arched-arrow-rtl.svg);
1858 }
1859
1860 .oo-ui-icon-window {
1861         /* @embed */
1862         background-image: url(images/icons/window.svg);
1863 }
1864
1865 /* Indicators */
1866
1867 .oo-ui-indicator-down {
1868         /* @embed */
1869         background-image: url(images/indicators/down.svg);
1870 }
1871
1872 .oo-ui-indicator-required {
1873         /* @embed */
1874         background-image: url(images/indicators/required.svg);
1875 }
1876
1877 .oo-ui-indicator-up {
1878         /* @embed */
1879         background-image: url(images/indicators/up.svg);
1880 }