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