LCARStrek/browser/browser.css

   1 /* ***** BEGIN LICENSE BLOCK *****
   2  * Version: MPL 1.1/GPL 2.0/LGPL 2.1
   3  *
   4  * The contents of this file are subject to the Mozilla Public License Version
   5  * 1.1 (the "License"); you may not use this file except in compliance with
   6  * the License. You may obtain a copy of the License at
   7  * http://www.mozilla.org/MPL/
   8  *
   9  * Software distributed under the License is distributed on an "AS IS" basis,
  10  * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
  11  * for the specific language governing rights and limitations under the
  12  * License.
  13  *
  14  * The Original Code is mozilla.org code.
  15  *
  16  * The Initial Developer of the Original Code is
  17  * Netscape Communications Corporation.
  18  * Portions created by the Initial Developer are Copyright (C) 1998-1999
  19  * the Initial Developer. All Rights Reserved.
  20  *
  21  * Contributor(s):
  22  *   Joe Hewitt (hewitt@netscape.com)
  23  *   Jason Kersey (kerz@netscape.com)
  24  *   Pierre Chanial (chanial@noos.fr)
  25  *   Dean Tessman (dean_tessman@hotmail.com)
  26  *   Blake Ross (blake@cs.stanford.edu)
  27  *   Pamela Greene (pamg.bugs@gmail.com)
  28  *   Dão Gottwald (dao@mozilla.com)
  29  *   Jim Mathies (jmathies@mozilla.com)
  30  *   Drew Willcoxon (adw@mozilla.com)
  31  *
  32  * Alternatively, the contents of this file may be used under the terms of
  33  * either the GNU General Public License Version 2 or later (the "GPL"), or
  34  * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
  35  * in which case the provisions of the GPL or the LGPL are applicable instead
  36  * of those above. If you wish to allow use of your version of this file only
  37  * under the terms of either the GPL or the LGPL, and not to allow others to
  38  * use your version of this file under the terms of the MPL, indicate your
  39  * decision by deleting the provisions above and replace them with the notice
  40  * and other provisions required by the GPL or the LGPL. If you do not delete
  41  * the provisions above, a recipient may use your version of this file under
  42  * the terms of any one of the MPL, the GPL or the LGPL.
  43  *
  44  * ***** END LICENSE BLOCK ***** */
  45
  46 @import url("chrome://global/skin/");
  47
  48 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
  49 @namespace html url("http://www.w3.org/1999/xhtml");
  50
  51 toolbar {
  52   -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar");
  53 }
  54
  55 menubar {
  56   -moz-binding: url("chrome://global/skin/globalBindings.xml#menubar");
  57 }
  58
  59 #menubar-items {
  60   -moz-box-orient: vertical; /* for flex hack */
  61 }
  62
  63 #main-menubar {
  64   -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
  65 }
  66
  67 #navigator-toolbox {
  68 }
  69
  70 #navigator-toolbox::after {
  71   content: "";
  72   display: -moz-box;
  73   -moz-box-ordinal-group: 101; /* tabs toolbar is 100 */
  74   height: 1px;
  75 }
  76 #navigator-toolbox[tabsontop=false]::after,
  77 #main-window[disablechrome] #navigator-toolbox::after {
  78   visibility: collapse;
  79 }
  80
  81 #navigator-toolbox > toolbar:not(:-moz-lwtheme) {
  82 }
  83
  84 #main-window[tabsintitlebar] #titlebar-content:not(:-moz-lwtheme),
  85 #main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar:not(:-moz-lwtheme) {
  86   /* like menubar */
  87   background-color: #6000CF;
  88   color: #FF9F00;
  89 }
  90 #main-window[tabsintitlebar] #titlebar-content:not(:-moz-lwtheme):-moz-window-inactive,
  91 #main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive {
  92   background-color: #8050B0;
  93   color: #FF9F00;
  94 }
  95
  96 #main-window[tabsintitlebar] #titlebar:-moz-lwtheme {
  97   visibility: hidden;
  98 }
  99 #main-window[tabsintitlebar] #titlebar-content:-moz-lwtheme {
 100   -moz-binding: url("chrome://global/content/bindings/general.xml#windowdragbox");
 101   visibility: visible;
 102 }
 103
 104 #navigator-toolbox[iconsize="small"] > #nav-bar,
 105 #navigator-toolbox > toolbar:not(#nav-bar):not(#toolbar-menubar):not(#TabsToolbar)[iconsize="small"] {
 106   padding-top: 1px;
 107   padding-bottom: 1px;
 108 }
 109
 110 #nav-bar:not(:-moz-lwtheme),
 111 #nav-bar[collapsed="true"] + toolbar:not(:-moz-lwtheme),
 112 #nav-bar[collapsed="true"] + #customToolbars + #PersonalToolbar:not(:-moz-lwtheme),
 113 #navigator-toolbox[tabsontop="true"] > #nav-bar,
 114 #navigator-toolbox[tabsontop="true"]:not([customizing]) > #nav-bar[collapsed="true"] + toolbar,
 115 #navigator-toolbox[tabsontop="true"]:not([customizing]) > #nav-bar[collapsed="true"] + #customToolbars + #PersonalToolbar {
 116   /* background-image: -moz-linear-gradient(@toolbarHighlight@, rgba(255,255,255,0)); */
 117 }
 118
 119 #navigator-toolbox[tabsontop="false"] > #toolbar-menubar:not(:-moz-lwtheme) {
 120   /* background-image: -moz-linear-gradient(@toolbarHighlight@, @toolbarHighlight@); */
 121 }
 122
 123 #personal-bookmarks {
 124   min-height: 24px;
 125 }
 126
 127 #print-preview-toolbar:not(:-moz-lwtheme) {
 128   /* -moz-appearance: toolbox; */
 129 }
 130
 131 /* ::::: app menu button ::::: */
 132
 133 #appmenu-button {
 134   background-color: #FF9F00;
 135   background-clip: padding-box;
 136   border-radius: 0;
 137   border: none;
 138   border-left: 3px solid #000000;
 139   border-right: 3px solid #000000;
 140   color: #000000;
 141   font-weight: bold;
 142   padding: 0 1.5em .05em;
 143   margin: 0 0 2px;
 144 }
 145
 146 #main-window[privatebrowsingmode=temporary] #appmenu-button {
 147   background-color: #6000CF;
 148   color: #FFCF00;
 149 }
 150
 151 #appmenu-button:hover,
 152 #appmenu-button:hover:active,
 153 #appmenu-button[open] {
 154   background-color: #FFCF00;
 155   color: #000000;
 156 }
 157
 158 #appmenu-button > .button-box > .button-menu-dropmarker {
 159   list-style-image: url("appmenu-dropmarker.png");
 160   width: auto;
 161   height: auto;
 162   padding: 0;
 163   margin: 0;
 164   -moz-margin-start: .5em;
 165 }
 166
 167 .splitmenu-menu {
 168   -moz-box-pack: end;
 169 }
 170
 171 .appmenu-edit-button {
 172 }
 173
 174 .appmenu-edit-button[disabled="true"] {
 175 }
 176
 177 #appmenuPrimaryPane {
 178   -moz-border-end: 1px solid #9C9CFF;
 179 }
 180 /*
 181   #appmenu-popup {
 182   }
 183   #appmenuPrimaryPane {
 184   }
 185   #appmenuSecondaryPane {
 186   }
 187   #appmenuSecondaryPane:-moz-locale-dir(rtl) {
 188   }
 189
 190   #appmenuSecondaryPane menupopup {
 191   }
 192
 193   .appmenu-menuseparator {
 194   }
 195
 196   .appmenu-edit-button:not([disabled]):hover {
 197   }
 198 */
 199 #appmenuSecondaryPane-spacer {
 200   min-height: 1em;
 201 }
 202
 203 #appmenu-editmenu {
 204   -moz-box-pack: end;
 205 }
 206
 207 #appmenu_print,
 208 #appmenu_print_popup,
 209 .appmenu-edit-button,
 210 #appmenu-editmenu-cut,
 211 #appmenu-editmenu-copy,
 212 #appmenu-editmenu-paste,
 213 #appmenu-quit {
 214   list-style-image: url("appmenu-icons.png");
 215 }
 216
 217 #appmenu-cut,
 218 #appmenu-editmenu-cut {
 219   -moz-image-region: rect(0 16px 16px 0);
 220 }
 221
 222 #appmenu-copy,
 223 #appmenu-editmenu-copy {
 224   -moz-image-region: rect(0 32px 16px 16px);
 225 }
 226
 227 #appmenu-paste,
 228 #appmenu-editmenu-paste {
 229   -moz-image-region: rect(0 48px 16px 32px);
 230 }
 231
 232 #appmenu_print,
 233 #appmenu_print_popup {
 234   -moz-image-region: rect(0 64px 16px 48px);
 235 }
 236
 237 #appmenu-quit {
 238   -moz-image-region: rect(0 80px 16px 64px);
 239 }
 240
 241 #appmenu-edit-label {
 242   -moz-appearance: none;
 243   background: transparent;
 244   font-style: italic;
 245 }
 246
 247 #appmenu_bookmarks {
 248   list-style-image: url("chrome://browser/skin/places/bookmark.png");
 249   -moz-image-region: rect(0px 48px 16px 32px);
 250 }
 251
 252 #appmenu_privateBrowsing {
 253   list-style-image: url("chrome://browser/skin/Privacy-16.png");
 254 }
 255
 256 #appmenu_addons {
 257   list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
 258 }
 259
 260 #BMB_bookmarkThisPage,
 261 #appmenu_bookmarkThisPage {
 262   list-style-image: url("chrome://browser/skin/places/bookmark.png");
 263   -moz-image-region: rect(0 16px 16px 0);
 264 }
 265
 266 /* ::::: titlebar ::::: */
 267
 268 #main-window[sizemode="normal"] > #titlebar {
 269 }
 270
 271 #main-window[sizemode="maximized"] > #titlebar {
 272 }
 273
 274 #titlebar-buttonbox {
 275 }
 276
 277 #main-window[sizemode="maximized"] #titlebar-buttonbox {
 278 }
 279
 280 .titlebar-placeholder[type="appmenu-button"] {
 281   margin-left: 4px;
 282 }
 283
 284 .titlebar-placeholder[type="caption-buttons"] {
 285   margin-left: 10px;
 286 }
 287
 288 /* titlebar command buttons */
 289
 290 #titlebar-min {
 291 }
 292
 293 #titlebar-max {
 294 }
 295
 296 #main-window[sizemode="maximized"] #titlebar-max {
 297 }
 298
 299 #titlebar-close {
 300 }
 301
 302 /* ::::: bookmark buttons ::::: */
 303
 304 toolbarbutton.bookmark-item {
 305   margin: 0;
 306   padding: 2px 3px;
 307 }
 308
 309 toolbarbutton.bookmark-item:hover:active:not([disabled="true"]),
 310 toolbarbutton.bookmark-item[open="true"] {
 311   padding-top: 3px;
 312   padding-bottom: 1px;
 313   -moz-padding-start: 4px;
 314   -moz-padding-end: 2px;
 315 }
 316
 317 .bookmark-item > .toolbarbutton-icon {
 318   width: 16px;
 319   height: 16px;
 320 }
 321
 322 /* Prevent [mode="icons"] from hiding the label */
 323 .bookmark-item > .toolbarbutton-text {
 324   display: -moz-box !important;
 325 }
 326
 327 .bookmark-item > .toolbarbutton-menu-dropmarker {
 328   display: none;
 329 }
 330
 331 #wrapper-personal-bookmarks[place="palette"] > .toolbarpaletteitem-box {
 332   width: 16px;
 333   height: 16px;
 334   background: url("chrome://browser/skin/places/bookmarksToolbar.png") no-repeat;
 335 }
 336
 337 .bookmarks-toolbar-customize {
 338   max-width: 15em !important;
 339   list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png") !important;
 340 }
 341
 342 /* ::::: bookmark menus ::::: */
 343
 344 menu.bookmark-item,
 345 menuitem.bookmark-item {
 346   min-width: 0;
 347   max-width: 32em;
 348 }
 349
 350 .bookmark-item > .menu-iconic-left {
 351   margin-top: 0;
 352   margin-bottom: 0;
 353 }
 354
 355 .bookmark-item > .menu-iconic-left > .menu-iconic-icon {
 356   -moz-padding-start: 0px;
 357 }
 358
 359 /* ::::: bookmark items ::::: */
 360
 361 .bookmark-item  {
 362   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-item.gif");
 363 }
 364
 365 .bookmark-item[container] {
 366   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
 367 }
 368
 369 .bookmark-item[container][open] {
 370   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
 371 }
 372
 373 .bookmark-item[container][livemark] {
 374   list-style-image: url("chrome://browser/skin/livemark-folder.png");
 375   -moz-image-region: auto;
 376 }
 377
 378 .bookmark-item[container][livemark] .bookmark-item {
 379   list-style-image: url("chrome://browser/skin/livemark-item.png");
 380   -moz-image-region: auto;
 381 }
 382
 383 .bookmark-item[container][query] {
 384   list-style-image: url("chrome://browser/skin/places/query.png");
 385   -moz-image-region: auto;
 386 }
 387
 388 .bookmark-item[query][tagContainer] {
 389   list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
 390   -moz-image-region: auto;
 391 }
 392
 393 .bookmark-item[query][dayContainer] {
 394   list-style-image: url("chrome://browser/skin/places/calendar.png");
 395   -moz-image-region: auto;
 396 }
 397
 398 .bookmark-item[query][hostContainer] {
 399   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
 400 }
 401
 402 .bookmark-item[query][hostContainer][open] {
 403   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
 404 }
 405
 406 /* ::::: primary toolbar buttons ::::: */
 407
 408 /* ::::: large toolbar buttons ::::: */
 409
 410 .toolbarbutton-1,
 411 .toolbarbutton-1 > .toolbarbutton-menubutton-button {
 412   min-width: 36px;
 413   min-height: 36px;
 414 }
 415
 416 .toolbarbutton-1:not([type="menu-button"]) {
 417   -moz-box-orient: vertical;
 418 }
 419
 420 .toolbarbutton-1,
 421 .toolbarbutton-1 > .toolbarbutton-menubutton-button,
 422 .toolbarbutton-1[disabled="true"]:hover:active,
 423 .toolbarbutton-1[disabled="true"]:hover:active > .toolbarbutton-menubutton-button {
 424   padding: 1px 2px;
 425 }
 426
 427 .toolbarbutton-1:hover:active,
 428 .toolbarbutton-1[open="true"],
 429 .toolbarbutton-1:hover:active > .toolbarbutton-menubutton-button {
 430   padding-top: 2px;
 431   padding-bottom: 0px;
 432   -moz-padding-start: 3px;
 433   -moz-padding-end: 1px;
 434 }
 435
 436 .toolbarbutton-1[type="menu"] {
 437   -moz-binding: url("chrome://global/content/bindings/toolbarbutton.xml#menu-vertical");
 438 }
 439
 440 /* ::::: small primary toolbar buttons ::::: */
 441
 442 #nav-bar {
 443   /* force iconsize="small" on this toolbar */
 444   counter-reset: smallicons;
 445 }
 446
 447 toolbar[mode="text"] .toolbarbutton-1,
 448 toolbar[mode="icons"] .toolbarbutton-1,
 449 toolbar[iconsize="small"] .toolbarbutton-1,
 450 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1,
 451 toolbar[mode="text"] .toolbarbutton-menubutton-button,
 452 toolbar[mode="icons"] .toolbarbutton-menubutton-button,
 453 toolbar[iconsize="small"] .toolbarbutton-menubutton-button,
 454 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-button {
 455   min-width: 0px;
 456   min-height: 0px;
 457 }
 458
 459 toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker {
 460   padding-top: 4px;
 461   padding-bottom: 8px;
 462   -moz-padding-start: 1px;
 463   -moz-padding-end: 1px;
 464 }
 465
 466 toolbar[mode="icons"] .toolbarbutton-menubutton-dropmarker,
 467 toolbar[iconsize="small"] .toolbarbutton-menubutton-dropmarker,
 468 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
 469   padding-top: 0px;
 470   padding-bottom: 13px;
 471   -moz-padding-start: 1px;
 472   -moz-padding-end: 1px;
 473 }
 474
 475 toolbar[mode="text"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
 476 toolbar[mode="text"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker {
 477   padding-top: 5px;
 478   padding-bottom: 7px;
 479   -moz-padding-start: 0px;
 480   -moz-padding-end: 2px;
 481 }
 482
 483 toolbar[mode="icons"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
 484 toolbar[mode="icons"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker,
 485 toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
 486 toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker,
 487 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
 488 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker {
 489   padding-top: 1px;
 490   padding-bottom: 12px;
 491   -moz-padding-start: 0px;
 492   -moz-padding-end: 2px;
 493 }
 494
 495 toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker[disabled="true"] {
 496   padding-top: 4px !important;
 497   padding-bottom: 8px !important;
 498   -moz-padding-start: 1px !important;
 499   -moz-padding-end: 1px !important;
 500 }
 501
 502 toolbar[mode="icons"] .toolbarbutton-menubutton-dropmarker[disabled="true"],
 503 toolbar[iconsize="small"] > .toolbarbutton-menubutton-dropmarker[disabled="true"] {
 504   padding-top: 0px !important;
 505   padding-bottom: 13px !important;
 506   -moz-padding-start: 1px !important;
 507   -moz-padding-end: 1px !important;
 508 }
 509
 510 toolbar[mode="icons"] .toolbarbutton-text,
 511 toolbar[mode="text"] .toolbarbutton-icon {
 512   display: none;
 513 }
 514
 515 toolbar[mode="text"] .toolbarbutton-text {
 516   padding: 4px 0;
 517 }
 518
 519 toolbar[mode="text"] .toolbarbutton-1,
 520 toolbar[mode="text"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
 521   -moz-box-orient: horizontal;
 522 }
 523
 524 toolbar[mode="full"] .toolbarbutton-1,
 525 toolbar[mode="full"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
 526   min-width: 30px;
 527 }
 528
 529 /* unified back/forward button */
 530
 531 #back-button {
 532   -moz-image-region: rect(0, 18px, 18px, 0);
 533   -moz-margin-end: 0;
 534 }
 535
 536 #forward-button {
 537   -moz-image-region: rect(0, 36px, 18px, 18px);
 538   border-left: none;
 539   -moz-margin-start: 0;
 540 }
 541
 542 #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
 543 #forward-button:-moz-locale-dir(rtl),
 544 #forward-button:-moz-locale-dir(rtl) > .toolbarbutton-text {
 545   -moz-transform: scaleX(-1);
 546 }
 547
 548 #back-button:-moz-locale-dir(ltr) {
 549   border-top-right-radius: 0;
 550   border-bottom-right-radius: 0;
 551 }
 552
 553 #back-button:-moz-locale-dir(rtl),
 554 #forward-button {
 555   border-top-left-radius: 0;
 556   border-bottom-left-radius: 0;
 557 }
 558
 559 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #back-button {
 560   border-radius: 10000px;
 561   width: 30px;
 562   height: 30px;
 563   position: relative;
 564   z-index: 1;
 565   margin-top: -2px;
 566   margin-bottom: -2px;
 567   border: none;
 568   -moz-image-region: rect(18px, 20px, 38px, 0);
 569 }
 570
 571 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #back-button:not([disabled="true"]):not([open="true"]):not(:active):hover {
 572 }
 573
 574 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #back-button:not([disabled="true"]):hover:active,
 575 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #back-button[open="true"] {
 576 }
 577
 578 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar[currentset*="unified-back-forward-button"],
 579 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar:not([currentset]) {
 580 /*  padding-top: 3px;
 581   padding-bottom: 5px; */
 582 }
 583
 584 #navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar[currentset*="unified-back-forward-button"],
 585 #navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar:not([currentset]) {
 586 /*  padding-top: 5px; */
 587 }
 588
 589 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #forward-button {
 590   /*mask: url(keyhole-forward-mask.svg#mask); XXX: this regresses twinopen */
 591   mask: url("chrome://browser/content/browser.xul#winstripe-keyhole-forward-mask");
 592   -moz-margin-start: -6px !important;
 593   padding-left: 7px;
 594   padding-right: 3px;
 595 }
 596
 597 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #forward-button:not([disabled="true"]):not(:active):hover {
 598   /*mask: url(keyhole-forward-mask.svg#mask-hover);*/
 599   mask: url("chrome://browser/content/browser.xul#winstripe-keyhole-forward-mask-hover");
 600 }
 601
 602 .unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
 603 .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
 604   list-style-image: url("chrome://browser/skin/menu-back.png") !important;
 605 }
 606
 607 .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr),
 608 .unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl) {
 609   list-style-image: url("chrome://browser/skin/menu-forward.png") !important;
 610 }
 611
 612 /* stop button */
 613
 614 #stop-button {
 615   -moz-image-region: rect(0, 54px, 18px, 36px);
 616 }
 617
 618 /* reload button */
 619
 620 #reload-button {
 621   -moz-image-region: rect(0, 72px, 18px, 54px);
 622 }
 623
 624 /* home button */
 625
 626 #home-button.bookmark-item {
 627   list-style-image: url("chrome://browser/skin/Toolbar.png");
 628 }
 629 #home-button {
 630   -moz-image-region: rect(0, 90px, 18px, 72px);
 631 }
 632
 633 /* tabview button */
 634
 635 #tabview-button {
 636   list-style-image: url("chrome://browser/skin/tabview/tabview.png");
 637   -moz-image-region: rect(0, 90px, 18px, 72px);
 638 }
 639
 640 #tabview-button[groups="0"] {
 641   -moz-image-region: rect(0, 18px, 18px, 0);
 642 }
 643
 644 #tabview-button[groups="1"] {
 645   -moz-image-region: rect(0, 36px, 18px, 18px);
 646 }
 647
 648 #tabview-button[groups="2"] {
 649   -moz-image-region: rect(0, 54px, 18px, 36px);
 650 }
 651
 652 #tabview-button[groups="3"] {
 653   -moz-image-region: rect(0, 72px, 18px, 54px);
 654 }
 655
 656 /* download manager button */
 657
 658 #downloads-button {
 659   -moz-image-region: rect(0, 108px, 18px, 90px);
 660 }
 661
 662 /* history sidebar button */
 663
 664 #history-button {
 665   -moz-image-region: rect(0, 126px, 18px, 108px);
 666 }
 667
 668 /* bookmark sidebar & menu buttons */
 669
 670 #bookmarks-button,
 671 #bookmarks-menu-button {
 672   -moz-image-region: rect(0, 144px, 18px, 126px);
 673 }
 674
 675 #bookmarks-menu-button.bookmark-item {
 676   list-style-image: url("chrome://browser/skin/Toolbar.png");
 677 }
 678
 679 #bookmarks-menu-button.toolbarbutton-1 {
 680   -moz-box-orient: horizontal;
 681 }
 682
 683 /* print button */
 684
 685 #print-button {
 686   -moz-image-region: rect(0, 162px, 18px, 144px);
 687 }
 688
 689 /* toolbar new tab button */
 690
 691 #new-tab-button {
 692   -moz-image-region: rect(0, 180px, 18px, 162px);
 693 }
 694
 695 /* new window button */
 696
 697 #new-window-button {
 698   -moz-image-region: rect(0, 198px, 18px, 180px);
 699 }
 700
 701 /* cut button */
 702
 703 #cut-button {
 704   -moz-image-region: rect(0, 216px, 18px, 198px);
 705 }
 706
 707 /* copy button */
 708
 709 #copy-button {
 710   -moz-image-region: rect(0, 234px, 18px, 216px);
 711 }
 712
 713 /* paste button */
 714
 715 #paste-button {
 716   -moz-image-region: rect(0, 252px, 18px, 234px);
 717 }
 718
 719 /* fullscreen button */
 720
 721 #fullscreen-button {
 722   -moz-image-region: rect(0, 270px, 18px, 252px);
 723 }
 724
 725 /* zoom controls */
 726
 727 #zoom-out-button {
 728   -moz-image-region: rect(0, 288px, 18px, 270px);
 729   -moz-margin-end: 0;
 730 }
 731
 732 #zoom-in-button {
 733   -moz-image-region: rect(0, 306px, 18px, 288px);
 734   -moz-border-start: none;
 735   -moz-margin-start: 0;
 736 }
 737
 738 #zoom-out-button:-moz-locale-dir(ltr),
 739 #zoom-in-button:-moz-locale-dir(rtl) {
 740   border-top-right-radius: 0;
 741   border-bottom-right-radius: 0;
 742 }
 743
 744 #zoom-out-button:-moz-locale-dir(rtl),
 745 #zoom-in-button:-moz-locale-dir(ltr) {
 746   border-top-left-radius: 0;
 747   border-bottom-left-radius: 0;
 748 }
 749
 750 /* sync button */
 751
 752 #sync-button {
 753   -moz-image-region: rect(0, 324px, 18px, 306px);
 754 }
 755
 756 #sync-button[status="active"] {
 757   list-style-image: url("chrome://browser/skin/sync-throbber.png");
 758   -moz-image-region: rect(0, 18px, 18px, 0);
 759 }
 760
 761 /* feed button */
 762
 763 #feed-button {
 764   -moz-image-region: rect(0, 342px, 18px, 324px);
 765 }
 766
 767 /* ::::: fullscreen window controls ::::: */
 768
 769 #TabsToolbar > #window-controls {
 770   -moz-margin-start: 4px;
 771 }
 772
 773 #minimize-button,
 774 #restore-button,
 775 #close-button {
 776 /*  padding: 0; */
 777 }
 778
 779 #minimize-button {
 780   list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
 781 }
 782
 783 #minimize-button:hover {
 784   list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
 785 }
 786
 787 #restore-button {
 788   list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
 789 }
 790
 791 #restore-button:hover {
 792   list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
 793 }
 794
 795 #close-button {
 796   list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
 797 }
 798
 799 #close-button:hover {
 800   list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
 801 }
 802
 803 /* ::::: Location Bar ::::: */
 804
 805 #urlbar {
 806   width: 7em;
 807   min-width: 7em;
 808 }
 809
 810 #urlbar,
 811 .searchbar-textbox {
 812   border-radius: 5px;
 813   margin: 0;
 814   -moz-margin-start: 3px;
 815 }
 816
 817 #urlbar:-moz-lwtheme,
 818 .searchbar-textbox:-moz-lwtheme {
 819   /* background-color: rgba(255,255,255,.8);
 820   @navbarTextboxCustomBorder@
 821   color: black; */
 822 }
 823
 824 html|*.urlbar-input:-moz-lwtheme:-moz-placeholder,
 825 .searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input:-moz-placeholder {
 826   color: #E7ADE7;
 827 }
 828
 829 #urlbar:-moz-lwtheme[focused="true"],
 830 .searchbar-textbox:-moz-lwtheme[focused="true"] {
 831 /*  background-color: white; */
 832 }
 833
 834 #urlbar-container {
 835   -moz-box-orient: horizontal;
 836   -moz-box-align: stretch;
 837 }
 838
 839 .urlbar-textbox-container {
 840   -moz-box-align: stretch;
 841 }
 842
 843 #urlbar-icons {
 844   height: 18px;
 845   -moz-box-align: center;
 846 }
 847
 848 .urlbar-icon {
 849   padding: 0 2px !important;
 850 }
 851
 852 .urlbar-icon:-moz-system-metric(touch-enabled) {
 853   -moz-margin-end: 1px !important;
 854   padding: 0 3px !important;
 855 }
 856
 857 #urlbar-search-splitter {
 858   min-width: 6px;
 859   -moz-margin-start: -3px;
 860   border: none;
 861   background: transparent;
 862 }
 863
 864 #urlbar-search-splitter + #urlbar-container > #urlbar ,
 865 #urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox {
 866   -moz-margin-start: 0;
 867 }
 868
 869 #urlbar-display {
 870   margin-top: -2px;
 871   margin-bottom: -2px;
 872   -moz-border-end: 1px solid #9C9CFF;
 873   -moz-margin-end: 3px;
 874 }
 875
 876 #urlbar-display {
 877   margin-top: 0;
 878   margin-bottom: 0;
 879   color: #8050B0;
 880 }
 881
 882 /* identity box */
 883
 884 #identity-box {
 885   background-color: #000000;
 886   color: #FF9F00;
 887   border-radius: 2px;
 888 }
 889
 890 #identity-box:hover {
 891   background-color: #9C9CFF;
 892   color: #000000;
 893 }
 894
 895 #identity-box[open="true"],
 896 #identity-box:hover:active {
 897   background-color: #FF9F00;
 898   color: #000000;
 899 }
 900
 901 #identity-box.verifiedDomain {
 902   background-color: #FFCF00;
 903   color: #000000;
 904 }
 905
 906 #identity-box.verifiedIdentity {
 907   background-color: #008484;
 908   color: #000000;
 909 }
 910
 911 #identity-box:-moz-focusring {
 912   outline: 1px dotted #008484;
 913   outline-offset: -3px;
 914 }
 915
 916 #identity-box.verifiedDomain:-moz-focusring,
 917 #identity-box.verifiedIdentity:-moz-focusring {
 918   outline-color: #000000;
 919 }
 920
 921 #identity-icon-labels {
 922   -moz-margin-start: 1px;
 923   -moz-margin-end: 3px;
 924   -moz-transform: translate(0, -1px);
 925 }
 926
 927 /* Location bar dropmarker */
 928
 929 .urlbar-history-dropmarker {
 930   -moz-appearance: none;
 931   padding: 0 1px;
 932   background-color: transparent;
 933   border: none;
 934   width: auto;
 935   list-style-image: url("mainwindow-dropdown-arrow.png");
 936   -moz-image-region: rect(0, 13px, 11px, 0);
 937 }
 938
 939 .urlbar-history-dropmarker:-moz-system-metric(touch-enabled) {
 940   min-width: 6.4mozmm;
 941 }
 942
 943 .urlbar-history-dropmarker:hover:active,
 944 .urlbar-history-dropmarker[open="true"] {
 945   -moz-image-region: rect(0, 26px, 11px, 13px);
 946 }
 947
 948 /* page proxy icon */
 949
 950 #page-proxy-favicon,
 951 #urlbar-throbber {
 952   width: 16px;
 953   height: 16px;
 954 }
 955
 956 #page-proxy-stack {
 957   width: 24px;
 958   height: 18px;
 959   padding: 1px 4px;
 960   background: url("urlbar-favicon-glow.png") center center no-repeat;
 961 }
 962
 963 #page-proxy-favicon:not([src]) {
 964   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-item.gif");
 965 }
 966
 967 #page-proxy-favicon[pageproxystate="invalid"] {
 968   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-item.gif");
 969 }
 970
 971 #urlbar-throbber {
 972   list-style-image: url("chrome://global/skin/icons/loading.gif");
 973 }
 974
 975 /* autocomplete */
 976
 977 #PopupAutoComplete,
 978 #PopupAutoCompleteRichResult {
 979   direction: ltr !important;
 980 }
 981
 982 #PopupAutoComplete:-moz-locale-dir(rtl) > tree > treerows {
 983   direction: rtl;
 984 }
 985
 986 #PopupAutoComplete .autocomplete-treebody {
 987   direction: ltr;
 988 }
 989
 990 #treecolAutoCompleteImage {
 991   max-width: 36px;
 992 }
 993
 994 .ac-result-type-bookmark,
 995 .autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
 996   list-style-image: url("chrome://browser/skin/places/editBookmark.png");
 997   -moz-image-region: rect(0px 16px 16px 0px);
 998   width: 16px;
 999   height: 16px;
1000 }
1001
1002 .ac-result-type-keyword,
1003 .autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) {
1004   list-style-image: url("chrome://global/skin/icons/Search-glass.png");
1005   -moz-image-region: rect(0px 32px 16px 16px);
1006   width: 16px;
1007   height: 16px;
1008 }
1009
1010 .ac-result-type-tag,
1011 .autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
1012   list-style-image: url("chrome://browser/skin/places/tag.png");
1013   width: 16px;
1014   height: 16px;
1015 }
1016
1017 .ac-comment {
1018   font-size: 1.15em;
1019 }
1020
1021 .ac-extra > .ac-comment {
1022   font-size: inherit;
1023 }
1024
1025 .ac-url-text,
1026 .ac-action-text {
1027   color: #9C9CFF;
1028 }
1029
1030 richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
1031   list-style-image: url("chrome://browser/skin/actionicon-tab.png");
1032 }
1033
1034 .autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
1035   color: #8050B0;
1036 }
1037
1038 .ac-comment[selected="true"],
1039 .ac-url-text[selected="true"],
1040 .ac-action-text[selected="true"] {
1041   color: inherit !important;
1042 }
1043
1044 .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
1045 .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
1046 {
1047   color: #8050B0;
1048   font-size: smaller;
1049 }
1050
1051 .autocomplete-treebody::-moz-tree-cell(suggesthint) {
1052   border-top: 1px solid #9C9CFF;
1053 }
1054
1055 /* go button */
1056
1057 #go-button {
1058   list-style-image: url("chrome://browser/skin/Go-arrow.png");
1059   -moz-image-region: rect(0px, 16px, 16px, 0px);
1060 }
1061
1062 #go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
1063   -moz-transform: scaleX(-1);
1064 }
1065
1066 #go-button:hover {
1067   -moz-image-region: rect(16px, 16px, 32px, 0px);
1068 }
1069
1070 /* combined go/reload/stop button in location bar */
1071
1072 #urlbar > toolbarbutton {
1073   list-style-image: url("chrome://browser/skin/reload-stop-go.png");
1074   margin: -2px;
1075   -moz-margin-start: 0;
1076   padding: 0 3px;
1077   background-origin: border-box;
1078   border: none;
1079   -moz-border-start: 1px solid #9C9CFF;
1080 }
1081
1082 #urlbar:-moz-locale-dir(ltr) > toolbarbutton {
1083   border-top-right-radius: 2px;
1084   border-bottom-right-radius: 2px;
1085 }
1086
1087 #urlbar:-moz-locale-dir(rtl) > toolbarbutton {
1088   border-top-left-radius: 2px;
1089   border-bottom-left-radius: 2px;
1090 }
1091
1092 #urlbar > toolbarbutton:not([disabled]):active:hover {
1093   -moz-padding-start: 4px;
1094   -moz-border-start: none;
1095 }
1096
1097 #urlbar-go-button {
1098   -moz-image-region: rect(0px, 56px, 14px, 42px);
1099 }
1100
1101 #urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
1102   -moz-transform: scaleX(-1);
1103 }
1104
1105 #urlbar-go-button:hover {
1106 }
1107
1108 #urlbar-reload-button {
1109   -moz-image-region: rect(0px, 14px, 14px, 0px);
1110 }
1111
1112 #urlbar-reload-button:not([disabled]):hover {
1113   -moz-image-region: rect(0px, 28px, 14px, 14px);
1114 }
1115
1116 #urlbar-stop-button {
1117   -moz-image-region: rect(0px, 42px, 14px, 28px);
1118 }
1119
1120 #urlbar-stop-button:hover {
1121 }
1122
1123 /* popup blocker button */
1124
1125 #page-report-button {
1126   list-style-image: url("chrome://browser/skin/urlbar-popup-blocked.png");
1127   -moz-image-region: rect(0, 16px, 16px, 0);
1128 }
1129
1130 #page-report-button:hover {
1131   -moz-image-region: rect(0, 32px, 16px, 16px);
1132 }
1133
1134 #page-report-button:hover:active,
1135 #page-report-button[open="true"] {
1136   -moz-image-region: rect(0, 48px, 16px, 32px);
1137 }
1138
1139 /* star button */
1140
1141 #star-button {
1142   list-style-image: url("chrome://browser/skin/places/bookmark.png");
1143   -moz-image-region: rect(0px 16px 16px 0px);
1144 }
1145
1146 #star-button:hover {
1147   -moz-image-region: rect(0px 32px 16px 16px);
1148 }
1149
1150 #star-button:hover:active {
1151   -moz-image-region: rect(0px 48px 16px 32px);
1152 }
1153
1154 #star-button[starred="true"] {
1155   list-style-image: url("chrome://browser/skin/places/editBookmark.png");
1156 }
1157
1158 /* bookmarking panel */
1159 #editBookmarkPanelStarIcon {
1160   list-style-image: url("chrome://browser/skin/places/starred48.png");
1161   width: 48px;
1162   height: 48px;
1163 }
1164
1165 #editBookmarkPanelStarIcon[unstarred] {
1166   list-style-image: url("chrome://browser/skin/places/unstarred48.png");
1167 }
1168
1169 #editBookmarkPanelTitle {
1170   font-size: 130%;
1171 }
1172
1173 #editBookmarkPanelHeader,
1174 #editBookmarkPanelContent {
1175   margin-bottom: .5em;
1176 }
1177
1178 /* Implements editBookmarkPanel resizing on folderTree un-collapse. */
1179 #editBMPanel_folderTree {
1180   min-width: 27em;
1181 }
1182
1183 /* ::::: content area ::::: */
1184
1185 #sidebar {
1186   background-color: Window;
1187 }
1188
1189 #sidebar-title {
1190   -moz-padding-start: 0px;
1191 }
1192
1193 /* ::::: throbber ::::: */
1194
1195 #navigator-throbber {
1196   width: 16px;
1197   min-height: 16px;
1198   margin: 0 3px;
1199 }
1200
1201 #navigator-throbber[busy="true"] {
1202   list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.gif");
1203 }
1204
1205 #navigator-throbber,
1206 #wrapper-navigator-throbber > #navigator-throbber {
1207   list-style-image: url("chrome://communicator/skin/brand/throbber16-single.gif");
1208 }
1209
1210 /* Tabstrip */
1211 #TabsToolbar {
1212   min-height: 0;
1213   padding: 0;
1214 }
1215
1216 #TabsToolbar[tabsontop="false"] {
1217   border-bottom: 1px solid #FF9F00;
1218 }
1219
1220 .tabbrowser-tab,
1221 .tabs-newtab-button {
1222   margin-top: 0px;
1223 }
1224
1225 .tabbrowser-tab:hover,
1226 .tabs-newtab-button:hover {
1227 }
1228
1229 .tabbrowser-tab[selected="true"] {
1230 }
1231
1232 #main-window[tabsontop=false]:not([disablechrome]) .tabbrowser-tab[selected=true]:not(:-moz-lwtheme) {
1233 }
1234
1235 .tabbrowser-tab:-moz-lwtheme {
1236 }
1237
1238 .tabbrowser-tab[selected="true"]:-moz-lwtheme {
1239 }
1240
1241 .tabbrowser-tab:-moz-lwtheme-brighttext:not([selected="true"]),
1242 .tabs-newtab-button:-moz-lwtheme-brighttext {
1243 }
1244
1245 .tabbrowser-tab:-moz-lwtheme-brighttext:not([selected="true"]):hover,
1246 .tabs-newtab-button:-moz-lwtheme-brighttext:hover {
1247 }
1248
1249 .tabbrowser-tab:-moz-lwtheme-darktext:not([selected="true"]),
1250 .tabs-newtab-button:-moz-lwtheme-darktext {
1251 }
1252
1253 .tabbrowser-tab:-moz-lwtheme-darktext:not([selected="true"]):hover,
1254 .tabs-newtab-button:-moz-lwtheme-darktext:hover {
1255 }
1256
1257 .tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) {
1258   background-color: #E7ADE7;
1259 }
1260 .tabbrowser-tab[pinned][titlechanged]:not([selected="true"]):hover {
1261   background-color: #0000FF;
1262   color: #000000;
1263 }
1264
1265 .tab-throbber,
1266 .tab-icon-image {
1267   width: 16px;
1268   height: 16px;
1269   list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-item.gif");
1270   -moz-image-region: rect(0px, 16px, 16px, 0px);
1271   -moz-margin-end: 3px;
1272 }
1273
1274 .tab-throbber {
1275   list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png");
1276 }
1277
1278 .tab-throbber[progress] {
1279   list-style-image: url("chrome://browser/skin/tabbrowser/loading.png");
1280 }
1281
1282 .tabbrowser-tab[pinned] {
1283   min-height: 16px; /* corresponds to the max. height of non-textual tab contents, i.e. the favicon */
1284 }
1285
1286 .tab-throbber[pinned],
1287 .tab-icon-image[pinned] {
1288   -moz-margin-start: 2px;
1289   -moz-margin-end: 2px;
1290 }
1291
1292 /* tabbrowser-tab focus ring */
1293 .tabbrowser-tab:focus > .tab-stack {
1294   outline: 1px dotted;
1295 }
1296
1297 /* Tab DnD indicator */
1298 .tab-drop-indicator {
1299   list-style-image: url("chrome://browser/skin/tabbrowser/tabDragIndicator.png");
1300   margin-bottom: -11px;
1301 }
1302
1303 /* Tab close button */
1304 .tab-close-button {
1305   border: none;
1306   padding: 0px;
1307   list-style-image: url("chrome://global/skin/icons/close-button.gif");
1308 }
1309
1310 .tab-close-button:-moz-system-metric(touch-enabled) {
1311   -moz-transform: scale(1.2);
1312 }
1313
1314 .tab-close-button:hover,
1315 .tab-close-button:hover[selected="true"] {
1316   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1317 }
1318
1319 .tab-close-button:hover:active,
1320 .tab-close-button:hover:active[selected="true"] {
1321   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1322 }
1323
1324 .tab-close-button:focus {
1325   outline: none !important;
1326 }
1327
1328 /* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */
1329
1330 @media all and (-moz-touch-enabled) {
1331   .tabbrowser-arrowscrollbox > .scrollbutton-up,
1332   .tabbrowser-arrowscrollbox > .scrollbutton-down,
1333   #TabsToolbar .toolbarbutton-1 {
1334     min-width: 8.1mozmm;
1335   }
1336
1337   .tabs-newtab-button {
1338     min-width: 10mozmm;
1339   }
1340
1341   .tab-content {
1342     min-height: -moz-calc(6.8mozmm - 7px); /* subtract borders from the desired height */
1343   }
1344 }
1345
1346 .tabbrowser-arrowscrollbox > .scrollbutton-up,
1347 .tabbrowser-arrowscrollbox > .scrollbutton-down {
1348   list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-left.png");
1349   -moz-image-region: rect(0, 15px, 17px, 0);
1350   margin: 0;
1351   padding-top: 0;
1352   padding-bottom: 0;
1353 }
1354
1355 .tabbrowser-arrowscrollbox > .scrollbutton-up[disabled],
1356 .tabbrowser-arrowscrollbox > .scrollbutton-down[disabled] {
1357   opacity: .4;
1358 }
1359
1360 .tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):hover:active,
1361 .tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):hover:active {
1362   -moz-image-region: rect(0, 30px, 17px, 15px);
1363 }
1364
1365 .tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(rtl) > .toolbarbutton-icon,
1366 .tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(ltr) > .toolbarbutton-icon {
1367   -moz-transform: scaleX(-1);
1368 }
1369
1370 .tabbrowser-arrowscrollbox > .scrollbutton-down {
1371 }
1372
1373 .tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
1374   background-color: #008484;
1375 }
1376
1377 .tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):not(:hover):-moz-locale-dir(ltr),
1378 .tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):not(:hover):-moz-locale-dir(rtl) {
1379   -moz-appearance: none;
1380   -moz-border-image: url("chrome://browser/skin/tabbrowser/tab-overflow-border.png") 0 2 0 2 / 0 2px 0 0;
1381   padding-right: 1px;
1382 }
1383
1384 .tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):not(:hover):-moz-locale-dir(ltr),
1385 .tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):not(:hover):-moz-locale-dir(rtl) {
1386   -moz-appearance: none;
1387   -moz-border-image: url("chrome://browser/skin/tabbrowser/tab-overflow-border.png") 0 2 0 2 / 0 0 0 2px;
1388   padding-left: 1px;
1389 }
1390
1391 @media all and (-moz-windows-classic) {
1392   .tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):not(:hover):-moz-locale-dir(ltr),
1393   .tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):not(:hover):-moz-locale-dir(rtl) {
1394     padding-left: 4px;
1395     padding-right: 2px;
1396   }
1397
1398   .tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):not(:hover):-moz-locale-dir(ltr),
1399   .tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):not(:hover):-moz-locale-dir(rtl) {
1400     padding-left: 2px;
1401     padding-right: 4px;
1402   }
1403 }
1404
1405 .tabs-newtab-button > .toolbarbutton-icon {
1406   margin-top: -1px;
1407   margin-bottom: -1px;
1408 }
1409
1410 .tabs-newtab-button,
1411 #TabsToolbar > #new-tab-button,
1412 #TabsToolbar > toolbarpaletteitem > #new-tab-button {
1413   list-style-image: url(chrome://browser/skin/tabbrowser/newtab.png);
1414   -moz-image-region: rect(0, 16px, 18px, 0);
1415 }
1416
1417 .tabs-newtab-button {
1418   width: 31px;
1419 }
1420
1421 .tabs-newtab-button:hover:active,
1422 #TabsToolbar > #new-tab-button:hover:active {
1423   -moz-image-region: rect(0, 32px, 18px, 16px);
1424 }
1425
1426 #alltabs-button {
1427   list-style-image: url("chrome://browser/skin/tabbrowser/alltabs.png");
1428   -moz-image-region: rect(0, 14px, 16px, 0);
1429 }
1430
1431 #alltabs-button:hover:active {
1432   -moz-image-region: rect(0, 28px, 16px, 14px);
1433 }
1434
1435 #alltabs-button[type="menu"] {
1436   list-style-image: url("chrome://browser/skin/mainwindow-dropdown-arrow.png");
1437   -moz-image-region: rect(0, 13px, 11px, 0);
1438 }
1439
1440 #alltabs-button[type="menu"] > .toolbarbutton-icon {
1441   margin: 3px 0;
1442 }
1443
1444 #alltabs-button[type="menu"] > .toolbarbutton-menu-dropmarker {
1445   display: none;
1446 }
1447
1448 #alltabs-button[type="menu"]:hover:active,
1449 #alltabs-button[type="menu"][open="true"] {
1450   -moz-image-region: rect(0, 26px, 11px, 13px);
1451 }
1452
1453 /* All tabs menupopup */
1454 .alltabs-item > .menu-iconic-left > .menu-iconic-icon {
1455   list-style-image: url("chrome://global/skin/icons/folder-item.png");
1456   -moz-image-region: rect(0px, 16px, 16px, 0px);
1457 }
1458
1459 .alltabs-item[selected="true"] {
1460   font-weight: bold;
1461 }
1462
1463 .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon {
1464   list-style-image: url("chrome://global/skin/icons/loading.gif");
1465 }
1466
1467 /* Tabstrip close button */
1468 .tabs-closebutton {
1469   -moz-box-flex: 1;
1470   margin: 0px;
1471   padding: 2px;
1472   list-style-image: url("chrome://global/skin/icons/close-button.gif");
1473 }
1474
1475 .tabs-closebutton:hover,
1476 .tabs-closebutton:hover:active {
1477   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1478 }
1479
1480 toolbarbutton.chevron {
1481   list-style-image: url("chrome://global/skin/toolbar/chevron.gif") !important;
1482 }
1483
1484 toolbarbutton.chevron:hover {
1485   list-style-image: url("chrome://global/skin/toolbar/chevron-hover.gif") !important;
1486 }
1487
1488 toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon,
1489 toolbarbutton.chevron:-moz-locale-dir(rtl):hover > .toolbarbutton-icon {
1490   -moz-transform: scaleX(-1);
1491 }
1492
1493 toolbarbutton.chevron > .toolbarbutton-text,
1494 toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
1495   display: none;
1496 }
1497
1498 toolbarbutton.chevron > .toolbarbutton-icon {
1499   margin: 0;
1500 }
1501
1502 toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
1503   display: -moz-box; /* display chevron icon in text mode */
1504 }
1505
1506 #sidebar-throbber[loading="true"] {
1507   list-style-image: url("chrome://global/skin/icons/loading.gif");
1508   -moz-margin-end: 4px;
1509 }
1510
1511 /* Bookmarks toolbar */
1512 #PlacesToolbarDropIndicator {
1513   list-style-image: url("chrome://browser/skin/places/toolbarDropMarker.png");
1514 }
1515
1516 toolbarbutton.bookmark-item[dragover="true"][open="true"] {
1517   background-color: #008484 !important;
1518   color: #FFCF00 !important;
1519 }
1520
1521 /* rules for menupopup drop indicators */
1522 .menupopup-drop-indicator-bar {
1523   position: relative;
1524   /* these two margins must together compensate the indicator's height */
1525   margin-top: -1px;
1526   margin-bottom: -1px;
1527 }
1528
1529 .menupopup-drop-indicator {
1530   list-style-image: none;
1531   height: 2px;
1532   -moz-margin-end: -4em;
1533   background-color: #008484;
1534 }
1535
1536 /* ::::: Identity Indicator Styling ::::: */
1537
1538 /* Popup Icons */
1539 #identity-popup-icon {
1540   height: 64px;
1541   width: 64px;
1542   padding: 0;
1543   list-style-image: url("chrome://browser/skin/identity.png");
1544   -moz-image-region: rect(0px, 64px, 64px, 0px);
1545 }
1546
1547 #identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
1548   -moz-image-region: rect(64px, 64px, 128px, 0px);
1549 }
1550
1551 #identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
1552   -moz-image-region: rect(128px, 64px, 192px, 0px);
1553 }
1554
1555 /* Popup Body Text */
1556 .identity-popup-description {
1557   white-space: pre-wrap;
1558   -moz-padding-start: 15px;
1559   margin: 2px 0 4px;
1560 }
1561
1562 .identity-popup-label {
1563   white-space: pre-wrap;
1564   -moz-padding-start: 15px;
1565   margin: 0;
1566 }
1567
1568 #identity-popup-content-host ,
1569 #identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner {
1570   font-size: 1.2em;
1571 }
1572
1573 #identity-popup-content-host {
1574   margin-top: 3px;
1575   margin-bottom: 5px;
1576   font-weight: bold;
1577   max-width: 300px;
1578 }
1579
1580 #identity-popup-content-owner {
1581   margin-top: 4px;
1582   margin-bottom: 0 !important;
1583   font-weight: bold;
1584   max-width: 300px;
1585 }
1586
1587 .verifiedDomain > #identity-popup-content-owner {
1588   font-weight: normal;
1589 }
1590
1591 #identity-popup-content-verifier {
1592   margin: 4px 0 2px;
1593 }
1594
1595 #identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
1596 #identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
1597   margin-top: 10px;
1598   -moz-margin-start: -24px;
1599 }
1600
1601 #identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
1602 #identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
1603   list-style-image: url("chrome://browser/skin/Secure24.png");
1604 }
1605
1606 #identity-popup-more-info-button {
1607   margin-top: 6px;
1608   margin-bottom: 0;
1609   -moz-margin-end: 0;
1610 }
1611
1612 .popup-notification-icon {
1613   width: 64px;
1614   height: 64px;
1615   -moz-margin-end: 10px;
1616 }
1617
1618 .popup-notification-icon[popupid="geolocation"] {
1619   list-style-image: url("chrome://browser/skin/Geolocation-64.png");
1620 }
1621
1622 .popup-notification-icon[popupid="xpinstall-disabled"],
1623 .popup-notification-icon[popupid="addon-progress"],
1624 .popup-notification-icon[popupid="addon-install-cancelled"],
1625 .popup-notification-icon[popupid="addon-install-blocked"],
1626 .popup-notification-icon[popupid="addon-install-failed"],
1627 .popup-notification-icon[popupid="addon-install-complete"] {
1628   list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
1629   width: 32px;
1630   height: 32px;
1631 }
1632
1633 .addon-progress-description {
1634   width: 350px;
1635   max-width: 350px;
1636 }
1637
1638 .popup-progress-label,
1639 .popup-progress-meter {
1640   -moz-margin-start: 0;
1641   -moz-margin-end: 0;
1642 }
1643
1644 .popup-progress-cancel {
1645   -moz-appearance: none;
1646   background: transparent;
1647   border: none;
1648   padding: 0;
1649   margin: 0;
1650   min-height: 0;
1651   min-width: 0;
1652   list-style-image: url("chrome://mozapps/skin/downloads/downloadButtons.png");
1653   -moz-image-region: rect(0px, 32px, 16px, 16px);
1654 }
1655
1656 .popup-progress-cancel:hover {
1657   -moz-image-region: rect(16px, 32px, 32px, 16px);
1658 }
1659
1660 .popup-progress-cancel:active {
1661   -moz-image-region: rect(32px, 32px, 48px, 16px);
1662 }
1663
1664 .popup-notification-icon[popupid="indexedDB-permissions-prompt"],
1665 .popup-notification-icon[popupid="indexedDB-quota-prompt"] {
1666   list-style-image: url("chrome://global/skin/icons/alert-question.gif");
1667 }
1668
1669 .popup-notification-icon[popupid="password-save"],
1670 .popup-notification-icon[popupid="password-change"] {
1671   list-style-image: url("chrome://mozapps/skin/passwordmgr/key-64.png");
1672 }
1673
1674 /* Notification icon box */
1675 #notification-popup-box {
1676   margin: 0 3px;
1677 }
1678
1679 .notification-anchor-icon {
1680   width: 16px;
1681   height: 16px;
1682 }
1683
1684 .notification-anchor-icon:-moz-focusring {
1685   outline: 1px dotted -moz-DialogText;
1686   outline-offset: -3px;
1687 }
1688
1689 #default-notification-icon {
1690   list-style-image: url("chrome://global/skin/icons/information-16.png");
1691 }
1692
1693 #geo-notification-icon {
1694   list-style-image: url("chrome://browser/skin/Geolocation-16.png");
1695 }
1696
1697 #addons-notification-icon {
1698   list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
1699 }
1700
1701 #indexedDB-notification-icon {
1702   list-style-image: url("chrome://global/skin/icons/question-16.png");
1703 }
1704
1705 #password-notification-icon {
1706   list-style-image: url("chrome://mozapps/skin/passwordmgr/key-16.png");
1707 }
1708
1709 #identity-popup-container {
1710   min-width: 280px;
1711 }
1712
1713 #download-monitor {
1714   list-style-image: url("chrome://browser/skin/Toolbar.png");
1715   -moz-image-region: rect(0, 108px, 18px, 90px);
1716 }
1717
1718 /* Bookmarks roots menu-items */
1719 #appmenu_subscribeToPage:not([disabled]),
1720 #appmenu_subscribeToPageMenu,
1721 #subscribeToPageMenuitem:not([disabled]),
1722 #subscribeToPageMenupopup,
1723 #BMB_subscribeToPageMenuitem:not([disabled]),
1724 #BMB_subscribeToPageMenupopup {
1725   list-style-image: url("chrome://browser/skin/feeds/feedIcon16.png");
1726 }
1727
1728 #bookmarksToolbarFolderMenu,
1729 #appmenu_bookmarksToolbar,
1730 #BMB_bookmarksToolbar {
1731   list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png");
1732   -moz-image-region: auto;
1733 }
1734
1735 #appmenu_unsortedBookmarks,
1736 #BMB_unsortedBookmarks {
1737   list-style-image: url("chrome://browser/skin/places/unsortedBookmarks.png");
1738   -moz-image-region: auto;
1739 }
1740
1741 /* ::::: Keyboard UI Panel ::::: */
1742
1743 .KUI-panel {
1744   color: #FF9F00;
1745   border-style: none;
1746   border-radius: 20px;
1747 }
1748
1749 .KUI-panel[level="top"] {
1750   /*background-color: rgba(27%,27%,27%,.65);*/
1751 }
1752
1753 .KUI-panel-closebutton {
1754   list-style-image: url("KUI-close.png");
1755   width: 24px;
1756   height: 24px;
1757 }
1758
1759 .KUI-panel-closebutton:not(:hover) {
1760 }
1761
1762 .KUI-panel-closebutton > .toolbarbutton-icon {
1763 }
1764
1765 /* ::::: Ctrl-Tab and All Tabs Panels ::::: */
1766
1767 /* Ctrl-Tab */
1768
1769 #ctrlTab-panel {
1770   padding: 20px 10px 10px;
1771   font-weight: bold;
1772 }
1773
1774 .ctrlTab-favicon[src] {
1775   background-color: #000000;
1776   width: 20px;
1777   height: 20px;
1778   padding: 2px;
1779 }
1780
1781 .ctrlTab-preview-inner > .tabPreview-canvas {
1782 }
1783
1784 .ctrlTab-preview:not(#ctrlTab-showAll) > * > .ctrlTab-preview-inner > .tabPreview-canvas {
1785   margin-bottom: 2px;
1786 }
1787
1788 .ctrlTab-preview-inner {
1789   padding-bottom: 10px;
1790 }
1791
1792 #ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
1793   padding: 10px;
1794   background-color: #000000;
1795   border-radius: .5em;
1796 }
1797
1798 .ctrlTab-preview:focus > * > .ctrlTab-preview-inner {
1799   color: white;
1800   background-color: #000000;
1801   text-shadow: none;
1802   padding: 8px;
1803   border: 2px solid #9C9CFF;
1804   border-radius: .5em;
1805 }
1806
1807 .ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
1808   margin: -10px -10px 0;
1809 }
1810
1811 #ctrlTab-showAll {
1812   margin-top: .5em;
1813 }
1814
1815 /* All Tabs */
1816
1817 #allTabs-panel {
1818   padding-bottom: 10px;
1819 }
1820
1821 #allTabs-meta {
1822   margin: 10px;
1823 }
1824
1825 #allTabs-filter {
1826   -moz-margin-start: 24px;
1827   -moz-margin-end: 0;
1828 }
1829
1830 #allTabs-tab-close-button > .toolbarbutton-icon {
1831   margin: 0;
1832 }
1833
1834 .allTabs-favicon[src] {
1835   width: 22px;
1836   height: 22px;
1837   padding-top: 1px;
1838   padding-bottom: 5px;
1839   -moz-padding-start: 1px;
1840   -moz-padding-end: 5px;
1841   margin-top: -2px;
1842   -moz-margin-start: -2px;
1843   border-bottom-right-radius: 4px;
1844 }
1845
1846 .allTabs-favicon[src]:-moz-locale-dir(rtl) {
1847   border-bottom-right-radius: 0;
1848   border-bottom-left-radius: 4px;
1849 }
1850
1851 .allTabs-preview-inner > .tabPreview-canvas {
1852   background-color: #E7ADE7;
1853 }
1854
1855 .allTabs-preview:not(:hover):not([closebuttonhover]) > html|canvas {
1856 }
1857
1858 .allTabs-preview:focus > * > .allTabs-preview-inner {
1859   outline: 1px dotted #008484;
1860 }
1861
1862 /* Inspector / Highlighter */
1863
1864 #highlighter-panel {
1865   -moz-window-shadow: none;
1866   background: #000000;
1867   border: none;
1868 }
1869
1870 listitem.style-selector {
1871   background-color: #9C9CFF;
1872   color: #000000;
1873 }
1874
1875 listitem.style-section {
1876   background-color: #E7ADE7;
1877   color: #000000;
1878   font-weight: bold;
1879 }
1880
1881 panel[dimmed="true"] {
1882   opacity: 0.5;
1883 }
1884
1885 /* Vertically-center the statusbar compatibility shim, because
1886    toolbars, even in small-icon mode, are a bit taller than
1887    statusbars. Also turn off the statusbar border. On Windows
1888    we have to disable borders on statusbar *and* child statusbar
1889    elements. */
1890 #status-bar {
1891   margin-top: .3em;
1892   border-width: 0;
1893 }
1894
1895 /* Remove all borders from statusbarpanel children of
1896    the statusbar.
1897 #status-bar > statusbarpanel {
1898   border-width: 0;
1899 } */
1900
1901 /* Add-on bar close button */
1902 #addonbar-closebutton {
1903   border: none;
1904   padding: 3px 5px;
1905   list-style-image: url("chrome://global/skin/icons/close-button.gif");
1906 }
1907
1908 #addonbar-closebutton:hover,
1909 #addonbar-closebutton:hover:active {
1910   list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1911 }
1912
1913 /* Status panel */
1914
1915 .statuspanel-label {
1916   margin: 0;
1917   padding: 2px 4px;
1918   background: -moz-linear-gradient(white, #ddd);
1919   border: 1px none #9C9CFF;
1920   border-top-style: solid;
1921   color: #FF9F00;
1922   text-shadow: none;
1923 }
1924
1925 .statuspanel-label:-moz-locale-dir(ltr):not([mirror]),
1926 .statuspanel-label:-moz-locale-dir(rtl)[mirror] {
1927   border-right-style: solid;
1928   border-top-right-radius: .3em;
1929   margin-right: 1em;
1930 }
1931
1932 .statuspanel-label:-moz-locale-dir(rtl):not([mirror]),
1933 .statuspanel-label:-moz-locale-dir(ltr)[mirror] {
1934   border-left-style: solid;
1935   border-top-left-radius: .3em;
1936   margin-left: 1em;
1937 }