LCARStrek/browser/browser.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 @import url("chrome://global/skin/");
   6
   7 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
   8 @namespace html url("http://www.w3.org/1999/xhtml");
   9
  10 toolbar {
  11   -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar");
  12 }
  13
  14 toolbar[type="menubar"][autohide="true"] {
  15   -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide");
  16 }
  17
  18 menubar {
  19   -moz-binding: url("chrome://global/skin/globalBindings.xml#menubar");
  20 }
  21
  22 #menubar-items {
  23   -moz-box-orient: vertical; /* for flex hack */
  24 }
  25
  26 #main-menubar {
  27   -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
  28 }
  29
  30 /* ::::: primary toolbar ::::: */
  31
  32 .toolbar-primary > .toolbar-box > .toolbar-holder {
  33   background-color: #A09090;
  34 }
  35
  36 .toolbar-primary > .toolbar-box > .toolbar-startcap,
  37 .toolbar-primary > .toolbar-box > .toolbar-endcap {
  38   background-color: #9C9CFF;
  39 }
  40
  41
  42 #navigator-toolbox {
  43 }
  44
  45 #navigator-toolbox::after {
  46   content: "";
  47   display: -moz-box;
  48   -moz-box-ordinal-group: 101; /* tabs toolbar is 100 */
  49   height: 1px;
  50 }
  51 #navigator-toolbox[tabsontop=false]::after,
  52 #main-window[disablechrome] #navigator-toolbox::after {
  53   visibility: collapse;
  54 }
  55
  56 #navigator-toolbox > toolbar:not(:-moz-lwtheme) {
  57 }
  58
  59 #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[inactive] ~ #TabsToolbar:not(:-moz-lwtheme) {
  60   /* like menubar */
  61   background-color: #6000CF;
  62   color: #FF9F00;
  63 }
  64 #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[inactive] ~ #TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive {
  65   background-color: #8050B0;
  66   color: #FF9F00;
  67 }
  68 #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[inactive] ~ #TabsToolbar > .tabbrowser-tabs > .tabbrowser-tab {
  69   padding-top: 3px;
  70 }
  71
  72 #main-window[tabsintitlebar] #titlebar:-moz-lwtheme {
  73   visibility: hidden;
  74 }
  75 #main-window[tabsintitlebar] #titlebar-content:-moz-lwtheme {
  76   -moz-binding: url("chrome://global/content/bindings/general.xml#windowdragbox");
  77   visibility: visible;
  78 }
  79
  80 #nav-bar[tabsontop="true"],
  81 #nav-bar[tabsontop="true"][collapsed="true"]:not([customizing]) + toolbar,
  82 #nav-bar[tabsontop="true"][collapsed="true"]:not([customizing]) + #customToolbars + #PersonalToolbar {
  83   /* background-image: linear-gradient(@toolbarHighlight@, rgba(255,255,255,0)); */
  84 }
  85
  86 #personal-bookmarks {
  87 /*  min-height: 24px; */
  88 }
  89
  90 #print-preview-toolbar:not(:-moz-lwtheme) {
  91   /* -moz-appearance: toolbox; */
  92 }
  93
  94 /* ::::: app menu button ::::: */
  95
  96 #appmenu-button {
  97   background-color: #FF9F00;
  98   background-clip: padding-box;
  99   border-radius: 0;
 100   border: none;
 101   border-right: 3px solid #000000;
 102   color: #000000;
 103   font-weight: bold;
 104   padding: 1px 1.5em;
 105   margin: 0;
 106 }
 107
 108 #appmenu-button:-moz-locale-dir(rtl) {
 109   border-left: 3px solid #000000;
 110   border-right: none;
 111 }
 112
 113 #main-window[privatebrowsingmode=temporary] #appmenu-button {
 114   background-color: #6000CF;
 115   color: #FFCF00;
 116 }
 117
 118 #appmenu-button:hover:not(:active):not([open]) {
 119 }
 120
 121 #main-window[privatebrowsingmode=temporary] #appmenu-button:hover:not(:active):not([open]) {
 122 }
 123
 124 #appmenu-button:hover,
 125 #appmenu-button:hover:active,
 126 #appmenu-button[open] {
 127   background-color: #FFCF00;
 128   color: #000000;
 129 }
 130
 131 #appmenu-button > .button-box > .button-menu-dropmarker {
 132   list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
 133   width: auto;
 134   height: auto;
 135   padding: 0;
 136   margin: 0;
 137   border: none;
 138   background-color: transparent;
 139   -moz-margin-start: .5em;
 140 }
 141
 142 #main-window[privatebrowsingmode=temporary] #appmenu-button > .button-box > .button-menu-dropmarker {
 143   list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
 144 }
 145
 146 #appmenuPrimaryPane > menuitem,
 147 #appmenuSecondaryPane > menuitem,
 148 #appmenuPrimaryPane > menu {
 149   padding: 2px;
 150 }
 151
 152 .splitmenu-menuitem {
 153   -moz-padding-start: 2px;
 154   padding-top: 2px;
 155   padding-bottom: 2px;
 156   -moz-margin-end: 1px;
 157 }
 158
 159 .splitmenu-menu {
 160   padding-top: 2px;
 161   padding-bottom: 2px;
 162   -moz-box-pack: end;
 163 }
 164
 165 .appmenu-edit-button {
 166 }
 167
 168 .appmenu-edit-button[disabled="true"] {
 169 }
 170
 171 #appmenuPrimaryPane {
 172   -moz-border-end: 1px solid #9C9CFF;
 173 }
 174 /*
 175   #appmenu-popup {
 176   }
 177   #appmenuPrimaryPane {
 178   }
 179   #appmenuSecondaryPane {
 180   }
 181   #appmenuSecondaryPane:-moz-locale-dir(rtl) {
 182   }
 183
 184   #appmenuSecondaryPane menupopup {
 185   }
 186
 187   .appmenu-menuseparator {
 188   }
 189
 190   .appmenu-edit-button:not([disabled]):hover {
 191   }
 192 */
 193 #appmenuSecondaryPane-spacer {
 194   min-height: 1em;
 195 }
 196
 197 #appmenu-editmenu {
 198   -moz-box-pack: end;
 199 }
 200
 201 #appmenu_print,
 202 #appmenu_print_popup,
 203 .appmenu-edit-button,
 204 #appmenu-editmenu-cut,
 205 #appmenu-editmenu-copy,
 206 #appmenu-editmenu-paste,
 207 #appmenu-quit {
 208   list-style-image: url("appmenu-icons.png");
 209 }
 210
 211 #appmenu-cut,
 212 #appmenu-editmenu-cut {
 213   -moz-image-region: rect(0 16px 16px 0);
 214 }
 215
 216 #appmenu-cut:hover:not([disabled="true"]),
 217 #appmenu-editmenu-cut:hover:not([disabled="true"]) {
 218   -moz-image-region: rect(16px 16px 32px 0);
 219 }
 220
 221 #appmenu-cut[disabled="true"],
 222 #appmenu-editmenu-cut[disabled="true"] {
 223   -moz-image-region: rect(32px 16px 48px 0);
 224 }
 225
 226 #appmenu-copy,
 227 #appmenu-editmenu-copy {
 228   -moz-image-region: rect(0 32px 16px 16px);
 229 }
 230
 231 #appmenu-copy:hover:not([disabled="true"]),
 232 #appmenu-editmenu-copy:hover:not([disabled="true"]) {
 233   -moz-image-region: rect(16px 32px 32px 16px);
 234 }
 235
 236 #appmenu-copy[disabled="true"],
 237 #appmenu-editmenu-copy[disabled="true"] {
 238   -moz-image-region: rect(32px 32px 48px 16px);
 239 }
 240
 241 #appmenu-paste,
 242 #appmenu-editmenu-paste {
 243   -moz-image-region: rect(0 48px 16px 32px);
 244 }
 245
 246 #appmenu-paste:hover:not([disabled="true"]),
 247 #appmenu-editmenu-paste:hover:not([disabled="true"]) {
 248   -moz-image-region: rect(16px 48px 32px 32px);
 249 }
 250
 251 #appmenu-paste[disabled="true"],
 252 #appmenu-editmenu-paste[disabled="true"] {
 253   -moz-image-region: rect(32px 48px 48px 32px);
 254 }
 255
 256 #appmenu_print,
 257 #appmenu_print_popup {
 258   -moz-image-region: rect(0 64px 16px 48px);
 259 }
 260
 261 #appmenu_print:hover:not([disabled="true"]),
 262 #appmenu_print[open="true"],
 263 #appmenu_print_popup:hover:not([disabled="true"]) {
 264   -moz-image-region: rect(16px 64px 32px 48px);
 265 }
 266
 267 #appmenu-print[disabled="true"],
 268 #appmenu_print_popup[disabled="true"] {
 269   -moz-image-region: rect(32px 64px 48px 48px);
 270 }
 271
 272 #appmenu-quit {
 273   -moz-image-region: rect(0 80px 16px 64px);
 274 }
 275
 276 #appmenu-quit:hover {
 277   -moz-image-region: rect(16px 80px 32px 64px);
 278 }
 279
 280 #appmenu-edit-label {
 281   -moz-appearance: none;
 282   background: transparent;
 283   font-style: italic;
 284 }
 285
 286 #appmenu_bookmarks {
 287   list-style-image: url("chrome://browser/skin/places/bookmark.png");
 288   -moz-image-region: rect(0px 48px 16px 32px);
 289 }
 290
 291 #appmenu_privateBrowsing,
 292 #appmenu_newPrivateWindow {
 293   list-style-image: url("chrome://browser/skin/Privacy-16.png");
 294 }
 295
 296 @media (min-resolution: 1.25dppx) {
 297   #appmenu_privateBrowsing,
 298   #appmenu_newPrivateWindow {
 299     list-style-image: url("chrome://browser/skin/Privacy-32.png");
 300   }
 301 }
 302
 303 #appmenu_addons {
 304   list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
 305 }
 306
 307 @media (min-resolution: 1.25dppx) {
 308   #appmenu_addons {
 309     list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
 310   }
 311 }
 312
 313 #BMB_bookmarkThisPage,
 314 #appmenu_bookmarkThisPage {
 315   list-style-image: url("chrome://browser/skin/places/bookmark.png");
 316   -moz-image-region: rect(0 16px 16px 0);
 317 }
 318
 319 /* ::::: titlebar ::::: */
 320
 321 #titlebar {
 322   /* like menubar */
 323   background-color: #6000CF;
 324   color: #FF9F00;
 325 }
 326 #titlebar:-moz-window-inactive {
 327   background-color: #8050B0;
 328   color: #FF9F00;
 329 }
 330
 331 #main-window[sizemode="normal"] > #titlebar {
 332   margin-top: -3px;
 333   margin-bottom: 3px;
 334 }
 335
 336 #main-window[sizemode="maximized"] > #titlebar {
 337   margin-top: 4px;
 338 }
 339
 340 #titlebar-buttonbox {
 341   margin-top: 5px;
 342   -moz-margin-end: 3px;
 343 }
 344
 345 #main-window[sizemode="maximized"] #titlebar-buttonbox {
 346 }
 347
 348 .titlebar-placeholder[type="appmenu-button"] {
 349   margin-left: 4px;
 350 }
 351
 352 .titlebar-placeholder[type="caption-buttons"] {
 353   margin-left: 10px;
 354 }
 355
 356 /* titlebar command buttons */
 357
 358 #titlebar-min {
 359   list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
 360 }
 361
 362 #titlebar-min:hover {
 363   list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
 364 }
 365
 366 #titlebar-max {
 367   list-style-image: url("chrome://browser/skin/win-maximize.gif");
 368 }
 369
 370 #titlebar-max:hover {
 371   list-style-image: url("chrome://browser/skin/win-maximize-hover.gif");
 372 }
 373
 374 #main-window[sizemode="maximized"] #titlebar-max {
 375   list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
 376 }
 377
 378 #main-window[sizemode="maximized"] #titlebar-max:hover {
 379   list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
 380 }
 381
 382 #titlebar-close {
 383   list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
 384 }
 385
 386 #titlebar-close:hover {
 387   list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
 388 }
 389
 390 /* ::::: bookmark buttons ::::: */
 391
 392 /*.bookmark-item:not(#bookmarks-menu-button) > .toolbarbutton-icon */
 393 .bookmark-item > .toolbarbutton-icon {
 394   width: 16px;
 395   height: 16px;
 396 }
 397
 398 #PlacesToolbarItems > .bookmark-item:not([image]):not([label=""]):not([container]) > .toolbarbutton-icon {
 399   display: none;
 400 }
 401
 402 /* Prevent [mode="icons"] from hiding the label */
 403 .bookmark-item > .toolbarbutton-text {
 404   display: -moz-box !important;
 405 }
 406
 407 .bookmark-item > .toolbarbutton-menu-dropmarker {
 408   display: none;
 409 }
 410
 411 #wrapper-personal-bookmarks[place="palette"] > .toolbarpaletteitem-box {
 412   background: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") no-repeat center;
 413 }
 414
 415 .bookmarks-toolbar-customize {
 416   max-width: 15em !important;
 417   list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") !important;
 418 }
 419
 420 /* ::::: bookmark menus ::::: */
 421
 422 menu.bookmark-item,
 423 menuitem.bookmark-item {
 424   min-width: 0;
 425   max-width: 32em;
 426 }
 427
 428 .bookmark-item > .menu-iconic-left {
 429   margin-top: 0;
 430   margin-bottom: 0;
 431 }
 432
 433 .bookmark-item > .menu-iconic-left > .menu-iconic-icon {
 434   -moz-padding-start: 0px;
 435 }
 436
 437 /* ::::: bookmark items ::::: */
 438
 439 .bookmark-item  {
 440   list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
 441   -moz-image-region: auto;
 442 }
 443
 444 .bookmark-item[container] {
 445   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
 446   -moz-image-region: auto;
 447 }
 448
 449 .bookmark-item[container][open] {
 450   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
 451   -moz-image-region: auto;
 452 }
 453
 454 .bookmark-item[container][livemark] {
 455   list-style-image: url("chrome://communicator/skin/bookmarks/livemark-folder.png");
 456   -moz-image-region: auto;
 457 }
 458
 459 .bookmark-item[container][livemark] .bookmark-item {
 460   list-style-image: url("chrome://communicator/skin/bookmarks/livemark-item.png");
 461   -moz-image-region: rect(0px, 16px, 16px, 0px);
 462 }
 463
 464 .bookmark-item[container][livemark] .bookmark-item[visited] {
 465   -moz-image-region: rect(0px, 32px, 16px, 16px);
 466 }
 467
 468 .bookmark-item[container][query] {
 469   list-style-image: url("chrome://communicator/skin/bookmarks/query.png");
 470   -moz-image-region: auto;
 471 }
 472
 473 .bookmark-item[query][tagContainer] {
 474   list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
 475   -moz-image-region: auto;
 476 }
 477
 478 .bookmark-item[query][dayContainer] {
 479   list-style-image: url("chrome://communicator/skin/history/calendar.png");
 480   -moz-image-region: auto;
 481 }
 482
 483 .bookmark-item[query][hostContainer] {
 484   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
 485   -moz-image-region: auto;
 486 }
 487
 488 .bookmark-item[query][hostContainer][open] {
 489   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
 490   -moz-image-region: auto;
 491 }
 492
 493 .bookmark-item[cutting] > .toolbarbutton-icon,
 494 .bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-icon {
 495   opacity: 0.5;
 496 }
 497
 498 .bookmark-item[cutting] > .toolbarbutton-text,
 499 .bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-text {
 500   opacity: 0.7;
 501 }
 502
 503 /* ::::: primary toolbar buttons ::::: */
 504
 505 .toolbarbutton-1 {
 506   list-style-image: url("chrome://browser/skin/FxToolbar.png");
 507 }
 508
 509 .toolbarbutton-1:not([type="menu-button"]) {
 510   -moz-box-orient: vertical;
 511 }
 512
 513 .toolbarbutton-1,
 514 .toolbarbutton-1 > .toolbarbutton-menubutton-button {
 515   min-width: 36px;
 516   min-height: 36px;
 517 }
 518
 519 .toolbarbutton-1:not([type="menu-button"]) {
 520   -moz-box-orient: vertical;
 521 }
 522
 523 .toolbarbutton-1,
 524 .toolbarbutton-1 > .toolbarbutton-menubutton-button,
 525 .toolbarbutton-1[disabled="true"]:hover:active,
 526 .toolbarbutton-1[disabled="true"]:hover:active > .toolbarbutton-menubutton-button {
 527   padding: 1px 2px;
 528 }
 529
 530 .toolbarbutton-1:hover:active,
 531 .toolbarbutton-1[open="true"],
 532 .toolbarbutton-1:hover:active > .toolbarbutton-menubutton-button {
 533   padding-top: 2px;
 534   padding-bottom: 0px;
 535   -moz-padding-start: 3px;
 536   -moz-padding-end: 1px;
 537 }
 538
 539 /* ::::: small primary toolbar buttons ::::: */
 540
 541 #nav-bar {
 542   /* force iconsize="small" on this toolbar */
 543   counter-reset: smallicons;
 544 }
 545
 546 toolbar[mode="text"] .toolbarbutton-1,
 547 toolbar[mode="icons"] .toolbarbutton-1,
 548 toolbar[iconsize="small"] .toolbarbutton-1,
 549 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1,
 550 toolbar[mode="text"] .toolbarbutton-menubutton-button,
 551 toolbar[mode="icons"] .toolbarbutton-menubutton-button,
 552 toolbar[iconsize="small"] .toolbarbutton-menubutton-button,
 553 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-button {
 554   min-width: 0px;
 555   min-height: 0px;
 556 }
 557
 558 toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker {
 559   padding-top: 4px;
 560   padding-bottom: 8px;
 561   -moz-padding-start: 1px;
 562   -moz-padding-end: 1px;
 563 }
 564
 565 toolbar[mode="icons"] .toolbarbutton-menubutton-dropmarker,
 566 toolbar[iconsize="small"] .toolbarbutton-menubutton-dropmarker,
 567 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
 568   padding-top: 0px;
 569   padding-bottom: 13px;
 570   -moz-padding-start: 1px;
 571   -moz-padding-end: 1px;
 572 }
 573
 574 toolbar[mode="text"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
 575 toolbar[mode="text"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker {
 576   padding-top: 5px;
 577   padding-bottom: 7px;
 578   -moz-padding-start: 0px;
 579   -moz-padding-end: 2px;
 580 }
 581
 582 toolbar[mode="icons"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
 583 toolbar[mode="icons"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker,
 584 toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
 585 toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker,
 586 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
 587 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker {
 588   padding-top: 1px;
 589   padding-bottom: 12px;
 590   -moz-padding-start: 0px;
 591   -moz-padding-end: 2px;
 592 }
 593
 594 toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker[disabled="true"] {
 595   padding-top: 4px !important;
 596   padding-bottom: 8px !important;
 597   -moz-padding-start: 1px !important;
 598   -moz-padding-end: 1px !important;
 599 }
 600
 601 toolbar[mode="icons"] .toolbarbutton-menubutton-dropmarker[disabled="true"],
 602 toolbar[iconsize="small"] > .toolbarbutton-menubutton-dropmarker[disabled="true"] {
 603   padding-top: 0px !important;
 604   padding-bottom: 13px !important;
 605   -moz-padding-start: 1px !important;
 606   -moz-padding-end: 1px !important;
 607 }
 608
 609 toolbar[mode="icons"] .toolbarbutton-text,
 610 toolbar[mode="text"] .toolbarbutton-icon {
 611   display: none;
 612 }
 613
 614 toolbar[mode="text"] .toolbarbutton-text {
 615   padding: 4px 0;
 616 }
 617
 618 toolbar[mode="text"] .toolbarbutton-1,
 619 toolbar[mode="text"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
 620   -moz-box-orient: horizontal;
 621 }
 622
 623 toolbar[mode="full"] .toolbarbutton-1,
 624 toolbar[mode="full"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
 625   min-width: 30px;
 626 }
 627
 628 #navigator-toolbox[iconsize=small] > #nav-bar {
 629 }
 630
 631 #navigator-toolbox[iconsize=large][mode=icons] > #nav-bar {
 632 }
 633
 634
 635 /* unified back/forward button */
 636
 637 #back-button {
 638   -moz-image-region: rect(0, 18px, 18px, 0);
 639   -moz-margin-end: 0;
 640 }
 641
 642 #back-button:not([disabled="true"]):hover {
 643   -moz-image-region: rect(18px, 18px, 36px, 0);
 644 }
 645
 646 #back-button[disabled="true"] {
 647   -moz-image-region: rect(36px, 18px, 54px, 0);
 648 }
 649
 650 #forward-button {
 651   -moz-image-region: rect(0, 36px, 18px, 18px);
 652   border-left: none;
 653   -moz-margin-start: 0;
 654 }
 655
 656 #forward-button:not([disabled="true"]):hover {
 657   -moz-image-region: rect(18px, 36px, 36px, 18px);
 658 }
 659
 660 #forward-button[disabled="true"] {
 661   -moz-image-region: rect(36px, 36px, 54px, 18px);
 662 }
 663
 664 #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
 665 #forward-button:-moz-locale-dir(rtl),
 666 #forward-button:-moz-locale-dir(rtl) > .toolbarbutton-text {
 667   transform: scaleX(-1);
 668 }
 669
 670 #nav-bar #back-button {
 671   -moz-margin-end: 0 !important;
 672 }
 673
 674 #nav-bar #forward-button {
 675   border-left-style: none;
 676   -moz-margin-start: 0 !important;
 677 }
 678
 679 #nav-bar #back-button:-moz-locale-dir(ltr) {
 680   border-top-right-radius: 0;
 681   border-bottom-right-radius: 0;
 682 }
 683
 684 #nav-bar #back-button:-moz-locale-dir(rtl),
 685 #nav-bar #forward-button {
 686   border-top-left-radius: 0;
 687   border-bottom-left-radius: 0;
 688 }
 689
 690 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 691     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 692     #unified-back-forward-button > #back-button {
 693   border-radius: 10000px;
 694   width: 30px;
 695   height: 30px;
 696   position: relative;
 697   z-index: 1;
 698   margin-top: -2px;
 699   margin-bottom: -2px;
 700   border: none;
 701   -moz-image-region: rect(54px, 20px, 74px, 0);
 702 }
 703
 704 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 705     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 706     #unified-back-forward-button > #back-button:not([disabled="true"]):hover,
 707 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 708     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 709     #unified-back-forward-button > #back-button[open="true"] {
 710   -moz-image-region: rect(54px, 40px, 74px, 20px);
 711 }
 712
 713 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 714     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 715     #unified-back-forward-button > #back-button[disabled="true"] {
 716   -moz-image-region: rect(54px, 60px, 74px, 40px);
 717 }
 718
 719 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 720     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 721     #unified-back-forward-button > #back-button:not([disabled="true"]):not([open="true"]):not(:active):hover {
 722 }
 723
 724 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 725     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 726     #unified-back-forward-button > #back-button:not([disabled="true"]):hover:active,
 727 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 728     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 729     #unified-back-forward-button > #back-button[open="true"] {
 730 }
 731
 732 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar[currentset*="unified-back-forward-button"],
 733 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar:not([currentset]) {
 734 /*  padding-top: 3px;
 735   padding-bottom: 5px; */
 736 }
 737
 738 #navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar[currentset*="unified-back-forward-button"],
 739 #navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar:not([currentset]) {
 740 /*  padding-top: 5px; */
 741 }
 742
 743 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 744     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 745     #unified-back-forward-button > #forward-button {
 746   /*mask: url(keyhole-forward-mask.svg#mask); XXX: this regresses twinopen */
 747   /*clip-path: url("chrome://browser/content/browser.xul#winstripe-keyhole-forward-clip-path"); */
 748   -moz-margin-start: -6px !important;
 749   padding-left: 7px;
 750   padding-right: 3px;
 751   margin-top: 2px;
 752   margin-bottom: 2px;
 753 }
 754
 755 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 756     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 757     #unified-back-forward-button > #forward-button:-moz-locale-dir(ltr) {
 758   border-top-right-radius: 11px;
 759   border-bottom-right-radius: 11px;
 760 }
 761
 762 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 763     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 764     #unified-back-forward-button > #forward-button:-moz-locale-dir(rtl) {
 765   border-top-left-radius: 11px;
 766   border-bottom-left-radius: 11px;
 767 }
 768
 769 .unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
 770 .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
 771   list-style-image: url("chrome://global/skin/arrow/arrow-left.gif") !important;
 772 }
 773
 774 .unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr):hover,
 775 .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl):hover {
 776   list-style-image: url("chrome://global/skin/arrow/arrow-left-hover.gif") !important;
 777 }
 778
 779 .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr),
 780 .unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl) {
 781   list-style-image: url("chrome://global/skin/arrow/arrow-right.gif") !important;
 782 }
 783
 784 .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr):hover,
 785 .unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl):hover {
 786   list-style-image: url("chrome://global/skin/arrow/arrow-right.gif") !important;
 787 }
 788
 789 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 790     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 791     #unified-back-forward-button > #forward-button {
 792 /*  border-top-right-radius: 0;
 793   border-bottom-right-radius: 0;
 794   -moz-margin-end: 0; */
 795 }
 796
 797 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 798     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 799     #unified-back-forward-button:not([switchingtabs]) > #forward-button {
 800   transition: opacity 150ms ease-out;
 801 }
 802
 803 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 804     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 805     #unified-back-forward-button:not(:hover) > #forward-button[disabled] {
 806   opacity: 0;
 807 }
 808
 809 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
 810     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
 811     #unified-back-forward-button:hover > #forward-button[disabled] {
 812   background-color: transparent;
 813 }
 814
 815 #stop-button {
 816   -moz-image-region: rect(0, 54px, 18px, 36px);
 817 }
 818
 819 #stop-button:not([disabled="true"]):hover {
 820   -moz-image-region: rect(18px, 54px, 36px, 36px);
 821 }
 822
 823 #stop-button[disabled="true"] {
 824   -moz-image-region: rect(36px, 54px, 54px, 36px);
 825 }
 826
 827 #reload-button {
 828   -moz-image-region: rect(0, 72px, 18px, 54px);
 829 }
 830
 831 #reload-button:not([disabled="true"]):hover {
 832   -moz-image-region: rect(18px, 72px, 36px, 54px);
 833 }
 834
 835 #reload-button[disabled="true"] {
 836   -moz-image-region: rect(36px, 72px, 54px, 54px);
 837 }
 838
 839 #home-button.bookmark-item {
 840   list-style-image: url("chrome://browser/skin/FxToolbar.png");
 841 }
 842 #home-button {
 843   -moz-image-region: rect(0, 90px, 18px, 72px);
 844 }
 845
 846 #home-button:not([disabled="true"]):hover {
 847   -moz-image-region: rect(18px, 90px, 36px, 72px);
 848 }
 849
 850 #home-button[disabled="true"] {
 851   -moz-image-region: rect(36px, 90px, 54px, 72px);
 852 }
 853
 854 #downloads-button {
 855   -moz-image-region: rect(0, 108px, 18px, 90px);
 856 }
 857
 858 #downloads-button:not([disabled="true"]):hover {
 859   -moz-image-region: rect(18px, 108px, 36px, 90px);
 860 }
 861
 862 #downloads-button[disabled="true"] {
 863   -moz-image-region: rect(36px, 108px, 54px, 90px);
 864 }
 865
 866 #downloads-button > .toolbarbutton-icon {
 867   margin: 0;
 868 }
 869
 870 #history-button {
 871   -moz-image-region: rect(0, 126px, 18px, 108px);
 872 }
 873
 874 #history-button:not([disabled="true"]):hover {
 875   -moz-image-region: rect(18px, 126px, 36px, 108px);
 876 }
 877
 878 #history-button[disabled="true"] {
 879   -moz-image-region: rect(36px, 126px, 54px, 108px);
 880 }
 881
 882 #bookmarks-button,
 883 #bookmarks-menu-button {
 884   list-style-image: url("chrome://browser/skin/FxToolbar.png") !important; /* for making the palette work */
 885   -moz-image-region: rect(0, 144px, 18px, 126px);
 886 }
 887
 888 #bookmarks-menu-button.bookmark-item {
 889   /* list-style-image: url("chrome://browser/skin/FxToolbar.png"); */
 890 }
 891
 892 #bookmarks-menu-button.toolbarbutton-1 {
 893   -moz-box-orient: horizontal;
 894 }
 895
 896 #bookmarks-button:not([disabled="true"]):hover,
 897 #bookmarks-menu-button[open="true"],
 898 #bookmarks-menu-button:not([disabled="true"]):hover {
 899   -moz-image-region: rect(18px, 144px, 36px, 126px);
 900 }
 901
 902 #bookmarks-button[disabled="true"],
 903 #bookmarks-menu-button[disabled="true"] {
 904   -moz-image-region: rect(36px, 144px, 54px, 126px);
 905 }
 906
 907 #print-button {
 908   -moz-image-region: rect(0, 162px, 18px, 144px);
 909 }
 910
 911 #print-button:not([disabled="true"]):hover {
 912   -moz-image-region: rect(18px, 162px, 36px, 144px);
 913 }
 914
 915 #print-button[disabled="true"] {
 916   -moz-image-region: rect(36px, 162px, 54px, 144px);
 917 }
 918
 919 #new-tab-button {
 920   -moz-image-region: rect(0, 180px, 18px, 162px);
 921 }
 922
 923 #new-tab-button:not([disabled="true"]):hover {
 924   -moz-image-region: rect(18px, 180px, 36px, 162px);
 925 }
 926
 927 #new-tab-button[disabled="true"] {
 928   -moz-image-region: rect(36px, 180px, 54px, 162px);
 929 }
 930
 931 #new-window-button {
 932   -moz-image-region: rect(0, 198px, 18px, 180px);
 933 }
 934
 935 #new-window-button:not([disabled="true"]):hover {
 936   -moz-image-region: rect(18px, 198px, 36px, 180px);
 937 }
 938
 939 #new-window-button[disabled="true"] {
 940   -moz-image-region: rect(36px, 198px, 54px, 180px);
 941 }
 942
 943 #cut-button {
 944   -moz-image-region: rect(0, 216px, 18px, 198px);
 945 }
 946
 947 #cut-button:not([disabled="true"]):hover {
 948   -moz-image-region: rect(18px, 216px, 36px, 198px);
 949 }
 950
 951 #cut-button[disabled="true"] {
 952   -moz-image-region: rect(36px, 216px, 54px, 198px);
 953 }
 954
 955 #copy-button {
 956   -moz-image-region: rect(0, 234px, 18px, 216px);
 957 }
 958
 959 #copy-button:not([disabled="true"]):hover {
 960   -moz-image-region: rect(18px, 234px, 36px, 216px);
 961 }
 962
 963 #copy-button[disabled="true"] {
 964   -moz-image-region: rect(36px, 234px, 54px, 216px);
 965 }
 966
 967 #paste-button {
 968   -moz-image-region: rect(0, 252px, 18px, 234px);
 969 }
 970
 971 #paste-button:not([disabled="true"]):hover {
 972   -moz-image-region: rect(18px, 252px, 36px, 234px);
 973 }
 974
 975 #paste-button[disabled="true"] {
 976   -moz-image-region: rect(36px, 252px, 54px, 234px);
 977 }
 978
 979 #fullscreen-button {
 980   -moz-image-region: rect(0, 270px, 18px, 252px);
 981 }
 982
 983 #fullscreen-button:not([disabled="true"]):hover {
 984   -moz-image-region: rect(18px, 270px, 36px, 252px);
 985 }
 986
 987 #fullscreen-button[disabled="true"] {
 988   -moz-image-region: rect(36px, 270px, 54px, 252px);
 989 }
 990
 991 #zoom-out-button {
 992   -moz-image-region: rect(0, 288px, 18px, 270px);
 993   -moz-margin-end: 0;
 994 }
 995
 996 #zoom-in-button {
 997   -moz-image-region: rect(0, 306px, 18px, 288px);
 998 }
 999
1000 #zoom-out-button:not([disabled="true"]):hover {
1001   -moz-image-region: rect(18px, 288px, 36px, 270px);
1002 }
1003
1004 #zoom-out-button[disabled="true"] {
1005   -moz-image-region: rect(36px, 288px, 54px, 270px);
1006 }
1007
1008 #zoom-in-button:not([disabled="true"]):hover {
1009   -moz-image-region: rect(18px, 306px, 36px, 288px);
1010 }
1011
1012 #zoom-in-button[disabled="true"] {
1013   -moz-image-region: rect(36px, 306px, 54px, 288px);
1014 }
1015
1016 #sync-button:not([status]) {
1017   list-style-image: url("chrome://browser/skin/FxToolbar.png") !important; /* for making the palette work */
1018   -moz-image-region: rect(0, 324px, 18px, 306px);
1019 }
1020
1021 #sync-button[status="active"] {
1022   list-style-image: url("chrome://browser/skin/sync-throbber.png");
1023   -moz-image-region: rect(0, 18px, 18px, 0);
1024 }
1025
1026 #sync-button[disabled="true"] {
1027   -moz-image-region: rect(36px, 324px, 54px, 306px);
1028 }
1029
1030 #feed-button {
1031   -moz-image-region: rect(0, 342px, 18px, 324px);
1032 }
1033
1034 #feed-button[disabled="true"] {
1035   -moz-image-region: rect(36px, 342px, 54px, 324px);
1036 }
1037
1038 #webrtc-status-button {
1039   -moz-image-region: rect(0, 360px, 18px, 342px);
1040 }
1041
1042 #webrtc-status-button:not([disabled="true"]):hover,
1043 #webrtc-status-button[open="true"] {
1044   -moz-image-region: rect(18px, 360px, 36px, 342px);
1045 }
1046
1047 #webrtc-status-button[disabled="true"] {
1048   -moz-image-region: rect(36px, 360px, 54px, 342px);
1049 }
1050
1051 /* tabview button & menu item */
1052
1053 #tabview-button,
1054 #menu_tabview {
1055   list-style-image: url("chrome://browser/skin/tabview/tabview.png");
1056 }
1057
1058 #tabview-button {
1059   -moz-image-region: rect(0, 90px, 18px, 72px);
1060 }
1061
1062 #tabview-button[groups="0"] {
1063   -moz-image-region: rect(0, 18px, 18px, 0);
1064 }
1065
1066 #tabview-button[groups="1"] {
1067   -moz-image-region: rect(0, 36px, 18px, 18px);
1068 }
1069
1070 #tabview-button[groups="2"] {
1071   -moz-image-region: rect(0, 54px, 18px, 36px);
1072 }
1073
1074 #tabview-button[groups="3"] {
1075   -moz-image-region: rect(0, 72px, 18px, 54px);
1076 }
1077
1078 #menu_tabview {
1079   -moz-image-region: rect(1px, 89px, 17px, 73px);
1080 }
1081
1082 #menu_tabview[groups="0"] {
1083   -moz-image-region: rect(1px, 17px, 17px, 1px);
1084 }
1085
1086 #menu_tabview[groups="1"] {
1087   -moz-image-region: rect(1px, 35px, 17px, 19px);
1088 }
1089
1090 #menu_tabview[groups="2"] {
1091   -moz-image-region: rect(1px, 53px, 17px, 37px);
1092 }
1093
1094 #menu_tabview[groups="3"] {
1095   -moz-image-region: rect(1px, 71px, 17px, 55px);
1096 }
1097
1098 /* ::::: fullscreen window controls ::::: */
1099
1100 #window-controls {
1101   -moz-margin-start: 4px;
1102 }
1103
1104 #minimize-button,
1105 #restore-button,
1106 #close-button {
1107 /*  padding: 0; */
1108 }
1109
1110 #minimize-button {
1111   list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
1112 }
1113
1114 #minimize-button:hover {
1115   list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
1116 }
1117
1118 #restore-button {
1119   list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
1120 }
1121
1122 #restore-button:hover {
1123   list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
1124 }
1125
1126 #close-button {
1127   list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
1128 }
1129
1130 #close-button:hover {
1131   list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
1132 }
1133
1134 /* ::::: Location Bar ::::: */
1135
1136 #urlbar,
1137 .searchbar-textbox {
1138   border-radius: 5px;
1139   margin: 0;
1140   -moz-margin-start: 3px;
1141 }
1142
1143 #urlbar {
1144   width: 7em;
1145   /* make color as light as possible to deal with dark non-domain parts */
1146   color: #FFBFFF;
1147 }
1148
1149 #urlbar:-moz-lwtheme,
1150 .searchbar-textbox:-moz-lwtheme {
1151   /* background-color: rgba(255,255,255,.8);
1152   @navbarTextboxCustomBorder@
1153   color: black; */
1154 }
1155
1156 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1157     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1158     #unified-back-forward-button + #urlbar-container {
1159   padding-left: 22px;
1160   -moz-margin-start: -22px;
1161   position: relative;
1162   pointer-events: none;
1163 }
1164
1165 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1166     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1167     #unified-back-forward-button + #urlbar-container > #urlbar {
1168 /*  -moz-border-start: none;
1169   margin-left: 0; */
1170   pointer-events: all;
1171 }
1172
1173 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1174     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1175     #unified-back-forward-button:not([switchingtabs]) + #urlbar-container > #urlbar {
1176   transition: margin-left 150ms ease-out;
1177 }
1178
1179 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1180     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1181     #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(ltr) {
1182 /*  border-top-left-radius: 0;
1183   border-bottom-left-radius: 0; */
1184 }
1185
1186 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1187     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1188     #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(rtl) {
1189 /*  border-top-right-radius: 0;
1190   border-bottom-right-radius: 0; */
1191 }
1192
1193 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1194     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1195     #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar {
1196   margin-left: -22px;
1197 }
1198
1199 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1200     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1201     #unified-back-forward-button[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar {
1202   /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */
1203   transition-delay: 100s;
1204 }
1205
1206 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1207     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1208     #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar {
1209   /* when not hovered anymore, trigger a new transition to hide the forward button immediately */
1210   margin-left: -22.01px;
1211 }
1212
1213 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1214     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1215     #unified-back-forward-button + #urlbar-container:-moz-locale-dir(rtl),
1216 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1217     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1218     #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(rtl) {
1219   /* let winstripe-urlbar-back-button-clip-path clip the urlbar's right side for RTL */
1220   transform: scaleX(-1);
1221 }
1222
1223 html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
1224 .searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
1225   color: #E7ADE7;
1226 }
1227
1228 #urlbar:-moz-lwtheme[focused="true"],
1229 .searchbar-textbox:-moz-lwtheme[focused="true"] {
1230 /*  background-color: white; */
1231 }
1232
1233 #urlbar-container {
1234   -moz-box-orient: horizontal;
1235   -moz-box-align: stretch;
1236 }
1237
1238 .urlbar-textbox-container {
1239   -moz-box-align: stretch;
1240 }
1241
1242 .urlbar-input-box {
1243   -moz-margin-start: 0;
1244   min-width: 4em;
1245 }
1246
1247 #urlbar-icons {
1248   -moz-box-align: center;
1249 }
1250
1251 .urlbar-icon {
1252   padding: 0 2px;
1253 }
1254
1255 .searchbar-engine-button,
1256 .search-go-container {
1257   padding: 2px;
1258 }
1259
1260 .search-go-container > .search-go-button {
1261   padding: 0;
1262 }
1263
1264 .urlbar-icon:hover {
1265 }
1266
1267 .urlbar-icon[open="true"],
1268 .urlbar-icon:hover:active {
1269 }
1270
1271 #urlbar-search-splitter {
1272   min-width: 6px;
1273   -moz-margin-start: -3px;
1274   border: none;
1275   background: transparent;
1276 }
1277
1278 #urlbar-search-splitter + #urlbar-container > #urlbar,
1279 #urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox {
1280   -moz-margin-start: 0;
1281 }
1282
1283 #urlbar-display {
1284   -moz-border-end: 1px solid #9C9CFF;
1285   -moz-margin-end: 3px;
1286   margin-top: 0;
1287   margin-bottom: 0;
1288   -moz-margin-start: 0;
1289   color: #8050B0;
1290 }
1291
1292 /* identity box */
1293
1294 #identity-box {
1295   border-radius: 2px;
1296   font-size: .9em;
1297 }
1298
1299 #notification-popup-box:not([hidden]) + #identity-box {
1300   -moz-padding-start: 10px !important;
1301   border-radius: 0;
1302 }
1303
1304 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1305     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1306     #unified-back-forward-button + #urlbar-container > #urlbar > #identity-box {
1307 /*   border-radius: 0; */
1308   -moz-padding-start: 2px;
1309   -moz-padding-end: 2px;
1310   -moz-margin-end: 1px;
1311 }
1312
1313 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1314     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1315     #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
1316   padding-left: 2px;
1317   transition: padding-left;
1318 }
1319
1320 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1321     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1322     #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
1323   padding-right: 2px;
1324   transition: padding-right;
1325 }
1326
1327 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1328     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1329     #unified-back-forward-button[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box {
1330   /* forward button hiding is delayed when hovered */
1331   transition-delay: 100s;
1332 }
1333
1334 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1335     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1336     #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
1337   /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
1338   padding-left: 2.01px;
1339 }
1340
1341 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1342     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1343     #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
1344   /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
1345   padding-right: 2.01px;
1346 }
1347
1348 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
1349   color: #008484;
1350   -moz-border-end: 1px solid #008484;
1351   -moz-margin-end: 3px;
1352 }
1353
1354 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(ltr) {
1355   border-top-right-radius: 0;
1356   border-bottom-right-radius: 0;
1357 }
1358
1359 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(rtl) {
1360   border-top-left-radius: 0;
1361   border-bottom-left-radius: 0;
1362 }
1363
1364 #identity-box.verifiedIdentity:not(:-moz-lwtheme) {
1365   background-color: #000000;
1366 }
1367
1368 #identity-box:-moz-focusring {
1369   outline: 1px dotted #008484;
1370   outline-offset: -1px;
1371 }
1372
1373 #identity-box.verifiedDomain:-moz-focusring,
1374 #identity-box.verifiedIdentity:-moz-focusring {
1375   outline-color: #000000;
1376 }
1377
1378 #identity-icon-labels {
1379   -moz-margin-start: 1px;
1380   -moz-margin-end: 3px;
1381 }
1382
1383 /* Location bar dropmarker */
1384
1385 .urlbar-history-dropmarker:not(:hover):not([open="true"]) {
1386   background-color: transparent;
1387 }
1388
1389 #urlbar-container[combined="true"] > #urlbar > .urlbar-history-dropmarker {
1390   border: none;
1391   border-radius: 0px;
1392 }
1393
1394 .urlbar-history-dropmarker:hover {
1395 }
1396
1397 .urlbar-history-dropmarker:hover:active,
1398 .urlbar-history-dropmarker[open="true"] {
1399 }
1400
1401 /* page proxy icon */
1402
1403 #page-proxy-favicon {
1404   width: 16px;
1405   height: 16px;
1406   list-style-image: url("chrome://browser/skin/identity-icons-generic.png");
1407   -moz-image-region: rect(0, 16px, 16px, 0);
1408 }
1409
1410 .verifiedDomain > #page-proxy-favicon[pageproxystate="valid"] {
1411   list-style-image: url("chrome://browser/skin/identity-icons-https.png");
1412 }
1413
1414 .verifiedIdentity > #page-proxy-favicon[pageproxystate="valid"] {
1415   list-style-image: url("chrome://browser/skin/identity-icons-https-ev.png");
1416 }
1417
1418 .mixedActiveContent > #page-proxy-favicon[pageproxystate="valid"] {
1419   list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-active.png");
1420 }
1421
1422 #identity-box:hover > #page-proxy-favicon {
1423   -moz-image-region: rect(0, 32px, 16px, 16px);
1424 }
1425
1426 #identity-box:hover:active > #page-proxy-favicon,
1427 #identity-box[open=true] > #page-proxy-favicon {
1428   -moz-image-region: rect(0, 48px, 16px, 32px);
1429 }
1430
1431 #identity-box:hover {
1432   background-color: #FFCF00;
1433   color: #000000;
1434 }
1435
1436 #identity-box:hover:active,
1437 #identity-box[open=true] {
1438   background-color: #FF9F00;
1439   color: #000000;
1440 }
1441
1442 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover,
1443 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover:active,
1444 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity[open=true] {
1445   background-color: #008484;
1446   color: #000000;
1447 }
1448
1449 #page-proxy-favicon[pageproxystate="invalid"] {
1450   opacity: 0.3;
1451 }
1452
1453 /* autocomplete */
1454
1455 #treecolAutoCompleteImage {
1456   max-width: 36px;
1457 }
1458
1459 .ac-result-type-bookmark,
1460 .autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
1461   list-style-image: url("chrome://browser/skin/places/bookmark.png");
1462   -moz-image-region: rect(0px 16px 16px 0px);
1463   width: 16px;
1464   height: 16px;
1465 }
1466
1467 .ac-result-type-keyword,
1468 .autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) {
1469   list-style-image: url("chrome://global/skin/icons/Search-glass.png");
1470   -moz-image-region: rect(0px 32px 16px 16px);
1471   width: 16px;
1472   height: 16px;
1473 }
1474
1475 .ac-result-type-tag,
1476 .autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
1477   list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
1478   width: 16px;
1479   height: 16px;
1480 }
1481
1482 .ac-comment {
1483   font-size: 1.15em;
1484 }
1485
1486 .ac-extra > .ac-comment {
1487   font-size: inherit;
1488 }
1489
1490 .ac-url-text,
1491 .ac-action-text {
1492   color: #9C9CFF;
1493 }
1494
1495 richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
1496   list-style-image: url("chrome://browser/skin/actionicon-tab.png");
1497   -moz-image-region: rect(0, 16px, 16px, 0);
1498   padding: 0 3px;
1499 }
1500
1501 richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
1502   -moz-image-region: rect(16px, 16px, 32px, 0);
1503 }
1504
1505 .autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
1506   color: #8050B0;
1507 }
1508
1509 .ac-comment[selected="true"],
1510 .ac-url-text[selected="true"],
1511 .ac-action-text[selected="true"] {
1512   color: inherit !important;
1513 }
1514
1515 .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
1516 .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
1517 {
1518   color: #8050B0;
1519   font-size: smaller;
1520 }
1521
1522 .autocomplete-treebody::-moz-tree-cell(suggesthint) {
1523   border-top: 1px solid #9C9CFF;
1524 }
1525
1526 /* combined go/reload/stop button in location bar */
1527
1528 #go-button,
1529 #urlbar > toolbarbutton {
1530   list-style-image: url("chrome://browser/skin/reload-stop-go.png");
1531   /* margin: -2px; */
1532   -moz-margin-start: 0;
1533   padding: 0 2px;
1534   background-origin: border-box;
1535   border: none;
1536   -moz-border-start: 1px solid #9C9CFF;
1537 }
1538
1539 #go-button {
1540   padding: 0 3px;
1541 }
1542
1543 #urlbar:-moz-locale-dir(ltr) > toolbarbutton {
1544   border-top-left-radius: 0px;
1545   border-bottom-left-radius: 0px;
1546 }
1547
1548 #urlbar:-moz-locale-dir(rtl) > toolbarbutton {
1549   border-top-right-radius: 0px;
1550   border-bottom-right-radius: 0px;
1551 }
1552
1553 #urlbar > toolbarbutton:not([disabled]):active:hover,
1554 #urlbar-reload-button:not(:hover) {
1555   -moz-border-start-style: none;
1556   -moz-padding-start: 3px;
1557 }
1558
1559 #urlbar > toolbarbutton:not([disabled]):active:hover {
1560 }
1561
1562 #urlbar-go-button {
1563   -moz-image-region: rect(0, 42px, 14px, 28px);
1564 }
1565
1566 #go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
1567 #urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
1568   transform: scaleX(-1);
1569 }
1570
1571 #urlbar-go-button:hover,
1572 #go-button:hover {
1573   -moz-image-region: rect(14px, 42px, 28px, 28px);
1574 }
1575
1576 #urlbar-reload-button {
1577   -moz-image-region: rect(0px, 14px, 14px, 0px);
1578 }
1579
1580 #urlbar-reload-button[disabled] {
1581   -moz-image-region: rect(28px, 14px, 42px, 0px);
1582 }
1583
1584 #urlbar-reload-button:not([disabled]):hover {
1585   -moz-image-region: rect(14px, 14px, 28px, 0px);
1586 }
1587
1588 #urlbar-stop-button {
1589   -moz-image-region: rect(0px, 28px, 14px, 14px);
1590 }
1591
1592 #urlbar-stop-button:hover {
1593   -moz-image-region: rect(14px, 28px, 28px, 14px);
1594 }
1595
1596 /* popup blocker button */
1597
1598 #page-report-button {
1599   list-style-image: url("chrome://browser/skin/urlbar-popup-blocked.png");
1600   -moz-image-region: rect(0, 16px, 16px, 0);
1601 }
1602
1603 #page-report-button:hover ,
1604 #page-report-button:hover:active,
1605 #page-report-button[open="true"] {
1606   -moz-image-region: rect(0, 32px, 16px, 16px);
1607 }
1608
1609 /* social share panel */
1610
1611 #social-share-panel > iframe {
1612 /*  background: linear-gradient(to bottom, #f0f4f7, #fafbfc);*/
1613   width: 300px;
1614   height: 150px;
1615 }
1616
1617 #social-share-button {
1618   list-style-image: url("chrome://browser/skin/social/share-button.png");
1619   -moz-image-region: rect(0, 16px, 16px, 0);
1620 }
1621
1622 .social-share-toolbar {
1623   border-right: 1px solid #9C9CFF;
1624 /*  background-color: #000000; */
1625 }
1626
1627 #social-share-provider-buttons {
1628   padding: 6px;
1629 }
1630
1631 #social-share-provider-buttons > .share-provider-button {
1632   -moz-appearance: none;
1633   padding: 5px;
1634   margin: 1px;
1635   border: none;
1636   background: none;
1637   border-radius: 2px;
1638 }
1639
1640 #social-share-provider-buttons > .share-provider-button[checked="true"]:not([disabled="true"]),
1641 #social-share-provider-buttons > .share-provider-button:hover,
1642 #social-share-provider-buttons > .share-provider-button:active {
1643   padding: 4px;
1644 }
1645
1646 #social-share-provider-buttons > .share-provider-button[checked="true"]:not([disabled="true"]) {
1647 }
1648
1649 #social-share-provider-buttons > .share-provider-button > .toolbarbutton-text {
1650   display: none;
1651 }
1652 #social-share-provider-buttons > .share-provider-button > .toolbarbutton-icon {
1653   width: 16px;
1654   min-height: 16px;
1655   max-height: 16px;
1656 }
1657
1658 /* fixup corners for share panel */
1659 .social-panel > .social-panel-frame {
1660   border-radius: inherit;
1661 }
1662
1663 #social-share-panel {
1664   max-height: 600px;
1665   min-height: 100px;
1666   max-width: 800px;
1667   min-width: 300px;
1668 }
1669
1670 .social-share-frame {
1671 /*  background: linear-gradient(to bottom, #f0f4f7, #fafbfc); */
1672   width: 330px;
1673   height: 150px;
1674   /* we resize our panels dynamically, make it look nice */
1675   transition: height 100ms ease-out, width 100ms ease-out;
1676 }
1677
1678 .social-share-frame:-moz-locale-dir(ltr) {
1679   border-top-left-radius: 0;
1680   border-bottom-left-radius: 0;
1681   border-top-right-radius: inherit;
1682   border-bottom-right-radius: inherit;
1683 }
1684
1685 .social-share-frame:-moz-locale-dir(rtl) {
1686   border-top-left-radius: inherit;
1687   border-bottom-left-radius: inherit;
1688   border-top-right-radius: 0;
1689   border-bottom-right-radius: 0;
1690 }
1691
1692 #social-share-panel > .social-share-toolbar:-moz-locale-dir(ltr) {
1693   border-top-left-radius: inherit;
1694   border-bottom-left-radius: inherit;
1695 }
1696
1697 #social-share-panel > .social-share-toolbar:-moz-locale-dir(rtl) {
1698   border-top-right-radius: inherit;
1699   border-bottom-right-radius: inherit;
1700 }
1701
1702 #social-share-provider-buttons:-moz-locale-dir(ltr) {
1703   border-top-left-radius: inherit;
1704   border-bottom-left-radius: inherit;
1705 }
1706
1707 #social-share-provider-buttons:-moz-locale-dir(rtl) {
1708   border-top-right-radius: inherit;
1709   border-bottom-right-radius: inherit;
1710 }
1711
1712 /* social recommending panel */
1713
1714 #social-mark-button {
1715   -moz-image-region: rect(0, 16px, 16px, 0);
1716 }
1717
1718 /* star button */
1719
1720 #star-button {
1721   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark.png");
1722   -moz-image-region: rect(16px 16px 32px 0px);
1723 }
1724
1725 #star-button:hover {
1726   -moz-image-region: rect(16px 32px 32px 16px);
1727 }
1728
1729 #star-button:hover:active {
1730   -moz-image-region: rect(16px 48px 32px 32px);
1731 }
1732
1733 #star-button[starred="true"] {
1734   -moz-image-region: rect(0px 16px 16px 0px);
1735 }
1736
1737 #star-button[starred="true"]:hover {
1738   -moz-image-region: rect(0px 32px 16px 16px);
1739 }
1740
1741 #star-button[starred="true"]:hover:active {
1742   -moz-image-region: rect(0px 48px 16px 32px);
1743 }
1744
1745 /* bookmarking panel */
1746 #editBookmarkPanelStarIcon {
1747   list-style-image: url("chrome://browser/skin/places/starred48.png");
1748   width: 48px;
1749   height: 48px;
1750 }
1751
1752 #editBookmarkPanelStarIcon[unstarred] {
1753   list-style-image: url("chrome://browser/skin/places/unstarred48.png");
1754 }
1755
1756 #editBookmarkPanelTitle {
1757   font-size: 130%;
1758 }
1759
1760 #editBookmarkPanelHeader,
1761 #editBookmarkPanelContent {
1762   margin-bottom: .5em;
1763 }
1764
1765 /* Implements editBookmarkPanel resizing on folderTree un-collapse. */
1766 #editBMPanel_folderTree {
1767   min-width: 27em;
1768 }
1769
1770 .panel-promo-box {
1771   margin: 5px -6px -6px;
1772   padding: 5px;
1773   border-top: 1px solid #9C9CFF;
1774   border-bottom-left-radius: 5px;
1775   border-bottom-right-radius: 5px;
1776 }
1777
1778 .panel-promo-icon {
1779   list-style-image: url("chrome://browser/skin/sync-notification-24.png");
1780   -moz-margin-end: 10px;
1781   vertical-align: middle;
1782 }
1783
1784 .panel-promo-closebutton {
1785   list-style-image: url("chrome://global/skin/icons/close-button.gif");
1786   -moz-margin-end: -3px;
1787   margin-top: -3px;
1788 }
1789
1790 .panel-promo-closebutton:hover {
1791   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1792 }
1793
1794 .panel-promo-closebutton:hover:active {
1795   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1796 }
1797
1798 .panel-promo-closebutton > .toolbarbutton-text {
1799   padding: 0;
1800   margin: 0;
1801 }
1802
1803 /* ::::: content area ::::: */
1804
1805 #sidebar {
1806   background-color: Window;
1807 }
1808
1809 #sidebar-title {
1810   -moz-padding-start: 0px;
1811 }
1812
1813 /* ::::: throbber ::::: */
1814
1815 #navigator-throbber {
1816   width: 16px;
1817   min-height: 16px;
1818   margin: 0 3px;
1819 }
1820
1821 #navigator-throbber[busy="true"] {
1822   list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
1823 }
1824
1825 #navigator-throbber,
1826 #wrapper-navigator-throbber > #navigator-throbber {
1827   list-style-image: url("chrome://communicator/skin/brand/throbber16-single.png");
1828 }
1829
1830 /* Tabstrip */
1831
1832 #TabsToolbar {
1833   min-height: 0;
1834   padding: 0;
1835   -moz-binding: url("chrome://global/content/bindings/toolbar.xml#toolbar");
1836 }
1837
1838 #TabsToolbar .toolbar-holder {
1839   background-color: #000000; /* correct effect of being an actual toolbar */
1840 }
1841
1842 #main-window[disablechrome] #TabsToolbar,
1843 #TabsToolbar[tabsontop="false"] {
1844   border-bottom: 1px solid #008484;
1845 }
1846
1847 .tabbrowser-tab,
1848 .tabs-newtab-button {
1849   margin-top: 0px;
1850 }
1851
1852 .tabbrowser-tab{
1853   padding: 1px 4px 2px;
1854 }
1855
1856 .tabbrowser-tab:first-of-type {
1857   -moz-margin-start: 2px;
1858 }
1859
1860 .tabs-newtab-button {
1861   border-radius: 8px 8px 0px 0px;
1862   -moz-margin-start: 0;
1863 }
1864
1865 .tabs-newtab-button:not(:hover) {
1866   background-color: #C09070;
1867 }
1868
1869 .tabbrowser-tab:hover,
1870 .tabs-newtab-button:hover {
1871 }
1872
1873 .tabbrowser-tab[selected="true"] {
1874 }
1875
1876 #main-window[tabsontop=false]:not([disablechrome]) .tabbrowser-tab[selected=true]:not(:-moz-lwtheme) {
1877 }
1878
1879 .tabbrowser-tab:-moz-lwtheme {
1880 }
1881
1882 .tabbrowser-tab[selected="true"]:-moz-lwtheme {
1883 }
1884
1885 .tabbrowser-tab:-moz-lwtheme-brighttext:not([selected="true"]),
1886 .tabs-newtab-button:-moz-lwtheme-brighttext {
1887 }
1888
1889 .tabbrowser-tab:-moz-lwtheme-brighttext:not([selected="true"]):hover,
1890 .tabs-newtab-button:-moz-lwtheme-brighttext:hover {
1891 }
1892
1893 .tabbrowser-tab:-moz-lwtheme-darktext:not([selected="true"]),
1894 .tabs-newtab-button:-moz-lwtheme-darktext {
1895 }
1896
1897 .tabbrowser-tab:-moz-lwtheme-darktext:not([selected="true"]):hover,
1898 .tabs-newtab-button:-moz-lwtheme-darktext:hover {
1899 }
1900
1901 .tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) {
1902   background-color: #E7ADE7;
1903 }
1904 .tabbrowser-tab[pinned][titlechanged]:not([selected="true"]):hover {
1905   background-color: #3333FF;
1906   color: #000000;
1907 }
1908
1909 .tab-throbber,
1910 .tab-icon-image {
1911   width: 16px;
1912   height: 16px;
1913   list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
1914   -moz-image-region: auto;
1915   -moz-margin-end: 3px;
1916 }
1917
1918 .tab-throbber {
1919   list-style-image: url("chrome://communicator/skin/brand/throbber16-anim-connect.png");
1920 }
1921
1922 .tab-throbber[progress] {
1923   list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
1924 }
1925
1926 .tab-throbber[pinned],
1927 .tab-icon-image[pinned] {
1928   -moz-margin-start: 2px;
1929   -moz-margin-end: 2px;
1930 }
1931
1932 /* tabbrowser-tab focus ring */
1933 .tabbrowser-tab:focus > .tab-stack {
1934   outline: 1px dotted;
1935 }
1936
1937 /* Tab DnD indicator */
1938 .tab-drop-indicator {
1939   list-style-image: url("chrome://browser/skin/tabbrowser/tabDragIndicator.png");
1940   margin-bottom: -11px;
1941 }
1942
1943 /* Tab close button */
1944 .tab-close-button {
1945   border: none;
1946   padding: 0px;
1947   margin-top: 1px;
1948   list-style-image: url("chrome://global/skin/icons/close-button.gif");
1949 }
1950
1951 .tab-close-button:hover,
1952 .tab-close-button:hover[selected="true"] {
1953   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1954 }
1955
1956 .tab-close-button:hover:active,
1957 .tab-close-button:hover:active[selected="true"] {
1958   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1959 }
1960
1961 /* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */
1962
1963 .tabbrowser-arrowscrollbox > .scrollbutton-up,
1964 .tabbrowser-arrowscrollbox > .scrollbutton-down {
1965   margin: 0;
1966   padding-top: 0;
1967   padding-bottom: 0;
1968 }
1969
1970 .tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
1971   background-color: #008484;
1972 }
1973
1974 .tabs-newtab-button > .toolbarbutton-icon {
1975   margin-top: -1px;
1976   margin-bottom: -1px;
1977 }
1978
1979 .tabs-newtab-button,
1980 #TabsToolbar > #new-tab-button,
1981 #TabsToolbar > toolbarpaletteitem > #new-tab-button {
1982   list-style-image: url("chrome://browser/skin/tabbrowser/newtab.png");
1983   -moz-image-region: rect(0, 16px, 18px, 0);
1984 }
1985
1986 .tabs-newtab-button {
1987   width: 28px;
1988 }
1989
1990 #TabsToolbar > #new-tab-button {
1991   width: 26px;
1992 }
1993
1994 .tabs-newtab-button,
1995 .tabs-newtab-button:hover,
1996 #TabsToolbar > #new-tab-button:hover {
1997   -moz-image-region: rect(0, 32px, 18px, 16px);
1998 }
1999
2000 #alltabs-button {
2001   list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
2002 }
2003
2004 #alltabs-button > .toolbarbutton-menu-dropmarker {
2005   display: none;
2006 }
2007
2008 #alltabs-button:hover,
2009 #alltabs-button:hover:active,
2010 #alltabs-button[open="true"] {
2011   list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
2012 }
2013
2014 /* All tabs menupopup */
2015 .alltabs-item > .menu-iconic-left > .menu-iconic-icon {
2016   list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
2017   -moz-image-region: auto;
2018 }
2019
2020 .alltabs-item[selected="true"] {
2021   font-weight: bold;
2022 }
2023
2024 .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon {
2025   list-style-image: url("chrome://global/skin/icons/loading.gif");
2026 }
2027
2028 .alltabs-item[tabIsVisible]:not([_moz-menuactive="true"]) {
2029   background-color: #402800;
2030 }
2031
2032 /* Tabstrip close button */
2033 .tabs-closebutton {
2034   -moz-box-flex: 1;
2035   margin: 0px;
2036   padding: 2px;
2037   list-style-image: url("chrome://global/skin/icons/close-button.gif");
2038 }
2039
2040 .tabs-closebutton > .toolbarbutton-icon {
2041 }
2042
2043 .tabs-closebutton > .toolbarbutton-text {
2044   display: none;
2045 }
2046
2047 .tabs-closebutton:hover,
2048 .tabs-closebutton:hover:active {
2049   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2050 }
2051
2052 toolbarbutton.chevron {
2053   list-style-image: url("chrome://global/skin/toolbar/chevron.gif") !important;
2054 }
2055
2056 toolbarbutton.chevron:hover {
2057   list-style-image: url("chrome://global/skin/toolbar/chevron-hover.gif") !important;
2058 }
2059
2060 toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon,
2061 toolbarbutton.chevron:-moz-locale-dir(rtl):hover > .toolbarbutton-icon {
2062   transform: scaleX(-1);
2063 }
2064
2065 toolbarbutton.chevron > .toolbarbutton-text,
2066 toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
2067   display: none;
2068 }
2069
2070 toolbarbutton.chevron > .toolbarbutton-icon {
2071   margin: 0;
2072 }
2073
2074 toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
2075   display: -moz-box; /* display chevron icon in text mode */
2076 }
2077
2078 #sidebar-throbber[loading="true"] {
2079   list-style-image: url("chrome://global/skin/icons/loading.gif");
2080   -moz-margin-end: 4px;
2081 }
2082
2083 /* Bookmarks toolbar */
2084 #PlacesToolbarDropIndicator {
2085   list-style-image: url("chrome://communicator/skin/bookmarks/toolbarDropMarker.png");
2086 }
2087
2088 toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2089   background-color: #008484 !important;
2090   color: #FFCF00 !important;
2091 }
2092
2093 /* rules for menupopup drop indicators */
2094 .menupopup-drop-indicator-bar {
2095   position: relative;
2096   /* these two margins must together compensate the indicator's height */
2097   margin-top: -1px;
2098   margin-bottom: -1px;
2099 }
2100
2101 .menupopup-drop-indicator {
2102   list-style-image: none;
2103   height: 2px;
2104   -moz-margin-end: -4em;
2105   background-color: #008484;
2106 }
2107
2108 /* ::::: Identity Indicator Styling ::::: */
2109
2110 /* Popup Icons */
2111 #identity-popup-icon {
2112   height: 64px;
2113   width: 64px;
2114   padding: 0;
2115   list-style-image: url("chrome://browser/skin/identity.png");
2116   -moz-image-region: rect(0px, 64px, 64px, 0px);
2117 }
2118
2119 #identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
2120   -moz-image-region: rect(64px, 64px, 128px, 0px);
2121 }
2122
2123 #identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
2124   -moz-image-region: rect(128px, 64px, 192px, 0px);
2125 }
2126
2127 /* Popup Body Text */
2128 .identity-popup-description {
2129   white-space: pre-wrap;
2130   -moz-padding-start: 15px;
2131   margin: 2px 0 4px;
2132 }
2133
2134 .identity-popup-label {
2135   white-space: pre-wrap;
2136   -moz-padding-start: 15px;
2137   margin: 0;
2138 }
2139
2140 #identity-popup-content-host,
2141 #identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner {
2142   font-size: 1.2em;
2143 }
2144
2145 #identity-popup-content-host {
2146   margin-top: 3px;
2147   margin-bottom: 5px;
2148   font-weight: bold;
2149   max-width: 300px;
2150 }
2151
2152 #identity-popup-content-owner {
2153   margin-top: 4px;
2154   margin-bottom: 0 !important;
2155   font-weight: bold;
2156   max-width: 300px;
2157 }
2158
2159 .verifiedDomain > #identity-popup-content-owner {
2160   font-weight: normal;
2161 }
2162
2163 #identity-popup-content-verifier {
2164   margin: 4px 0 2px;
2165 }
2166
2167 #identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
2168 #identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
2169   margin-top: 10px;
2170   -moz-margin-start: -24px;
2171 }
2172
2173 #identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
2174 #identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
2175   list-style-image: url("chrome://browser/skin/Secure24.png");
2176 }
2177
2178 #identity-popup-more-info-button {
2179   margin-top: 6px;
2180   margin-bottom: 0;
2181   -moz-margin-end: 0;
2182 }
2183
2184 .popup-notification-icon {
2185   width: 64px;
2186   height: 64px;
2187   -moz-margin-end: 10px;
2188 }
2189
2190 .popup-notification-icon[popupid="geolocation"] {
2191   list-style-image: url("chrome://browser/skin/Geolocation-64.png");
2192 }
2193
2194 .popup-notification-icon[popupid="xpinstall-disabled"],
2195 .popup-notification-icon[popupid="addon-progress"],
2196 .popup-notification-icon[popupid="addon-install-cancelled"],
2197 .popup-notification-icon[popupid="addon-install-blocked"],
2198 .popup-notification-icon[popupid="addon-install-failed"],
2199 .popup-notification-icon[popupid="addon-install-complete"] {
2200   list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
2201   width: 32px;
2202   height: 32px;
2203 }
2204
2205 .popup-notification-icon[popupid="click-to-play-plugins"] {
2206   list-style-image: url("chrome://mozapps/skin/plugins/pluginBlocked-64.png");
2207 }
2208
2209 .popup-notification-icon[popupid="plugins-not-found"] {
2210   list-style-image: url("chrome://browser/skin/pluginInstall-64.png");
2211 }
2212
2213 .popup-notification-icon[popupid="web-notifications"] {
2214   list-style-image: url("chrome://browser/skin/notification-64.png");
2215 }
2216
2217 .addon-progress-description {
2218   width: 350px;
2219   max-width: 350px;
2220 }
2221
2222 .popup-progress-label,
2223 .popup-progress-meter {
2224   -moz-margin-start: 0;
2225   -moz-margin-end: 0;
2226 }
2227
2228 .popup-progress-cancel {
2229   -moz-appearance: none;
2230   background: transparent;
2231   border: none;
2232   padding: 0;
2233   margin: 0;
2234   min-height: 0;
2235   min-width: 0;
2236   list-style-image: url("chrome://mozapps/skin/downloads/downloadButtons.png");
2237   -moz-image-region: rect(0px, 32px, 16px, 16px);
2238 }
2239
2240 .popup-progress-cancel:hover {
2241   -moz-image-region: rect(16px, 32px, 32px, 16px);
2242 }
2243
2244 .popup-progress-cancel:active {
2245   -moz-image-region: rect(32px, 32px, 48px, 16px);
2246 }
2247
2248 .popup-notification-icon[popupid="indexedDB-permissions-prompt"],
2249 .popup-notification-icon[popupid="indexedDB-quota-prompt"],
2250 .popup-notification-icon[popupid*="offline-app-requested"],
2251 .popup-notification-icon[popupid="offline-app-usage"] {
2252   list-style-image: url("chrome://global/skin/icons/alert-question.gif");
2253 }
2254
2255 .popup-notification-icon[popupid="password-save"],
2256 .popup-notification-icon[popupid="password-change"] {
2257   list-style-image: url("chrome://mozapps/skin/passwordmgr/key-64.png");
2258 }
2259
2260 .popup-notification-icon[popupid="webapps-install"] {
2261   list-style-image: url("chrome://browser/skin/webapps-64.png");
2262 }
2263
2264 .popup-notification-icon[popupid="mixed-content-blocked"] {
2265   list-style-image: url("chrome://browser/skin/mixed-content-blocked-64.png");
2266 }
2267
2268 .popup-notification-icon[popupid="webRTC-sharingDevices"],
2269 .popup-notification-icon[popupid="webRTC-shareDevices"] {
2270   list-style-image: url("chrome://browser/skin/webRTC-shareDevice-64.png");
2271 }
2272
2273 .popup-notification-icon[popupid="pointerLock"] {
2274   list-style-image: url("chrome://browser/skin/pointerLock-64.png");
2275 }
2276
2277 /* Notification icon box */
2278 #notification-popup-box {
2279   position: relative;
2280   background-color: #000000;
2281   background-clip: padding-box;
2282   padding-left: 3px;
2283   padding-right: 8px;
2284   border-radius: 3px 0 0 3px;
2285   border-image: url("chrome://browser/skin/urlbar-arrow.png") 0 8 0 0 / 0 8px 0 0;
2286   -moz-margin-end: -8px;
2287   border-right-width: 8px;
2288 }
2289
2290 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
2291     :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
2292     #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box {
2293 /*  padding-left: 5px; */
2294 }
2295
2296 #notification-popup-box:-moz-locale-dir(rtl),
2297 .notification-anchor-icon:-moz-locale-dir(rtl) {
2298   transform: scaleX(-1);
2299 }
2300
2301 .notification-anchor-icon {
2302   width: 16px;
2303   height: 16px;
2304   margin: 0 2px;
2305 }
2306
2307 .notification-anchor-icon:-moz-focusring {
2308   outline: 1px dotted #008484;
2309 /*  outline-offset: -3px; */
2310 }
2311
2312 .default-notification-icon,
2313 #default-notification-icon {
2314   list-style-image: url("chrome://global/skin/icons/information-16.png");
2315 }
2316
2317 .identity-notification-icon,
2318 #identity-notification-icon {
2319   list-style-image: url("chrome://mozapps/skin/profile/profileicon.png");
2320 }
2321
2322 .geo-notification-icon,
2323 #geo-notification-icon {
2324   list-style-image: url("chrome://browser/skin/Geolocation-16.png");
2325 }
2326
2327 #addons-notification-icon {
2328   list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
2329 }
2330
2331 .indexedDB-notification-icon,
2332 #indexedDB-notification-icon {
2333   list-style-image: url("chrome://global/skin/icons/question-16.png");
2334 }
2335
2336 #password-notification-icon {
2337   list-style-image: url("chrome://mozapps/skin/passwordmgr/key-16.png");
2338 }
2339
2340 #webapps-notification-icon {
2341   list-style-image: url("chrome://browser/skin/webapps-16.png");
2342 }
2343
2344 #plugins-notification-icon {
2345   list-style-image: url("chrome://mozapps/skin/plugins/pluginGeneric-16.png");
2346 }
2347
2348 #blocked-plugins-notification-icon {
2349   list-style-image: url("chrome://mozapps/skin/plugins/notifyPluginBlocked.png");
2350 }
2351
2352 #plugin-install-notification-icon {
2353   list-style-image: url("chrome://browser/skin/pluginInstall-16.png");
2354 }
2355
2356 #notification-popup-box[hidden] {
2357   /* Override display:none to make the pluginBlockedNotification animation work
2358      when showing the notification repeatedly. */
2359   display: -moz-box;
2360   visibility: collapse;
2361 }
2362
2363 #blocked-plugins-notification-icon[showing] {
2364   animation: pluginBlockedNotification 500ms ease 0s 5 alternate both;
2365 }
2366
2367 @keyframes pluginBlockedNotification {
2368   from {
2369     opacity: 0;
2370   }
2371   to {
2372     opacity: 1;
2373   }
2374 }
2375
2376 .mixed-content-blocked-notification-icon,
2377 #mixed-content-blocked-notification-icon {
2378   list-style-image: url("chrome://browser/skin/mixed-content-blocked-16.png");
2379 }
2380
2381 .webRTC-shareDevices-notification-icon,
2382 #webRTC-shareDevices-notification-icon {
2383   list-style-image: url("chrome://browser/skin/webRTC-shareDevice-16.png");
2384 }
2385
2386 .webRTC-sharingDevices-notification-icon,
2387 #webRTC-sharingDevices-notification-icon {
2388   list-style-image: url("chrome://browser/skin/webRTC-sharingDevice-16.png");
2389 }
2390
2391 .web-notifications-notification-icon,
2392 #web-notifications-notification-icon {
2393   list-style-image: url("chrome://browser/skin/notification-16.png");
2394 }
2395
2396 #pointerLock-notification-icon {
2397   list-style-image: url("chrome://browser/skin/pointerLock-16.png");
2398 }
2399 #pointerLock-cancel {
2400   margin: 0px;
2401 }
2402
2403 #identity-popup-container {
2404   min-width: 280px;
2405 }
2406
2407 #download-monitor {
2408   list-style-image: url("chrome://browser/skin/FxToolbar.png");
2409   -moz-image-region: rect(0, 108px, 18px, 90px);
2410 }
2411
2412 /* Bookmarks roots menu-items */
2413 #appmenu_subscribeToPage:not([disabled]),
2414 #appmenu_subscribeToPageMenu,
2415 #subscribeToPageMenuitem:not([disabled]),
2416 #subscribeToPageMenupopup,
2417 #BMB_subscribeToPageMenuitem:not([disabled]),
2418 #BMB_subscribeToPageMenupopup {
2419   list-style-image: url("chrome://browser/skin/feeds/feedIcon16.png");
2420 }
2421
2422 #bookmarksToolbarFolderMenu,
2423 #appmenu_bookmarksToolbar,
2424 #BMB_bookmarksToolbar {
2425   list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png");
2426   -moz-image-region: auto;
2427 }
2428
2429 #appmenu_unsortedBookmarks,
2430 #BMB_unsortedBookmarks {
2431   list-style-image: url("chrome://communicator/skin/bookmarks/unsortedBookmarks.png");
2432   -moz-image-region: auto;
2433 }
2434
2435 /* ::::: Keyboard UI Panel ::::: */
2436
2437 .KUI-panel {
2438   color: #FF9F00;
2439   border-style: none;
2440   border-radius: 20px;
2441 }
2442
2443 .KUI-panel[level="top"] {
2444   /*background-color: rgba(27%,27%,27%,.65);*/
2445 }
2446
2447 /* Ctrl-Tab */
2448
2449 #ctrlTab-panel {
2450   padding: 20px 10px 10px;
2451   font-weight: bold;
2452 }
2453
2454 .ctrlTab-favicon[src] {
2455   background-color: #000000;
2456   width: 20px;
2457   height: 20px;
2458   padding: 2px;
2459 }
2460
2461 .ctrlTab-preview-inner > .tabPreview-canvas {
2462 }
2463
2464 .ctrlTab-preview:not(#ctrlTab-showAll) > * > .ctrlTab-preview-inner > .tabPreview-canvas {
2465   margin-bottom: 2px;
2466 }
2467
2468 .ctrlTab-preview-inner {
2469   padding-bottom: 10px;
2470 }
2471
2472 #ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
2473   padding: 10px;
2474   background-color: #000000;
2475   border-radius: .5em;
2476 }
2477
2478 .ctrlTab-preview:focus > * > .ctrlTab-preview-inner {
2479   color: white;
2480   background-color: #000000;
2481   text-shadow: none;
2482   padding: 8px;
2483   border: 2px solid #9C9CFF;
2484   border-radius: .5em;
2485 }
2486
2487 .ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
2488   margin: -10px -10px 0;
2489 }
2490
2491 #ctrlTab-showAll {
2492   margin-top: .5em;
2493 }
2494
2495 /* Add-on bar */
2496
2497 #addon-bar {
2498   min-height: 20px;
2499   border-top: 3px solid #000000;
2500   border-bottom-width: 0;
2501 }
2502
2503 #addon-bar .toolbar-holder {
2504   background-color: #8050B0;
2505   color: #FFCF00;
2506 }
2507
2508 #addon-bar .toolbar-holder {
2509   background-color: #8050B0;
2510   color: #FFCF00;
2511 }
2512
2513 #addon-bar .toolbar-startcap,
2514 #addon-bar .toolbar-endcap{
2515   background-color: #6000CF;
2516 }
2517
2518 #status-bar {
2519   -moz-binding: url("chrome://global/content/bindings/general.xml#statusbar");
2520   margin-top: .3em;
2521   border-width: 0;
2522 }
2523
2524 #addon-bar[customizing] > #status-bar {
2525   opacity: .5;
2526 /*  background-image: -moz-repeating-linear-gradient(-45deg,
2527                                                    rgba(255,255,255,.3), rgba(255,255,255,.3) 5px,
2528                                                    rgba(0,0,0,.3) 5px, rgba(0,0,0,.3) 10px);*/
2529 }
2530
2531 /* Remove all borders from statusbarpanel children of
2532    the statusbar.
2533 #status-bar > statusbarpanel {
2534   border-width: 0;
2535 } */
2536
2537 #addonbar-closebutton {
2538   border: none;
2539   padding: 3px 5px;
2540   list-style-image: url("chrome://global/skin/icons/close-button.gif");
2541 }
2542
2543 #addonbar-closebutton:hover,
2544 #addonbar-closebutton:hover:active {
2545   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2546 }
2547
2548 /* Status panel */
2549
2550 .statuspanel-label {
2551   margin: 0;
2552   padding: 2px 4px;
2553   background: #404000;
2554   border: 1px none #9C9CFF;
2555   border-top-style: solid;
2556   color: #FF9F00;
2557   text-shadow: none;
2558 }
2559
2560 .statuspanel-label:-moz-locale-dir(ltr):not([mirror]),
2561 .statuspanel-label:-moz-locale-dir(rtl)[mirror] {
2562   border-right-style: solid;
2563   border-top-right-radius: .3em;
2564   margin-right: 1em;
2565 }
2566
2567 .statuspanel-label:-moz-locale-dir(rtl):not([mirror]),
2568 .statuspanel-label:-moz-locale-dir(ltr)[mirror] {
2569   border-left-style: solid;
2570   border-top-left-radius: .3em;
2571   margin-left: 1em;
2572 }
2573
2574 /* HACK to abolish devily color on main content */
2575
2576 #content {
2577   background-color: transparent !important;
2578 }
2579
2580 /* Highlighter */
2581
2582 .highlighter-outline {
2583   box-shadow: 0 0 0 1px black;
2584   outline: 1px dashed white;
2585 }
2586
2587 .highlighter-outline[locked]  {
2588   box-shadow: 0 0 0 1px rgba(0,0,0,0.3);
2589   outline-color: rgba(255,255,255,0.7);
2590 }
2591
2592 /* Developer toolbar */
2593
2594 #developer-toolbar {
2595   border-top: 3px solid #000000;
2596   border-bottom: none;
2597 }
2598
2599 #developer-toolbar .toolbar-holder {
2600   background-color: #8050B0;
2601   color: #FFCF00;
2602 }
2603
2604 #developer-toolbar .toolbar-holder {
2605   background-color: #8050B0;
2606   color: #FFCF00;
2607 }
2608
2609 #developer-toolbar .toolbar-startcap,
2610 #developer-toolbar .toolbar-endcap{
2611   background-color: #6000CF;
2612 }
2613
2614 /* Highlighter - Node Infobar */
2615
2616 .highlighter-nodeinfobar {
2617   color: #FF9F00;
2618   border: 1px solid rgba(156, 156, 255, .5);
2619   border-radius: 3px;
2620   background-color: #000000;
2621   background-clip: padding-box;
2622 }
2623
2624 /* Highlighter - Node Infobar - text */
2625
2626 .highlighter-nodeinfobar-text {
2627   /* 100% - size of the buttons and margins */
2628   max-width: calc(100% - 2 * (26px + 6px));
2629   padding-bottom: 1px;
2630 }
2631
2632 html|*.highlighter-nodeinfobar-tagname {
2633   color: #FFCF00;
2634 }
2635
2636 html|*.highlighter-nodeinfobar-id {
2637   color: #9C9CFF;
2638 }
2639
2640 html|*.highlighter-nodeinfobar-pseudo-classes {
2641   color: #FF9F00;
2642 }
2643
2644 /* Highlighter - Node Infobar - buttons */
2645
2646 .highlighter-nodeinfobar-button {
2647   padding: 0;
2648   width: 26px;
2649   min-height: 26px;
2650 }
2651
2652 .highlighter-nodeinfobar-inspectbutton {
2653   list-style-image: url("chrome://browser/skin/devtools/inspect-button.png");
2654   -moz-image-region: rect(0px 16px 16px 0px);
2655   -moz-margin-start: 0px;
2656   -moz-margin-end: 2px;
2657 }
2658
2659 .highlighter-nodeinfobar-inspectbutton:-moz-locale-dir(rtl) {
2660 }
2661
2662 .highlighter-nodeinfobar-inspectbutton:hover,
2663 .highlighter-nodeinfobar-inspectbutton:hover:active/*,
2664 .highlighter-nodeinfobar-container:not([locked]) >  .highlighter-nodeinfobar >  .highlighter-nodeinfobar-inspectbutton*/ {
2665   -moz-image-region: rect(0px 32px 16px 16px);
2666 }
2667
2668 .highlighter-nodeinfobar-menu {
2669 }
2670
2671 .highlighter-nodeinfobar-menu:-moz-locale-dir(rtl) {
2672 }
2673
2674 .highlighter-nodeinfobar-menu > .toolbarbutton-menu-dropmarker {
2675   -moz-box-align: center;
2676   -moz-margin-start: -1px;
2677 }
2678
2679 /* Highlighter - Node Infobar - box & arrow */
2680
2681 .highlighter-nodeinfobar-arrow {
2682   width: 14px;
2683   height: 14px;
2684   -moz-margin-start: calc(50% - 7px);
2685   transform: rotate(-45deg);
2686   border: 1px solid transparent;
2687   background-clip: padding-box;
2688   background-repeat: no-repeat;
2689 }
2690
2691 .highlighter-nodeinfobar-arrow-top {
2692   margin-bottom: -8px;
2693   margin-top: 8px;
2694   border-right-color: rgba(0, 132, 132, .5);
2695   border-top-color: rgba(0, 132, 132, .5);
2696   background-image: linear-gradient(bottom left, transparent 50%, rgb(0, 132, 132) 50%);
2697 }
2698
2699 .highlighter-nodeinfobar-arrow-bottom {
2700   margin-top: -8px;
2701   margin-bottom: 8px;
2702   border-left-color: rgba(0, 132, 132, .5);
2703   border-bottom-color: rgba(0, 132, 132, .5);
2704   background-image: linear-gradient(top right, transparent 50%, rgb(0, 132, 132) 50%);
2705 }
2706
2707 .highlighter-nodeinfobar-container[position="top"] > .highlighter-nodeinfobar,
2708 .highlighter-nodeinfobar-container[position="overlap"] > .highlighter-nodeinfobar {
2709   box-shadow: 0 1px 0 hsla(0, 0%, 100%, .1) inset;
2710 }
2711
2712 .highlighter-nodeinfobar-container[hide-arrow] > .highlighter-nodeinfobar {
2713   margin: 7px 0;
2714 }
2715
2716 #full-screen-warning-message {
2717   background-color: #000000;
2718   color: #FF9F00;
2719   border-radius: 8px;
2720   margin-top: 30px;
2721   padding: 30px 50px;
2722   box-shadow: 0 0 2px #9C9CFF;
2723 }
2724
2725 #full-screen-warning-container[obscure-browser] {
2726   background-color: rgba(0,0,0,0.3);
2727 }
2728
2729 .full-screen-description {
2730   font-size: 150%;
2731 }
2732
2733 #full-screen-domain-text {
2734   font-size: 300%;
2735 }
2736
2737 .full-screen-approval-button,
2738 #full-screen-remember-decision {
2739   font-size: 120%;
2740 }
2741
2742 html|*#gcli-tooltip-frame,
2743 html|*#gcli-output-frame {
2744   padding: 0;
2745   border-width: 0;
2746   background-color: transparent;
2747 }
2748
2749 #gcli-output,
2750 #gcli-tooltip {
2751   border-width: 0;
2752   background-color: transparent;
2753   margin-bottom: -2px;
2754 }
2755
2756 .gclitoolbar-input-node,
2757 .gclitoolbar-complete-node,
2758 .gclitoolbar-prompt {
2759   margin: 1px 3px;
2760   -moz-box-align: center;
2761   padding-top: 0;
2762   padding-bottom: 0;
2763   padding-right: 4px;
2764   background-color: transparent;
2765   border-radius: 3px;
2766   text-shadow: none;
2767 }
2768
2769 .gclitoolbar-input-node {
2770   padding-left: 20px;
2771 }
2772
2773 .gclitoolbar-input-node:not([focused="true"]) {
2774   border-color: transparent;
2775 }
2776
2777 .gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection {
2778   background-color: #008484;
2779   color: #000000;
2780   text-shadow: none;
2781 }
2782
2783 .gclitoolbar-complete-node {
2784   padding-left: 21px;
2785   background-color: transparent;
2786   color: transparent;
2787 }
2788
2789 .gclitoolbar-prompt {
2790   padding-left: 4px;
2791   padding-bottom: 2px;
2792   font-size: 150%;
2793   font-weight: bold;
2794   color: #E7ADE7;
2795   background-color: #000000;
2796 }
2797
2798 .gclitoolbar-prompt-label,
2799 .gcli-in-incomplete,
2800 .gcli-in-error,
2801 .gcli-in-ontab,
2802 .gcli-in-todo,
2803 .gcli-in-closebrace,
2804 .gcli-in-param,
2805 .gcli-in-valid {
2806   margin: 0;
2807   padding: 0;
2808 }
2809
2810 .gcli-in-incomplete {
2811   border-bottom: 2px dotted #8050B0;
2812 }
2813
2814 .gcli-in-error {
2815   border-bottom: 2px dotted #FF0000;
2816 }
2817
2818 .gcli-in-ontab {
2819   color: #9C9CFF;
2820 }
2821
2822 .gcli-in-todo {
2823   color: #795900;
2824 }
2825
2826 .gcli-in-closebrace {
2827   color: #8050B0;
2828 }
2829
2830 /* Responsive Mode */
2831
2832 .browserContainer[responsivemode] {
2833   background: #221500 url("chrome://browser/skin/devtools/responsive-background.png");
2834   padding: 0 20px 20px 20px;
2835 }
2836
2837 .browserStack[responsivemode] {
2838   box-shadow: 0 0 7px #9C9CFF;
2839 }
2840
2841 .devtools-responsiveui-toolbar {
2842   background: transparent;
2843   margin: 10px 0;
2844   padding: 0;
2845   box-shadow: none;
2846   border-bottom-width: 0;
2847 }
2848
2849 .devtools-responsiveui-toolbar > menulist,
2850 .devtools-responsiveui-toolbar > toolbarbutton {
2851   min-width: 22px;
2852   border-radius: 0;
2853 }
2854
2855 .devtools-responsiveui-toolbar:-moz-locale-dir(ltr) > *:first-child,
2856 .devtools-responsiveui-toolbar:-moz-locale-dir(rtl) > *:last-child {
2857   margin-left: 0;
2858 }
2859
2860 .devtools-responsiveui-resizebar {
2861   width: 7px;
2862   height: 24px;
2863   cursor: ew-resize;
2864   transform: translate(12px, -12px);
2865   background-image: url("chrome://browser/skin/devtools/responsive-vertical-resizer.png");
2866 }
2867
2868 .devtools-responsiveui-resizehandle {
2869   width: 16px;
2870   height: 16px;
2871   cursor: se-resize;
2872   transform: translate(12px, 12px);
2873   background-image: url("chrome://browser/skin/devtools/responsive-se-resizer.png");
2874 }
2875
2876 /* Web Console */
2877
2878 .web-console-frame {
2879   /* border-bottom: 3px solid #000000; */
2880 }
2881
2882 .web-console-frame[animated] {
2883   transition: height 100ms;
2884 }
2885
2886 /* Developer Toolbar */
2887
2888 #developer-toolbar-toolbox-button {
2889   min-width: 18px;
2890 }
2891
2892 #developer-toolbar-toolbox-button > .toolbarbutton-text {
2893   display: none;
2894 }
2895
2896 #developer-toolbar-toolbox-button > .toolbarbutton-icon {
2897   -moz-margin-end: 0;
2898 }
2899
2900 .developer-toolbar-button {
2901   min-width: 78px;
2902   min-height: 21px;
2903   margin: 0 1px;
2904   list-style-image: url("chrome://browser/skin/devtools/tools-icons-small.png");
2905 }
2906
2907 .developer-toolbar-button[open=true],
2908 .developer-toolbar-button:active:hover,
2909 .developer-toolbar-button[checked=true] {
2910 }
2911
2912 .developer-toolbar-button[checked=true] {
2913 }
2914
2915 #developer-toolbar-toolbox-button {
2916   -moz-image-region: rect(64px, 16px, 80px, 0);
2917 }
2918
2919 /* Error counter */
2920
2921 #developer-toolbar-toolbox-button[error-count]:before {
2922   color: #000000;
2923   min-width: 16px;
2924   text-shadow: none;
2925   background-color: #FF0000;
2926   border-radius: 1px;
2927   -moz-margin-end: 5px;
2928 }
2929
2930 /* Social toolbar item */
2931
2932 #social-provider-button {
2933   -moz-image-region: rect(0, 16px, 16px, 0);
2934   list-style-image: url("chrome://browser/skin/social/services-16.png");
2935 }
2936
2937 #social-provider-button > .toolbarbutton-menu-dropmarker {
2938   display: none;
2939 }
2940
2941 .toolbarbutton-badge-container {
2942   margin: 0;
2943   padding: 0;
2944   position: relative;
2945 }
2946
2947 #navigator-toolbox[iconsize=large][mode=icons] > #nav-bar .toolbarbutton-1 > .toolbarbutton-badge-container {
2948   padding: 2px 2px;
2949 }
2950
2951 .toolbarbutton-1 > .toolbarbutton-badge-container > .toolbar-icon {
2952   position: absolute;
2953   top: 2px;
2954   right: 2px;
2955 }
2956
2957 .toolbarbutton-badge-container > .toolbarbutton-icon[label]:not([label=""]) {
2958   -moz-margin-end: 0;
2959 }
2960
2961 .toolbarbutton-badge[badge=""] {
2962   display: none;
2963 }
2964 .toolbarbutton-badge[badge]:not([badge=""])::after {
2965   /* The |content| property is set in the content stylesheet. */
2966   font-size: 9px;
2967   font-weight: bold;
2968   padding: 0 1px;
2969   color: #FF9F00;
2970   background-color: #000000;
2971   border: 1px solid #9C9CFF;
2972   border-radius: 2px;
2973   position: absolute;
2974   top: 0;
2975   right: 0;
2976 }
2977
2978 #navigator-toolbox[iconsize=large][mode=icons] > #nav-bar *|* > .toolbarbutton-badge[badge]:not([badge=""])::after {
2979   top: 1px;
2980   right: 1px;
2981 }
2982
2983 .toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
2984   left: 0;
2985   right: auto;
2986 }
2987
2988 #navigator-toolbox[iconsize=large][mode=icons] > #nav-bar *|* > .toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
2989   left: 1px;
2990   right: auto;
2991 }
2992
2993 #social-notification-icon-mentions {
2994   background-color: #000000;
2995   border-radius: 3px;
2996   -moz-margin-start: 2px;
2997 }
2998
2999 #social-notification-icon-mentions:hover {
3000   background-color: #FFCF00;
3001 }
3002
3003 #social-notification-icon-mentions[open="true"] {
3004   background-color: #FF9F00;
3005 }
3006
3007 #social-sidebar-splitter {
3008   border: 0;
3009 }
3010
3011 .popup-notification-icon[popupid="servicesInstall"] {
3012   list-style-image: url("chrome://browser/skin/social/services-64.png");
3013 }
3014 #servicesInstall-notification-icon {
3015   list-style-image: url("chrome://browser/skin/social/services-16.png");
3016 }
3017 #social-undoactivation-button,
3018 #servicesInstall-learnmore-link {
3019   -moz-margin-start: 0; /* override default label margin to match description margin */
3020 }
3021
3022 #socialActivatedNotification .popup-notification-button-container {
3023   margin-left: 6px;
3024 }
3025
3026 .social-activation-icon {
3027   width: auto;
3028   height: auto;
3029   max-height: 64px;
3030   max-width: 64px;
3031 }
3032
3033 #social-activation-message {
3034   max-width: 250px;
3035 }
3036
3037 #social-activation-message > label {
3038   margin: 0;
3039 }
3040
3041 /* social toolbar provider menu */
3042 .social-statusarea-popup {
3043   margin-top: 0;
3044   margin-left: -12px;
3045   margin-right: -12px;
3046 }
3047
3048 .social-statusarea-user {
3049   border-bottom: 1px solid #9C9CFF;
3050   background-color: #000000;
3051   color: #FF9F00;
3052   position: relative;
3053   cursor: pointer;
3054 }
3055
3056 .social-statusarea-user-portrait {
3057   width: 32px;
3058   height: 32px;
3059   border-radius: 2px;
3060   margin: 10px;
3061 }
3062
3063 .social-statusarea-loggedInStatus {
3064   background: transparent;
3065   border: none;
3066   color: #3333FF;
3067   min-width: 0;
3068   margin: 0 6px;
3069   list-style-image: none;
3070 }
3071
3072 #social-statusarea-user[_moz-menuactive] > vbox > .social-statusarea-loggedInStatus {
3073   text-decoration: underline;
3074 }
3075
3076 .social-panel > .panel-arrowcontainer > .panel-arrowcontent {
3077   padding: 0;
3078 }
3079
3080 .social-panel-frame {
3081   border-radius: inherit;
3082 }
3083
3084 .chat-status-icon {
3085   max-height: 16px;
3086   max-width: 16px;
3087   padding: 0;
3088 }
3089
3090 .chat-toolbarbutton {
3091   -moz-appearance: none;
3092   border: none;
3093   padding: 0;
3094   margin: 0;
3095   background: none;
3096 }
3097
3098 .chat-toolbarbutton > .toolbarbutton-text {
3099   display: none;
3100 }
3101
3102 .chat-close-button {
3103   list-style-image: url('chrome://browser/skin/social/chat-icons.png');
3104   -moz-image-region: rect(0, 14px, 14px, 0);
3105 }
3106
3107 .chat-close-button:hover,
3108 .chat-close-button:hover:active {
3109   -moz-image-region: rect(14px, 14px, 28px, 0);
3110 }
3111
3112 .chat-minimize-button {
3113   list-style-image: url('chrome://browser/skin/social/chat-icons.png');
3114   -moz-image-region: rect(0, 28px, 14px, 14px);
3115 }
3116
3117 .chat-minimize-button:hover:active,
3118 .chat-minimize-button:hover {
3119   -moz-image-region: rect(14px, 28px, 28px, 14px);
3120 }
3121
3122 .chat-swap-button {
3123   list-style-image: url('chrome://browser/skin/social/chat-icons.png');
3124   -moz-image-region: rect(0, 42px, 14px, 28px);
3125 }
3126
3127 .chat-swap-button:hover:active,
3128 .chat-swap-button:hover {
3129   -moz-image-region: rect(14px, 42px, 28px, 28px);
3130 }
3131
3132 chatbar > chatbox > .chat-titlebar > .chat-swap-button {
3133   list-style-image: url('chrome://browser/skin/social/chat-icons.png');
3134   -moz-image-region: rect(0, 56px, 14px, 42px);
3135 }
3136
3137 chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover:active,
3138 chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover {
3139   -moz-image-region: rect(14px, 56px, 28px, 42px);
3140 }
3141
3142 .chat-title {
3143   font-weight: bold;
3144   font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
3145   text-shadow: none;
3146   cursor: inherit;
3147 }
3148
3149 .chat-titlebar {
3150   background-color: #9C9CFF;
3151   color: #000000;
3152   height: 20px;
3153   min-height: 16px;
3154   width: 100%;
3155   margin: 0;
3156   padding: 2px;
3157   -moz-padding-start: 6px;
3158   border: none;
3159   border-bottom: 1px solid #008484;
3160   cursor: pointer;
3161 }
3162
3163 .chat-titlebar > .notification-anchor-icon {
3164   margin-left: 2px;
3165   margin-right: 2px;
3166 }
3167
3168 .chat-titlebar[minimized="true"] {
3169   border-bottom: none;
3170 }
3171
3172 .chat-titlebar[selected] {
3173   background-color: #008484;
3174 }
3175
3176 .chat-titlebar[activity] {
3177   background-color: #E7ADE7;
3178 }
3179
3180 .chat-frame {
3181   padding: 0;
3182   margin: 0;
3183   overflow: hidden;
3184 }
3185
3186 .chatbar-button {
3187   list-style-image: url("chrome://browser/skin/social/services-16.png");
3188   background-color: #000000;
3189   border: none;
3190   margin: 0;
3191   padding: 2px;
3192   height: 21px;
3193   width: 21px;
3194   border-top: 1px solid #008484;
3195   -moz-border-end: 1px solid #008484;
3196 }
3197
3198 @media (min-resolution: 2dppx) {
3199   .chatbar-button {
3200     list-style-image: url("chrome://browser/skin/social/services-16@2x.png");
3201   }
3202 }
3203
3204 .chatbar-button > menupopup > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon {
3205   width: auto;
3206   height: auto;
3207   max-height: 16px;
3208   max-width: 16px;
3209 }
3210
3211 .chatbar-button > .toolbarbutton-icon {
3212   opacity: .6;
3213   -moz-margin-end: 0;
3214 }
3215 .chatbar-button:hover > .toolbarbutton-icon,
3216 .chatbar-button[open="true"] > .toolbarbutton-icon {
3217   opacity: 1;
3218 }
3219
3220 .chatbar-button:hover,
3221 .chatbar-button[open="true"] {
3222 }
3223
3224 .chatbar-button > .toolbarbutton-text,
3225 .chatbar-button > .toolbarbutton-menu-dropmarker {
3226   display: none;
3227 }
3228
3229 .chatbar-button[activity]:not([open="true"]) {
3230   background-color: #E7ADE7;
3231 }
3232
3233 .chatbar-button > menupopup > menuitem[activity] {
3234   font-weight: bold;
3235 }
3236
3237 .chatbar-innerbox {
3238   background: transparent;
3239   margin: -285px 0 0;
3240   overflow: hidden;
3241 }
3242
3243 chatbar {
3244   -moz-margin-end: 20px;
3245 }
3246
3247 chatbar > chatbox {
3248   height: 285px;
3249   width: 260px;
3250   -moz-margin-start: 4px;
3251   background-color: #000000;
3252   border: 1px solid #9C9CFF;
3253   border-bottom: none;
3254   border-top-left-radius: 2.5px;
3255   border-top-right-radius: 2.5px;
3256 }
3257
3258 chatbox[minimized="true"] {
3259   width: 160px;
3260   height: 20px;
3261 }
3262
3263 window > chatbox {
3264   -moz-margin-start: 0px;
3265   margin: 0px;
3266   border: none;
3267   padding: 0px;
3268 }
3269
3270 .click-to-play-plugins-notification-content {
3271   margin: -10px;
3272   border-radius: 4px;
3273 }
3274
3275 .click-to-play-plugins-notification-icon-box {
3276   background: #000000;
3277   -moz-border-end: 1px solid #FF9F00;
3278   padding-top: 16px;
3279   -moz-padding-end: 16px;
3280   -moz-padding-start: 24px;
3281   -moz-margin-start: 4px;
3282   margin-top: 4px;
3283   margin-bottom: 4px;
3284 }
3285
3286 .click-to-play-plugins-notification-icon-box:-moz-locale-dir(ltr) {
3287   border-bottom-left-radius: 4px;
3288   border-top-left-radius: 4px;
3289 }
3290
3291 .click-to-play-plugins-notification-icon-box:-moz-locale-dir(rtl) {
3292   border-bottom-right-radius: 4px;
3293   border-top-right-radius: 4px;
3294 }
3295
3296 .click-to-play-plugins-notification-separator {
3297 }
3298
3299 .click-to-play-plugins-notification-description-box {
3300   padding-top: 12px;
3301   -moz-padding-end: 11px;
3302   padding-bottom: 9px;
3303   -moz-padding-start: 10px;
3304 }
3305
3306 .click-to-play-plugins-notification-center-box {
3307   border-top: 1px solid #FF9F00;
3308   border-bottom: 1px solid #FF9F00;
3309   background-color: #000000;
3310   -moz-margin-end: 4px;
3311 }
3312
3313 .click-to-play-plugins-notification-button-container {
3314   margin: 0px;
3315   padding: 16px;
3316 }
3317
3318 .center-item-box {
3319   padding: 12px 16px 0px 16px;
3320 }
3321
3322 .center-item-box[padbottom="true"] {
3323   padding-bottom: 12px;
3324 }
3325
3326 .center-item-icon {
3327   background-image: url("chrome://mozapps/skin/plugins/pluginGeneric-16.png");
3328   background-repeat: no-repeat;
3329   height: 16px;
3330   width: 16px;
3331   margin-bottom: 4px;
3332 }
3333
3334 .center-item-box[warn="true"] {
3335   background-color: #FFCF00;
3336   color: #000000;
3337   padding: 8px 16px 6px 16px;
3338 }
3339
3340 .center-item-box[padbottom="true"][warn="true"] {
3341   padding-bottom: 4px;
3342 }
3343
3344 .center-item-box[showseparator="true"] {
3345   border-top: 1px solid #9C9CFF;
3346 }
3347
3348 .center-item-box[warn="false"] > .center-item-warning {
3349   display: none;
3350 }
3351
3352 .center-item-warning > .text-link {
3353   color: #6868AA;
3354 }
3355
3356 .center-item-warning > .text-link[href=""] {
3357   display: none;
3358 }
3359
3360 .center-item-warning-icon {
3361   background-image: url("chrome://mozapps/skin/extensions/alerticon-info-negative.png");
3362   background-repeat: no-repeat;
3363   width: 16px;
3364   height: 15px;
3365   margin-bottom: 4px;
3366 }
3367
3368 .center-item-warning-description {
3369   color: #828282;
3370 }
3371
3372 .center-item-button {
3373   min-width: 0;
3374 }
3375
3376 #main-window[privatebrowsingmode=temporary] #toolbar-menubar {
3377   background-image: url("chrome://browser/skin/privatebrowsing-dark.png");
3378   background-position: top right;
3379   background-repeat: no-repeat;
3380 }
3381
3382 #main-window[privatebrowsingmode=temporary] #toolbar-menubar:-moz-locale-dir(rtl) {
3383   background-position: top left;
3384 }
3385
3386 #main-window[privatebrowsingmode=temporary] #appmenu-button > .button-box > .box-inherit > .button-icon {
3387   list-style-image: url("chrome://browser/skin/privatebrowsing-light.png");
3388   width: 20px;
3389   height: 16px;
3390 }