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