resources/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 .oo-ui-window-frame {
  13   background-color: #fff;
  14   border: solid 1px #ccc;
  15   border-radius: 0.5em;
  16   -webkit-transform: scale(0.5);
  17      -moz-transform: scale(0.5);
  18       -ms-transform: scale(0.5);
  19        -o-transform: scale(0.5);
  20           transform: scale(0.5);
  21   box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.3);
  22   -webkit-transition: all 250ms ease-in-out;
  23      -moz-transition: all 250ms ease-in-out;
  24       -ms-transition: all 250ms ease-in-out;
  25        -o-transition: all 250ms ease-in-out;
  26           transition: all 250ms ease-in-out;
  27 }
  28
  29 .oo-ui-dialog-open {
  30   opacity: 1;
  31 }
  32
  33 .oo-ui-dialog-open .oo-ui-window-frame {
  34   -webkit-transform: scale(1);
  35      -moz-transform: scale(1);
  36       -ms-transform: scale(1);
  37        -o-transform: scale(1);
  38           transform: scale(1);
  39 }
  40
  41 .oo-ui-dialog-content .oo-ui-window-body {
  42   box-shadow: 0 0 0.66em rgba(0, 0, 0, 0.25);
  43 }
  44
  45 .oo-ui-toolbar-bar {
  46   background: #f8fbfd;
  47   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #ffffff), color-stop(100%, #f1f7fb));
  48   background-image: -webkit-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
  49   background-image: -moz-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
  50   background-image: -ms-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
  51   background-image: -o-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
  52   background-image: linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
  53   border-bottom: solid 1px #ccc;
  54   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#f1f7fb');
  55 }
  56
  57 .oo-ui-toolbar-bar .oo-ui-toolbar-bar {
  58   background: none;
  59   border: none;
  60 }
  61
  62 .oo-ui-toolbar-shadow {
  63   bottom: -9px;
  64   height: 9px;
  65   background-image: /* @embed */ url(images/toolbar-shadow.png);
  66   opacity: 0.125;
  67   -webkit-transition: opacity 500ms ease-in-out;
  68      -moz-transition: opacity 500ms ease-in-out;
  69       -ms-transition: opacity 500ms ease-in-out;
  70        -o-transition: opacity 500ms ease-in-out;
  71           transition: opacity 500ms ease-in-out;
  72 }
  73
  74 .oo-ui-toolGroup {
  75   border: solid 1px transparent;
  76   border-radius: 0.25em;
  77   -webkit-transition: border-color 300ms ease-in-out;
  78      -moz-transition: border-color 300ms ease-in-out;
  79       -ms-transition: border-color 300ms ease-in-out;
  80        -o-transition: border-color 300ms ease-in-out;
  81           transition: border-color 300ms ease-in-out;
  82 }
  83
  84 .oo-ui-toolGroup:hover {
  85   border-color: rgba(0, 0, 0, 0.1);
  86 }
  87
  88 .oo-ui-toolGroup .oo-ui-tool-link .oo-ui-tool-title {
  89   color: #000;
  90 }
  91
  92 .oo-ui-window-title {
  93   color: #333;
  94 }
  95
  96 .oo-ui-window-overlay {
  97   font-family: sans-serif;
  98   font-size: 1em;
  99   line-height: 1.5em;
 100 }
 101
 102 .oo-ui-buttonedElement .oo-ui-buttonedElement-button {
 103   color: #333;
 104 }
 105
 106 .oo-ui-buttonedElement.oo-ui-indicatedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator,
 107 .oo-ui-buttonedElement.oo-ui-iconedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 108   opacity: 0.8;
 109 }
 110
 111 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 112   -webkit-transition: opacity 200ms;
 113      -moz-transition: opacity 200ms;
 114       -ms-transition: opacity 200ms;
 115        -o-transition: opacity 200ms;
 116           transition: opacity 200ms;
 117 }
 118
 119 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button:hover > .oo-ui-iconedElement-icon,
 120 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button:focus > .oo-ui-iconedElement-icon {
 121   opacity: 1;
 122 }
 123
 124 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button:hover > .oo-ui-labeledElement-label,
 125 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button:focus > .oo-ui-labeledElement-label {
 126   color: #000;
 127 }
 128
 129 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 130   color: #333;
 131 }
 132
 133 .oo-ui-buttonedElement-frameless.oo-ui-widget-disabled .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 134   opacity: 0.2;
 135 }
 136
 137 .oo-ui-buttonedElement-frameless.oo-ui-widget-disabled .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 138   color: #ccc;
 139 }
 140
 141 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
 142   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
 143   background: #eeeeee;
 144   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #ffffff), color-stop(100%, #dddddd));
 145   background-image: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 146   background-image: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 147   background-image: -ms-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 148   background-image: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 149   background-image: linear-gradient(top, #ffffff 0%, #dddddd 100%);
 150   border: 1px #c9c9c9 solid;
 151   border-radius: 0.3em;
 152   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#dddddd');
 153   -webkit-transition: border-color 100ms ease-in-out;
 154      -moz-transition: border-color 100ms ease-in-out;
 155       -ms-transition: border-color 100ms ease-in-out;
 156        -o-transition: border-color 100ms ease-in-out;
 157           transition: border-color 100ms ease-in-out;
 158 }
 159
 160 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button:hover,
 161 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button:focus {
 162   border-color: #aaa;
 163 }
 164
 165 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
 166 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
 167   color: black;
 168   background: #eeeeee;
 169   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #dddddd), color-stop(100%, #ffffff));
 170   background-image: -webkit-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 171   background-image: -moz-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 172   background-image: -ms-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 173   background-image: -o-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 174   background-image: linear-gradient(top, #dddddd 0%, #ffffff 100%);
 175   border-color: #c9c9c9;
 176   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#dddddd', endColorstr='#ffffff');
 177   box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
 178 }
 179
 180 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button {
 181   background: #cde7f4;
 182   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #eaf4fa), color-stop(100%, #b0d9ee));
 183   background-image: -webkit-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 184   background-image: -moz-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 185   background-image: -ms-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 186   background-image: -o-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 187   background-image: linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
 188   border: solid 1px #a6cee1;
 189   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#eaf4fa', endColorstr='#b0d9ee');
 190 }
 191
 192 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button:hover,
 193 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button:focus {
 194   border-color: #9dc2d4;
 195 }
 196
 197 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
 198 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
 199   background: #cde7f4;
 200   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #b0d9ee), color-stop(100%, #eaf4fa));
 201   background-image: -webkit-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 202   background-image: -moz-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 203   background-image: -ms-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 204   background-image: -o-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 205   background-image: linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 206   border: solid 1px #a6cee1;
 207   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#b0d9ee', endColorstr='#eaf4fa');
 208 }
 209
 210 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive .oo-ui-buttonedElement-button {
 211   background: #daf0be;
 212   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f0fbe1), color-stop(100%, #c3e59a));
 213   background-image: -webkit-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 214   background-image: -moz-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 215   background-image: -ms-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 216   background-image: -o-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 217   background-image: linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
 218   border: solid 1px #b8d892;
 219   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f0fbe1', endColorstr='#c3e59a');
 220 }
 221
 222 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive .oo-ui-buttonedElement-button:hover,
 223 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive .oo-ui-buttonedElement-button:focus {
 224   border-color: #adcb89;
 225 }
 226
 227 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
 228 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
 229   background: #daf0be;
 230   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #c3e59a), color-stop(100%, #f0fbe1));
 231   background-image: -webkit-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 232   background-image: -moz-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 233   background-image: -ms-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 234   background-image: -o-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 235   background-image: linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
 236   border: solid 1px #b8d892;
 237   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#c3e59a', endColorstr='#f0fbe1');
 238 }
 239
 240 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-destructive .oo-ui-buttonedElement-button {
 241   color: #d45353;
 242 }
 243
 244 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button,
 245 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
 246 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
 247   color: #333;
 248   background: #eee;
 249   opacity: 0.5;
 250   box-shadow: none;
 251 }
 252
 253 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button:hover,
 254 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active:hover,
 255 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed:hover,
 256 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button:focus,
 257 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active:focus,
 258 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed:focus {
 259   border-color: #ccc;
 260   box-shadow: none;
 261 }
 262
 263 .oo-ui-bookletLayout > .oo-ui-gridLayout > .oo-ui-panelLayout {
 264   -webkit-transition: width 250ms ease-in-out, height 250ms ease-in-out, top 250ms ease-in-out, left 250ms ease-in-out;
 265      -moz-transition: width 250ms ease-in-out, height 250ms ease-in-out, top 250ms ease-in-out, left 250ms ease-in-out;
 266       -ms-transition: width 250ms ease-in-out, height 250ms ease-in-out, top 250ms ease-in-out, left 250ms ease-in-out;
 267        -o-transition: width 250ms ease-in-out, height 250ms ease-in-out, top 250ms ease-in-out, left 250ms ease-in-out;
 268           transition: width 250ms ease-in-out, height 250ms ease-in-out, top 250ms ease-in-out, left 250ms ease-in-out;
 269 }
 270
 271 .oo-ui-bookletLayout-outlinePanel {
 272   border-right: solid 1px #ddd;
 273 }
 274
 275 .oo-ui-bookletLayout-outlinePanel .oo-ui-outlineControlsWidget {
 276   box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.25);
 277 }
 278
 279 .oo-ui-fieldsetLayout {
 280   border: none;
 281 }
 282
 283 .oo-ui-fieldsetLayout > legend.oo-ui-labeledElement-label {
 284   font-size: 1.5em;
 285 }
 286
 287 .oo-ui-barToolGroup .oo-ui-tool {
 288   margin: -1px 0 -1px -1px;
 289   border: solid 1px transparent;
 290 }
 291
 292 .oo-ui-barToolGroup .oo-ui-tool:first-child {
 293   border-bottom-left-radius: 0.25em;
 294   border-top-left-radius: 0.25em;
 295 }
 296
 297 .oo-ui-barToolGroup .oo-ui-tool:last-child {
 298   margin-right: -1px;
 299   border-top-right-radius: 0.25em;
 300   border-bottom-right-radius: 0.25em;
 301 }
 302
 303 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover {
 304   border-color: rgba(0, 0, 0, 0.2);
 305 }
 306
 307 .oo-ui-barToolGroup .oo-ui-tool-active.oo-ui-widget-enabled {
 308   background: #f8fbfd;
 309   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f1f7fb), color-stop(100%, #ffffff));
 310   background-image: -webkit-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 311   background-image: -moz-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 312   background-image: -ms-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 313   background-image: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 314   background-image: linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 315   border-color: rgba(0, 0, 0, 0.2);
 316   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
 317   box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 318 }
 319
 320 .oo-ui-barToolGroup .oo-ui-tool-active.oo-ui-widget-enabled + .oo-ui-tool-active.oo-ui-widget-enabled {
 321   border-left-color: rgba(0, 0, 0, 0.1);
 322 }
 323
 324 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 325   opacity: 0.8;
 326 }
 327
 328 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 329   opacity: 0.2;
 330 }
 331
 332 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 333   opacity: 0.8;
 334 }
 335
 336 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconedElement-icon {
 337   opacity: 1;
 338 }
 339
 340 .oo-ui-listToolGroup.oo-ui-popupToolGroup-active {
 341   border-color: rgba(0, 0, 0, 0.2);
 342 }
 343
 344 .oo-ui-listToolGroup .oo-ui-tool {
 345   margin: -1px 0;
 346   border: solid 1px transparent;
 347 }
 348
 349 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled {
 350   background: #f8fbfd;
 351   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f1f7fb), color-stop(100%, #ffffff));
 352   background-image: -webkit-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 353   background-image: -moz-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 354   background-image: -ms-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 355   background-image: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 356   background-image: linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 357   border-color: rgba(0, 0, 0, 0.1);
 358   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
 359   box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 360 }
 361
 362 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled + .oo-ui-tool-active.oo-ui-widget-enabled {
 363   border-top-color: rgba(0, 0, 0, 0.1);
 364 }
 365
 366 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled:hover {
 367   border-color: rgba(0, 0, 0, 0.2);
 368 }
 369
 370 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover {
 371   border-color: rgba(0, 0, 0, 0.2);
 372 }
 373
 374 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 375   opacity: 0.8;
 376 }
 377
 378 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconedElement-icon {
 379   opacity: 1;
 380 }
 381
 382 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title {
 383   color: #ccc;
 384 }
 385
 386 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
 387   opacity: 0.2;
 388 }
 389
 390 .oo-ui-menuToolGroup {
 391   border-color: rgba(0, 0, 0, 0.1);
 392 }
 393
 394 .oo-ui-menuToolGroup:hover {
 395   border-color: rgba(0, 0, 0, 0.2);
 396 }
 397
 398 .oo-ui-menuToolGroup.oo-ui-popupToolGroup-active {
 399   border-color: rgba(0, 0, 0, 0.25);
 400 }
 401
 402 .oo-ui-menuToolGroup .oo-ui-tool:hover {
 403   background-color: #e1f3ff;
 404 }
 405
 406 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator,
 407 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
 408   opacity: 0.8;
 409 }
 410
 411 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
 412   background-color: white;
 413   border: solid 1px #ccc;
 414   box-shadow: 0 0.25em 1em rgba(0, 0, 0, 0.25);
 415 }
 416
 417 .oo-ui-popupToolGroup-active.oo-ui-widget-enabled {
 418   background: #f8fbfd;
 419   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f1f7fb), color-stop(100%, #ffffff));
 420   background-image: -webkit-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 421   background-image: -moz-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 422   background-image: -ms-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 423   background-image: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 424   background-image: linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
 425   border-bottom-right-radius: 0;
 426   border-bottom-left-radius: 0;
 427   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
 428   box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 429 }
 430
 431 .oo-ui-optionWidget-highlighted {
 432   background-color: #e1f3ff;
 433 }
 434
 435 .oo-ui-optionWidget-selected {
 436   background-color: #a7dcff;
 437 }
 438
 439 .oo-ui-menuWidget {
 440   margin-top: -1px;
 441   background: #fff;
 442   border: solid 1px #ccc;
 443   border-radius: 0 0 0.25em 0.25em;
 444   box-shadow: 0 0.15em 1em 0 rgba(0, 0, 0, 0.2);
 445 }
 446
 447 .oo-ui-popupWidget-popup {
 448   background-color: #fff;
 449   border: solid 1px #ccc;
 450   border-radius: 0.25em;
 451   box-shadow: 0 0.15em 0.5em 0 rgba(0, 0, 0, 0.2);
 452 }
 453
 454 .oo-ui-popupWidget-tailed .oo-ui-popupWidget-tail {
 455   width: 15px;
 456   height: 8px;
 457   margin-left: -7px;
 458   background-image: /* @embed */ url(images/tail.svg);
 459 }
 460
 461 .oo-ui-popupWidget-transitioning .oo-ui-popupWidget-popup {
 462   -webkit-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 463      -moz-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 464       -ms-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 465        -o-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 466           transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 467 }
 468
 469 .oo-ui-popupWidget-body {
 470   box-shadow: 0 0 0.66em rgba(0, 0, 0, 0.25);
 471 }
 472
 473 .oo-ui-buttonGroupWidget {
 474   display: inline-block;
 475   white-space: nowrap;
 476 }
 477
 478 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected,
 479 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-highlighted {
 480   background-color: transparent;
 481 }
 482
 483 .oo-ui-buttonSelectWidget {
 484   border-radius: 0.3em;
 485 }
 486
 487 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
 488   margin-left: -1px;
 489   border-radius: 0;
 490 }
 491
 492 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonedElement-button {
 493   margin-left: 0;
 494   border-bottom-left-radius: 0.3em;
 495   border-top-left-radius: 0.3em;
 496 }
 497
 498 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:last-child .oo-ui-buttonedElement-button {
 499   border-top-right-radius: 0.3em;
 500   border-bottom-right-radius: 0.3em;
 501 }
 502
 503 .oo-ui-inlineMenuWidget-handle {
 504   border: solid 1px rgba(0, 0, 0, 0.1);
 505   border-radius: 0.25em;
 506 }
 507
 508 .oo-ui-inlineMenuWidget-handle:hover {
 509   border-color: rgba(0, 0, 0, 0.2);
 510 }
 511
 512 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator,
 513 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
 514   opacity: 0.8;
 515 }
 516
 517 .oo-ui-menuItemWidget.oo-ui-optionWidget-highlighted {
 518   background-color: #e1f3ff;
 519 }
 520
 521 .oo-ui-menuSectionItemWidget {
 522   color: #888;
 523 }
 524
 525 .oo-ui-outlineControlsWidget {
 526   background-color: #fff;
 527 }
 528
 529 .oo-ui-outlineControlsWidget > .oo-ui-iconedElement-icon {
 530   opacity: 0.2;
 531 }
 532
 533 .oo-ui-outlineItemWidget {
 534   font-size: 1.1em;
 535 }
 536
 537 .oo-ui-outlineItemWidget.oo-ui-optionWidget-selected {
 538   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
 539   background-color: #a7dcff;
 540 }
 541
 542 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-important {
 543   font-weight: bold;
 544 }
 545
 546 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-placeholder {
 547   font-style: italic;
 548 }
 549
 550 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-empty .oo-ui-iconedElement-icon,
 551 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-empty .oo-ui-indicatedElement-indicator {
 552   opacity: 0.5;
 553 }
 554
 555 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-empty .oo-ui-labeledElement-label {
 556   color: #777;
 557 }
 558
 559 .oo-ui-searchWidget-query {
 560   box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.2);
 561 }
 562
 563 .oo-ui-textInputWidget input,
 564 .oo-ui-textInputWidget textarea {
 565   font-family: sans-serif;
 566   font-size: 1em;
 567   background-color: #fff;
 568   border: solid 1px #ccc;
 569   border-radius: 0.25em;
 570   box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd;
 571   -webkit-transition: border-color 200ms, box-shadow 200ms;
 572      -moz-transition: border-color 200ms, box-shadow 200ms;
 573       -ms-transition: border-color 200ms, box-shadow 200ms;
 574        -o-transition: border-color 200ms, box-shadow 200ms;
 575           transition: border-color 200ms, box-shadow 200ms;
 576 }
 577
 578 .oo-ui-textInputWidget.oo-ui-widget-enabled input:focus,
 579 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus {
 580   border-color: #a7dcff;
 581   outline: none;
 582   box-shadow: 0 0 0.3em #a7dcff, 0 0 0 white;
 583 }
 584
 585 .oo-ui-textInputWidget input[readonly],
 586 .oo-ui-textInputWidget textarea[readonly] {
 587   color: #777;
 588   text-shadow: 0 1px 1px #fff;
 589 }
 590
 591 .oo-ui-textInputWidget-pending input,
 592 .oo-ui-textInputWidget-pending textarea {
 593   background-color: transparent;
 594 }
 595
 596 .oo-ui-textInputWidget.oo-ui-widget-disabled input,
 597 .oo-ui-textInputWidget.oo-ui-widget-disabled input:focus,
 598 .oo-ui-textInputWidget.oo-ui-widget-disabled textarea,
 599 .oo-ui-textInputWidget.oo-ui-widget-disabled textarea:focus {
 600   color: #ccc;
 601   text-shadow: 0 1px 1px #fff;
 602   background-color: #f3f3f3;
 603   border-color: #ddd;
 604 }
 605
 606 .oo-ui-toggleSwitchWidget {
 607   background: #eeeeee;
 608   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #dddddd), color-stop(100%, #ffffff));
 609   background-image: -webkit-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 610   background-image: -moz-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 611   background-image: -ms-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 612   background-image: -o-linear-gradient(top, #dddddd 0%, #ffffff 100%);
 613   background-image: linear-gradient(top, #dddddd 0%, #ffffff 100%);
 614   border: solid 1px #ccc;
 615   border-radius: 1em;
 616   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#dddddd', endColorstr='#ffffff');
 617   box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd;
 618 }
 619
 620 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
 621   opacity: 0.5;
 622 }
 623
 624 .oo-ui-toggleSwitchWidget-grip {
 625   background: #eeeeee;
 626   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #ffffff), color-stop(100%, #dddddd));
 627   background-image: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 628   background-image: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 629   background-image: -ms-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 630   background-image: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%);
 631   background-image: linear-gradient(top, #ffffff 0%, #dddddd 100%);
 632   border: 1px #c9c9c9 solid;
 633   border-radius: 1em;
 634   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#dddddd');
 635   box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
 636 }
 637
 638 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover,
 639 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
 640   border-color: #aaa;
 641 }
 642
 643 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
 644   background: #cde7f4;
 645   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #b0d9ee), color-stop(100%, #eaf4fa));
 646   background-image: -webkit-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 647   background-image: -moz-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 648   background-image: -ms-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 649   background-image: -o-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 650   background-image: linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
 651   border-radius: 1em;
 652   filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#b0d9ee', endColorstr='#eaf4fa');
 653   box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
 654 }
 655
 656 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-glow {
 657   opacity: 1;
 658 }
 659
 660 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
 661   display: block;
 662   opacity: 0;
 663 }