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

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