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

   1 /*!
   2  * OOjs UI v0.1.0-pre (0e50d2e336)
   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: 2014-08-06T12:56:55Z
  10  */
  11 .oo-ui-dialog-content > .oo-ui-window-head,
  12 .oo-ui-dialog-content > .oo-ui-window-body,
  13 .oo-ui-dialog-content > .oo-ui-window-foot {
  14   position: absolute;
  15   right: 0;
  16   left: 0;
  17   overflow: hidden;
  18   -webkit-box-sizing: border-box;
  19      -moz-box-sizing: border-box;
  20           box-sizing: border-box;
  21 }
  22
  23 .oo-ui-dialog-content > .oo-ui-window-head {
  24   top: 0;
  25   z-index: 1;
  26 }
  27
  28 .oo-ui-dialog-content > .oo-ui-window-body {
  29   top: 0;
  30   bottom: 0;
  31   z-index: 2;
  32   box-shadow: 0 0 0.66em rgba(0, 0, 0, 0.25);
  33 }
  34
  35 .oo-ui-dialog-content > .oo-ui-window-foot {
  36   bottom: 0;
  37   z-index: 1;
  38 }
  39
  40 .oo-ui-dialog-content > .oo-ui-window-overlay {
  41   z-index: 3;
  42 }
  43
  44 .oo-ui-frame-content {
  45   font-family: sans-serif;
  46   font-size: 0.8em;
  47 }
  48
  49 .oo-ui-toolbar-bar {
  50   background: #f8fbfd;
  51   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #ffffff), color-stop(100%, #f1f7fb));
  52   background-image: -webkit-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
  53   background-image: -moz-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
  54   background-image: -ms-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
  55   background-image: -o-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
  56   background-image: linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
  57   border-bottom: solid 1px #ccc;
  58   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#f1f7fb');
  59 }
  60
  61 .oo-ui-toolbar-bar .oo-ui-toolbar-bar {
  62   background: none;
  63   border: none;
  64 }
  65
  66 .oo-ui-toolbar-shadow {
  67   bottom: -9px;
  68   height: 9px;
  69   background-image: /* @embed */ url(images/toolbar-shadow.png);
  70   opacity: 0.125;
  71   -webkit-transition: opacity 500ms ease-in-out;
  72      -moz-transition: opacity 500ms ease-in-out;
  73       -ms-transition: opacity 500ms ease-in-out;
  74        -o-transition: opacity 500ms ease-in-out;
  75           transition: opacity 500ms ease-in-out;
  76 }
  77
  78 .oo-ui-toolGroup {
  79   border: solid 1px transparent;
  80   border-radius: 0.25em;
  81   -webkit-transition: border-color 300ms ease-in-out;
  82      -moz-transition: border-color 300ms ease-in-out;
  83       -ms-transition: border-color 300ms ease-in-out;
  84        -o-transition: border-color 300ms ease-in-out;
  85           transition: border-color 300ms ease-in-out;
  86 }
  87
  88 .oo-ui-toolGroup.oo-ui-widget-enabled:hover {
  89   border-color: rgba(0, 0, 0, 0.1);
  90 }
  91
  92 .oo-ui-toolGroup.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
  93   color: #000;
  94 }
  95
  96 .oo-ui-window-content {
  97   background: transparent;
  98 }
  99
 100 .oo-ui-window-overlay {
 101   font-family: sans-serif;
 102   font-size: 1em;
 103   line-height: 1.5em;
 104 }
 105
 106 .oo-ui-windowManager-modal > .oo-ui-dialog {
 107   background-color: rgba(255, 255, 255, 0.5);
 108   opacity: 0;
 109   -webkit-transition: opacity 250ms ease-in-out;
 110      -moz-transition: opacity 250ms ease-in-out;
 111       -ms-transition: opacity 250ms ease-in-out;
 112        -o-transition: opacity 250ms ease-in-out;
 113           transition: opacity 250ms ease-in-out;
 114 }
 115
 116 .oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
 117   top: 1em;
 118   bottom: 1em;
 119   background-color: #fff;
 120   -webkit-transform: scale(0.5);
 121      -moz-transform: scale(0.5);
 122       -ms-transform: scale(0.5);
 123        -o-transform: scale(0.5);
 124           transform: scale(0.5);
 125   -webkit-transition: all 250ms ease-in-out;
 126      -moz-transition: all 250ms ease-in-out;
 127       -ms-transition: all 250ms ease-in-out;
 128        -o-transition: all 250ms ease-in-out;
 129           transition: all 250ms ease-in-out;
 130 }
 131
 132 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-ready {
 133   opacity: 1;
 134 }
 135
 136 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-ready > .oo-ui-window-frame {
 137   -webkit-transform: scale(1);
 138      -moz-transform: scale(1);
 139       -ms-transform: scale(1);
 140        -o-transform: scale(1);
 141           transform: scale(1);
 142 }
 143
 144 .oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
 145   border: solid 1px #ccc;
 146   border-radius: 0.5em;
 147   box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.3);
 148 }
 149
 150 .oo-ui-messageDialog-content .oo-ui-window-body {
 151   box-shadow: 0 0 0.33em rgba(0, 0, 0, 0.33);
 152 }
 153
 154 .oo-ui-messageDialog-title,
 155 .oo-ui-messageDialog-message {
 156   display: block;
 157   padding-top: 0.5em;
 158   text-align: center;
 159 }
 160
 161 .oo-ui-messageDialog-title {
 162   font-size: 1.5em;
 163   line-height: 1em;
 164   color: #000;
 165 }
 166
 167 .oo-ui-messageDialog-message {
 168   font-size: 0.9em;
 169   line-height: 1.25em;
 170   color: #666;
 171 }
 172
 173 .oo-ui-messageDialog-message-verbose {
 174   font-size: 1.1em;
 175   line-height: 1.5em;
 176   text-align: left;
 177 }
 178
 179 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
 180   border-right: solid 1px #e5e5e5;
 181 }
 182
 183 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:last-child {
 184   border-right-width: 0;
 185 }
 186
 187 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
 188   border-bottom: solid 1px #e5e5e5;
 189 }
 190
 191 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget:last-child {
 192   border-bottom-width: 0;
 193 }
 194
 195 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-labeledElement-label {
 196   padding: 0 2em;
 197   line-height: 3.4em;
 198   text-align: center;
 199 }
 200
 201 .oo-ui-messageDialog-actions .oo-ui-actionWidget:hover {
 202   background-color: rgba(0, 0, 0, 0.05);
 203 }
 204
 205 .oo-ui-messageDialog-actions .oo-ui-actionWidget:active {
 206   background-color: rgba(0, 0, 0, 0.1);
 207 }
 208
 209 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-primary:hover {
 210   background-color: rgba(8, 126, 204, 0.05);
 211 }
 212
 213 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-primary:active {
 214   background-color: rgba(8, 126, 204, 0.1);
 215 }
 216
 217 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-labeledElement-label {
 218   font-weight: bold;
 219 }
 220
 221 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:hover {
 222   background-color: rgba(118, 171, 54, 0.05);
 223 }
 224
 225 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:active {
 226   background-color: rgba(118, 171, 54, 0.1);
 227 }
 228
 229 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:hover {
 230   background-color: rgba(212, 83, 83, 0.05);
 231 }
 232
 233 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:active {
 234   background-color: rgba(212, 83, 83, 0.1);
 235 }
 236
 237 .oo-ui-processDialog-content .oo-ui-window-head {
 238   height: 3.4em;
 239 }
 240
 241 .oo-ui-processDialog-content .oo-ui-window-body {
 242   top: 3.4em;
 243   box-shadow: 0 0 0.33em rgba(0, 0, 0, 0.33);
 244 }
 245
 246 .oo-ui-processDialog-navigation {
 247   position: relative;
 248   height: 3.4em;
 249   padding: 0 1em;
 250 }
 251
 252 .oo-ui-processDialog-location {
 253   height: 1.9em;
 254   padding: 0.25em 0;
 255   text-align: center;
 256   cursor: default;
 257 }
 258
 259 .oo-ui-processDialog-title {
 260   font-weight: bold;
 261   line-height: 1.9em;
 262 }
 263
 264 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget .oo-ui-buttonedElement-button,
 265 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget .oo-ui-buttonedElement-button,
 266 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-buttonedElement-button {
 267   min-width: 1.9em;
 268   min-height: 1.9em;
 269   padding-top: 0.75em;
 270   padding-bottom: 0.75em;
 271 }
 272
 273 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget .oo-ui-labeledElement-label,
 274 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget .oo-ui-labeledElement-label,
 275 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-labeledElement-label {
 276   padding: 0 1em;
 277   line-height: 1.9em;
 278 }
 279
 280 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget .oo-ui-iconedElement-icon,
 281 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget .oo-ui-iconedElement-icon,
 282 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-iconedElement-icon {
 283   position: absolute;
 284   margin-top: -0.125em;
 285 }
 286
 287 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonedElement-framed,
 288 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonedElement-framed,
 289 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonedElement-framed {
 290   margin: 0.75em 0 0.75em 0.75em;
 291 }
 292
 293 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button,
 294 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button,
 295 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
 296   padding: 0;
 297   vertical-align: middle;
 298 }
 299
 300 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget:hover,
 301 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget:hover {
 302   background-color: rgba(0, 0, 0, 0.05);
 303 }
 304
 305 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget:active,
 306 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget:active {
 307   background-color: rgba(0, 0, 0, 0.1);
 308 }
 309
 310 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonedElement-framed,
 311 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonedElement-framed {
 312   margin: 0.75em;
 313 }
 314
 315 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button,
 316 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
 317   /* Adjust for border so text aligns with title */
 318
 319   margin: -1px;
 320 }
 321
 322 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-primary:hover,
 323 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-primary:hover {
 324   background-color: rgba(8, 126, 204, 0.05);
 325 }
 326
 327 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-primary:active,
 328 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-primary:active {
 329   background-color: rgba(8, 126, 204, 0.1);
 330 }
 331
 332 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-labeledElement-label,
 333 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-labeledElement-label {
 334   font-weight: bold;
 335 }
 336
 337 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:hover,
 338 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:hover {
 339   background-color: rgba(118, 171, 54, 0.05);
 340 }
 341
 342 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:active,
 343 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:active {
 344   background-color: rgba(118, 171, 54, 0.1);
 345 }
 346
 347 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:hover,
 348 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:hover {
 349   background-color: rgba(212, 83, 83, 0.05);
 350 }
 351
 352 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:active,
 353 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:active {
 354   background-color: rgba(212, 83, 83, 0.1);
 355 }
 356
 357 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon {
 358   left: 0.5em;
 359 }
 360
 361 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-labeledElement-label {
 362   padding-left: 2.25em;
 363 }
 364
 365 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon {
 366   right: 0.5em;
 367 }
 368
 369 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-labeledElement-label {
 370   padding-right: 2.25em;
 371 }
 372
 373 .oo-ui-processDialog > .oo-ui-window-frame {
 374   min-height: 5em;
 375 }
 376
 377 .oo-ui-processDialog-errors {
 378   padding: 3em 3em 1.5em 3em;
 379   text-align: center;
 380   background-color: rgba(255, 255, 255, 0.9);
 381 }
 382
 383 .oo-ui-processDialog-errors .oo-ui-buttonWidget {
 384   margin: 2em 1em 2em 1em;
 385 }
 386
 387 .oo-ui-processDialog-errors-title {
 388   margin-bottom: 2em;
 389   font-size: 1.5em;
 390   color: #000;
 391 }
 392
 393 .oo-ui-processDialog-error {
 394   padding: 1em;
 395   margin: 1em;
 396   text-align: left;
 397   background-color: #fff7f7;
 398   border: solid 1px #ff9e9e;
 399   border-radius: 0.25em;
 400 }
 401
 402 .oo-ui-buttonedElement > .oo-ui-buttonedElement-button {
 403   color: #333;
 404 }
 405
 406 .oo-ui-buttonedElement.oo-ui-indicatedElement > .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator,
 407 .oo-ui-buttonedElement.oo-ui-iconedElement > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 408   width: 1.9em;
 409   height: 1.9em;
 410   opacity: 0.8;
 411 }
 412
 413 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 414   /* Don't animate opacities for now, causes wiggling in Chrome (bug 63020) */
 415
 416   /*.oo-ui-transition(opacity 200ms);*/
 417
 418 }
 419
 420 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button:hover > .oo-ui-iconedElement-icon,
 421 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button:focus > .oo-ui-iconedElement-icon {
 422   opacity: 1;
 423 }
 424
 425 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button:hover > .oo-ui-labeledElement-label,
 426 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button:focus > .oo-ui-labeledElement-label {
 427   color: #000;
 428 }
 429
 430 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 431   color: #333;
 432 }
 433
 434 .oo-ui-buttonedElement-frameless.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 435   color: #087ecc;
 436 }
 437
 438 .oo-ui-buttonedElement-frameless.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 439   color: #76ab36;
 440 }
 441
 442 .oo-ui-buttonedElement-frameless.oo-ui-flaggableElement-destructive > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 443   color: #d45353;
 444 }
 445
 446 .oo-ui-buttonedElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 447   opacity: 0.2;
 448 }
 449
 450 .oo-ui-buttonedElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 451   color: #ccc;
 452 }
 453
 454 .oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button {
 455   padding: 0.2em 0.8em;
 456   margin: 0.1em 0;
 457   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
 458   background: #eeeeee;
 459   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #ffffff), color-stop(100%, #dddddd));
 460   background-image: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 461   background-image: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 462   background-image: -ms-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 463   background-image: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 464   background-image: linear-gradient(top, #ffffff 0%, #dddddd 100%);
 465   border: 1px #c9c9c9 solid;
 466   border-radius: 0.3em;
 467   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#dddddd');
 468   -webkit-transition: border-color 100ms ease-in-out;
 469      -moz-transition: border-color 100ms ease-in-out;
 470       -ms-transition: border-color 100ms ease-in-out;
 471        -o-transition: border-color 100ms ease-in-out;
 472           transition: border-color 100ms ease-in-out;
 473 }
 474
 475 .oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button:hover,
 476 .oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button:focus {
 477   border-color: #aaa;
 478 }
 479
 480 .oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
 481 .oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
 482   color: black;
 483   background: #eeeeee;
 484   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #dddddd), color-stop(100%, #ffffff));
 485   background-image: -webkit-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 486   background-image: -moz-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 487   background-image: -ms-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 488   background-image: -o-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 489   background-image: linear-gradient(top, #dddddd 0%, #ffffff 100%);
 490   border-color: #c9c9c9;
 491   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#dddddd', endColorstr='#ffffff');
 492   box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
 493 }
 494
 495 .oo-ui-buttonedElement-framed.oo-ui-iconedElement > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 496   margin-right: -0.5em;
 497   margin-left: -0.5em;
 498 }
 499
 500 .oo-ui-buttonedElement-framed.oo-ui-iconedElement.oo-ui-labeledElement > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 501   margin-right: 0.3em;
 502   margin-left: -0.5em;
 503 }
 504
 505 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button {
 506   background: #cde7f4;
 507   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #eaf4fa), color-stop(100%, #b0d9ee));
 508   background-image: -webkit-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 509   background-image: -moz-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 510   background-image: -ms-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 511   background-image: -o-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 512   background-image: linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 513   border: solid 1px #a6cee1;
 514   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#eaf4fa', endColorstr='#b0d9ee');
 515 }
 516
 517 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button:hover,
 518 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button:focus {
 519   border-color: #9dc2d4;
 520 }
 521
 522 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
 523 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
 524   background: #cde7f4;
 525   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #b0d9ee), color-stop(100%, #eaf4fa));
 526   background-image: -webkit-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 527   background-image: -moz-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 528   background-image: -ms-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 529   background-image: -o-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 530   background-image: linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 531   border: solid 1px #a6cee1;
 532   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#b0d9ee', endColorstr='#eaf4fa');
 533 }
 534
 535 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button {
 536   background: #daf0be;
 537   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f0fbe1), color-stop(100%, #c3e59a));
 538   background-image: -webkit-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 539   background-image: -moz-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 540   background-image: -ms-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 541   background-image: -o-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 542   background-image: linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 543   border: solid 1px #b8d892;
 544   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f0fbe1', endColorstr='#c3e59a');
 545 }
 546
 547 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button:hover,
 548 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button:focus {
 549   border-color: #adcb89;
 550 }
 551
 552 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
 553 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
 554   background: #daf0be;
 555   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #c3e59a), color-stop(100%, #f0fbe1));
 556   background-image: -webkit-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 557   background-image: -moz-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 558   background-image: -ms-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 559   background-image: -o-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 560   background-image: linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 561   border: solid 1px #b8d892;
 562   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#c3e59a', endColorstr='#f0fbe1');
 563 }
 564
 565 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-destructive > .oo-ui-buttonedElement-button {
 566   color: #d45353;
 567 }
 568
 569 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button,
 570 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
 571 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
 572   color: #333;
 573   background: #eee;
 574   border-color: #ccc;
 575   opacity: 0.5;
 576   box-shadow: none;
 577 }
 578
 579 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button:hover,
 580 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active:hover,
 581 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed:hover,
 582 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button:focus,
 583 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active:focus,
 584 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed:focus {
 585   border-color: #ccc;
 586   box-shadow: none;
 587 }
 588
 589 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout {
 590   padding: 1.5em;
 591 }
 592
 593 .oo-ui-bookletLayout-outlinePanel {
 594   border-right: solid 1px #ddd;
 595 }
 596
 597 .oo-ui-bookletLayout-outlinePanel .oo-ui-outlineControlsWidget {
 598   box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.25);
 599 }
 600
 601 .oo-ui-fieldLayout-disabled .oo-ui-labeledElement-label {
 602   color: #ccc;
 603 }
 604
 605 .oo-ui-fieldsetLayout {
 606   border: none;
 607 }
 608
 609 .oo-ui-fieldsetLayout > .oo-ui-labeledElement-label {
 610   font-size: 1.5em;
 611 }
 612
 613 .oo-ui-panelLayout-padded {
 614   padding: 1.25em;
 615 }
 616
 617 .oo-ui-barToolGroup .oo-ui-tool {
 618   margin: -1px 0 -1px -1px;
 619   border: solid 1px transparent;
 620 }
 621
 622 .oo-ui-barToolGroup .oo-ui-tool:first-child {
 623   border-bottom-left-radius: 0.25em;
 624   border-top-left-radius: 0.25em;
 625 }
 626
 627 .oo-ui-barToolGroup .oo-ui-tool:last-child {
 628   margin-right: -1px;
 629   border-top-right-radius: 0.25em;
 630   border-bottom-right-radius: 0.25em;
 631 }
 632
 633 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 634   opacity: 0.8;
 635 }
 636
 637 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-enabled:hover {
 638   border-color: rgba(0, 0, 0, 0.2);
 639 }
 640
 641 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool-active.oo-ui-widget-enabled {
 642   background: #f8fbfd;
 643   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f1f7fb), color-stop(100%, #ffffff));
 644   background-image: -webkit-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 645   background-image: -moz-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 646   background-image: -ms-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 647   background-image: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 648   background-image: linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 649   border-color: rgba(0, 0, 0, 0.2);
 650   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
 651   box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 652 }
 653
 654 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool-active.oo-ui-widget-enabled + .oo-ui-tool-active.oo-ui-widget-enabled {
 655   border-left-color: rgba(0, 0, 0, 0.1);
 656 }
 657
 658 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 659   opacity: 0.2;
 660 }
 661
 662 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 663   opacity: 0.8;
 664 }
 665
 666 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconedElement-icon {
 667   opacity: 1;
 668 }
 669
 670 .oo-ui-barToolGroup.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 671   opacity: 0.2;
 672 }
 673
 674 .oo-ui-listToolGroup.oo-ui-popupToolGroup-active {
 675   border-color: rgba(0, 0, 0, 0.2);
 676 }
 677
 678 .oo-ui-listToolGroup .oo-ui-tool {
 679   margin: -1px 0;
 680   border: solid 1px transparent;
 681 }
 682
 683 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled {
 684   background: #f8fbfd;
 685   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f1f7fb), color-stop(100%, #ffffff));
 686   background-image: -webkit-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 687   background-image: -moz-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 688   background-image: -ms-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 689   background-image: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 690   background-image: linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 691   border-color: rgba(0, 0, 0, 0.1);
 692   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
 693   box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 694 }
 695
 696 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled + .oo-ui-tool-active.oo-ui-widget-enabled {
 697   border-top-color: rgba(0, 0, 0, 0.1);
 698 }
 699
 700 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled:hover {
 701   border-color: rgba(0, 0, 0, 0.2);
 702 }
 703
 704 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover {
 705   border-color: rgba(0, 0, 0, 0.2);
 706 }
 707
 708 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 709   opacity: 0.8;
 710 }
 711
 712 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconedElement-icon {
 713   opacity: 1;
 714 }
 715
 716 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title {
 717   color: #ccc;
 718 }
 719
 720 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 721   opacity: 0.2;
 722 }
 723
 724 .oo-ui-listToolGroup.oo-ui-widget-disabled {
 725   color: #ccc;
 726 }
 727
 728 .oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-indicatedElement-indicator,
 729 .oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-iconedElement-icon {
 730   opacity: 0.2;
 731 }
 732
 733 .oo-ui-menuToolGroup {
 734   border-color: rgba(0, 0, 0, 0.1);
 735 }
 736
 737 .oo-ui-menuToolGroup.oo-ui-widget-enabled:hover {
 738   border-color: rgba(0, 0, 0, 0.2);
 739 }
 740
 741 .oo-ui-menuToolGroup.oo-ui-popupToolGroup-active {
 742   border-color: rgba(0, 0, 0, 0.25);
 743 }
 744
 745 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover {
 746   background-color: #e1f3ff;
 747 }
 748
 749 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title {
 750   color: #ccc;
 751 }
 752
 753 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 754   opacity: 0.2;
 755 }
 756
 757 .oo-ui-menuToolGroup.oo-ui-widget-disabled {
 758   color: #ccc;
 759   border-color: rgba(0, 0, 0, 0.05);
 760 }
 761
 762 .oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-indicatedElement-indicator,
 763 .oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-iconedElement-icon {
 764   opacity: 0.2;
 765 }
 766
 767 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator,
 768 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
 769   opacity: 0.8;
 770 }
 771
 772 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
 773   background-color: white;
 774   border: solid 1px #ccc;
 775   box-shadow: 0 0.25em 1em rgba(0, 0, 0, 0.25);
 776 }
 777
 778 .oo-ui-popupToolGroup-active.oo-ui-widget-enabled {
 779   background: #f8fbfd;
 780   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f1f7fb), color-stop(100%, #ffffff));
 781   background-image: -webkit-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 782   background-image: -moz-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 783   background-image: -ms-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 784   background-image: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 785   background-image: linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 786   border-bottom-right-radius: 0;
 787   border-bottom-left-radius: 0;
 788   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
 789   box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 790 }
 791
 792 .oo-ui-optionWidget {
 793   padding: 0.5em 2em 0.5em 3em;
 794 }
 795
 796 .oo-ui-optionWidget-highlighted {
 797   background-color: #e1f3ff;
 798 }
 799
 800 .oo-ui-selectWidget-depressed .oo-ui-optionWidget-selected {
 801   background-color: #a7dcff;
 802 }
 803
 804 .oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed {
 805   background-color: #a7dcff;
 806 }
 807
 808 .oo-ui-optionWidget.oo-ui-widget-disabled {
 809   color: #ccc;
 810 }
 811
 812 .oo-ui-menuWidget {
 813   margin-top: -1px;
 814   background: #fff;
 815   border: solid 1px #ccc;
 816   border-radius: 0 0 0.25em 0.25em;
 817   box-shadow: 0 0.15em 1em 0 rgba(0, 0, 0, 0.2);
 818 }
 819
 820 .oo-ui-popupWidget-popup {
 821   background-color: #fff;
 822   border: solid 1px #ccc;
 823   border-radius: 0.25em;
 824   box-shadow: 0 0.15em 0.5em 0 rgba(0, 0, 0, 0.2);
 825 }
 826
 827 .oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor {
 828   width: 15px;
 829   height: 8px;
 830   margin-left: -7px;
 831   background-image: /* @embed */ url(images/anchor.svg);
 832 }
 833
 834 .oo-ui-popupWidget-transitioning .oo-ui-popupWidget-popup {
 835   -webkit-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 836      -moz-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 837       -ms-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 838        -o-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 839           transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 840 }
 841
 842 .oo-ui-popupWidget-body {
 843   box-shadow: 0 0 0.66em rgba(0, 0, 0, 0.25);
 844 }
 845
 846 .oo-ui-buttonGroupWidget {
 847   display: inline-block;
 848   white-space: nowrap;
 849 }
 850
 851 .oo-ui-buttonOptionWidget {
 852   padding: 0;
 853 }
 854
 855 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected,
 856 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
 857 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-highlighted {
 858   background-color: transparent;
 859 }
 860
 861 .oo-ui-buttonSelectWidget {
 862   border-radius: 0.3em;
 863 }
 864
 865 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
 866   margin-left: -1px;
 867   border-radius: 0;
 868 }
 869
 870 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonedElement-button {
 871   margin-left: 0;
 872   border-bottom-left-radius: 0.3em;
 873   border-top-left-radius: 0.3em;
 874 }
 875
 876 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:last-child .oo-ui-buttonedElement-button {
 877   border-top-right-radius: 0.3em;
 878   border-bottom-right-radius: 0.3em;
 879 }
 880
 881 .oo-ui-inlineMenuWidget-handle {
 882   border: solid 1px rgba(0, 0, 0, 0.1);
 883   border-radius: 0.25em;
 884 }
 885
 886 .oo-ui-inlineMenuWidget-handle:hover {
 887   border-color: rgba(0, 0, 0, 0.2);
 888 }
 889
 890 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator,
 891 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
 892   opacity: 0.8;
 893 }
 894
 895 .oo-ui-inlineMenuWidget.oo-ui-widget-disabled .oo-ui-inlineMenuWidget-handle {
 896   color: #ccc;
 897   text-shadow: 0 1px 1px #fff;
 898   background-color: #f3f3f3;
 899   border-color: #ddd;
 900 }
 901
 902 .oo-ui-inlineMenuWidget.oo-ui-widget-disabled .oo-ui-indicatedElement-indicator {
 903   opacity: 0.2;
 904 }
 905
 906 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
 907   background-color: transparent;
 908 }
 909
 910 .oo-ui-menuItemWidget.oo-ui-optionWidget-highlighted,
 911 .oo-ui-menuItemWidget.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected {
 912   background-color: #e1f3ff;
 913 }
 914
 915 .oo-ui-menuSectionItemWidget {
 916   padding: 0.33em 0.75em;
 917   color: #888;
 918 }
 919
 920 .oo-ui-outlineControlsWidget {
 921   background-color: #fff;
 922 }
 923
 924 .oo-ui-outlineControlsWidget > .oo-ui-iconedElement-icon {
 925   opacity: 0.2;
 926 }
 927
 928 .oo-ui-outlineItemWidget {
 929   font-size: 1.1em;
 930 }
 931
 932 .oo-ui-outlineItemWidget.oo-ui-indicatedElement .oo-ui-labeledElement-label {
 933   padding-right: 1.5em;
 934 }
 935
 936 .oo-ui-outlineItemWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
 937   opacity: 0.5;
 938 }
 939
 940 .oo-ui-outlineItemWidget-level-0 {
 941   padding-left: 3.5em;
 942 }
 943
 944 .oo-ui-outlineItemWidget-level-0 .oo-ui-iconedElement-icon {
 945   left: 1em;
 946 }
 947
 948 .oo-ui-outlineItemWidget-level-1 {
 949   padding-left: 5em;
 950 }
 951
 952 .oo-ui-outlineItemWidget-level-1 .oo-ui-iconedElement-icon {
 953   left: 2.5em;
 954 }
 955
 956 .oo-ui-outlineItemWidget-level-2 {
 957   padding-left: 6.5em;
 958 }
 959
 960 .oo-ui-outlineItemWidget-level-2 .oo-ui-iconedElement-icon {
 961   left: 4em;
 962 }
 963
 964 .oo-ui-selectWidget-depressed .oo-ui-outlineItemWidget.oo-ui-optionWidget-selected {
 965   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
 966   background-color: #a7dcff;
 967 }
 968
 969 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-important {
 970   font-weight: bold;
 971 }
 972
 973 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-placeholder {
 974   font-style: italic;
 975 }
 976
 977 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-empty .oo-ui-iconedElement-icon {
 978   opacity: 0.5;
 979 }
 980
 981 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-empty .oo-ui-labeledElement-label {
 982   color: #777;
 983 }
 984
 985 .oo-ui-searchWidget-query {
 986   box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.2);
 987 }
 988
 989 .oo-ui-textInputWidget {
 990   width: 20em;
 991 }
 992
 993 .oo-ui-textInputWidget input,
 994 .oo-ui-textInputWidget textarea {
 995   padding: 0.5em;
 996   font-family: sans-serif;
 997   font-size: 1em;
 998   background-color: #fff;
 999   border: solid 1px #ccc;
1000   border-radius: 0.25em;
1001   box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd;
1002   -webkit-transition: border-color 200ms, box-shadow 200ms;
1003      -moz-transition: border-color 200ms, box-shadow 200ms;
1004       -ms-transition: border-color 200ms, box-shadow 200ms;
1005        -o-transition: border-color 200ms, box-shadow 200ms;
1006           transition: border-color 200ms, box-shadow 200ms;
1007 }
1008
1009 .oo-ui-textInputWidget-decorated input,
1010 .oo-ui-textInputWidget-decorated textarea {
1011   padding-left: 2em;
1012 }
1013
1014 .oo-ui-textInputWidget-icon {
1015   width: 2em;
1016 }
1017
1018 .oo-ui-textInputWidget.oo-ui-widget-enabled input:focus,
1019 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus {
1020   border-color: #a7dcff;
1021   outline: none;
1022   box-shadow: 0 0 0.3em #a7dcff, 0 0 0 white;
1023 }
1024
1025 .oo-ui-textInputWidget input[readonly],
1026 .oo-ui-textInputWidget textarea[readonly] {
1027   color: #777;
1028   text-shadow: 0 1px 1px #fff;
1029 }
1030
1031 .oo-ui-textInputWidget-pending input,
1032 .oo-ui-textInputWidget-pending textarea {
1033   background-color: transparent;
1034 }
1035
1036 .oo-ui-textInputWidget.oo-ui-widget-disabled input,
1037 .oo-ui-textInputWidget.oo-ui-widget-disabled input:focus,
1038 .oo-ui-textInputWidget.oo-ui-widget-disabled textarea,
1039 .oo-ui-textInputWidget.oo-ui-widget-disabled textarea:focus {
1040   color: #ccc;
1041   text-shadow: 0 1px 1px #fff;
1042   background-color: #f3f3f3;
1043   border-color: #ddd;
1044 }
1045
1046 .oo-ui-toggleSwitchWidget {
1047   background: #eeeeee;
1048   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #dddddd), color-stop(100%, #ffffff));
1049   background-image: -webkit-linear-gradient(top, #dddddd 0%, #ffffff 100%);
1050   background-image: -moz-linear-gradient(top, #dddddd 0%, #ffffff 100%);
1051   background-image: -ms-linear-gradient(top, #dddddd 0%, #ffffff 100%);
1052   background-image: -o-linear-gradient(top, #dddddd 0%, #ffffff 100%);
1053   background-image: linear-gradient(top, #dddddd 0%, #ffffff 100%);
1054   border: solid 1px #ccc;
1055   border-radius: 1em;
1056   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#dddddd', endColorstr='#ffffff');
1057   box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd;
1058 }
1059
1060 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
1061   opacity: 0.5;
1062 }
1063
1064 .oo-ui-toggleSwitchWidget-grip {
1065   background: #eeeeee;
1066   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #ffffff), color-stop(100%, #dddddd));
1067   background-image: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 100%);
1068   background-image: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%);
1069   background-image: -ms-linear-gradient(top, #ffffff 0%, #dddddd 100%);
1070   background-image: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%);
1071   background-image: linear-gradient(top, #ffffff 0%, #dddddd 100%);
1072   border: 1px #c9c9c9 solid;
1073   border-radius: 1em;
1074   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#dddddd');
1075   box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
1076 }
1077
1078 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover,
1079 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
1080   border-color: #aaa;
1081 }
1082
1083 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
1084   background: #cde7f4;
1085   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #b0d9ee), color-stop(100%, #eaf4fa));
1086   background-image: -webkit-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
1087   background-image: -moz-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
1088   background-image: -ms-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
1089   background-image: -o-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
1090   background-image: linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
1091   border-radius: 1em;
1092   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#b0d9ee', endColorstr='#eaf4fa');
1093   box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
1094 }
1095
1096 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-glow {
1097   opacity: 1;
1098 }
1099
1100 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
1101   display: block;
1102   opacity: 0;
1103 }