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

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