projects / themes.git / blame
? search:
summary | shortlog | log | commit | commitdiff | tree
blob | blame (incremental) | history | HEAD
fourth part of syncing LCARStrek with Firefox 30 windows theme changes
[themes.git] / LCARStrek / browser / browser.css
CommitLineData
9099c61d
RK		 1/* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
acb0e9b8 4
5@import url("chrome://global/skin/");
fcaeefc2 6@import url("downloads/indicator.css");
acb0e9b8 7
8@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
319c6529 9@namespace html url("http://www.w3.org/1999/xhtml");
cae267ab 10@namespace svg url("http://www.w3.org/2000/svg");
319c6529
RK		 11
12toolbar {
13 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar");
14}
acb0e9b8 15
7d3f7f14 16toolbar[customizable="true"] {
43cc2806
RK		 17 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-browsercustom");
18}
19
41279e76
RK		 20toolbar[type="menubar"][autohide="true"] {
21 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide");
22}
23
7d3f7f14 24#toolbar-menubar[autohide="true"] {
43cc2806
RK		 25 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide-browsercustom");
26}
27
acb0e9b8 28menubar {
319c6529 29 -moz-binding: url("chrome://global/skin/globalBindings.xml#menubar");
acb0e9b8 30}
31
319c6529
RK		 32#menubar-items {
33 -moz-box-orient: vertical; /* for flex hack */
acb0e9b8 34}
35
319c6529
RK		 36#main-menubar {
37 -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
38}
39
63ada306
RK		 40/* ::::: primary toolbar ::::: */
41
42.toolbar-primary > .toolbar-box > .toolbar-holder {
270cbf0c 43 background-color: #A09090;
63ada306
RK		 44}
45
46.toolbar-primary > .toolbar-box > .toolbar-startcap,
47.toolbar-primary > .toolbar-box > .toolbar-endcap {
48 background-color: #9C9CFF;
49}
50
e20c83c3
RK		 51/* Hides the titlebar-placeholder underneath the window caption buttons when we
52 are not autohiding the menubar. */
53#toolbar-menubar:not([autohide="true"]) + #TabsToolbar > .titlebar-placeholder[type="caption-buttons"] {
54 display: none;
55}
56
43cc2806
RK		 57/* We want a 4px gap between the TabsToolbar and the toolbar-menubar when the
58 toolbar-menu is displayed, and a 16px gap when it is not. 1px is taken care
59 of by the (light) outer shadow of the tab, the remaining 3/15 are these margins. */
c0f6797e
RK		 60#toolbar-menubar:not([moz-collapsed=true]):not([autohide=true]) ~ #TabsToolbar,
61#toolbar-menubar:not([moz-collapsed=true])[autohide=true]:not([inactive]) ~ #TabsToolbar {
43cc2806
RK		 62/* margin-top: 3px;*/
63}
64
65#main-window[tabsintitlebar][sizemode="normal"][chromehidden~="menubar"] #toolbar-menubar ~ #TabsToolbar,
66#main-window[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="true"][inactive] ~ #TabsToolbar {
67/* margin-top: 15px;*/
68}
69
7d3f7f14 70#toolbar-menubar:not([autohide="true"]) {
43cc2806
RK		 71 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-drag-browsercustom");
72}
73
018d70fb
RK		 74#main-window[tabsintitlebar] #toolbar-menubar .toolbar-endcap {
75 /* the titlebar buttons are shown right over the endcap but we have no power over the buttonbox position just for this case, so hide the endcap */
76 display: none;
43cc2806 77}
63ada306 78
e20c83c3
RK		 79#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[customizing-dragovertarget].customization-target::before,
80#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #TabsToolbar[customizing-dragovertarget].customization-target::before,
81#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #toolbar-menubar.customization-target:hover::before,
82#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #TabsToolbar.customization-target:hover::before {
83 outline-color: #A09090;
84}
85
319c6529
RK		 86#navigator-toolbox {
87}
88
9abeb12c
RK		 89#navigator-toolbox::after {
90 content: "";
91 display: -moz-box;
92 -moz-box-ordinal-group: 101; /* tabs toolbar is 100 */
93 height: 1px;
94}
9abeb12c 95
319c6529
RK		 96#navigator-toolbox > toolbar:not(:-moz-lwtheme) {
97}
98
c0f6797e
RK		 99/* indent due to non-applicable aero rule */
100 #toolbar-menubar {
101 background-color: transparent !important;
319c6529
RK		 102 }
103
c0f6797e
RK		 104 #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar:not(:-moz-lwtheme),
105 #main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar:not(:-moz-lwtheme) {
106 /* like menubar */
107 background-color: #6000CF;
108 color: #FF9F00;
319c6529
RK		 109 }
110
c0f6797e
RK		 111 #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar:not(:-moz-lwtheme):-moz-window-inactive,
112 #main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive {
113 background-color: #8050B0;
114 color: #FF9F00;
319c6529
RK		 115 }
116
c0f6797e
RK		 117 #TabsToolbar:-moz-lwtheme {
118 /*background: linear-gradient(to top, @toolbarShadowColor@ 2px, transparent 2px);*/
319c6529 119 }
9abeb12c 120
c0f6797e
RK		 121 #main-window[tabsintitlebar] #titlebar:-moz-lwtheme {
122 visibility: hidden;
123 }
319c6529 124
c0f6797e
RK		 125 #main-window[tabsintitlebar] #titlebar-content:-moz-lwtheme {
126 -moz-binding: url("chrome://global/content/bindings/general.xml#windowdragbox");
127 visibility: visible;
128 }
319c6529 129
c0f6797e 130/* Make the menu inherit the toolbar's color. On non-compositor (Aero Basic, XP modern, classic)
5401f433
RK		 131 * this is defined above, but only for tabsintitlebar. Otherwise (Aero Glass, Windows 8),
132 * this is hardcoded to black in browser-aero.css, even without tabsintitlebar. */
133 #main-window[tabsintitlebar] #main-menubar > menu:not(:-moz-lwtheme) {
134/* color: inherit; */
135 }
319c6529 136
c0f6797e
RK		 137#nav-bar {
138 /* Position the toolbar above the bottom of background tabs */
139 position: relative;
140 z-index: 1;
82b4252f
RK		 141}
142
c0f6797e
RK		 143#personal-bookmarks {
144/* min-height: 24px; */
319c6529
RK		 145}
146
c0f6797e
RK		 147#print-preview-toolbar:not(:-moz-lwtheme) {
148 /* -moz-appearance: toolbox; */
82b4252f
RK		 149}
150
c0f6797e 151#browser-bottombox:not(:-moz-lwtheme) {
319c6529
RK		 152}
153
154/* ::::: titlebar ::::: */
155
5305ef8d
RK		 156#titlebar {
157 /* like menubar */
158 background-color: #6000CF;
159 color: #FF9F00;
160}
161#titlebar:-moz-window-inactive {
162 background-color: #8050B0;
163 color: #FF9F00;
164}
165
319c6529 166#main-window[sizemode="normal"] > #titlebar {
5305ef8d
RK		 167 margin-top: -3px;
168 margin-bottom: 3px;
319c6529
RK		 169}
170
171#main-window[sizemode="maximized"] > #titlebar {
5305ef8d 172 margin-top: 4px;
319c6529
RK		 173}
174
43cc2806
RK		 175/* The button box must appear on top of the navigator-toolbox in order for
176 * click and hover mouse events to work properly for the button in the restored
177 * window state. Otherwise, elements in the navigator-toolbox, like the menubar,
178 * can swallow those events. It will also place the buttons above the fog on
179 * themes with Aero Glass.
180 */
319c6529 181#titlebar-buttonbox {
b7f3670c
RK		 182 -moz-appearance: none;
183 margin-top: 6px;
184 margin-top: 4px;
5305ef8d 185 -moz-margin-end: 3px;
43cc2806 186 z-index: 1;
319c6529
RK		 187}
188
319c6529
RK		 189.titlebar-placeholder[type="appmenu-button"] {
190 margin-left: 4px;
191}
192
193.titlebar-placeholder[type="caption-buttons"] {
194 margin-left: 10px;
195}
196
197/* titlebar command buttons */
198
199#titlebar-min {
5305ef8d
RK		 200 list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
201}
202
203#titlebar-min:hover {
204 list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
319c6529
RK		 205}
206
207#titlebar-max {
5305ef8d
RK		 208 list-style-image: url("chrome://browser/skin/win-maximize.gif");
209}
210
211#titlebar-max:hover {
212 list-style-image: url("chrome://browser/skin/win-maximize-hover.gif");
319c6529
RK		 213}
214
215#main-window[sizemode="maximized"] #titlebar-max {
5305ef8d
RK		 216 list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
217}
218
219#main-window[sizemode="maximized"] #titlebar-max:hover {
220 list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
319c6529
RK		 221}
222
223#titlebar-close {
5305ef8d
RK		 224 list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
225}
226
227#titlebar-close:hover {
228 list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
acb0e9b8 229}
230
231/* ::::: bookmark buttons ::::: */
232
c0f6797e
RK		 233toolbarbutton.bookmark-item:not(.subviewbutton),
234#personal-bookmarks[cui-areatype="toolbar"]:not([overflowedItem=true]) > #bookmarks-toolbar-placeholder {
235/* margin: 0;
236 padding: 2px 3px;*/
237}
238
239toolbarbutton.bookmark-item:not([disabled="true"]):not(.subviewbutton):hover:active,
240toolbarbutton.bookmark-item[open="true"] {
241/* padding-top: 3px;
242 padding-bottom: 1px;
243 -moz-padding-start: 4px;
244 -moz-padding-end: 2px;*/
245}
246
26125509
RK		 247.bookmark-item > .toolbarbutton-icon,
248#personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
acb0e9b8 249 width: 16px;
250 height: 16px;
251}
252
26125509
RK		 253/* Force the display of the label for bookmarks */
254.bookmark-item > .toolbarbutton-text,
255#personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-text {
acb0e9b8 256 display: -moz-box !important;
257}
258
319c6529
RK		 259.bookmark-item > .toolbarbutton-menu-dropmarker {
260 display: none;
261}
262
26125509 263#bookmarks-toolbar-placeholder {
8da9da4e 264 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") !important;
319c6529
RK		 265}
266
e20c83c3
RK		 267toolbarpaletteitem[place="palette"] > #personal-bookmarks > #bookmarks-toolbar-placeholder,
268#personal-bookmarks[cui-areatype="menu-panel"] > #bookmarks-toolbar-placeholder {
269 list-style-image: url("chrome://browser/skin/places/bookmarksToolbar-menuPanel.png") !important;
270}
271
272/* ----- BOOKMARK STAR ANIMATION ----- */
273
274@keyframes animation-bookmarkAdded {
275 from { transform: rotate(0deg) translateX(-16px) rotate(0deg) scale(1); opacity: 0; }
276 60% { transform: rotate(180deg) translateX(-16px) rotate(-180deg) scale(2.2); opacity: 1; }
277 80% { opacity: 1; }
278 to { transform: rotate(180deg) translateX(-16px) rotate(-180deg) scale(1); opacity: 0; }
279}
280
281@keyframes animation-bookmarkPulse {
282 from { transform: scale(1); }
283 50% { transform: scale(1.3); }
284 to { transform: scale(1); }
285}
286
287#bookmarked-notification-container {
288 min-height: 1px;
289 min-width: 1px;
290 height: 1px;
291 margin-bottom: -1px;
292 z-index: 5;
293 position: relative;
294}
295
296#bookmarked-notification {
297 background-size: 16px;
298 background-position: center;
299 background-repeat: no-repeat;
300 width: 16px;
301 height: 16px;
302 opacity: 0;
303}
304
c0f6797e
RK		 305#bookmarked-notification-dropmarker-anchor {
306 z-index: -1;
307 position: relative;
308}
309
310#bookmarked-notification-dropmarker-icon {
311 width: 18px;
312 height: 18px;
313 visibility: hidden;
314}
315
e20c83c3
RK		 316#bookmarked-notification-anchor[notification="finish"] > #bookmarked-notification {
317 background-image: url("chrome://browser/skin/places/bookmarks-notification-finish.png");
318 animation: animation-bookmarkAdded 800ms;
319 animation-timing-function: ease, ease, ease;
320}
321
322#bookmarks-menu-button[notification="finish"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
c0f6797e
RK		 323 list-style-image: none !important;
324}
325
326#bookmarked-notification-dropmarker-anchor[notification="finish"] > #bookmarked-notification-dropmarker-icon {
327 visibility: visible;
e20c83c3
RK		 328 animation: animation-bookmarkPulse 300ms;
329 animation-delay: 600ms;
330 animation-timing-function: ease-out;
331}
332
319c6529
RK		 333/* ::::: bookmark menus ::::: */
334
335menu.bookmark-item,
336menuitem.bookmark-item {
337 min-width: 0;
ab799a7a 338 max-width: 32em;
319c6529
RK		 339}
340
e20c83c3 341.bookmark-item:not(.subviewbutton) > .menu-iconic-left {
319c6529
RK		 342 margin-top: 0;
343 margin-bottom: 0;
344}
345
346.bookmark-item > .menu-iconic-left > .menu-iconic-icon {
347 -moz-padding-start: 0px;
348}
349
350/* ::::: bookmark items ::::: */
351
352.bookmark-item {
dce90fef 353 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
8da9da4e 354 -moz-image-region: auto;
319c6529
RK		 355}
356
357.bookmark-item[container] {
358 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
8da9da4e 359 -moz-image-region: auto;
319c6529
RK		 360}
361
362.bookmark-item[container][open] {
363 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
8da9da4e 364 -moz-image-region: auto;
319c6529
RK		 365}
366
8da9da4e
RK		 367.bookmark-item[container][livemark] {
368 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-folder.png");
319c6529
RK		 369 -moz-image-region: auto;
370}
371
372.bookmark-item[container][livemark] .bookmark-item {
8da9da4e 373 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-item.png");
719b06bc 374 -moz-image-region: rect(0px, 16px, 16px, 0px);
319c6529
RK		 375}
376
eec397be 377.bookmark-item[container][livemark] .bookmark-item[visited] {
719b06bc 378 -moz-image-region: rect(0px, 32px, 16px, 16px);
eec397be
RK		 379}
380
319c6529 381.bookmark-item[container][query] {
8da9da4e 382 list-style-image: url("chrome://communicator/skin/bookmarks/query.png");
319c6529
RK		 383 -moz-image-region: auto;
384}
385
386.bookmark-item[query][tagContainer] {
387 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
388 -moz-image-region: auto;
389}
390
391.bookmark-item[query][dayContainer] {
8da9da4e 392 list-style-image: url("chrome://communicator/skin/history/calendar.png");
319c6529
RK		 393 -moz-image-region: auto;
394}
395
396.bookmark-item[query][hostContainer] {
397 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
8da9da4e 398 -moz-image-region: auto;
319c6529
RK		 399}
400
401.bookmark-item[query][hostContainer][open] {
402 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
8da9da4e 403 -moz-image-region: auto;
319c6529
RK		 404}
405
b1234db8
RK		 406.bookmark-item[cutting] > .toolbarbutton-icon,
407.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-icon {
408 opacity: 0.5;
409}
410
411.bookmark-item[cutting] > .toolbarbutton-text,
412.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-text {
413 opacity: 0.7;
414}
415
319c6529
RK		 416/* ::::: primary toolbar buttons ::::: */
417
43cc2806
RK		 418/* === BEGIN toolbarbuttons.inc.css === */
419
420/* Whole section of this included file: */
51994fad
RK		 421:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button,
422 #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #tabview-button,
423 #webrtc-status-button, #social-share-button, #open-file-button, #find-button, #developer-button,
424 #preferences-button, #privatebrowsing-button, #save-page-button, #switch-to-metro-button, #add-ons-button,
425 #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button,
426 #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button,
427 #copy-button, #paste-button, #e10s-button),
428
7d3f7f14 429#bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK		 430 list-style-image: url("chrome://browser/skin/ToolbarFx.png");
431}
432
7d3f7f14 433#back-button {
43cc2806
RK		 434 -moz-image-region: rect(0, 36px, 18px, 18px);
435}
436
7d3f7f14 437#back-button:hover:not([disabled="true"]) {
43cc2806
RK		 438 -moz-image-region: rect(18px, 36px, 36px, 18px);
439}
440
7d3f7f14 441#back-button[disabled="true"] {
43cc2806
RK		 442 -moz-image-region: rect(36px, 36px, 54px, 18px);
443}
444
7d3f7f14 445#forward-button {
43cc2806
RK		 446 -moz-image-region: rect(0, 72px, 18px, 54px);
447}
448
7d3f7f14 449#forward-button:hover:not([disabled="true"]) {
43cc2806
RK		 450 -moz-image-region: rect(18px, 72px, 36px, 54px);
451}
452
7d3f7f14 453#forward-button[disabled="true"] {
43cc2806
RK		 454 -moz-image-region: rect(36px, 72px, 54px, 54px);
455}
456
7d3f7f14
RK		 457#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
458#forward-button:-moz-locale-dir(rtl) {
43cc2806
RK		 459 transform: scaleX(-1);
460}
461
7d3f7f14 462#home-button[cui-areatype="toolbar"] {
43cc2806
RK		 463 -moz-image-region: rect(0, 126px, 18px, 108px);
464}
465
7d3f7f14 466#home-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 467 -moz-image-region: rect(18px, 126px, 36px, 108px);
468}
469
7d3f7f14 470#bookmarks-menu-button[cui-areatype="toolbar"] {
43cc2806
RK		 471 -moz-image-region: rect(0, 144px, 18px, 126px);
472}
473
7d3f7f14
RK		 474#bookmarks-menu-button[cui-areatype="toolbar"]:hover,
475#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK		 476 -moz-image-region: rect(18px, 144px, 36px, 126px);
477}
478
43ee1307 479/* When "new tab" page shows up, the menubutton-button (star button) is disabled */
7d3f7f14 480#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-button[disabled="true"] {
43ee1307
RK		 481 -moz-image-region: rect(36px, 144px, 54px, 126px) !important;
482 background-color: transparent !important;
483}
484
7d3f7f14 485#bookmarks-menu-button[cui-areatype="toolbar"][starred] {
43cc2806
RK		 486 -moz-image-region: rect(0, 162px, 18px, 144px);
487}
488
7d3f7f14 489#bookmarks-menu-button[cui-areatype="toolbar"][starred]:hover,
83e3b5cf
RK		 490#bookmarks-menu-button[cui-areatype="toolbar"][starred][open="true"],
491#bookmarks-menu-button[cui-areatype="toolbar"][starred] > .toolbarbutton-menubutton-button[open="true"] {
492 /* When starred and clicked (for edit/delete dialog),
493 * then only the menubutton-button itself is open, but not the whole menubutton. */
43cc2806
RK		 494 -moz-image-region: rect(18px, 162px, 36px, 144px);
495}
496
7d3f7f14 497#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK		 498 -moz-image-region: rect(0, 630px, 18px, 612px);
499}
500
7d3f7f14 501#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker {
43cc2806
RK		 502 padding: 1px;
503 -moz-box-align: center;
504}
505
7d3f7f14
RK		 506#bookmarks-menu-button[cui-areatype="toolbar"]:hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
507#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK		 508 -moz-image-region: rect(18px, 630px, 36px, 612px);
509}
510
7d3f7f14
RK		 511#bookmarks-menu-button[cui-areatype="toolbar"]:hover:active > .toolbarbutton-menubutton-dropmarker,
512#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] > .toolbarbutton-menubutton-dropmarker {
43cc2806
RK		 513 padding-top: 2px;
514 padding-bottom: 0px;
515 -moz-padding-start: 2px;
516 -moz-padding-end: 0px;
517}
518
7d3f7f14 519#history-panelmenu[cui-areatype="toolbar"] {
43cc2806
RK		 520 -moz-image-region: rect(0, 180px, 18px, 162px);
521}
522
7d3f7f14
RK		 523#history-panelmenu[cui-areatype="toolbar"]:hover,
524#history-panelmenu[cui-areatype="toolbar"][open="true"] {
43cc2806
RK		 525 -moz-image-region: rect(18px, 180px, 36px, 162px);
526}
527
7d3f7f14 528#downloads-button[cui-areatype="toolbar"] {
43cc2806
RK		 529 -moz-image-region: rect(0, 198px, 18px, 180px);
530}
531
7d3f7f14
RK		 532#downloads-button[cui-areatype="toolbar"]:hover,
533#downloads-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK		 534 -moz-image-region: rect(18px, 198px, 36px, 180px);
535}
536
7d3f7f14 537#add-ons-button[cui-areatype="toolbar"] {
43cc2806
RK		 538 -moz-image-region: rect(0, 216px, 18px, 198px);
539}
540
7d3f7f14 541#add-ons-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 542 -moz-image-region: rect(18px, 216px, 36px, 198px);
543}
544
7d3f7f14 545#open-file-button[cui-areatype="toolbar"] {
43cc2806
RK		 546 -moz-image-region: rect(0, 234px, 18px, 216px);
547}
548
7d3f7f14 549#open-file-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 550 -moz-image-region: rect(18px, 234px, 36px, 216px);
551}
552
7d3f7f14 553#save-page-button[cui-areatype="toolbar"] {
43cc2806
RK		 554 -moz-image-region: rect(0, 252px, 18px, 234px);
555}
556
7d3f7f14 557#save-page-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 558 -moz-image-region: rect(18px, 252px, 36px, 234px);
559}
560
7d3f7f14 561#sync-button[cui-areatype="toolbar"] {
43cc2806
RK		 562 -moz-image-region: rect(0, 270px, 18px, 252px);
563}
564
7d3f7f14 565#sync-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 566 -moz-image-region: rect(18px, 270px, 36px, 252px);
567}
568
5401f433
RK		 569#sync-button[cui-areatype="toolbar"][status="active"],
570#sync-button[cui-areatype="toolbar"][status="active"]:hover:active:not([disabled="true"]) {
571 list-style-image: url("chrome://browser/skin/syncProgress-toolbar.png");
572 -moz-image-region: rect(0, 18px, 18px, 0px);
573}
574
575/*
576#sync-button[cui-areatype="toolbar"][status="active"]:-moz-lwtheme-brighttext,
577#sync-button[cui-areatype="toolbar"][status="active"]:-moz-lwtheme-brighttext:hover:active:not([disabled="true"]) {
578 list-style-image: url("chrome://browser/skin/syncProgress-toolbar-inverted.png");
579}
580*/
581
7d3f7f14 582#feed-button[cui-areatype="toolbar"] {
43cc2806
RK		 583 -moz-image-region: rect(0, 288px, 18px, 270px);
584}
585
7d3f7f14 586#feed-button[cui-areatype="toolbar"]:hover:not([disabled="true"]) {
43cc2806
RK		 587 -moz-image-region: rect(18px, 288px, 36px, 270px);
588}
589
7d3f7f14 590#feed-button[cui-areatype="toolbar"][disabled="true"] {
cc4b0b0d
RK		 591 -moz-image-region: rect(36px, 288px, 54px, 270px);
592}
593
7d3f7f14 594#social-share-button[cui-areatype="toolbar"] {
43cc2806
RK		 595 -moz-image-region: rect(0px, 306px, 18px, 288px);
596}
597
7d3f7f14 598#social-share-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 599 -moz-image-region: rect(18px, 306px, 36px, 288px);
600}
601
7d3f7f14 602#characterencoding-button[cui-areatype="toolbar"] {
43cc2806
RK		 603 -moz-image-region: rect(0, 324px, 18px, 306px);
604}
605
7d3f7f14
RK		 606#characterencoding-button[cui-areatype="toolbar"]:hover:not([disabled="true"]),
607#characterencoding-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK		 608 -moz-image-region: rect(18px, 324px, 36px, 306px);
609}
610
7d3f7f14 611#characterencoding-button[cui-areatype="toolbar"][disabled="true"] {
cc4b0b0d
RK		 612 -moz-image-region: rect(36px, 324px, 54px, 306px);
613}
614
7d3f7f14 615#new-window-button[cui-areatype="toolbar"] {
43cc2806
RK		 616 -moz-image-region: rect(0, 342px, 18px, 324px);
617}
618
7d3f7f14 619#new-window-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 620 -moz-image-region: rect(18px, 342px, 36px, 324px);
621}
622
46e71434
RK		 623#e10s-button[cui-areatype="toolbar"] {
624 -moz-image-region: rect(0, 342px, 18px, 324px);
625}
626
627#e10s-button[cui-areatype="toolbar"]:hover {
628 -moz-image-region: rect(18px, 342px, 36px, 324px);
629}
630
631#e10s-button > .toolbarbutton-icon {
632 transform: scaleY(-1);
633}
634
7d3f7f14 635#new-tab-button[cui-areatype="toolbar"] {
43cc2806
RK		 636 -moz-image-region: rect(0, 360px, 18px, 342px);
637}
638
7d3f7f14 639#new-tab-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 640 -moz-image-region: rect(18px, 360px, 36px, 342px);
641}
642
7d3f7f14 643#privatebrowsing-button[cui-areatype="toolbar"] {
43cc2806
RK		 644 -moz-image-region: rect(0, 378px, 18px, 360px);
645}
646
7d3f7f14 647#privatebrowsing-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 648 -moz-image-region: rect(18px, 378px, 36px, 360px);
649}
650
7d3f7f14 651#find-button[cui-areatype="toolbar"] {
43cc2806
RK		 652 -moz-image-region: rect(0, 396px, 18px, 378px);
653}
654
7d3f7f14 655#find-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 656 -moz-image-region: rect(18px, 396px, 36px, 378px);
657}
658
7d3f7f14 659#print-button[cui-areatype="toolbar"] {
43cc2806
RK		 660 -moz-image-region: rect(0, 414px, 18px, 396px);
661}
662
7d3f7f14 663#print-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 664 -moz-image-region: rect(18px, 414px, 36px, 396px);
665}
666
7d3f7f14 667#fullscreen-button[cui-areatype="toolbar"] {
43cc2806
RK		 668 -moz-image-region: rect(0, 432px, 18px, 414px);
669}
670
7d3f7f14 671#fullscreen-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 672 -moz-image-region: rect(18px, 432px, 36px, 414px);
673}
674
7d3f7f14 675#developer-button[cui-areatype="toolbar"] {
43cc2806
RK		 676 -moz-image-region: rect(0, 450px, 18px, 432px);
677}
678
7d3f7f14
RK		 679#developer-button[cui-areatype="toolbar"]:hover,
680#developer-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK		 681 -moz-image-region: rect(18px, 450px, 36px, 432px);
682}
683
7d3f7f14 684#preferences-button[cui-areatype="toolbar"] {
43cc2806
RK		 685 -moz-image-region: rect(0, 468px, 18px, 450px);
686}
687
7d3f7f14 688#preferences-button[cui-areatype="toolbar"]:hover {
43cc2806
RK		 689 -moz-image-region: rect(18px, 468px, 36px, 450px);
690}
691
7d3f7f14 692#PanelUI-menu-button {
43cc2806
RK		 693 -moz-image-region: rect(0, 486px, 18px, 468px);
694}
695
7d3f7f14
RK		 696#PanelUI-menu-button:hover,
697#PanelUI-menu-button[open="true"] {
43cc2806
RK		 698 -moz-image-region: rect(18px, 486px, 36px, 468px);
699}
700
51994fad 701#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #cut-button {
43cc2806
RK		 702 -moz-image-region: rect(0, 504px, 18px, 486px);
703}
704
51994fad 705#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #cut-button:hover:not([disabled="true"]) {
43cc2806
RK		 706 -moz-image-region: rect(18px, 504px, 36px, 486px);
707}
708
51994fad 709#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #cut-button[disabled="true"] {
cc4b0b0d
RK		 710 -moz-image-region: rect(36px, 504px, 54px, 486px);
711}
712
51994fad 713#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #copy-button {
43cc2806
RK		 714 -moz-image-region: rect(0, 522px, 18px, 504px);
715}
716
51994fad 717#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #copy-button:hover:not([disabled="true"]) {
43cc2806
RK		 718 -moz-image-region: rect(18px, 522px, 36px, 504px);
719}
720
51994fad 721#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #copy-button[disabled="true"] {
cc4b0b0d
RK		 722 -moz-image-region: rect(36px, 522px, 54px, 504px);
723}
724
51994fad 725#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #paste-button {
43cc2806
RK		 726 -moz-image-region: rect(0, 540px, 18px, 522px);
727}
728
51994fad 729#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #paste-button:hover:not([disabled="true"]) {
43cc2806
RK		 730 -moz-image-region: rect(18px, 540px, 36px, 522px);
731}
732
51994fad 733#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #paste-button[disabled="true"] {
cc4b0b0d
RK		 734 -moz-image-region: rect(36px, 540px, 54px, 522px);
735}
736
51994fad 737#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-out-button {
43cc2806
RK		 738 -moz-image-region: rect(0, 558px, 18px, 540px);
739}
740
51994fad 741#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-out-button:hover:not([disabled="true"]) {
43cc2806
RK		 742 -moz-image-region: rect(18px, 558px, 36px, 540px);
743}
744
51994fad 745#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-out-button[disabled="true"] {
cc4b0b0d
RK		 746 -moz-image-region: rect(36px, 558px, 54px, 540px);
747}
748
51994fad 749#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-in-button {
43cc2806
RK		 750 -moz-image-region: rect(0, 576px, 18px, 558px);
751}
752
51994fad 753#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-in-button:hover:not([disabled="true"]) {
43cc2806
RK		 754 -moz-image-region: rect(18px, 576px, 36px, 558px);
755}
756
51994fad 757#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-in-button[disabled="true"] {
cc4b0b0d
RK		 758 -moz-image-region: rect(36px, 576px, 54px, 558px);
759}
760
51994fad 761#webrtc-status-button:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) {
43cc2806
RK		 762 -moz-image-region: rect(0, 594px, 18px, 576px);
763}
764
51994fad
RK		 765#webrtc-status-button:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])):hover,
766#webrtc-status-button:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]))[open="true"] {
43cc2806
RK		 767 -moz-image-region: rect(18px, 594px, 36px, 576px);
768}
769
7d3f7f14 770#nav-bar-overflow-button {
43cc2806
RK		 771 -moz-image-region: rect(0, 612px, 18px, 594px);
772}
773
7d3f7f14
RK		 774#nav-bar-overflow-button:hover,
775#nav-bar-overflow-button[open="true"] {
43cc2806
RK		 776 -moz-image-region: rect(18px, 612px, 36px, 594px);
777}
778
46e71434
RK		 779#nav-bar-overflow-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
780 transform: scaleX(-1);
781}
782
c0f6797e
RK		 783#tabview-button {
784 -moz-image-region: rect(0, 648px, 18px, 630px);
785}
786
787#tabview-button:hover {
788 -moz-image-region: rect(18px, 648px, 36px, 630px);
789}
790
791#email-link-button[cui-areatype="toolbar"] {
792 -moz-image-region: rect(0, 666px, 18px, 648px);
793}
794
795#email-button[cui-areatype="toolbar"]:hover {
796 -moz-image-region: rect(18px, 666px, 36px, 648px);
797}
798
799#sidebar-button[cui-areatype="toolbar"] {
800 -moz-image-region: rect(0, 684px, 18px, 666px);
801}
802
803#sidebar-button[cui-areatype="toolbar"]:hover {
804 -moz-image-region: rect(18px, 684px, 36px, 666px);
805}
806
43cc2806
RK		 807/* === END toolbarbuttons.inc.css === */
808
809/* === BEGIN menupanel.inc.css === */
810
811/* Menu panel and palette styles */
812
51994fad 813toolbaritem[sdkstylewidget="true"] > toolbarbutton,
5401f433
RK		 814:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button,
815 #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #tabview-button,
816 #webrtc-status-button, #social-share-button, #open-file-button, #find-button, #developer-button,
817 #preferences-button, #privatebrowsing-button, #save-page-button, #switch-to-metro-button, #add-ons-button,
818 #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button,
819 #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button,
820 #copy-button, #paste-button, #e10s-button)[cui-areatype="menu-panel"],
821toolbarpaletteitem[place="palette"] > :-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button,
822 #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #tabview-button,
823 #webrtc-status-button, #social-share-button, #open-file-button, #find-button, #developer-button,
824 #preferences-button, #privatebrowsing-button, #save-page-button, #switch-to-metro-button, #add-ons-button,
825 #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button,
826 #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button,
827 #copy-button, #paste-button, #e10s-button) {
43cc2806
RK		 828 list-style-image: url("chrome://browser/skin/menuPanel.png");
829}
830
831#home-button[cui-areatype="menu-panel"],
7d3f7f14 832toolbarpaletteitem[place="palette"] > #home-button {
43cc2806
RK		 833 -moz-image-region: rect(0px, 128px, 32px, 96px);
834}
835
cc4b0b0d 836#home-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 837toolbarpaletteitem[place="palette"] > #home-button:hover {
cc4b0b0d
RK		 838 -moz-image-region: rect(32px, 128px, 64px, 96px);
839}
840
43cc2806 841#bookmarks-menu-button[cui-areatype="menu-panel"],
7d3f7f14 842toolbarpaletteitem[place="palette"] > #bookmarks-menu-button {
46e71434 843 -moz-image-region: rect(0px, 192px, 32px, 160px);
43cc2806
RK		 844}
845
cc4b0b0d 846#bookmarks-menu-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 847toolbarpaletteitem[place="palette"] > #bookmarks-menu-button:hover {
46e71434
RK		 848 -moz-image-region: rect(32px, 192px, 64px, 160px);
849}
850
851#bookmarks-menu-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
852 -moz-image-region: rect(32px, 192px, 64px, 160px);
cc4b0b0d
RK		 853}
854
43cc2806 855#history-panelmenu[cui-areatype="menu-panel"],
7d3f7f14 856toolbarpaletteitem[place="palette"] > #history-panelmenu {
43cc2806
RK		 857 -moz-image-region: rect(0px, 224px, 32px, 192px);
858}
859
cc4b0b0d 860#history-panelmenu[cui-areatype="menu-panel"]:hover,
7d3f7f14 861toolbarpaletteitem[place="palette"] > #history-panelmenu:hover {
cc4b0b0d
RK		 862 -moz-image-region: rect(32px, 224px, 64px, 192px);
863}
864
46e71434
RK		 865#history-panelmenu[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
866 -moz-image-region: rect(32px, 224px, 64px, 192px);
867}
868
43cc2806 869#downloads-button[cui-areatype="menu-panel"],
7d3f7f14 870toolbarpaletteitem[place="palette"] > #downloads-button {
43cc2806
RK		 871 -moz-image-region: rect(0px, 256px, 32px, 224px);
872}
873
cc4b0b0d 874#downloads-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 875toolbarpaletteitem[place="palette"] > #downloads-button:hover {
cc4b0b0d
RK		 876 -moz-image-region: rect(32px, 256px, 64px, 224px);
877}
878
43cc2806 879#add-ons-button[cui-areatype="menu-panel"],
7d3f7f14 880toolbarpaletteitem[place="palette"] > #add-ons-button {
43cc2806
RK		 881 -moz-image-region: rect(0px, 288px, 32px, 256px);
882}
883
cc4b0b0d 884#add-ons-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 885toolbarpaletteitem[place="palette"] > #add-ons-button:hover {
cc4b0b0d
RK		 886 -moz-image-region: rect(32px, 288px, 64px, 256px);
887}
888
43cc2806 889#open-file-button[cui-areatype="menu-panel"],
7d3f7f14 890toolbarpaletteitem[place="palette"] > #open-file-button {
43cc2806
RK		 891 -moz-image-region: rect(0px, 320px, 32px, 288px);
892}
893
cc4b0b0d 894#open-file-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 895toolbarpaletteitem[place="palette"] > #open-file-button:hover {
cc4b0b0d
RK		 896 -moz-image-region: rect(32px, 320px, 64px, 288px);
897}
898
43cc2806 899#save-page-button[cui-areatype="menu-panel"],
7d3f7f14 900toolbarpaletteitem[place="palette"] > #save-page-button {
43cc2806
RK		 901 -moz-image-region: rect(0px, 352px, 32px, 320px);
902}
903
cc4b0b0d 904#save-page-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 905toolbarpaletteitem[place="palette"] > #save-page-button:hover {
cc4b0b0d
RK		 906 -moz-image-region: rect(32px, 352px, 64px, 320px);
907}
908
43cc2806 909#sync-button[cui-areatype="menu-panel"],
7d3f7f14 910toolbarpaletteitem[place="palette"] > #sync-button {
43cc2806
RK		 911 -moz-image-region: rect(0px, 384px, 32px, 352px);
912}
913
cc4b0b0d 914#sync-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 915toolbarpaletteitem[place="palette"] > #sync-button:hover {
cc4b0b0d
RK		 916 -moz-image-region: rect(32px, 384px, 64px, 352px);
917}
918
5401f433
RK		 919#sync-button[cui-areatype="menu-panel"][status="active"] {
920 list-style-image: url("chrome://browser/skin/syncProgress-menuPanel.png");
921 -moz-image-region: rect(0px, 32px, 32px, 0px);
922}
923
43cc2806 924#feed-button[cui-areatype="menu-panel"],
7d3f7f14 925toolbarpaletteitem[place="palette"] > #feed-button {
43cc2806
RK		 926 -moz-image-region: rect(0px, 416px, 32px, 384px);
927}
928
cc4b0b0d 929#feed-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
7d3f7f14 930toolbarpaletteitem[place="palette"] > #feed-button:hover:not([disabled="true"]) {
cc4b0b0d
RK		 931 -moz-image-region: rect(32px, 416px, 64px, 384px);
932}
933
934#feed-button[cui-areatype="menu-panel"][disabled="true"],
7d3f7f14 935toolbarpaletteitem[place="palette"] > #feed-button[disabled="true"] {
cc4b0b0d
RK		 936 -moz-image-region: rect(64px, 416px, 96px, 384px);
937}
938
43cc2806 939#social-share-button[cui-areatype="menu-panel"],
7d3f7f14 940toolbarpaletteitem[place="palette"] > #social-share-button {
43cc2806
RK		 941 -moz-image-region: rect(0px, 448px, 32px, 416px);
942}
943
cc4b0b0d 944#social-share-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 945toolbarpaletteitem[place="palette"] > #social-share-button:hover {
cc4b0b0d
RK		 946 -moz-image-region: rect(32px, 448px, 64px, 416px);
947}
948
43cc2806 949#characterencoding-button[cui-areatype="menu-panel"],
7d3f7f14 950toolbarpaletteitem[place="palette"] > #characterencoding-button {
43cc2806
RK		 951 -moz-image-region: rect(0px, 480px, 32px, 448px);
952}
953
cc4b0b0d 954#characterencoding-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
7d3f7f14 955toolbarpaletteitem[place="palette"] > #characterencoding-button:hover:not([disabled="true"]) {
cc4b0b0d
RK		 956 -moz-image-region: rect(32px, 480px, 64px, 448px);
957}
958
959#characterencoding-button[cui-areatype="menu-panel"][disabled="true"],
7d3f7f14 960toolbarpaletteitem[place="palette"] > #characterencoding-button[disabled="true"] {
cc4b0b0d
RK		 961 -moz-image-region: rect(64px, 480px, 96px, 448px);
962}
963
46e71434
RK		 964#characterencoding-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
965 -moz-image-region: rect(32px, 480px, 64px, 448px);
966}
967
43cc2806 968#new-window-button[cui-areatype="menu-panel"],
7d3f7f14 969toolbarpaletteitem[place="palette"] > #new-window-button {
43cc2806
RK		 970 -moz-image-region: rect(0px, 512px, 32px, 480px);
971}
972
cc4b0b0d 973#new-window-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 974toolbarpaletteitem[place="palette"] > #new-window-button:hover {
cc4b0b0d
RK		 975 -moz-image-region: rect(32px, 512px, 64px, 480px);
976}
977
5401f433
RK		 978#e10s-button[cui-areatype="menu-panel"],
979toolbarpaletteitem[place="palette"] > #e10s-button {
980 -moz-image-region: rect(0px, 512px, 32px, 480px);
981}
982
983#e10s-button[cui-areatype="menu-panel"]:hover,
984toolbarpaletteitem[place="palette"] > #e10s-button:hover {
985 -moz-image-region: rect(32px, 512px, 64px, 480px);
986}
987
43cc2806 988#new-tab-button[cui-areatype="menu-panel"],
7d3f7f14 989toolbarpaletteitem[place="palette"] > #new-tab-button {
43cc2806
RK		 990 -moz-image-region: rect(0px, 544px, 32px, 512px);
991}
992
cc4b0b0d 993#new-tab-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 994toolbarpaletteitem[place="palette"] > #new-tab-button:hover {
cc4b0b0d
RK		 995 -moz-image-region: rect(32px, 544px, 64px, 512px);
996}
997
43cc2806 998#privatebrowsing-button[cui-areatype="menu-panel"],
7d3f7f14 999toolbarpaletteitem[place="palette"] > #privatebrowsing-button {
43cc2806
RK		 1000 -moz-image-region: rect(0px, 576px, 32px, 544px);
1001}
1002
cc4b0b0d 1003#privatebrowsing-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1004toolbarpaletteitem[place="palette"] > #privatebrowsing-button:hover {
cc4b0b0d
RK		 1005 -moz-image-region: rect(32px, 576px, 64px, 544px);
1006}
1007
46e71434
RK		 1008#tabview-button[cui-areatype="menu-panel"],
1009toolbarpaletteitem[place="palette"] > #tabview-button {
1010 -moz-image-region: rect(0px, 608px, 32px, 576px);
1011}
1012
1013#tabview-button[cui-areatype="menu-panel"]:hover,
1014toolbarpaletteitem[place="palette"] > #tabview-button:hover {
1015 -moz-image-region: rect(32px, 608px, 64px, 576px);
1016}
1017
43cc2806 1018#find-button[cui-areatype="menu-panel"],
7d3f7f14 1019toolbarpaletteitem[place="palette"] > #find-button {
43cc2806
RK		 1020 -moz-image-region: rect(0px, 640px, 32px, 608px);
1021}
1022
cc4b0b0d 1023#find-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1024toolbarpaletteitem[place="palette"] > #find-button:hover {
cc4b0b0d
RK		 1025 -moz-image-region: rect(32px, 640px, 64px, 608px);
1026}
1027
43cc2806 1028#print-button[cui-areatype="menu-panel"],
7d3f7f14 1029toolbarpaletteitem[place="palette"] > #print-button {
43cc2806
RK		 1030 -moz-image-region: rect(0px, 672px, 32px, 640px);
1031}
1032
cc4b0b0d 1033#print-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1034toolbarpaletteitem[place="palette"] > #print-button:hover {
cc4b0b0d
RK		 1035 -moz-image-region: rect(32px, 672px, 64px, 640px);
1036}
1037
43cc2806 1038#fullscreen-button[cui-areatype="menu-panel"],
7d3f7f14 1039toolbarpaletteitem[place="palette"] > #fullscreen-button {
43cc2806
RK		 1040 -moz-image-region: rect(0px, 704px, 32px, 672px);
1041}
1042
cc4b0b0d 1043#fullscreen-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1044toolbarpaletteitem[place="palette"] > #fullscreen-button:hover {
cc4b0b0d
RK		 1045 -moz-image-region: rect(32px, 704px, 64px, 672px);
1046}
1047
43cc2806 1048#developer-button[cui-areatype="menu-panel"],
7d3f7f14 1049toolbarpaletteitem[place="palette"] > #developer-button {
43cc2806
RK		 1050 -moz-image-region: rect(0px, 736px, 32px, 704px);
1051}
1052
cc4b0b0d 1053#developer-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1054toolbarpaletteitem[place="palette"] > #developer-button:hover {
cc4b0b0d
RK		 1055 -moz-image-region: rect(32px, 736px, 64px, 704px);
1056}
1057
46e71434
RK		 1058#developer-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1059 -moz-image-region: rect(32px, 736px, 64px, 704px);
1060}
1061
43cc2806 1062#preferences-button[cui-areatype="menu-panel"],
7d3f7f14 1063toolbarpaletteitem[place="palette"] > #preferences-button {
43cc2806
RK		 1064 -moz-image-region: rect(0px, 768px, 32px, 736px);
1065}
1066
cc4b0b0d 1067#preferences-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1068toolbarpaletteitem[place="palette"] > #preferences-button:hover {
cc4b0b0d
RK		 1069 -moz-image-region: rect(32px, 768px, 64px, 736px);
1070}
1071
46e71434
RK		 1072#email-link-button[cui-areatype="menu-panel"],
1073toolbarpaletteitem[place="palette"] > #email-link-button {
1074 -moz-image-region: rect(0, 800px, 32px, 768px);
1075}
1076
1077#email-link-button[cui-areatype="menu-panel"]:hover,
1078toolbarpaletteitem[place="palette"] > #email-link-button:hover {
1079 -moz-image-region: rect(32px, 800px, 64px, 768px);
1080}
1081
1082#sidebar-button[cui-areatype="menu-panel"],
1083toolbarpaletteitem[place="palette"] > #sidebar-button {
1084 -moz-image-region: rect(0, 864px, 32px, 832px);
1085}
1086
1087#sidebar-button[cui-areatype="menu-panel"]:hover,
1088toolbarpaletteitem[place="palette"] > #sidebar-button:hover {
1089 -moz-image-region: rect(32px, 864px, 64px, 832px);
1090}
1091
1092#sidebar-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1093 -moz-image-region: rect(32px, 864px, 64px, 832px);
1094}
1095
1096toolbaritem[sdkstylewidget="true"] > toolbarbutton {
1097 -moz-image-region: rect(0, 832px, 32px, 800px);
1098}
1099
43cc2806
RK		 1100/* Wide panel control icons */
1101
51994fad
RK		 1102#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton,
1103#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton,
7d3f7f14
RK		 1104toolbarpaletteitem[place="palette"] > #edit-controls > toolbarbutton,
1105toolbarpaletteitem[place="palette"] > #zoom-controls > toolbarbutton {
43cc2806
RK		 1106 list-style-image: url("chrome://browser/skin/menuPanel-small.png");
1107}
1108
51994fad 1109#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button,
7d3f7f14 1110toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button {
43cc2806
RK		 1111 -moz-image-region: rect(0px, 32px, 16px, 16px);
1112}
1113
51994fad 1114#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button:hover:not([disabled="true"]),
7d3f7f14 1115toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button:hover:not([disabled="true"]) {
cc4b0b0d
RK		 1116 -moz-image-region: rect(16px, 32px, 32px, 16px);
1117}
1118
51994fad 1119#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button[disabled="true"],
7d3f7f14 1120toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button[disabled="true"] {
cc4b0b0d
RK		 1121 -moz-image-region: rect(32px, 32px, 48px, 16px);
1122}
1123
51994fad 1124#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button,
7d3f7f14 1125toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button {
43cc2806
RK		 1126 -moz-image-region: rect(0px, 48px, 16px, 32px);
1127}
1128
51994fad 1129#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button:hover:not([disabled="true"]),
7d3f7f14 1130toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button:hover:not([disabled="true"]) {
cc4b0b0d
RK		 1131 -moz-image-region: rect(16px, 48px, 32px, 32px);
1132}
1133
51994fad 1134#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button[disabled="true"],
7d3f7f14 1135toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button[disabled="true"] {
cc4b0b0d
RK		 1136 -moz-image-region: rect(32px, 48px, 48px, 32px);
1137}
1138
51994fad 1139#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button,
7d3f7f14 1140toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button {
43cc2806
RK		 1141 -moz-image-region: rect(0px, 64px, 16px, 48px);
1142}
1143
51994fad 1144#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button:hover:not([disabled="true"]),
7d3f7f14 1145toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button:hover:not([disabled="true"]) {
cc4b0b0d
RK		 1146 -moz-image-region: rect(16px, 64px, 32px, 48px);
1147}
1148
51994fad 1149#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button[disabled="true"],
7d3f7f14 1150toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button[disabled="true"] {
cc4b0b0d
RK		 1151 -moz-image-region: rect(32px, 64px, 48px, 48px);
1152}
1153
51994fad 1154#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button,
7d3f7f14 1155toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button {
43cc2806
RK		 1156 -moz-image-region: rect(0px, 80px, 16px, 64px);
1157}
1158
51994fad 1159#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button:hover:not([disabled="true"]),
7d3f7f14 1160toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button:hover:not([disabled="true"]) {
cc4b0b0d
RK		 1161 -moz-image-region: rect(16px, 80px, 32px, 64px);
1162}
1163
51994fad 1164#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button[disabled="true"],
7d3f7f14 1165toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button[disabled="true"] {
cc4b0b0d
RK		 1166 -moz-image-region: rect(32px, 80px, 48px, 64px);
1167}
1168
51994fad 1169#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button,
7d3f7f14 1170toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button {
43cc2806
RK		 1171 -moz-image-region: rect(0px, 96px, 16px, 80px);
1172}
1173
51994fad 1174#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button:hover:not([disabled="true"]),
7d3f7f14 1175toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button:hover:not([disabled="true"]) {
cc4b0b0d
RK		 1176 -moz-image-region: rect(16px, 96px, 32px, 80px);
1177}
1178
51994fad 1179#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button[disabled="true"],
7d3f7f14 1180toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button[disabled="true"] {
cc4b0b0d
RK		 1181 -moz-image-region: rect(32px, 96px, 48px, 80px);
1182}
1183
43cc2806
RK		 1184/* === END menupanel.inc.css === */
1185
63ada306
RK		 1186.toolbarbutton-1:not([type="menu-button"]) {
1187 -moz-box-orient: vertical;
1188}
1189
319c6529
RK		 1190.toolbarbutton-1,
1191.toolbarbutton-1 > .toolbarbutton-menubutton-button {
c0f6797e
RK		 1192/* min-width: 36px;
1193 min-height: 36px;*/
319c6529
RK		 1194}
1195
1196.toolbarbutton-1,
1197.toolbarbutton-1 > .toolbarbutton-menubutton-button,
1198.toolbarbutton-1[disabled="true"]:hover:active,
1199.toolbarbutton-1[disabled="true"]:hover:active > .toolbarbutton-menubutton-button {
1200 padding: 1px 2px;
1201}
1202
1203.toolbarbutton-1:hover:active,
1204.toolbarbutton-1[open="true"],
1205.toolbarbutton-1:hover:active > .toolbarbutton-menubutton-button {
1206 padding-top: 2px;
1207 padding-bottom: 0px;
1208 -moz-padding-start: 3px;
1209 -moz-padding-end: 1px;
1210}
1211
c0f6797e
RK		 1212#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-icon,
1213#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menu-dropmarker,
1214#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menubutton-dropmarker,
1215#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
1216#main-window:not([customizing]) .toolbarbutton-1 > .toolbarbutton-menubutton-button[disabled=true] > .toolbarbutton-icon {
e20c83c3
RK		 1217}
1218
c0f6797e
RK		 1219.toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
1220.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
e20c83c3
RK		 1221}
1222
c0f6797e
RK		 1223toolbar .toolbarbutton-1 > .toolbarbutton-menu-dropmarker:-moz-lwtheme-brighttext,
1224toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker:-moz-lwtheme-brighttext {
319c6529
RK		 1225}
1226
c0f6797e
RK		 1227.toolbarbutton-1 > .toolbarbutton-icon,
1228.toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
319c6529
RK		 1229}
1230
c0f6797e
RK		 1231#nav-bar .toolbarbutton-1,
1232#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button {
319c6529
RK		 1233}
1234
c0f6797e
RK		 1235#nav-bar .toolbarbutton-1:not([type=menu-button]),
1236#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
1237#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
319c6529
RK		 1238}
1239
c0f6797e
RK		 1240#nav-bar #PanelUI-menu-button {
1241/* -moz-padding-start: 7px;
1242 -moz-padding-end: 5px;*/
319c6529
RK		 1243}
1244
c0f6797e
RK		 1245#nav-bar .toolbarbutton-1[type=menu]:not(#back-button):not(#forward-button):not(#feed-button):not(#social-provider-button):not(#PanelUI-menu-button) {
1246/* padding-left: 5px;
1247 padding-right: 5px;*/
319c6529
RK		 1248}
1249
c0f6797e
RK		 1250#nav-bar .toolbarbutton-1 > menupopup {
1251/* margin-top: -3px;*/
319c6529
RK		 1252}
1253
c0f6797e 1254#nav-bar .toolbarbutton-1 > menupopup.cui-widget-panel {
c1d2ce3e 1255 margin-top: -4px;
319c6529
RK		 1256}
1257
c0f6797e
RK		 1258#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1259/* -moz-padding-end: 0;*/
319c6529
RK		 1260}
1261
c0f6797e
RK		 1262#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1263/* -moz-padding-start: 0;
1264 -moz-box-align: center;*/
319c6529
RK		 1265}
1266
c0f6797e
RK		 1267#nav-bar .toolbarbutton-1 > .toolbarbutton-icon,
1268#nav-bar .toolbarbutton-1 > .toolbarbutton-text,
1269#nav-bar .toolbarbutton-1 > .toolbarbutton-badge-container,
1270#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
1271#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
46e71434 1272window:not([chromehidden~="toolbar"]) #urlbar-container > .toolbarbutton-1:-moz-any([disabled=true],:not([open]):not([disabled=true]):not(:active)) > .toolbarbutton-icon {
c0f6797e
RK		 1273/* padding: 2px 6px;
1274 border: 1px solid;
1275 border-color: transparent;
1276 transition-property: background-color, border-color;
1277 transition-duration: 150ms;*/
d54f5b23 1278}
c0f6797e
RK		 1279/*
1280#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-icon,
1281#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-badge-container,
1282#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
1283 padding: 3px 7px;
d54f5b23 1284}
c0f6797e 1285*/
d54f5b23 1286
c0f6797e
RK		 1287/* Help SDK icons fit: */
1288toolbarbutton[sdk-button="true"][cui-areatype="toolbar"] > .toolbarbutton-icon {
1289 width: 16px;
26125509
RK		 1290}
1291
c0f6797e
RK		 1292#nav-bar toolbarbutton[sdk-button="true"][cui-areatype="toolbar"] > .toolbarbutton-icon {
1293 /* XXXgijs box models strike again: this is 16px + 2 * 7px padding + 2 * 1px border (from the rules above) */
1294 width: 32px;
26125509 1295}
26125509 1296
c0f6797e
RK		 1297#nav-bar .toolbarbutton-1[type=menu]:not(#back-button):not(#forward-button):not(#feed-button):not(#social-provider-button):not(#PanelUI-menu-button) > .toolbarbutton-icon,
1298#nav-bar .toolbarbutton-1[type=menu] > .toolbarbutton-text /* hack for add-ons that forcefully display the label */ {
1299/* -moz-padding-end: 17px;*/
319c6529
RK		 1300}
1301
c0f6797e 1302#nav-bar .toolbarbutton-1 > .toolbarbutton-menu-dropmarker {
319c6529
RK		 1303}
1304
c0f6797e 1305#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
319c6529
RK		 1306}
1307
c0f6797e 1308#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
38cfeb47
RK		 1309}
1310
c0f6797e
RK		 1311#nav-bar .toolbaritem-combined-buttons {
1312/* margin-left: 2px;
1313 margin-right: 2px;*/
38cfeb47
RK		 1314}
1315
c0f6797e
RK		 1316#nav-bar .toolbaritem-combined-buttons > .toolbarbutton-1 {
1317/* padding-left: 0;
1318 padding-right: 0;*/
319c6529
RK		 1319}
1320
c0f6797e
RK		 1321#nav-bar .toolbarbutton-1:not(:hover):not(:active):not([open]) > .toolbarbutton-menubutton-dropmarker::before,
1322#nav-bar .toolbaritem-combined-buttons > .toolbarbutton-1:-moz-any(:not(:hover):not([open]),[disabled=true]) + .toolbarbutton-1:-moz-any(:not(:hover):not([open]),[disabled=true])::before {
1323/*
1324 content: "";
1325 display: -moz-box;
1326 width: 1px;
1327 height: 16px;
1328 -moz-margin-end: -1px;
1329*/
319c6529
RK		 1330}
1331
46e71434 1332window:not([chromehidden~="toolbar"]) #urlbar-container > .toolbarbutton-1:-moz-any([disabled=true],:not([open]):not([disabled=true]):not(:active)) > .toolbarbutton-icon {
319c6529
RK		 1333}
1334
c0f6797e
RK		 1335#nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any(:hover,[open]) > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
1336#nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any(:hover,[open]) > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
1337#nav-bar .toolbarbutton-1:not([disabled=true]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-icon,
1338#nav-bar .toolbarbutton-1:not([disabled=true]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-text,
1339#nav-bar .toolbarbutton-1:not([disabled=true]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-badge-container,
46e71434
RK		 1340window:not([chromehidden~="toolbar"]) #urlbar-container > #forward-button:not([open]):not(:active):not([disabled=true]):hover > .toolbarbutton-icon,
1341#nav-bar .toolbarbutton-1:not([buttonover]):not([open]):not(:active):hover > .toolbarbutton-menubutton-dropmarker:not([disabled=true]) > .dropmarker-icon {
319c6529
RK		 1342}
1343
c0f6797e
RK		 1344#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled=true]):hover:active > .toolbarbutton-icon,
1345#nav-bar .toolbarbutton-1[open] > .toolbarbutton-menubutton-dropmarker:not([disabled=true]) > .dropmarker-icon,
1346#nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-icon,
1347#nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-text,
1348#nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-badge-container {
319c6529
RK		 1349}
1350
c0f6797e
RK		 1351#TabsToolbar .toolbarbutton-1,
1352#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
1353.tabbrowser-arrowscrollbox > .scrollbutton-up,
1354.tabbrowser-arrowscrollbox > .scrollbutton-down {
e8519ae0
RK		 1355}
1356
c0f6797e
RK		 1357#TabsToolbar .toolbarbutton-1:not([disabled=true]):hover,
1358#TabsToolbar .toolbarbutton-1[open],
1359#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled=true]):hover,
1360.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled=true]):hover,
1361.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled=true]):hover {
e8519ae0
RK		 1362}
1363
c0f6797e 1364/* unified back/forward button */
319c6529 1365
c0f6797e 1366#forward-button {
71bac478
RK		 1367}
1368
c0f6797e
RK		 1369#forward-button > menupopup {
1370 margin-top: 1px !important;
319c6529
RK		 1371}
1372
c0f6797e
RK		 1373#forward-button > .toolbarbutton-icon {
1374 background-clip: padding-box !important;
1375 /*mask: url(keyhole-forward-mask.svg#mask); XXX: this regresses twinopen */
5401f433 1376 /*clip-path: url(chrome://browser/content/browser.xul#keyhole-forward-clip-path) !important;*/
71bac478
RK		 1377}
1378
c0f6797e
RK		 1379#forward-button {
1380 -moz-margin-start: -6px !important;
1381 padding-left: 7px;
1382 padding-right: 3px;
1383 margin-top: 3px;
1384 margin-bottom: 3px;
1385 border-radius: 0 10000px 10000px 0;
319c6529
RK		 1386}
1387
c0f6797e
RK		 1388#forward-button:-moz-locale-dir(rtl) {
1389 border-radius: 10000px 0 0 10000px;
8ad8bf83
RK		 1390}
1391
fff8097b
RK		 1392window:not([chromehidden~="toolbar"]) #urlbar-container:not([switchingtabs]) > #forward-button,
1393window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not([switchingtabs]) > #forward-button {
5401f433 1394 transition: opacity 150ms ease-out;
8ad8bf83
RK		 1395}
1396
fff8097b
RK		 1397window:not([chromehidden~="toolbar"]) #urlbar-container:not(:hover) > #forward-button[disabled=true],
1398window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled=true] {
8ad8bf83
RK		 1399 opacity: 0;
1400}
1401
fff8097b
RK		 1402window:not([chromehidden~="toolbar"]) #urlbar-container > #forward-button[occluded-by-urlbar],
1403window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[occluded-by-urlbar] {
c0f6797e 1404 visibility: hidden;
143c5409
RK		 1405}
1406
c0f6797e
RK		 1407#back-button {
1408/* padding-top: 3px !important;
1409 padding-bottom: 3px !important;
1410 -moz-padding-start: 5px !important;
1411 -moz-padding-end: 0 !important;*/
1412 position: relative;
1413 z-index: 1;
1414 border-radius: 10000px;
1415 width: 30px;
1416 height: 30px;
1417 margin-top: -2px;
1418 margin-bottom: -2px;
143c5409
RK		 1419}
1420
c0f6797e 1421#back-button:-moz-locale-dir(rtl) {
319c6529
RK		 1422}
1423
c0f6797e
RK		 1424#back-button > menupopup {
1425 margin-top: -1px !important;
b36fc72e
RK		 1426}
1427
c0f6797e
RK		 1428#back-button > .toolbarbutton-icon {
1429 border-radius: 10000px !important;
1430 background-clip: padding-box !important;
1431/* background-color: hsla(210,25%,98%,.08) !important;
1432 padding: 6px !important;
1433 border-color: hsla(210,4%,10%,.25) !important;*/
1434 transition-property: background-color, border-color !important;
1435 transition-duration: 250ms !important;
143c5409
RK		 1436}
1437
c0f6797e
RK		 1438#back-button:not([disabled="true"]):not([open="true"]):not(:active):hover > .toolbarbutton-icon {
1439/* background-color: hsla(210,4%,10%,.08) !important;
1440 box-shadow: none !important;*/
143c5409
RK		 1441}
1442
c0f6797e
RK		 1443#back-button:not([disabled="true"]):hover:active > .toolbarbutton-icon,
1444#back-button[open="true"] > .toolbarbutton-icon {
1445/* background-color: hsla(210,4%,10%,.12) !important;
1446 box-shadow: 0 1px 0 0 hsla(210,80%,20%,.1) inset !important;*/
143c5409
RK		 1447}
1448
c0f6797e
RK		 1449#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
1450#forward-button:-moz-locale-dir(rtl) {
1451 transform: scaleX(-1);
143c5409 1452}
c0f6797e
RK		 1453/*
1454.unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
1455.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
1456 list-style-image: url("chrome://browser/skin/menu-back.png") !important;
6adbc9a6
RK		 1457}
1458
c0f6797e
RK		 1459.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr),
1460.unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl) {
1461 list-style-image: url("chrome://browser/skin/menu-forward.png") !important;
6adbc9a6
RK		 1462}
1463
c0f6797e
RK		 1464#home-button.bookmark-item {
1465 list-style-image: url("chrome://browser/skin/Toolbar.png");
6adbc9a6
RK		 1466}
1467
c0f6797e
RK		 1468#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1469#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > toolbarpaletteitem > #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1470#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > toolbarpaletteitem > toolbaritem > :-moz-any(@nestedButtons@):-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1471#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > toolbaritem > :-moz-any(@nestedButtons@):-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1472#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > toolbarpaletteitem > :-moz-any(@primaryToolbarButtons@):-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1473#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > :-moz-any(@primaryToolbarButtons@):-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1474#home-button.bookmark-item:-moz-lwtheme-brighttext {
1475 position: relative;
1476 z-index: 1;
1477 list-style-image: url("chrome://browser/skin/Toolbar-inverted.png");
6adbc9a6
RK		 1478}
1479
c0f6797e
RK		 1480#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > #sync-button[status="active"]:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1481#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > toolbarpaletteitem > #sync-button[status="active"]:-moz-system-metric(windows-classic):not(:-moz-lwtheme) {
1482 list-style-image: url("chrome://browser/skin/syncProgress-toolbar-inverted.png");
6adbc9a6 1483}
c0f6797e 1484*/
6adbc9a6 1485
c0f6797e
RK		 1486#downloads-button > .toolbarbutton-icon {
1487 margin: 0;
6adbc9a6
RK		 1488}
1489
c0f6797e
RK		 1490/* tabview button & menu item */
1491
6adbc9a6 1492#menu_tabview {
c0f6797e 1493 list-style-image: url("chrome://browser/skin/tabview/tabview.png");
6adbc9a6
RK		 1494 -moz-image-region: rect(1px, 89px, 17px, 73px);
1495}
1496
1497#menu_tabview[groups="0"] {
1498 -moz-image-region: rect(1px, 17px, 17px, 1px);
1499}
1500
1501#menu_tabview[groups="1"] {
1502 -moz-image-region: rect(1px, 35px, 17px, 19px);
1503}
1504
1505#menu_tabview[groups="2"] {
1506 -moz-image-region: rect(1px, 53px, 17px, 37px);
1507}
1508
1509#menu_tabview[groups="3"] {
1510 -moz-image-region: rect(1px, 71px, 17px, 55px);
1511}
1512
5401f433
RK		 1513/* zoom control text (reset) button special case: */
1514
1515#nav-bar #zoom-reset-button > .toolbarbutton-text {
1516 /* To make this line up with the icons, it needs the same height (18px) +
1517 * padding (2 * 2px) + border (2 * 1px), but as a minimum because otherwise
1518 * increase in text sizes would break things...
1519 */
1520 min-height: 20px;
1521}
1522
319c6529
RK		 1523/* ::::: fullscreen window controls ::::: */
1524
8d7ef0d9 1525#window-controls {
ab799a7a
RK		 1526 -moz-margin-start: 4px;
1527}
1528
319c6529
RK		 1529#minimize-button,
1530#restore-button,
1531#close-button {
c0f6797e
RK		 1532/* list-style-image: url("chrome://global/skin/icons/windowControls.png");
1533 padding: 0; */
319c6529
RK		 1534}
1535
1536#minimize-button {
1537 list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
1538}
1539
1540#minimize-button:hover {
1541 list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
1542}
1543
1544#restore-button {
1545 list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
1546}
1547
1548#restore-button:hover {
1549 list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
1550}
1551
1552#close-button {
1553 list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
1554}
1555
1556#close-button:hover {
1557 list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
1558}
1559
1560/* ::::: Location Bar ::::: */
1561
319c6529
RK		 1562#urlbar,
1563.searchbar-textbox {
1564 border-radius: 5px;
1565 margin: 0;
1566 -moz-margin-start: 3px;
1567}
1568
ffce2402 1569#urlbar {
f0071a71
RK		 1570 /* make color as light as possible to deal with dark non-domain parts */
1571 color: #FFBFFF;
ffce2402
RK		 1572}
1573
319c6529
RK		 1574#urlbar:-moz-lwtheme,
1575.searchbar-textbox:-moz-lwtheme {
1576 /* background-color: rgba(255,255,255,.8);
1577 @navbarTextboxCustomBorder@
1578 color: black; */
1579}
1580
c0f6797e
RK		 1581#urlbar:-moz-lwtheme:hover:not([focused]):not([readonly]),
1582.searchbar-textbox:-moz-lwtheme:hover:not([focused]) {
1583/* background-color: rgba(255,255,255,.9);*/
1584}
1585
1586#urlbar:-moz-lwtheme[focused]:not([readonly]),
1587.searchbar-textbox:-moz-lwtheme[focused] {
1588/* background-color: white;*/
1589}
1590
fff8097b
RK		 1591window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper,
1592window:not([chromehidden~="toolbar"]) #urlbar-wrapper {
e8519ae0
RK		 1593 padding-left: 22px;
1594 -moz-margin-start: -22px;
8ad8bf83
RK		 1595 position: relative;
1596 pointer-events: none;
1597}
1598
fff8097b
RK		 1599window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar,
1600window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar {
e8519ae0
RK		 1601/* -moz-border-start: none;
1602 margin-left: 0; */
8ad8bf83
RK		 1603 pointer-events: all;
1604}
1605
fff8097b
RK		 1606window:not([chromehidden~="toolbar"]) #urlbar-container:not([switchingtabs]) > #urlbar-wrapper > #urlbar,
1607window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not([switchingtabs]) > #urlbar {
71a617ff 1608 transition: margin-left 150ms ease-out;
8ad8bf83
RK		 1609}
1610
fff8097b
RK		 1611window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(ltr),
1612window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(ltr) {
e8519ae0
RK		 1613/* border-top-left-radius: 0;
1614 border-bottom-left-radius: 0; */
8ad8bf83
RK		 1615}
1616
fff8097b
RK		 1617window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl),
1618window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) {
e8519ae0
RK		 1619/* border-top-right-radius: 0;
1620 border-bottom-right-radius: 0; */
8ad8bf83
RK		 1621}
1622
fff8097b
RK		 1623window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper,
1624window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled] {
5401f433 1625/* clip-path: url("chrome://browser/content/browser.xul#urlbar-back-button-clip-path");*/
c0f6797e
RK		 1626}
1627
fff8097b
RK		 1628window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar,
1629window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled] > #urlbar {
e8519ae0 1630 margin-left: -22px;
8ad8bf83
RK		 1631}
1632
fff8097b
RK		 1633window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:hover:not([switchingtabs]) > #urlbar-wrapper > #urlbar,
1634window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled]:hover:not([switchingtabs]) > #urlbar {
8ad8bf83 1635 /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */
71a617ff 1636 transition-delay: 100s;
8ad8bf83
RK		 1637}
1638
fff8097b
RK		 1639window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar,
1640window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled]:not(:hover) > #urlbar {
8ad8bf83 1641 /* when not hovered anymore, trigger a new transition to hide the forward button immediately */
e8519ae0 1642 margin-left: -22.01px;
8ad8bf83
RK		 1643}
1644
26125509 1645window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper:-moz-locale-dir(rtl),
fff8097b
RK		 1646window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl),
1647window:not([chromehidden~="toolbar"]) #urlbar-wrapper:-moz-locale-dir(rtl),
1648window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) {
c0f6797e 1649 /* let windows-urlbar-back-button-mask clip the urlbar's right side for RTL */
71a617ff 1650 transform: scaleX(-1);
8ad8bf83
RK		 1651}
1652
a7145e95
RK		 1653html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
1654.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
319c6529
RK		 1655 color: #E7ADE7;
1656}
1657
319c6529
RK		 1658#urlbar-container {
1659 -moz-box-orient: horizontal;
1660 -moz-box-align: stretch;
1661}
1662
9abeb12c
RK		 1663.urlbar-textbox-container {
1664 -moz-box-align: stretch;
1665}
1666
a40f6a79
RK		 1667.urlbar-input-box {
1668 -moz-margin-start: 0;
1669}
1670
319c6529 1671#urlbar-icons {
319c6529
RK		 1672 -moz-box-align: center;
1673}
1674
1675.urlbar-icon {
b8384c33 1676 padding: 0 2px;
ffce2402
RK		 1677}
1678
1679.searchbar-engine-button,
1680.search-go-container {
4b686546
RK		 1681 padding: 2px;
1682}
1683
1684.search-go-container > .search-go-button {
1685 padding: 0;
319c6529
RK		 1686}
1687
ffce2402
RK		 1688.urlbar-icon:hover {
1689}
1690
1691.urlbar-icon[open="true"],
1692.urlbar-icon:hover:active {
1693}
1694
319c6529
RK		 1695#urlbar-search-splitter {
1696 min-width: 6px;
1697 -moz-margin-start: -3px;
1698 border: none;
1699 background: transparent;
1700}
1701
f0071a71 1702#urlbar-search-splitter + #urlbar-container > #urlbar,
319c6529
RK		 1703#urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox {
1704 -moz-margin-start: 0;
1705}
1706
e20c83c3
RK		 1707#urlbar-display-box {
1708}
1709
319c6529 1710#urlbar-display {
319c6529
RK		 1711 -moz-border-end: 1px solid #9C9CFF;
1712 -moz-margin-end: 3px;
ab799a7a
RK		 1713 margin-top: 0;
1714 margin-bottom: 0;
a40f6a79 1715 -moz-margin-start: 0;
ab799a7a
RK		 1716 color: #8050B0;
1717}
1718
26125509
RK		 1719#search-container {
1720 min-width: calc(54px + 11ch);
1721}
1722
319c6529
RK		 1723/* identity box */
1724
1725#identity-box {
319c6529 1726 border-radius: 2px;
85cfb236 1727 font-size: .9em;
319c6529
RK		 1728}
1729
e20c83c3
RK		 1730#identity-box:-moz-locale-dir(ltr) {
1731/* border-top-left-radius: 1.5px;
1732 border-bottom-left-radius: 1.5px;*/
1733}
1734
1735#identity-box:-moz-locale-dir(rtl) {
1736/* border-top-right-radius: 1.5px;
1737 border-bottom-right-radius: 1.5px;*/
1738}
1739
8ad8bf83 1740#notification-popup-box:not([hidden]) + #identity-box {
5517da5a 1741 -moz-padding-start: 10px !important;
8ad8bf83
RK		 1742 border-radius: 0;
1743}
1744
fff8097b
RK		 1745window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar > #identity-box,
1746window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box {
d15d08bf 1747/* border-radius: 0; */
2a5b7882
RK		 1748 -moz-padding-start: 2px;
1749 -moz-padding-end: 2px;
1750 -moz-margin-end: 1px;
8ad8bf83
RK		 1751}
1752
26125509 1753window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar >
fff8097b
RK		 1754 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr),
1755window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled] > #urlbar >
26125509 1756 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
2a5b7882 1757 padding-left: 2px;
71a617ff 1758 transition: padding-left;
8ad8bf83
RK		 1759}
1760
fff8097b
RK		 1761window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar >
1762 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl),
1763window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled] > #urlbar >
26125509 1764 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
2a5b7882 1765 padding-right: 2px;
71a617ff 1766 transition: padding-right;
8ad8bf83
RK		 1767}
1768
fff8097b
RK		 1769window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:hover:not([switchingtabs]) > #urlbar-wrapper > #urlbar >
1770 #notification-popup-box[hidden] + #identity-box,
1771window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled]:hover:not([switchingtabs]) > #urlbar >
26125509 1772 #notification-popup-box[hidden] + #identity-box {
8ad8bf83 1773 /* forward button hiding is delayed when hovered */
71a617ff 1774 transition-delay: 100s;
8ad8bf83
RK		 1775}
1776
fff8097b
RK		 1777window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar >
1778 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr),
1779window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled]:not(:hover) > #urlbar >
26125509 1780 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
8ad8bf83 1781 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
2a5b7882 1782 padding-left: 2.01px;
8ad8bf83
RK		 1783}
1784
fff8097b
RK		 1785window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar >
1786 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl),
1787window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled]:not(:hover) > #urlbar >
26125509 1788 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
8ad8bf83 1789 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
2a5b7882 1790 padding-right: 2.01px;
8ad8bf83
RK		 1791}
1792
56859d76
RK		 1793#urlbar[pageproxystate="valid"] > #identity-box.chromeUI,
1794#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
a40f6a79 1795 -moz-margin-end: 3px;
319c6529
RK		 1796}
1797
56859d76 1798#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:-moz-locale-dir(ltr),
37953ab4 1799#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(ltr) {
a40f6a79
RK		 1800 border-top-right-radius: 0;
1801 border-bottom-right-radius: 0;
319c6529
RK		 1802}
1803
56859d76 1804#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:-moz-locale-dir(rtl),
37953ab4 1805#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(rtl) {
a40f6a79
RK		 1806 border-top-left-radius: 0;
1807 border-bottom-left-radius: 0;
319c6529
RK		 1808}
1809
a40f6a79
RK		 1810#identity-box.verifiedIdentity:not(:-moz-lwtheme) {
1811 background-color: #000000;
319c6529
RK		 1812}
1813
1814#identity-box:-moz-focusring {
1815 outline: 1px dotted #008484;
f993773d 1816 outline-offset: -1px;
319c6529
RK		 1817}
1818
1819#identity-box.verifiedDomain:-moz-focusring,
1820#identity-box.verifiedIdentity:-moz-focusring {
1821 outline-color: #000000;
1822}
1823
1824#identity-icon-labels {
1825 -moz-margin-start: 1px;
1826 -moz-margin-end: 3px;
319c6529
RK		 1827}
1828
1829/* Location bar dropmarker */
1830
38cfeb47 1831.urlbar-history-dropmarker:not(:hover):not([open="true"]) {
319c6529 1832 background-color: transparent;
319c6529
RK		 1833}
1834
00f971bc
RK		 1835#urlbar-container[combined="true"] > #urlbar > .urlbar-history-dropmarker,
1836#urlbar-wrapper > #urlbar > .urlbar-history-dropmarker {
38cfeb47
RK		 1837 border: none;
1838 border-radius: 0px;
319c6529
RK		 1839}
1840
ffce2402
RK		 1841.urlbar-history-dropmarker:hover {
1842}
1843
1844.urlbar-history-dropmarker:hover:active,
1845.urlbar-history-dropmarker[open="true"] {
1846}
1847
319c6529
RK		 1848/* page proxy icon */
1849
e7c8bab1
RK		 1850/* === BEGIN identity-block.inc.css === */
1851
1852#urlbar[pageproxystate="valid"] > #identity-box.chromeUI {
1853 /* Default theme does different color per channel, we can't as they do it build-time. */
1854 color: #9C9CFF;
1855 -moz-border-end: 1px solid #9C9CFF;
1856}
1857
1858#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
1859 color: #008484;
1860 -moz-border-end: 1px solid #008484;
1861}
1862
1863#urlbar[pageproxystate="valid"] > #identity-box.chromeUI,
1864#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
1865 background-position: right;
1866 background-size: 1px;
1867 background-repeat: no-repeat;
1868}
1869
1870/* page proxy icon */
1871
4d58ff64 1872#page-proxy-favicon {
319c6529
RK		 1873 width: 16px;
1874 height: 16px;
a40f6a79 1875 list-style-image: url("chrome://browser/skin/identity-icons-generic.png");
00f971bc 1876 margin: 2px;
e7c8bab1
RK		 1877}
1878
1879.chromeUI > #page-proxy-favicon[pageproxystate="valid"] {
1880 list-style-image: url("chrome://branding/content/identity-icons-brand.png");
319c6529
RK		 1881}
1882
2a5b7882 1883.verifiedDomain > #page-proxy-favicon[pageproxystate="valid"] {
a40f6a79
RK		 1884 list-style-image: url("chrome://browser/skin/identity-icons-https.png");
1885}
1886
2a5b7882 1887.verifiedIdentity > #page-proxy-favicon[pageproxystate="valid"] {
a40f6a79
RK		 1888 list-style-image: url("chrome://browser/skin/identity-icons-https-ev.png");
1889}
1890
56ab361a
RK		 1891.mixedActiveContent > #page-proxy-favicon[pageproxystate="valid"] {
1892 list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-active.png");
1893}
1894
e7c8bab1
RK		 1895.mixedDisplayContent > #page-proxy-favicon[pageproxystate="valid"] {
1896 list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-display.png");
1897}
1898
1899.mixedDisplayContentLoadedActiveBlocked > #page-proxy-favicon[pageproxystate="valid"] {
1900 list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-display.png");
1901}
1902
1903#page-proxy-favicon[pageproxystate="invalid"] {
1904 opacity: 0.3;
1905}
1906
1907#identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon {
1908 list-style-image: url("chrome://branding/content/icon64.png");
1909}
1910
1911#identity-popup-brandName {
1912 font-weight: bold;
1913 font-size: 1.25em;
1914 margin-top: .5em;
1915 margin-bottom: .5em;
1916}
1917
1918#identity-popup-content-box {
1919 max-width: 50ch;
1920}
1921
1922/* === END identity-block.inc.css === */
1923
1924#page-proxy-favicon {
1925 -moz-image-region: rect(0, 16px, 16px, 0);
1926}
1927
fff8097b
RK		 1928window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar > #identity-box > #page-proxy-favicon,
1929window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box > #page-proxy-favicon {
c0f6797e
RK		 1930/* -moz-margin-end: 1px;*/
1931}
1932
2a5b7882 1933#identity-box:hover > #page-proxy-favicon {
a40f6a79
RK		 1934 -moz-image-region: rect(0, 32px, 16px, 16px);
1935}
1936
2a5b7882
RK		 1937#identity-box:hover:active > #page-proxy-favicon,
1938#identity-box[open=true] > #page-proxy-favicon {
a40f6a79 1939 -moz-image-region: rect(0, 48px, 16px, 32px);
acb0e9b8 1940}
1941
2a5b7882
RK		 1942#identity-box:hover {
1943 background-color: #FFCF00;
7092015d 1944 color: #000000;
2a5b7882
RK		 1945}
1946
1947#identity-box:hover:active,
1948#identity-box[open=true] {
1949 background-color: #FF9F00;
7092015d 1950 color: #000000;
2a5b7882
RK		 1951}
1952
56859d76
RK		 1953#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:hover,
1954#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:hover:active,
1955#urlbar[pageproxystate="valid"] > #identity-box.chromeUI[open=true] {
1956 background-color: #9C9CFF;
1957 color: #000000;
1958}
1959
387e6560
RK		 1960#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover,
1961#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover:active,
1962#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity[open=true] {
2a5b7882
RK		 1963 background-color: #008484;
1964 color: #000000;
1965}
1966
319c6529
RK		 1967/* autocomplete */
1968
319c6529
RK		 1969#treecolAutoCompleteImage {
1970 max-width: 36px;
1971}
acb0e9b8 1972
319c6529
RK		 1973.ac-result-type-bookmark,
1974.autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
71bac478 1975 list-style-image: url("chrome://browser/skin/places/bookmark.png");
319c6529 1976 -moz-image-region: rect(0px 16px 16px 0px);
c1f7cc84 1977 width: 16px;
319c6529 1978 height: 16px;
acb0e9b8 1979}
1980
c0f6797e
RK		 1981richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type-bookmark,
1982.autocomplete-treebody::-moz-tree-image(selected, current, bookmark, treecolAutoCompleteImage) {
1983/* -moz-image-region: rect(0px 48px 16px 32px);*/
1984}
1985
319c6529
RK		 1986.ac-result-type-keyword,
1987.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) {
1988 list-style-image: url("chrome://global/skin/icons/Search-glass.png");
1989 -moz-image-region: rect(0px 32px 16px 16px);
acb0e9b8 1990 width: 16px;
1991 height: 16px;
1992}
1993
319c6529
RK		 1994.ac-result-type-tag,
1995.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
8da9da4e 1996 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
c1f7cc84 1997 width: 16px;
319c6529
RK		 1998 height: 16px;
1999}
acb0e9b8 2000
319c6529 2001.ac-comment {
c0f6797e 2002 font-size: 1.06em;
acb0e9b8 2003}
319c6529
RK		 2004
2005.ac-extra > .ac-comment {
c0f6797e 2006 font-size: 1em;
acb0e9b8 2007}
319c6529
RK		 2008
2009.ac-url-text,
2010.ac-action-text {
c0f6797e 2011 font-size: 1em;
319c6529 2012 color: #9C9CFF;
acb0e9b8 2013}
319c6529
RK		 2014
2015richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
2016 list-style-image: url("chrome://browser/skin/actionicon-tab.png");
85cfb236
RK		 2017 -moz-image-region: rect(0, 16px, 16px, 0);
2018 padding: 0 3px;
2019}
2020
2021richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
2022 -moz-image-region: rect(16px, 16px, 32px, 0);
acb0e9b8 2023}
2024
319c6529
RK		 2025.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
2026 color: #8050B0;
2027}
acb0e9b8 2028
319c6529
RK		 2029.ac-comment[selected="true"],
2030.ac-url-text[selected="true"],
2031.ac-action-text[selected="true"] {
2032 color: inherit !important;
acb0e9b8 2033}
2034
c1f7cc84
RK		 2035.autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
2036.autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
319c6529
RK		 2037{
2038 color: #8050B0;
2039 font-size: smaller;
acb0e9b8 2040}
319c6529
RK		 2041
2042.autocomplete-treebody::-moz-tree-cell(suggesthint) {
2043 border-top: 1px solid #9C9CFF;
acb0e9b8 2044}
2045
319c6529
RK		 2046/* combined go/reload/stop button in location bar */
2047
2048#urlbar > toolbarbutton {
9abeb12c 2049 -moz-margin-start: 0;
ffce2402 2050 padding: 0 2px;
319c6529
RK		 2051 background-origin: border-box;
2052 border: none;
c0f6797e 2053 list-style-image: url("chrome://browser/skin/reload-stop-go.png");
9abeb12c
RK		 2054 -moz-border-start: 1px solid #9C9CFF;
2055}
2056
2057#urlbar:-moz-locale-dir(ltr) > toolbarbutton {
38cfeb47
RK		 2058 border-top-left-radius: 0px;
2059 border-bottom-left-radius: 0px;
acb0e9b8 2060}
acb0e9b8 2061
9abeb12c 2062#urlbar:-moz-locale-dir(rtl) > toolbarbutton {
38cfeb47
RK		 2063 border-top-right-radius: 0px;
2064 border-bottom-right-radius: 0px;
9abeb12c
RK		 2065}
2066
46e71434 2067#urlbar > toolbarbutton:not([disabled=true]):active:hover,
dce90fef
RK		 2068#urlbar-reload-button:not(:hover) {
2069 -moz-border-start-style: none;
714b11f6 2070 -moz-padding-start: 3px;
dce90fef
RK		 2071}
2072
c0f6797e
RK		 2073#urlbar-reload-button {
2074 -moz-image-region: rect(0px, 14px, 14px, 0px);
acb0e9b8 2075}
2076
46e71434 2077#urlbar-reload-button[disabled=true] {
c0f6797e 2078 -moz-image-region: rect(28px, 14px, 42px, 0px);
acb0e9b8 2079}
2080
46e71434 2081#urlbar-reload-button:not([disabled=true]):hover {
c0f6797e 2082 -moz-image-region: rect(14px, 14px, 28px, 0px);
ffce2402
RK		 2083}
2084
c0f6797e
RK		 2085#urlbar-reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
2086 transform: scaleX(-1);
acb0e9b8 2087}
2088
c0f6797e
RK		 2089#urlbar-go-button {
2090 -moz-image-region: rect(0, 42px, 14px, 28px);
38cfeb47
RK		 2091}
2092
fff8097b 2093#urlbar-go-button:hover {
c0f6797e 2094 -moz-image-region: rect(14px, 42px, 28px, 28px);
acb0e9b8 2095}
2096
c0f6797e
RK		 2097#urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
2098 transform: scaleX(-1);
acb0e9b8 2099}
319c6529
RK		 2100
2101#urlbar-stop-button {
ffce2402 2102 -moz-image-region: rect(0px, 28px, 14px, 14px);
acb0e9b8 2103}
319c6529
RK		 2104
2105#urlbar-stop-button:hover {
ffce2402 2106 -moz-image-region: rect(14px, 28px, 28px, 14px);
acb0e9b8 2107}
2108
319c6529
RK		 2109/* popup blocker button */
2110
2111#page-report-button {
2112 list-style-image: url("chrome://browser/skin/urlbar-popup-blocked.png");
2113 -moz-image-region: rect(0, 16px, 16px, 0);
acb0e9b8 2114}
319c6529 2115
71bac478 2116#page-report-button:hover ,
319c6529
RK		 2117#page-report-button:hover:active,
2118#page-report-button[open="true"] {
71bac478 2119 -moz-image-region: rect(0, 32px, 16px, 16px);
acb0e9b8 2120}
2121
c4460289
RK		 2122/* social share panel */
2123
2124#social-share-panel > iframe {
2125/* background: linear-gradient(to bottom, #f0f4f7, #fafbfc);*/
2126 width: 300px;
2127 height: 150px;
2128}
2129
c4460289
RK		 2130.social-share-toolbar {
2131 border-right: 1px solid #9C9CFF;
2132/* background-color: #000000; */
2133}
2134
2135#social-share-provider-buttons {
2136 padding: 6px;
2137}
2138
2139#social-share-provider-buttons > .share-provider-button {
2140 -moz-appearance: none;
2141 padding: 5px;
2142 margin: 1px;
2143 border: none;
2144 background: none;
2145 border-radius: 2px;
2146}
2147
2148#social-share-provider-buttons > .share-provider-button[checked="true"]:not([disabled="true"]),
2149#social-share-provider-buttons > .share-provider-button:hover,
2150#social-share-provider-buttons > .share-provider-button:active {
2151 padding: 4px;
2152}
2153
2154#social-share-provider-buttons > .share-provider-button[checked="true"]:not([disabled="true"]) {
2155}
2156
2157#social-share-provider-buttons > .share-provider-button > .toolbarbutton-text {
2158 display: none;
2159}
2160#social-share-provider-buttons > .share-provider-button > .toolbarbutton-icon {
2161 width: 16px;
2162 min-height: 16px;
2163 max-height: 16px;
2164}
2165
5a199ba1
RK		 2166toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
2167 width: auto;
2168 height: auto;
2169 max-width: 32px;
2170 max-height: 24px;
2171}
2172
c4460289
RK		 2173/* fixup corners for share panel */
2174.social-panel > .social-panel-frame {
2175 border-radius: inherit;
2176}
2177
2178#social-share-panel {
2179 max-height: 600px;
2180 min-height: 100px;
2181 max-width: 800px;
2182 min-width: 300px;
2183}
2184
2185.social-share-frame {
2186/* background: linear-gradient(to bottom, #f0f4f7, #fafbfc); */
2187 width: 330px;
2188 height: 150px;
c4460289
RK		 2189 /* we resize our panels dynamically, make it look nice */
2190 transition: height 100ms ease-out, width 100ms ease-out;
2191}
2192
e2734cc7
RK		 2193.social-share-frame:-moz-locale-dir(ltr) {
2194 border-top-left-radius: 0;
2195 border-bottom-left-radius: 0;
2196 border-top-right-radius: inherit;
2197 border-bottom-right-radius: inherit;
2198}
2199
2200.social-share-frame:-moz-locale-dir(rtl) {
c4460289
RK		 2201 border-top-left-radius: inherit;
2202 border-bottom-left-radius: inherit;
e2734cc7
RK		 2203 border-top-right-radius: 0;
2204 border-bottom-right-radius: 0;
c4460289
RK		 2205}
2206
e2734cc7
RK		 2207#social-share-panel > .social-share-toolbar:-moz-locale-dir(ltr) {
2208 border-top-left-radius: inherit;
2209 border-bottom-left-radius: inherit;
2210}
2211
2212#social-share-panel > .social-share-toolbar:-moz-locale-dir(rtl) {
2213 border-top-right-radius: inherit;
2214 border-bottom-right-radius: inherit;
2215}
2216
2217#social-share-provider-buttons:-moz-locale-dir(ltr) {
c4460289
RK		 2218 border-top-left-radius: inherit;
2219 border-bottom-left-radius: inherit;
2220}
2221
e2734cc7
RK		 2222#social-share-provider-buttons:-moz-locale-dir(rtl) {
2223 border-top-right-radius: inherit;
2224 border-bottom-right-radius: inherit;
2225}
2226
889649fd
RK		 2227/* social recommending panel */
2228
a6757852 2229#social-mark-button {
d7cfd768 2230 -moz-image-region: rect(0, 16px, 16px, 0);
889649fd
RK		 2231}
2232
c0f6797e 2233/* bookmarks menu-button */
319c6529 2234
c0f6797e
RK		 2235#bookmarks-menu-button.bookmark-item {
2236 list-style-image: url("chrome://browser/skin/places/bookmark.png");
2237 -moz-image-region: rect(0px 16px 16px 0px);
acb0e9b8 2238}
319c6529 2239
c0f6797e
RK		 2240#bookmarks-menu-button.bookmark-item[starred] {
2241 -moz-image-region: rect(0px 32px 16px 16px);
acb0e9b8 2242}
319c6529 2243
c0f6797e
RK		 2244#bookmarks-menu-button.bookmark-item > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
2245 -moz-margin-start: 5px;
acb0e9b8 2246}
2247
c0f6797e
RK		 2248#bookmarks-menu-button[cui-areatype="toolbar"]:not(.bookmark-item):not([overflowedItem=true]) > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
2249 padding-top: 2px;
2250 padding-bottom: 2px;
71bac478
RK		 2251}
2252
c0f6797e
RK		 2253#BMB_bookmarksPopup[side="top"],
2254#BMB_bookmarksPopup[side="bottom"] {
2255 margin-left: -20px;
2256 margin-right: -20px;
71bac478
RK		 2257}
2258
c0f6797e
RK		 2259#BMB_bookmarksPopup[side="left"],
2260#BMB_bookmarksPopup[side="right"] {
2261 margin-top: -20px;
2262 margin-bottom: -20px;
acb0e9b8 2263}
319c6529
RK		 2264
2265/* bookmarking panel */
c0f6797e 2266
319c6529
RK		 2267#editBookmarkPanelStarIcon {
2268 list-style-image: url("chrome://browser/skin/places/starred48.png");
2269 width: 48px;
2270 height: 48px;
acb0e9b8 2271}
319c6529
RK		 2272
2273#editBookmarkPanelStarIcon[unstarred] {
2274 list-style-image: url("chrome://browser/skin/places/unstarred48.png");
acb0e9b8 2275}
2276
319c6529
RK		 2277#editBookmarkPanelTitle {
2278 font-size: 130%;
acb0e9b8 2279}
319c6529
RK		 2280
2281#editBookmarkPanelHeader,
2282#editBookmarkPanelContent {
2283 margin-bottom: .5em;
acb0e9b8 2284}
319c6529
RK		 2285
2286/* Implements editBookmarkPanel resizing on folderTree un-collapse. */
2287#editBMPanel_folderTree {
2288 min-width: 27em;
acb0e9b8 2289}
2290
f993773d 2291.panel-promo-box {
46e71434
RK		 2292 margin: 5px 0 -6px;
2293 padding: 5px 0;
889649fd 2294 border-top: 1px solid #9C9CFF;
f0eab82c
RK		 2295 border-bottom-left-radius: 5px;
2296 border-bottom-right-radius: 5px;
f993773d
RK		 2297}
2298
2299.panel-promo-icon {
2300 list-style-image: url("chrome://browser/skin/sync-notification-24.png");
2301 -moz-margin-end: 10px;
2302 vertical-align: middle;
2303}
2304
2305.panel-promo-closebutton {
2306 list-style-image: url("chrome://global/skin/icons/close-button.gif");
f0eab82c
RK		 2307 -moz-margin-end: -3px;
2308 margin-top: -3px;
f993773d
RK		 2309}
2310
2311.panel-promo-closebutton:hover {
2312 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2313}
2314
2315.panel-promo-closebutton:hover:active {
2316 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2317}
2318
2319.panel-promo-closebutton > .toolbarbutton-text {
2320 padding: 0;
2321 margin: 0;
2322}
2323
319c6529
RK		 2324/* ::::: content area ::::: */
2325
2326#sidebar {
2327 background-color: Window;
acb0e9b8 2328}
319c6529
RK		 2329
2330#sidebar-title {
2331 -moz-padding-start: 0px;
acb0e9b8 2332}
319c6529 2333
fe524e0c
RK		 2334.browserContainer > findbar {
2335/*
2336 background-color: -moz-dialog;
2337 color: -moz-DialogText;
2338*/
2339}
2340
319c6529 2341/* Tabstrip */
b36fc72e 2342
c0f6797e 2343#TabsToolbar {
e20c83c3
RK		 2344 min-height: 0;
2345 padding: 0;
2346 -moz-binding: url("chrome://browser/content/customizableui/toolbar.xml#toolbar");
2347}
2348
b36fc72e 2349#TabsToolbar .toolbar-holder {
c1f7cc84 2350 background-color: #000000; /* correct effect of being an actual toolbar */
acb0e9b8 2351}
2352
b36fc72e 2353#main-window[disablechrome] #TabsToolbar,
319c6529 2354#TabsToolbar[tabsontop="false"] {
8b5fc82e 2355 border-bottom: 1px solid #008484;
acb0e9b8 2356}
319c6529 2357
c0f6797e 2358#main-window:not([customizing]) #TabsToolbar:not(:-moz-lwtheme) {
45dc7657 2359}
c0f6797e
RK		 2360
2361#main-window[tabsintitlebar] #TabsToolbar {
2362 background-color: transparent;
2363}
2364
6dc70335
RK		 2365/* === BEGIN tabs.inc.css === */
2366
319c6529 2367.tabbrowser-tab,
43ee1307
RK		 2368.tabs-newtab-button,
2369#TabsToolbar > #new-tab-button {
319c6529 2370 margin-top: 0px;
acb0e9b8 2371}
319c6529 2372
43ee1307 2373.tabbrowser-tab {
57fc408c
RK		 2374 padding: 1px 4px 2px;
2375}
2376
2377.tabbrowser-tab:first-of-type {
2378 -moz-margin-start: 2px;
2379}
2380
43ee1307
RK		 2381.tabs-newtab-button,
2382#TabsToolbar > #new-tab-button {
57fc408c
RK		 2383 border-radius: 8px 8px 0px 0px;
2384 -moz-margin-start: 0;
2385}
2386
43ee1307
RK		 2387.tabs-newtab-button:not(:hover),
2388#TabsToolbar > #new-tab-button:not(:hover) {
57fc408c
RK		 2389 background-color: #C09070;
2390}
2391
fe524e0c
RK		 2392.tabbrowser-tab[remote] {
2393 text-decoration: underline;
2394}
2395
c0f6797e
RK		 2396/* The selected tab should appear above adjacent tabs, .tabs-newtab-button and the highlight of #nav-bar */
2397.tabbrowser-tab[selected=true] {
2398/* position: relative;
2399 z-index: 2;*/
acb0e9b8 2400}
2401
c0f6797e 2402.tab-background-middle {
acb0e9b8 2403}
2404
c0f6797e 2405.tab-content {
acb0e9b8 2406}
319c6529 2407
46e71434 2408.tab-/*throbber*/,
c0f6797e
RK		 2409.tab-icon-image,
2410.tab-close-button {
acb0e9b8 2411}
2412
319c6529
RK		 2413.tab-throbber,
2414.tab-icon-image {
319c6529 2415 height: 16px;
c0f6797e
RK		 2416 width: 16px;
2417}
2418
2419.tab-icon-image {
dce90fef 2420 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
613daf44 2421}
2422
319c6529 2423.tab-throbber {
95f333af 2424 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim-connect.png");
613daf44 2425}
319c6529
RK		 2426
2427.tab-throbber[progress] {
95f333af 2428 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
613daf44 2429}
319c6529 2430
c0f6797e
RK		 2431.tab-throbber:not([pinned]),
2432.tab-icon-image:not([pinned]) {
2433 -moz-margin-end: 3px;
2434}
2435
319c6529
RK		 2436.tab-throbber[pinned],
2437.tab-icon-image[pinned] {
2438 -moz-margin-start: 2px;
2439 -moz-margin-end: 2px;
613daf44 2440}
319c6529 2441
c0f6797e
RK		 2442.tab-label {
2443}
2444
2445.tab-close-button {
2446 margin-top: 1px;
2447 padding: 0;
2448}
2449
2450.tab-background,
2451.tabs-newtab-button {
2452 /* overlap the tab curves */
2453}
2454
2455.tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox {
2456}
2457
2458.tab-background-start[selected=true]::after,
2459.tab-background-start[selected=true]::before,
2460.tab-background-start,
2461.tab-background-end,
2462.tab-background-end[selected=true]::after,
2463.tab-background-end[selected=true]::before {
2464}
2465
2466.tabbrowser-tab:not([selected=true]),
2467.tabbrowser-tab:-moz-lwtheme {
2468}
2469
319c6529 2470/* tabbrowser-tab focus ring */
c0f6797e 2471.tabbrowser-tab:focus {
319c6529 2472 outline: 1px dotted;
613daf44 2473}
319c6529 2474
c0f6797e
RK		 2475/* Selected tab */
2476
2477.tabbrowser-tab[selected="true"] {
2478}
2479
2480/* End selected tab */
2481
2482/* Background tabs */
2483
2484/* Decrease the height of the hoverable region of background tabs whenever the tabs are at the top
2485 of the window (e.g. no menubar, tabs in titlebar, etc.) to make it easier to drag the window by
2486 the titlebar. We don't need this in fullscreen since window dragging is not an issue there. */
2487#main-window[tabsintitlebar]:not([sizemode="maximized"]):not([inFullscreen]) #toolbar-menubar:-moz-any([autohide="true"][inactive], :not([autohide])) + #TabsToolbar .tab-background-middle:not([selected=true]) {
2488}
2489
2490/* End background tabs */
2491
2492/* Tab pointer-events */
2493/*
2494.tabbrowser-tab {
2495 pointer-events: none;
2496}
2497
2498.tab-background-middle,
2499.tabs-newtab-button,
2500.tab-close-button {
2501 pointer-events: auto;
2502}
2503*/
2504/* Pinned tabs */
2505
2506.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) {
2507 background-color: #E7ADE7;
2508}
2509
2510.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]):hover {
2511 background-color: #3333FF;
2512 color: #000000;
2513}
2514
2515/* New tab button */
2516
2517.tabs-newtab-button {
2518 width: 28px;
2519}
2520
2521/* === END tabs.inc.css === */
2522
8ad8bf83 2523/* Tab DnD indicator */
319c6529
RK		 2524.tab-drop-indicator {
2525 list-style-image: url("chrome://browser/skin/tabbrowser/tabDragIndicator.png");
9abeb12c 2526 margin-bottom: -11px;
613daf44 2527}
2528
319c6529
RK		 2529/* Tab close button */
2530.tab-close-button {
319c6529
RK		 2531 list-style-image: url("chrome://global/skin/icons/close-button.gif");
2532}
acb0e9b8 2533
319c6529
RK		 2534.tab-close-button:hover,
2535.tab-close-button:hover[selected="true"] {
2536 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
acb0e9b8 2537}
319c6529
RK		 2538
2539.tab-close-button:hover:active,
2540.tab-close-button:hover:active[selected="true"] {
2541 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
acb0e9b8 2542}
319c6529 2543
319c6529
RK		 2544/* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */
2545
319c6529
RK		 2546.tabbrowser-arrowscrollbox > .scrollbutton-up,
2547.tabbrowser-arrowscrollbox > .scrollbutton-down {
319c6529
RK		 2548 margin: 0;
2549 padding-top: 0;
2550 padding-bottom: 0;
c0f6797e
RK		 2551 background-origin: border-box;
2552}
2553
2554#main-window[tabsintitlebar]:not([inFullscreen]) .tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
2555#main-window[tabsintitlebar]:not([inFullscreen]) .tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
2556.tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-lwtheme-brighttext,
2557.tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-lwtheme-brighttext {
2558 }
b7f3670c 2559
c0f6797e
RK		 2560.tabbrowser-arrowscrollbox > .scrollbutton-up[disabled],
2561.tabbrowser-arrowscrollbox > .scrollbutton-down[disabled] {
2562 }
2563
2564.tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(rtl),
2565.tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(ltr) {
2566/* transform: scaleX(-1);*/
2567}
2568
2569.tabbrowser-arrowscrollbox > .scrollbutton-down {
2570 transition: 1s background-color ease-out;
acb0e9b8 2571}
319c6529 2572
319c6529
RK		 2573.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
2574 background-color: #008484;
acb0e9b8 2575}
319c6529 2576
c0f6797e
RK		 2577.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]),
2578.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]) {
2579/* border-width: 0 2px 0 0;
2580 border-style: solid;
2581 border-image: url("chrome://browser/skin/tabbrowser/tab-overflow-border.png") 0 2 0 2 fill;*/
2582}
2583
319c6529
RK		 2584.tabs-newtab-button > .toolbarbutton-icon {
2585 margin-top: -1px;
2586 margin-bottom: -1px;
acb0e9b8 2587}
319c6529
RK		 2588
2589.tabs-newtab-button,
2590#TabsToolbar > #new-tab-button,
e20c83c3
RK		 2591#TabsToolbar > toolbarpaletteitem > #new-tab-button,
2592#TabsToolbar > toolbarpaletteitem > #new-tab-button[cui-areatype="toolbar"] {
38cfeb47 2593 list-style-image: url("chrome://browser/skin/tabbrowser/newtab.png");
319c6529 2594 -moz-image-region: rect(0, 16px, 18px, 0);
acb0e9b8 2595}
2596
8b5fc82e 2597.tabs-newtab-button,
38cfeb47 2598.tabs-newtab-button:hover,
c0f6797e 2599#TabsToolbar > #new-tab-button,
38cfeb47 2600#TabsToolbar > #new-tab-button:hover {
319c6529 2601 -moz-image-region: rect(0, 32px, 18px, 16px);
acb0e9b8 2602}
319c6529 2603
c0f6797e
RK		 2604#main-window[tabsintitlebar]:not([inFullscreen]) .tabs-newtab-button:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
2605#main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar > #new-tab-button:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
2606#main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar > toolbarpaletteitem > #new-tab-button:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
2607.tabs-newtab-button:-moz-lwtheme-brighttext,
2608#TabsToolbar > #new-tab-button:-moz-lwtheme-brighttext,
2609#TabsToolbar > toolbarpaletteitem > #new-tab-button:-moz-lwtheme-brighttext {
acb0e9b8 2610}
2611
c0f6797e
RK		 2612#TabsToolbar > #new-tab-button {
2613 width: 26px;
2614}
2615
2616#alltabs-button {
2617 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
acb0e9b8 2618}
319c6529 2619
f9fc08c7
RK		 2620#alltabs-button:hover,
2621#alltabs-button:hover:active,
2622#alltabs-button[open="true"] {
8da9da4e 2623 list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
acb0e9b8 2624}
319c6529 2625
c0f6797e
RK		 2626#main-window[tabsintitlebar]:not([inFullscreen]) #alltabs-button:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
2627#alltabs-button:-moz-lwtheme-brighttext {
2628}
2629
2630#alltabs-button > .toolbarbutton-icon {
2631/* margin: 0 2px;*/
2632}
2633
2634#alltabs-button > .toolbarbutton-menu-dropmarker {
2635 display: none;
2636}
2637
319c6529
RK		 2638/* All tabs menupopup */
2639.alltabs-item > .menu-iconic-left > .menu-iconic-icon {
dce90fef 2640 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
8da9da4e 2641 -moz-image-region: auto;
acb0e9b8 2642}
2643
319c6529
RK		 2644.alltabs-item[selected="true"] {
2645 font-weight: bold;
acb0e9b8 2646}
319c6529
RK		 2647
2648.alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon {
2649 list-style-image: url("chrome://global/skin/icons/loading.gif");
acb0e9b8 2650}
319c6529 2651
85cfb236 2652.alltabs-item[tabIsVisible]:not([_moz-menuactive="true"]) {
b1234db8
RK		 2653 background-color: #402800;
2654}
2655
319c6529
RK		 2656/* Tabstrip close button */
2657.tabs-closebutton {
2658 -moz-box-flex: 1;
2659 margin: 0px;
2660 padding: 2px;
2661 list-style-image: url("chrome://global/skin/icons/close-button.gif");
acb0e9b8 2662}
2663
b36fc72e
RK		 2664.tabs-closebutton > .toolbarbutton-icon {
2665}
2666
8da9da4e
RK		 2667.tabs-closebutton > .toolbarbutton-text {
2668 display: none;
2669}
2670
319c6529
RK		 2671.tabs-closebutton:hover,
2672.tabs-closebutton:hover:active {
2673 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
acb0e9b8 2674}
319c6529
RK		 2675
2676toolbarbutton.chevron {
2677 list-style-image: url("chrome://global/skin/toolbar/chevron.gif") !important;
acb0e9b8 2678}
319c6529
RK		 2679
2680toolbarbutton.chevron:hover {
2681 list-style-image: url("chrome://global/skin/toolbar/chevron-hover.gif") !important;
acb0e9b8 2682}
2683
319c6529
RK		 2684toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon,
2685toolbarbutton.chevron:-moz-locale-dir(rtl):hover > .toolbarbutton-icon {
71a617ff 2686 transform: scaleX(-1);
acb0e9b8 2687}
319c6529
RK		 2688
2689toolbarbutton.chevron > .toolbarbutton-text,
2690toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
2691 display: none;
acb0e9b8 2692}
319c6529
RK		 2693
2694toolbarbutton.chevron > .toolbarbutton-icon {
2695 margin: 0;
acb0e9b8 2696}
2697
319c6529
RK		 2698#sidebar-throbber[loading="true"] {
2699 list-style-image: url("chrome://global/skin/icons/loading.gif");
2700 -moz-margin-end: 4px;
acb0e9b8 2701}
319c6529
RK		 2702
2703/* Bookmarks toolbar */
2704#PlacesToolbarDropIndicator {
8da9da4e 2705 list-style-image: url("chrome://communicator/skin/bookmarks/toolbarDropMarker.png");
acb0e9b8 2706}
2707
319c6529
RK		 2708toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2709 background-color: #008484 !important;
2710 color: #FFCF00 !important;
613daf44 2711}
319c6529
RK		 2712
2713/* rules for menupopup drop indicators */
2714.menupopup-drop-indicator-bar {
2715 position: relative;
2716 /* these two margins must together compensate the indicator's height */
2717 margin-top: -1px;
2718 margin-bottom: -1px;
613daf44 2719}
319c6529
RK		 2720
2721.menupopup-drop-indicator {
2722 list-style-image: none;
2723 height: 2px;
2724 -moz-margin-end: -4em;
2725 background-color: #008484;
613daf44 2726}
2727
319c6529
RK		 2728/* ::::: Identity Indicator Styling ::::: */
2729
2730/* Popup Icons */
2731#identity-popup-icon {
2732 height: 64px;
2733 width: 64px;
2734 padding: 0;
2735 list-style-image: url("chrome://browser/skin/identity.png");
2736 -moz-image-region: rect(0px, 64px, 64px, 0px);
613daf44 2737}
319c6529
RK		 2738
2739#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
2740 -moz-image-region: rect(64px, 64px, 128px, 0px);
613daf44 2741}
319c6529
RK		 2742
2743#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
2744 -moz-image-region: rect(128px, 64px, 192px, 0px);
613daf44 2745}
2746
319c6529
RK		 2747/* Popup Body Text */
2748.identity-popup-description {
2749 white-space: pre-wrap;
2750 -moz-padding-start: 15px;
2751 margin: 2px 0 4px;
613daf44 2752}
319c6529
RK		 2753
2754.identity-popup-label {
2755 white-space: pre-wrap;
2756 -moz-padding-start: 15px;
2757 margin: 0;
613daf44 2758}
319c6529 2759
5517da5a 2760#identity-popup-content-host,
319c6529
RK		 2761#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner {
2762 font-size: 1.2em;
613daf44 2763}
2764
319c6529
RK		 2765#identity-popup-content-host {
2766 margin-top: 3px;
2767 margin-bottom: 5px;
2768 font-weight: bold;
2769 max-width: 300px;
2770}
613daf44 2771
319c6529
RK		 2772#identity-popup-content-owner {
2773 margin-top: 4px;
2774 margin-bottom: 0 !important;
2775 font-weight: bold;
2776 max-width: 300px;
2777}
613daf44 2778
319c6529
RK		 2779.verifiedDomain > #identity-popup-content-owner {
2780 font-weight: normal;
613daf44 2781}
2782
319c6529
RK		 2783#identity-popup-content-verifier {
2784 margin: 4px 0 2px;
613daf44 2785}
2786
319c6529
RK		 2787#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
2788#identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
2789 margin-top: 10px;
2790 -moz-margin-start: -24px;
613daf44 2791}
2792
319c6529
RK		 2793#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
2794#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
2795 list-style-image: url("chrome://browser/skin/Secure24.png");
613daf44 2796}
2797
3a0880a9
RK		 2798#identity-popup-help-icon {
2799 border: none;
2800 margin: 7px 0 0 -3px;
2801 background: none;
2802 min-width: 0;
2803 list-style-image: url("chrome://global/skin/icons/question-16.png");
2804 cursor: pointer;
2805}
2806
2807#identity-popup-help-icon > .button-box > .button-text {
2808 display: none;
2809}
2810
2811#identity-popup-help-icon > .button-box > .button-icon {
2812 height: 16px;
2813 width: 16px;
2814}
2815
319c6529
RK		 2816#identity-popup-more-info-button {
2817 margin-top: 6px;
2818 margin-bottom: 0;
2819 -moz-margin-end: 0;
613daf44 2820}
acb0e9b8 2821
fe524e0c
RK		 2822#identity-popup > .panel-arrowcontainer > .panel-arrowcontent {
2823 padding: 0;
2824}
2825
2826#identity-popup-container {
2827 min-width: 280px;
2828 padding: 10px;
2829}
2830
2831#identity-popup-button-container {
2832/* background: linear-gradient(to bottom, rgba(0,0,0,0.04) 60%, transparent);*/
2833 padding: 10px;
2834 margin-top: 5px;
2835}
2836
319c6529
RK		 2837.popup-notification-icon {
2838 width: 64px;
2839 height: 64px;
2840 -moz-margin-end: 10px;
2841}
acb0e9b8 2842
319c6529
RK		 2843.popup-notification-icon[popupid="geolocation"] {
2844 list-style-image: url("chrome://browser/skin/Geolocation-64.png");
acb0e9b8 2845}
2846
319c6529
RK		 2847.popup-notification-icon[popupid="xpinstall-disabled"],
2848.popup-notification-icon[popupid="addon-progress"],
2849.popup-notification-icon[popupid="addon-install-cancelled"],
2850.popup-notification-icon[popupid="addon-install-blocked"],
2851.popup-notification-icon[popupid="addon-install-failed"],
a40f6a79 2852.popup-notification-icon[popupid="addon-install-complete"] {
319c6529
RK		 2853 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
2854 width: 32px;
2855 height: 32px;
acb0e9b8 2856}
319c6529 2857
a40f6a79 2858.popup-notification-icon[popupid="click-to-play-plugins"] {
fcfb76ce 2859 list-style-image: url("chrome://mozapps/skin/plugins/pluginBlocked-64.png");
a40f6a79
RK		 2860}
2861
a6757852
RK		 2862.popup-notification-icon[popupid="plugins-not-found"] {
2863 list-style-image: url("chrome://browser/skin/pluginInstall-64.png");
2864}
2865
82b4252f
RK		 2866.popup-notification-icon[popupid="web-notifications"] {
2867 list-style-image: url("chrome://browser/skin/notification-64.png");
2868}
2869
319c6529
RK		 2870.addon-progress-description {
2871 width: 350px;
2872 max-width: 350px;
acb0e9b8 2873}
319c6529
RK		 2874
2875.popup-progress-label,
2876.popup-progress-meter {
2877 -moz-margin-start: 0;
2878 -moz-margin-end: 0;
acb0e9b8 2879}
319c6529
RK		 2880
2881.popup-progress-cancel {
2882 -moz-appearance: none;
2883 background: transparent;
2884 border: none;
2885 padding: 0;
2886 margin: 0;
2887 min-height: 0;
2888 min-width: 0;
2889 list-style-image: url("chrome://mozapps/skin/downloads/downloadButtons.png");
2890 -moz-image-region: rect(0px, 32px, 16px, 16px);
acb0e9b8 2891}
319c6529
RK		 2892
2893.popup-progress-cancel:hover {
2894 -moz-image-region: rect(16px, 32px, 32px, 16px);
acb0e9b8 2895}
2896
319c6529
RK		 2897.popup-progress-cancel:active {
2898 -moz-image-region: rect(32px, 32px, 48px, 16px);
2899}
acb0e9b8 2900
319c6529 2901.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
a6757852 2902.popup-notification-icon[popupid="indexedDB-quota-prompt"],
e2734cc7
RK		 2903.popup-notification-icon[popupid*="offline-app-requested"],
2904.popup-notification-icon[popupid="offline-app-usage"] {
319c6529 2905 list-style-image: url("chrome://global/skin/icons/alert-question.gif");
acb0e9b8 2906}
2907
319c6529
RK		 2908.popup-notification-icon[popupid="password-save"],
2909.popup-notification-icon[popupid="password-change"] {
2910 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-64.png");
acb0e9b8 2911}
2912
1b13529a 2913.popup-notification-icon[popupid="webapps-install-progress"],
8d7ef0d9 2914.popup-notification-icon[popupid="webapps-install"] {
87a1144f 2915 list-style-image: url("chrome://global/skin/icons/webapps-64.png");
8d7ef0d9
RK		 2916}
2917
56ab361a
RK		 2918.popup-notification-icon[popupid="mixed-content-blocked"] {
2919 list-style-image: url("chrome://browser/skin/mixed-content-blocked-64.png");
2920}
2921
0142a07b 2922.popup-notification-icon[popupid="webRTC-sharingDevices"],
7bc075b6
RK		 2923.popup-notification-icon[popupid="webRTC-shareDevices"] {
2924 list-style-image: url("chrome://browser/skin/webRTC-shareDevice-64.png");
2925}
2926
c1d2ce3e
RK		 2927.popup-notification-icon[popupid="webRTC-sharingMicrophone"],
2928.popup-notification-icon[popupid="webRTC-shareMicrophone"] {
2929 list-style-image: url("chrome://browser/skin/webRTC-shareMicrophone-64.png");
2930}
2931
82b4252f
RK		 2932.popup-notification-icon[popupid="pointerLock"] {
2933 list-style-image: url("chrome://browser/skin/pointerLock-64.png");
2934}
2935
319c6529 2936/* Notification icon box */
cae267ab
RK		 2937#notification-popup .panel-promo-box {
2938/* margin: 10px -10px -10px; */
2939}
2940
319c6529 2941#notification-popup-box {
f993773d
RK		 2942 position: relative;
2943 background-color: #000000;
2944 background-clip: padding-box;
2945 padding-left: 3px;
5517da5a 2946 padding-right: 8px;
f0eab82c 2947 border-radius: 3px 0 0 3px;
82b4252f 2948 border-image: url("chrome://browser/skin/urlbar-arrow.png") 0 8 0 0 / 0 8px 0 0;
f993773d 2949 -moz-margin-end: -8px;
5517da5a 2950 border-right-width: 8px;
f993773d
RK		 2951}
2952
fff8097b
RK		 2953window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar > #notification-popup-box,
2954window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled] > #urlbar > #notification-popup-box {
5517da5a 2955/* padding-left: 5px; */
f993773d
RK		 2956}
2957
2958#notification-popup-box:-moz-locale-dir(rtl),
2959.notification-anchor-icon:-moz-locale-dir(rtl) {
71a617ff 2960 transform: scaleX(-1);
319c6529 2961}
acb0e9b8 2962
319c6529 2963.notification-anchor-icon {
acb0e9b8 2964 width: 16px;
2965 height: 16px;
85cfb236 2966 margin: 0 2px;
acb0e9b8 2967}
2968
319c6529 2969.notification-anchor-icon:-moz-focusring {
f0eab82c
RK		 2970 outline: 1px dotted #008484;
2971/* outline-offset: -3px; */
acb0e9b8 2972}
2973
e2734cc7 2974.default-notification-icon,
ab799a7a
RK		 2975#default-notification-icon {
2976 list-style-image: url("chrome://global/skin/icons/information-16.png");
2977}
2978
e2734cc7 2979.identity-notification-icon,
9585a561
RK		 2980#identity-notification-icon {
2981 list-style-image: url("chrome://mozapps/skin/profile/profileicon.png");
2982}
2983
e2734cc7 2984.geo-notification-icon,
319c6529
RK		 2985#geo-notification-icon {
2986 list-style-image: url("chrome://browser/skin/Geolocation-16.png");
acb0e9b8 2987}
2988
319c6529
RK		 2989#addons-notification-icon {
2990 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
acb0e9b8 2991}
2992
e2734cc7 2993.indexedDB-notification-icon,
319c6529
RK		 2994#indexedDB-notification-icon {
2995 list-style-image: url("chrome://global/skin/icons/question-16.png");
acb0e9b8 2996}
2997
319c6529
RK		 2998#password-notification-icon {
2999 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-16.png");
acb0e9b8 3000}
3001
8d7ef0d9 3002#webapps-notification-icon {
87a1144f 3003 list-style-image: url("chrome://gobal/skin/icons/webapps-16.png");
8d7ef0d9
RK		 3004}
3005
a40f6a79 3006#plugins-notification-icon {
b27cc46e
RK		 3007 list-style-image: url("chrome://browser/skin/notification-pluginNormal.png");
3008}
3009
f76c6aee 3010#plugins-notification-icon.plugin-hidden {
b27cc46e 3011 list-style-image: url("chrome://browser/skin/notification-pluginAlert.png");
a40f6a79
RK		 3012}
3013
f76c6aee 3014#plugins-notification-icon.plugin-blocked {
b27cc46e 3015 list-style-image: url("chrome://browser/skin/notification-pluginBlocked.png");
990cba4b
RK		 3016}
3017
f76c6aee 3018#plugins-notification-icon {
fe524e0c
RK		 3019/* -moz-image-region: rect(0, 16px, 16px, 0);*/
3020}
3021
f76c6aee 3022#plugins-notification-icon:hover {
fe524e0c
RK		 3023/* -moz-image-region: rect(0, 32px, 16px, 16px);*/
3024}
3025
a6757852
RK		 3026#plugin-install-notification-icon {
3027 list-style-image: url("chrome://browser/skin/pluginInstall-16.png");
3028}
3029
6adbc9a6
RK		 3030#notification-popup-box[hidden] {
3031 /* Override display:none to make the pluginBlockedNotification animation work
3032 when showing the notification repeatedly. */
3033 display: -moz-box;
3034 visibility: collapse;
3035}
3036
f76c6aee 3037#plugins-notification-icon.plugin-blocked[showing] {
990cba4b
RK		 3038 animation: pluginBlockedNotification 500ms ease 0s 5 alternate both;
3039}
3040
3041@keyframes pluginBlockedNotification {
3042 from {
3043 opacity: 0;
3044 }
3045 to {
3046 opacity: 1;
3047 }
3048}
3049
e2734cc7 3050.mixed-content-blocked-notification-icon,
56ab361a
RK		 3051#mixed-content-blocked-notification-icon {
3052 list-style-image: url("chrome://browser/skin/mixed-content-blocked-16.png");
3053}
3054
e2734cc7 3055.webRTC-shareDevices-notification-icon,
0142a07b 3056#webRTC-shareDevices-notification-icon {
7bc075b6
RK		 3057 list-style-image: url("chrome://browser/skin/webRTC-shareDevice-16.png");
3058}
3059
e2734cc7 3060.webRTC-sharingDevices-notification-icon,
6adbc9a6
RK		 3061#webRTC-sharingDevices-notification-icon {
3062 list-style-image: url("chrome://browser/skin/webRTC-sharingDevice-16.png");
3063}
3064
c1d2ce3e
RK		 3065.webRTC-shareMicrophone-notification-icon,
3066#webRTC-shareMicrophone-notification-icon {
3067 list-style-image: url("chrome://browser/skin/webRTC-shareMicrophone-16.png");
3068}
3069
3070.webRTC-sharingMicrophone-notification-icon,
3071#webRTC-sharingMicrophone-notification-icon {
3072 list-style-image: url("chrome://browser/skin/webRTC-sharingMicrophone-16.png");
3073}
3074
e2734cc7 3075.web-notifications-notification-icon,
82b4252f
RK		 3076#web-notifications-notification-icon {
3077 list-style-image: url("chrome://browser/skin/notification-16.png");
3078}
3079
3080#pointerLock-notification-icon {
3081 list-style-image: url("chrome://browser/skin/pointerLock-16.png");
3082}
3083#pointerLock-cancel {
3084 margin: 0px;
3085}
3086
319c6529 3087/* Bookmarks roots menu-items */
319c6529
RK		 3088#subscribeToPageMenuitem:not([disabled]),
3089#subscribeToPageMenupopup,
3090#BMB_subscribeToPageMenuitem:not([disabled]),
3091#BMB_subscribeToPageMenupopup {
3092 list-style-image: url("chrome://browser/skin/feeds/feedIcon16.png");
613daf44 3093}
3094
319c6529 3095#bookmarksToolbarFolderMenu,
c0f6797e
RK		 3096#BMB_bookmarksToolbar,
3097#panelMenu_bookmarksToolbar {
8da9da4e 3098 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png");
319c6529
RK		 3099 -moz-image-region: auto;
3100}
acb0e9b8 3101
c0f6797e
RK		 3102#BMB_unsortedBookmarks,
3103#panelMenu_unsortedBookmarks {
8da9da4e 3104 list-style-image: url("chrome://communicator/skin/bookmarks/unsortedBookmarks.png");
319c6529 3105 -moz-image-region: auto;
acb0e9b8 3106}
3107
319c6529 3108/* ::::: Keyboard UI Panel ::::: */
acb0e9b8 3109
319c6529
RK		 3110.KUI-panel {
3111 color: #FF9F00;
3112 border-style: none;
3113 border-radius: 20px;
acb0e9b8 3114}
3115
319c6529
RK		 3116.KUI-panel[level="top"] {
3117 /*background-color: rgba(27%,27%,27%,.65);*/
acb0e9b8 3118}
3119
319c6529
RK		 3120/* Ctrl-Tab */
3121
3122#ctrlTab-panel {
3123 padding: 20px 10px 10px;
3124 font-weight: bold;
acb0e9b8 3125}
3126
319c6529
RK		 3127.ctrlTab-favicon[src] {
3128 background-color: #000000;
3129 width: 20px;
3130 height: 20px;
3131 padding: 2px;
3132}
acb0e9b8 3133
319c6529 3134.ctrlTab-preview-inner > .tabPreview-canvas {
acb0e9b8 3135}
3136
319c6529
RK		 3137.ctrlTab-preview:not(#ctrlTab-showAll) > * > .ctrlTab-preview-inner > .tabPreview-canvas {
3138 margin-bottom: 2px;
acb0e9b8 3139}
3140
319c6529
RK		 3141.ctrlTab-preview-inner {
3142 padding-bottom: 10px;
acb0e9b8 3143}
3144
319c6529
RK		 3145#ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
3146 padding: 10px;
3147 background-color: #000000;
3148 border-radius: .5em;
acb0e9b8 3149}
3150
319c6529
RK		 3151.ctrlTab-preview:focus > * > .ctrlTab-preview-inner {
3152 color: white;
3153 background-color: #000000;
3154 text-shadow: none;
3155 padding: 8px;
3156 border: 2px solid #9C9CFF;
3157 border-radius: .5em;
acb0e9b8 3158}
3159
319c6529
RK		 3160.ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
3161 margin: -10px -10px 0;
acb0e9b8 3162}
3163
319c6529
RK		 3164#ctrlTab-showAll {
3165 margin-top: .5em;
acb0e9b8 3166}
3167
45dc7657
RK		 3168/* Sync Panel */
3169
3170.sync-panel-icon {
cae267ab 3171 height:32px;
45dc7657
RK		 3172 width: 32px;
3173 background: url("chrome://browser/content/abouthome/sync.png") top left no-repeat;
3174}
3175
3176.sync-panel-inner {
3177 width: 0;
3178 padding-left: 10px;
3179}
3180
3181.sync-panel-button-box {
3182 margin-top: 1em;
3183}
3184
3185#sync-error-panel-title,
3186#sync-start-panel-title {
cae267ab 3187 font-size: 120%;
45dc7657 3188 font-weight: bold;
cae267ab 3189 margin-bottom: 5px;
45dc7657
RK		 3190}
3191
3192#sync-start-panel-subtitle,
3193#sync-error-panel-subtitle {
3194 margin: 0;
3195}
3196
9abeb12c
RK		 3197/* Status panel */
3198
3199.statuspanel-label {
3200 margin: 0;
3201 padding: 2px 4px;
38cfeb47 3202 background: #404000;
9abeb12c
RK		 3203 border: 1px none #9C9CFF;
3204 border-top-style: solid;
3205 color: #FF9F00;
3206 text-shadow: none;
3207}
3208
3209.statuspanel-label:-moz-locale-dir(ltr):not([mirror]),
3210.statuspanel-label:-moz-locale-dir(rtl)[mirror] {
3211 border-right-style: solid;
3212 border-top-right-radius: .3em;
3213 margin-right: 1em;
3214}
3215
3216.statuspanel-label:-moz-locale-dir(rtl):not([mirror]),
3217.statuspanel-label:-moz-locale-dir(ltr)[mirror] {
3218 border-left-style: solid;
3219 border-top-left-radius: .3em;
3220 margin-left: 1em;
3221}
3e6e0e5c
RK		 3222
3223/* HACK to abolish devily color on main content */
3224
3225#content {
3226 background-color: transparent !important;
3227}
dce90fef 3228
7600e0b1
RK		 3229/* === BEGIN highlighter.inc.css === */
3230
cae267ab
RK		 3231/* Box model highlighter */
3232svg|g.box-model-container {
3233 opacity: 0.4;
3234}
3235
3236svg|polygon.box-model-content {
3237 fill: #008484;
3238}
3239
3240svg|polygon.box-model-padding {
3241 fill: #9C9CFF;
3242}
3243
3244svg|polygon.box-model-border {
3245 fill: #FFCF00;
3246}
3247
3248svg|polygon.box-model-margin {
3249 fill: #A09090;
3250}
3251
3252svg|polygon.box-model-content,
3253svg|polygon.box-model-padding,
3254svg|polygon.box-model-border,
3255svg|polygon.box-model-margin {
3256 stroke: none;
3257}
dce90fef 3258
cae267ab
RK		 3259svg|line.box-model-guide-top,
3260svg|line.box-model-guide-right,
3261svg|line.box-model-guide-bottom,
3262svg|line.box-model-guide-left {
3263 stroke: #E7ADE7;
3264 stroke-dasharray: 5 3;
dce90fef
RK		 3265}
3266
8ad8bf83
RK		 3267/* Highlighter - Node Infobar */
3268
0142a07b 3269.highlighter-nodeinfobar {
a40f6a79 3270 color: #FF9F00;
a40f6a79
RK		 3271 border-radius: 3px;
3272 background-color: #000000;
3273 background-clip: padding-box;
1bf116f8
RK		 3274 border: 1px solid #008484;
3275 padding: 5px;
3276 /* Avoid cases where the infobar is smaller than the arrow, when the text is
3277 short */
3278 min-width: 75px;
a40f6a79
RK		 3279}
3280
8ad8bf83
RK		 3281/* Highlighter - Node Infobar - text */
3282
0142a07b 3283.highlighter-nodeinfobar-text {
45dc7657 3284 text-align: center;
a40f6a79 3285 /* 100% - size of the buttons and margins */
c29b709d 3286 max-width: calc(100% - 2 * (26px + 6px));
a40f6a79
RK		 3287 padding-bottom: 1px;
3288}
3289
0142a07b 3290html|*.highlighter-nodeinfobar-tagname {
8ad8bf83
RK		 3291 color: #FFCF00;
3292}
3293
0142a07b 3294html|*.highlighter-nodeinfobar-id {
8ad8bf83
RK		 3295 color: #9C9CFF;
3296}
3297
0142a07b 3298html|*.highlighter-nodeinfobar-pseudo-classes {
eec397be 3299 color: #FF9F00;
8ad8bf83
RK		 3300}
3301
a40f6a79
RK		 3302/* Highlighter - Node Infobar - box & arrow */
3303
8ad8bf83
RK		 3304.highlighter-nodeinfobar-arrow {
3305 width: 14px;
3306 height: 14px;
c29b709d 3307 -moz-margin-start: calc(50% - 7px);
71a617ff 3308 transform: rotate(-45deg);
8ad8bf83
RK		 3309 background-clip: padding-box;
3310 background-repeat: no-repeat;
3311}
3312
0142a07b 3313.highlighter-nodeinfobar-arrow-top {
8ad8bf83
RK		 3314 margin-bottom: -8px;
3315 margin-top: 8px;
fcaeefc2 3316 background-image: linear-gradient(to bottom left, transparent 50%, rgb(0, 132, 132) 50%);
8ad8bf83
RK		 3317}
3318
0142a07b 3319.highlighter-nodeinfobar-arrow-bottom {
8ad8bf83
RK		 3320 margin-top: -8px;
3321 margin-bottom: 8px;
fcaeefc2 3322 background-image: linear-gradient(to top right, transparent 50%, rgb(0, 132, 132) 50%);
8ad8bf83
RK		 3323}
3324
0142a07b 3325.highlighter-nodeinfobar-container[hide-arrow] > .highlighter-nodeinfobar {
8ad8bf83
RK		 3326 margin: 7px 0;
3327}
3328
7600e0b1
RK		 3329/* === END highlighter.inc.css === */
3330
8ad8bf83
RK		 3331#full-screen-warning-message {
3332 background-color: #000000;
3333 color: #FF9F00;
8ad8bf83
RK		 3334 border-radius: 8px;
3335 margin-top: 30px;
3336 padding: 30px 50px;
3337 box-shadow: 0 0 2px #9C9CFF;
3338}
3339
3340#full-screen-warning-container[obscure-browser] {
85cfb236
RK		 3341 background-color: rgba(0,0,0,0.3);
3342}
3343
3344.full-screen-description {
3345 font-size: 150%;
3346}
3347
3348#full-screen-domain-text {
3349 font-size: 300%;
8ad8bf83
RK		 3350}
3351
85cfb236
RK		 3352.full-screen-approval-button,
3353#full-screen-remember-decision {
3354 font-size: 120%;
8ad8bf83
RK		 3355}
3356
b27cc46e
RK		 3357/* === BEGIN commandline.inc.css === */
3358
3359/* Developer toolbar */
3360
3361#developer-toolbar {
3362 border-top: 3px solid #000000;
3363 border-bottom: none;
3364}
3365
3366#developer-toolbar .toolbar-holder {
3367 background-color: #8050B0;
3368 color: #FFCF00;
3369}
3370
3371#developer-toolbar .toolbar-holder {
3372 background-color: #8050B0;
3373 color: #FFCF00;
3374}
3375
3376#developer-toolbar .toolbar-startcap,
3377#developer-toolbar .toolbar-endcap{
3378 background-color: #6000CF;
3379}
3380
3381#developer-toolbar {
3382/* padding: 0;
3383 min-height: 32px; */
3384}
3385
de57e474 3386#developer-toolbar > toolbarbutton {
b27cc46e
RK		 3387/* margin: 0;
3388 padding: 0 10px;
3389 width: 32px; */
3390}
3391
3392.developer-toolbar-button > image {
3393/* margin: auto 10px; */
3394}
3395
fe524e0c
RK		 3396#developer-toolbar-toolbox-button > label {
3397 display: none;
3398}
3399
b27cc46e
RK		 3400#developer-toolbar-toolbox-button {
3401 list-style-image: url("chrome://browser/skin/devtools/toggle-tools.png");
3402 -moz-image-region: rect(0px, 16px, 16px, 0px);
3403}
3404
3405#developer-toolbar-toolbox-button > label {
3406 display: none;
3407}
3408
3409#developer-toolbar-toolbox-button:hover,
3410#developer-toolbar-toolbox-button:hover:active,
3411#developer-toolbar-toolbox-button[checked=true] {
3412 -moz-image-region: rect(0px, 32px, 16px, 16px);
3413}
3414
de57e474
RK		 3415#developer-toolbar-closebutton {
3416 list-style-image: url("chrome://browser/skin/devtools/close.png");
3417 -moz-image-region: rect(0px, 16px, 16px, 0px);
3418 min-width: 16px;
3419 width: 16px;
3420}
3421
3422#developer-toolbar-closebutton > .toolbarbutton-icon {
3423}
3424
3425#developer-toolbar-closebutton > .toolbarbutton-text {
3426 display: none;
3427}
3428
3429#developer-toolbar-closebutton:hover,
3430#developer-toolbar-closebutton:hover:active {
3431 -moz-image-region: rect(0px, 32px, 16px, 16px);
3432}
3433
b27cc46e
RK		 3434/* GCLI */
3435
37953ab4
RK		 3436html|*#gcli-tooltip-frame,
3437html|*#gcli-output-frame {
85cfb236 3438 padding: 0;
37953ab4
RK		 3439 border-width: 0;
3440 background-color: transparent;
3441}
3442
3443#gcli-output,
3444#gcli-tooltip {
3445 border-width: 0;
3446 background-color: transparent;
85cfb236
RK		 3447}
3448
3449.gclitoolbar-input-node,
b27cc46e 3450.gclitoolbar-complete-node {
37953ab4
RK		 3451 margin: 1px 3px;
3452 -moz-box-align: center;
3453 padding-top: 0;
3454 padding-bottom: 0;
b27cc46e 3455 padding-right: 8px;
37953ab4 3456 background-color: transparent;
85cfb236
RK		 3457}
3458
3459.gclitoolbar-input-node {
37953ab4 3460 padding-left: 20px;
b27cc46e
RK		 3461/* line-height: 32px;
3462 outline-style: none; */
3463 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 16, 16, 0);
de57e474
RK		 3464 background-repeat: no-repeat;
3465 background-color: rgba(0, 0, 0, .75);
b27cc46e
RK		 3466}
3467
3468.gclitoolbar-input-node[focused="true"] {
3469 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16);
de57e474 3470 background-color: #000000;
37953ab4
RK		 3471}
3472
3473.gclitoolbar-input-node:not([focused="true"]) {
3474 border-color: transparent;
85cfb236
RK		 3475}
3476
7bc075b6
RK		 3477.gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection {
3478 background-color: #008484;
3479 color: #000000;
3480 text-shadow: none;
3481}
3482
85cfb236 3483.gclitoolbar-complete-node {
37953ab4 3484 padding-left: 21px;
85cfb236
RK		 3485 background-color: transparent;
3486 color: transparent;
b27cc46e
RK		 3487 z-index: 100;
3488 pointer-events: none;
85cfb236
RK		 3489}
3490
85cfb236
RK		 3491.gcli-in-incomplete,
3492.gcli-in-error,
3493.gcli-in-ontab,
3494.gcli-in-todo,
3495.gcli-in-closebrace,
3496.gcli-in-param,
3497.gcli-in-valid {
3498 margin: 0;
3499 padding: 0;
3500}
3501
3502.gcli-in-incomplete {
3503 border-bottom: 2px dotted #8050B0;
3504}
3505
3506.gcli-in-error {
3507 border-bottom: 2px dotted #FF0000;
3508}
3509
3510.gcli-in-ontab {
3511 color: #9C9CFF;
3512}
3513
3514.gcli-in-todo {
3515 color: #795900;
3516}
3517
3518.gcli-in-closebrace {
3519 color: #8050B0;
3520}
3521
b27cc46e
RK		 3522/* === END commandline.inc.css === */
3523
fe524e0c
RK		 3524/* === BEGIN responsivedesign.inc.css === */
3525
37953ab4 3526/* Responsive Mode */
85cfb236 3527
7bc075b6
RK		 3528.browserContainer[responsivemode] {
3529 background: #221500 url("chrome://browser/skin/devtools/responsive-background.png");
37953ab4
RK		 3530 padding: 0 20px 20px 20px;
3531}
3532
7bc075b6 3533.browserStack[responsivemode] {
37953ab4
RK		 3534 box-shadow: 0 0 7px #9C9CFF;
3535}
3536
3537.devtools-responsiveui-toolbar {
3538 background: transparent;
d2ce251d
RK		 3539 /* text color is textColor from dark theme, since no theme is applied to
3540 * the responsive toolbar.
3541 */
3542 color: #FF9F00;
37953ab4
RK		 3543 margin: 10px 0;
3544 padding: 0;
3545 box-shadow: none;
3546 border-bottom-width: 0;
3547}
3548
de57e474
RK		 3549.devtools-responsiveui-menulist,
3550.devtools-responsiveui-toolbarbutton {
3551 -moz-box-align: center;
3552 min-width: 32px;
3553/* min-height: 22px;*/
3554/* margin: 0 3px; */
3555}
3556
3557.devtools-responsiveui-toolbarbutton > .toolbarbutton-menubutton-button {
3558 -moz-box-orient: horizontal;
3559}
3560
3561.devtools-responsiveui-menulist:-moz-focusring,
3562.devtools-responsiveui-toolbarbutton:-moz-focusring {
3563/* outline: 1px dotted hsla(210,30%,85%,0.7);
3564 outline-offset: -4px;*/
3565}
3566
3567.devtools-responsiveui-toolbarbutton:not([label]) > .toolbarbutton-text {
3568 display: none;
3569}
3570
3571.devtools-responsiveui-toolbarbutton:not([checked=true]):hover:active {
3572/* border-color: hsla(210,8%,5%,.6);
3573 background: linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
3574 box-shadow: 0 0 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15); */
3575}
3576
3577.devtools-responsiveui-menulist[open=true],
3578.devtools-responsiveui-toolbarbutton[open=true],
3579.devtools-responsiveui-toolbarbutton[checked=true] {
3580/* border-color: hsla(210,8%,5%,.6) !important;
3581 background: linear-gradient(hsla(220,6%,10%,.6), hsla(210,11%,18%,.45) 75%, hsla(210,11%,30%,.4));
3582 box-shadow: 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15); */
3583}
3584
3585.devtools-responsiveui-toolbarbutton[checked=true] {
3586/* color: hsl(208,100%,60%); */
3587}
3588
3589.devtools-responsiveui-toolbarbutton[checked=true]:hover {
3590/* background-color: transparent !important;*/
3591}
3592
3593.devtools-responsiveui-toolbarbutton[checked=true]:hover:active {
3594/* background-color: hsla(210,8%,5%,.2) !important;*/
3595}
3596
3597.devtools-responsiveui-menulist > .menulist-label-box {
3598 text-align: center;
3599}
3600
3601.devtools-responsiveui-menulist > .menulist-dropmarker {
3602/* display: -moz-box;
3603 background-color: transparent;
3604 list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
3605 -moz-box-align: center;
3606 border-width: 0;
3607 min-width: 16px;*/
3608}
3609
3610.devtools-responsiveui-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-button {
3611/* color: inherit;
3612 border-width: 0;
3613 -moz-border-end: 1px solid hsla(210,8%,5%,.45);
3614 box-shadow: -1px 0 0 hsla(210,16%,76%,.15) inset, 1px 0 0 hsla(210,16%,76%,.15);*/
3615}
3616
3617.devtools-responsiveui-toolbarbutton[type=menu-button]:-moz-locale-dir(rtl) > .toolbarbutton-menubutton-button {
3618/* box-shadow: 1px 0 0 hsla(210,16%,76%,.15) inset, -1px 0 0 hsla(210,16%,76%,.15);*/
3619}
3620
3621.devtools-responsiveui-toolbarbutton[type=menu-button] {
3622/* padding: 0 1px;*/
3623 -moz-box-align: stretch;
3624}
3625
3626.devtools-responsiveui-toolbarbutton[type=menu] > .toolbarbutton-menu-dropmarker,
3627.devtools-responsiveui-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-dropmarker {
3628/* list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
3629 -moz-box-align: center;
3630 padding: 0 3px;*/
37953ab4
RK		 3631}
3632
3633.devtools-responsiveui-toolbar:-moz-locale-dir(ltr) > *:first-child,
3634.devtools-responsiveui-toolbar:-moz-locale-dir(rtl) > *:last-child {
fe524e0c
RK		 3635 margin-left: 3px;
3636}
3637
3638.devtools-responsiveui-close {
3639 list-style-image: url("chrome://browser/skin/devtools/close.png");
3640 -moz-image-region: rect(0px,16px,16px,0px);
3641}
3642
3643.devtools-responsiveui-close:hover {
3644 -moz-image-region: rect(0px,32px,16px,16px);
3645}
3646
3647.devtools-responsiveui-rotate {
3648 list-style-image: url("chrome://browser/skin/devtools/responsiveui-rotate.png");
3649 -moz-image-region: rect(0px,16px,16px,0px);
3650}
3651
3652.devtools-responsiveui-rotate:hover {
3653 -moz-image-region: rect(0px,32px,16px,16px);
3654}
3655
3656.devtools-responsiveui-touch {
3657 list-style-image: url("chrome://browser/skin/devtools/responsiveui-touch.png");
3658 -moz-image-region: rect(0px,16px,16px,0px);
3659}
3660
3661.devtools-responsiveui-touch:hover,
3662.devtools-responsiveui-touch[checked],
3663.devtools-responsiveui-touch[checked]:hover {
3664 -moz-image-region: rect(0px,32px,16px,16px);
3665}
3666
3667.devtools-responsiveui-screenshot {
3668 list-style-image: url("chrome://browser/skin/devtools/responsiveui-screenshot.png");
3669 -moz-image-region: rect(0px,16px,16px,0px);
3670}
3671
3672.devtools-responsiveui-screenshot:hover {
3673 -moz-image-region: rect(0px,32px,16px,16px);
37953ab4
RK		 3674}
3675
fe524e0c 3676.devtools-responsiveui-resizebarV {
37953ab4
RK		 3677 width: 7px;
3678 height: 24px;
3679 cursor: ew-resize;
71a617ff 3680 transform: translate(12px, -12px);
37953ab4
RK		 3681 background-image: url("chrome://browser/skin/devtools/responsive-vertical-resizer.png");
3682}
3683
fe524e0c
RK		 3684.devtools-responsiveui-resizebarH {
3685 width: 24px;
3686 height: 7px;
3687 cursor: ns-resize;
3688 transform: translate(-12px, 12px);
3689 background-image: url("chrome://browser/skin/devtools/responsive-horizontal-resizer.png");
3690}
3691
37953ab4
RK		 3692.devtools-responsiveui-resizehandle {
3693 width: 16px;
3694 height: 16px;
3695 cursor: se-resize;
71a617ff 3696 transform: translate(12px, 12px);
37953ab4 3697 background-image: url("chrome://browser/skin/devtools/responsive-se-resizer.png");
8d7ef0d9 3698}
889649fd 3699
fe524e0c 3700/* === END responsivedesign.inc.css === */
fcaeefc2
RK		 3701
3702/* === including indicator.css is done at the start of the file === */
fe524e0c 3703
889649fd
RK		 3704/* Error counter */
3705
0142a07b 3706#developer-toolbar-toolbox-button[error-count]:before {
889649fd
RK		 3707 color: #000000;
3708 min-width: 16px;
3709 text-shadow: none;
3710 background-color: #FF0000;
3711 border-radius: 1px;
c29b709d 3712 -moz-margin-end: 5px;
c54ac991 3713}
e9c73590 3714
348c0499 3715/* Social toolbar item */
e9c73590 3716
0142a07b
RK		 3717#social-provider-button {
3718 -moz-image-region: rect(0, 16px, 16px, 0);
a6757852 3719 list-style-image: url("chrome://browser/skin/social/services-16.png");
0142a07b
RK		 3720}
3721
348c0499
RK		 3722#social-provider-button > .toolbarbutton-menu-dropmarker {
3723 display: none;
e9c73590
RK		 3724}
3725
82b4252f
RK		 3726.toolbarbutton-badge-container {
3727 margin: 0;
3728 padding: 0;
3729 position: relative;
e9c73590
RK		 3730}
3731
c0f6797e 3732#nav-bar .toolbarbutton-1 > .toolbarbutton-badge-container {
ed1a91c6 3733 padding: 2px 2px;
82b4252f
RK		 3734}
3735
3736.toolbarbutton-1 > .toolbarbutton-badge-container > .toolbar-icon {
3737 position: absolute;
3738 top: 2px;
3739 right: 2px;
3740}
3741
3742.toolbarbutton-badge-container > .toolbarbutton-icon[label]:not([label=""]) {
3743 -moz-margin-end: 0;
e9c73590
RK		 3744}
3745
82b4252f
RK		 3746.toolbarbutton-badge[badge=""] {
3747 display: none;
3748}
3749.toolbarbutton-badge[badge]:not([badge=""])::after {
6adbc9a6 3750 /* The |content| property is set in the content stylesheet. */
348c0499
RK		 3751 font-size: 9px;
3752 font-weight: bold;
3753 padding: 0 1px;
3754 color: #FF9F00;
3755 background-color: #000000;
3756 border: 1px solid #9C9CFF;
3757 border-radius: 2px;
6adbc9a6 3758 position: absolute;
82b4252f
RK		 3759 top: 0;
3760 right: 0;
3761}
3762
c0f6797e 3763#nav-bar *|* > .toolbarbutton-badge[badge]:not([badge=""])::after {
82b4252f
RK		 3764 top: 1px;
3765 right: 1px;
e9c73590
RK		 3766}
3767
82b4252f
RK		 3768.toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
3769 left: 0;
3770 right: auto;
e9c73590
RK		 3771}
3772
c0f6797e 3773#nav-bar *|* > .toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
82b4252f 3774 left: 1px;
6adbc9a6 3775 right: auto;
348c0499
RK		 3776}
3777
3778#social-notification-icon-mentions {
e9c73590 3779 background-color: #000000;
348c0499
RK		 3780 border-radius: 3px;
3781 -moz-margin-start: 2px;
e9c73590
RK		 3782}
3783
348c0499
RK		 3784#social-notification-icon-mentions:hover {
3785 background-color: #FFCF00;
3786}
3787
3788#social-notification-icon-mentions[open="true"] {
3789 background-color: #FF9F00;
e9c73590
RK		 3790}
3791
3792#social-sidebar-splitter {
3793 border: 0;
3794}
3795
ed1a91c6
RK		 3796.popup-notification-icon[popupid="servicesInstall"] {
3797 list-style-image: url("chrome://browser/skin/social/services-64.png");
3798}
3799#servicesInstall-notification-icon {
3800 list-style-image: url("chrome://browser/skin/social/services-16.png");
3801}
c1d2ce3e 3802#social-undoactivation-button {
ed1a91c6
RK		 3803 -moz-margin-start: 0; /* override default label margin to match description margin */
3804}
3805
3806#socialActivatedNotification .popup-notification-button-container {
3807 margin-left: 6px;
3808}
3809
3810.social-activation-icon {
3811 width: auto;
3812 height: auto;
3813 max-height: 64px;
3814 max-width: 64px;
3815}
3816
3817#social-activation-message {
3818 max-width: 250px;
3819}
3820
3821#social-activation-message > label {
3822 margin: 0;
3823}
3824
e9c73590 3825/* social toolbar provider menu */
990cba4b 3826.social-statusarea-popup {
e9c73590
RK		 3827 margin-top: 0;
3828 margin-left: -12px;
3829 margin-right: -12px;
3830}
3831
990cba4b 3832.social-statusarea-user {
e9c73590
RK		 3833 border-bottom: 1px solid #9C9CFF;
3834 background-color: #000000;
3835 color: #FF9F00;
3836 position: relative;
348c0499 3837 cursor: pointer;
e9c73590
RK		 3838}
3839
990cba4b 3840.social-statusarea-user-portrait {
e9c73590
RK		 3841 width: 32px;
3842 height: 32px;
3843 border-radius: 2px;
3844 margin: 10px;
e9c73590
RK		 3845}
3846
990cba4b 3847.social-statusarea-loggedInStatus {
e9c73590
RK		 3848 background: transparent;
3849 border: none;
b8384c33 3850 color: #3333FF;
e9c73590
RK		 3851 min-width: 0;
3852 margin: 0 6px;
348c0499 3853 list-style-image: none;
e9c73590 3854}
90a244b7 3855
990cba4b 3856#social-statusarea-user[_moz-menuactive] > vbox > .social-statusarea-loggedInStatus {
e9c73590
RK		 3857 text-decoration: underline;
3858}
3859
348c0499
RK		 3860.social-panel > .panel-arrowcontainer > .panel-arrowcontent {
3861 padding: 0;
3862}
3863
348c0499
RK		 3864.social-panel-frame {
3865 border-radius: inherit;
3866}
e9c73590 3867
e7c8bab1
RK		 3868/* === BEGIN chat.inc.css === */
3869
dfa34f73
RK		 3870#social-sidebar-header {
3871 padding: 3px;
3872}
3873
3874#social-sidebar-button {
3875 -moz-appearance: none;
3876 list-style-image: url("chrome://browser/skin/social/gear_default.png");
45dc7657 3877 border: none;
dfa34f73
RK		 3878 padding: 0;
3879 margin: 2px;
3880}
45dc7657
RK		 3881#social-sidebar-button > .toolbarbutton-icon {
3882 min-height: 16px;
3883 min-width: 16px;
3884}
dfa34f73
RK		 3885#social-sidebar-button:hover,
3886#social-sidebar-button:hover:active {
3887 list-style-image: url("chrome://browser/skin/social/gear_clicked.png");
3888}
3889#social-sidebar-button > .toolbarbutton-menu-dropmarker {
3890 display: none;
3891}
3892
3893#social-sidebar-button[loading="true"] {
3894 list-style-image: url("chrome://global/skin/icons/loading.gif");
3895}
3896
3897#social-sidebar-favico {
3898 max-height: 16px;
3899 max-width: 16px;
3900 padding: 0;
3901 margin: 2px;
3902}
3903
e9c73590
RK		 3904.chat-status-icon {
3905 max-height: 16px;
3906 max-width: 16px;
3907 padding: 0;
3908}
3909
3910.chat-toolbarbutton {
3911 -moz-appearance: none;
3912 border: none;
3913 padding: 0;
3914 margin: 0;
3915 background: none;
b27cc46e 3916 width: 16px;
e9c73590
RK		 3917}
3918
3919.chat-toolbarbutton > .toolbarbutton-text {
3920 display: none;
3921}
3922
b27cc46e
RK		 3923.chat-toolbarbutton > .toolbarbutton-icon {
3924 width: inherit;
3925}
3926
e7c8bab1
RK		 3927.chat-toolbarbutton.notification-anchor-icon > .toolbarbutton-icon {
3928 width: inherit;
3929 margin-top: -2px;
3930}
3931
e9c73590 3932.chat-close-button {
e2734cc7 3933 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 3934 -moz-image-region: rect(0, 16px, 16px, 0);
e9c73590
RK		 3935}
3936
3937.chat-close-button:hover,
3938.chat-close-button:hover:active {
b27cc46e 3939 -moz-image-region: rect(0, 32px, 16px, 16px);
e9c73590
RK		 3940}
3941
e2734cc7
RK		 3942.chat-minimize-button {
3943 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 3944 -moz-image-region: rect(16px, 16px, 32px, 0);
e2734cc7
RK		 3945}
3946
3947.chat-minimize-button:hover:active,
3948.chat-minimize-button:hover {
b27cc46e 3949 -moz-image-region: rect(16px, 32px, 32px, 16px);
e2734cc7
RK		 3950}
3951
3952.chat-swap-button {
3953 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 3954 -moz-image-region: rect(48px, 16px, 64px, 0);
e2734cc7
RK		 3955}
3956
3957.chat-swap-button:hover:active,
3958.chat-swap-button:hover {
b27cc46e 3959 -moz-image-region: rect(48px, 32px, 64px, 16px);
e2734cc7
RK		 3960}
3961
3962chatbar > chatbox > .chat-titlebar > .chat-swap-button {
3963 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 3964 -moz-image-region: rect(32px, 16px, 48px, 0);
e2734cc7
RK		 3965}
3966
3967chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover:active,
3968chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover {
b27cc46e 3969 -moz-image-region: rect(32px, 32px, 48px, 16px);
e2734cc7
RK		 3970}
3971
e9c73590
RK		 3972.chat-title {
3973 font-weight: bold;
3974 font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
90a244b7 3975 text-shadow: none;
348c0499 3976 cursor: inherit;
e9c73590
RK		 3977}
3978
3979.chat-titlebar {
3980 background-color: #9C9CFF;
3981 color: #000000;
3982 height: 20px;
fcfb76ce 3983 min-height: 16px;
e9c73590
RK		 3984 width: 100%;
3985 margin: 0;
3986 padding: 2px;
348c0499 3987 -moz-padding-start: 6px;
e9c73590
RK		 3988 border: none;
3989 border-bottom: 1px solid #008484;
348c0499 3990 cursor: pointer;
e9c73590
RK		 3991}
3992
e2734cc7
RK		 3993.chat-titlebar > .notification-anchor-icon {
3994 margin-left: 2px;
3995 margin-right: 2px;
3996}
3997
e9c73590
RK		 3998.chat-titlebar[minimized="true"] {
3999 border-bottom: none;
4000}
4001
348c0499
RK		 4002.chat-titlebar[selected] {
4003 background-color: #008484;
4004}
4005
4006.chat-titlebar[activity] {
4007 background-color: #E7ADE7;
4008}
4009
e9c73590
RK		 4010.chat-frame {
4011 padding: 0;
4012 margin: 0;
4013 overflow: hidden;
4014}
4015
4016.chatbar-button {
ed1a91c6 4017 list-style-image: url("chrome://browser/skin/social/services-16.png");
e9c73590
RK		 4018 background-color: #000000;
4019 border: none;
4020 margin: 0;
4021 padding: 2px;
4022 height: 21px;
4023 width: 21px;
4024 border-top: 1px solid #008484;
4025 -moz-border-end: 1px solid #008484;
4026}
4027
ed1a91c6
RK		 4028@media (min-resolution: 2dppx) {
4029 .chatbar-button {
4030 list-style-image: url("chrome://browser/skin/social/services-16@2x.png");
4031 }
4032}
4033
fe524e0c
RK		 4034.chatbar-button > .toolbarbutton-icon {
4035 width: 16px;
4036}
4037
d7cfd768
RK		 4038.chatbar-button > menupopup > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon {
4039 width: auto;
4040 height: auto;
e9c73590
RK		 4041 max-height: 16px;
4042 max-width: 16px;
e9c73590
RK		 4043}
4044
90a244b7
RK		 4045.chatbar-button > .toolbarbutton-icon {
4046 opacity: .6;
4047 -moz-margin-end: 0;
4048}
4049.chatbar-button:hover > .toolbarbutton-icon,
4050.chatbar-button[open="true"] > .toolbarbutton-icon {
4051 opacity: 1;
4052}
4053
a6757852 4054.chatbar-button:hover,
90a244b7 4055.chatbar-button[open="true"] {
e9c73590
RK		 4056}
4057
e9c73590
RK		 4058.chatbar-button > .toolbarbutton-text,
4059.chatbar-button > .toolbarbutton-menu-dropmarker {
4060 display: none;
4061}
4062
90a244b7 4063.chatbar-button[activity]:not([open="true"]) {
348c0499
RK		 4064 background-color: #E7ADE7;
4065}
4066
4067.chatbar-button > menupopup > menuitem[activity] {
4068 font-weight: bold;
4069}
4070
e9c73590
RK		 4071.chatbar-innerbox {
4072 background: transparent;
90a244b7 4073 margin: -285px 0 0;
e9c73590
RK		 4074 overflow: hidden;
4075}
4076
fcfb76ce
RK		 4077chatbar {
4078 -moz-margin-end: 20px;
4079}
4080
e9c73590 4081chatbar > chatbox {
fcfb76ce
RK		 4082 height: 285px;
4083 width: 260px;
4084 -moz-margin-start: 4px;
e9c73590
RK		 4085 background-color: #000000;
4086 border: 1px solid #9C9CFF;
4087 border-bottom: none;
90a244b7
RK		 4088 border-top-left-radius: 2.5px;
4089 border-top-right-radius: 2.5px;
e9c73590
RK		 4090}
4091
fcfb76ce
RK		 4092chatbox[minimized="true"] {
4093 width: 160px;
e9c73590 4094 height: 20px;
e9c73590 4095}
348c0499 4096
e2734cc7
RK		 4097window > chatbox {
4098 -moz-margin-start: 0px;
4099 margin: 0px;
4100 border: none;
4101 padding: 0px;
4102}
4103
e7c8bab1
RK		 4104/* === END chat.inc.css === */
4105
c0f6797e
RK		 4106.chat-titlebar {
4107/* background-color: #c4cfde; */
4108}
4109
4110.chat-titlebar[selected] {
4111/* background-color: #dae3f0; */
4112}
4113
4114.chatbar-button {
4115 -moz-appearance: none;
4116/* background-color: #c4cfde; */
4117}
4118
4119.chatbar-button > .toolbarbutton-icon {
4120/* -moz-margin-end: 0; */
4121}
4122
4123.chatbar-button:hover,
4124.chatbar-button[open="true"] {
4125/* background-color: #dae3f0; */
4126}
4127
4128.chatbar-button[activity]:not([open="true"]) {
4129}
4130
4131chatbox {
4132/* border-top-left-radius: 2.5px;
4133 border-top-right-radius: 2.5px; */
4134}
4135
b27cc46e 4136/* === BEGIN plugin-doorhanger.inc.css === */
348c0499 4137
b27cc46e
RK		 4138/**
4139 * Plugin Doorhanger Styles
4140 */
348c0499 4141
b27cc46e 4142#notification-popup[popupid="click-to-play-plugins"] > .panel-arrowcontainer > .panel-arrowcontent {
1e32332f 4143 padding: 6px 1px 2px;
348c0499
RK		 4144}
4145
348c0499 4146.click-to-play-plugins-notification-center-box {
348c0499
RK		 4147}
4148
fe524e0c
RK		 4149.plugin-popupnotification-centeritem:nth-child(odd) {
4150/* background-color: rgba(0,0,0,0.1);*/
348c0499
RK		 4151}
4152
b27cc46e
RK		 4153.center-item-label {
4154 margin-bottom: 0;
4155 text-overflow: ellipsis;
348c0499
RK		 4156}
4157
b27cc46e
RK		 4158.center-item-warning-icon {
4159 background-image: url("chrome://mozapps/skin/extensions/alerticon-info-negative.png");
348c0499 4160 background-repeat: no-repeat;
348c0499 4161 width: 16px;
b27cc46e
RK		 4162 height: 15px;
4163 -moz-margin-start: 6px;
348c0499
RK		 4164}
4165
b27cc46e 4166.click-to-play-plugins-notification-button-container {
348c0499
RK		 4167}
4168
b27cc46e
RK		 4169.click-to-play-popup-button {
4170 width: 50%;
348c0499
RK		 4171}
4172
b27cc46e 4173.click-to-play-plugins-notification-description-box {
1e32332f
RK		 4174 margin-left: 5px;
4175 margin-right: 5px;
4176 margin-top: 0;
4177 padding-bottom: 3px;
348c0499
RK		 4178}
4179
b27cc46e 4180.click-to-play-plugins-outer-description {
1e32332f 4181 margin-top: 1px;
348c0499
RK		 4182}
4183
b27cc46e
RK		 4184.click-to-play-plugins-notification-link,
4185.center-item-link {
4186 margin: 0;
348c0499
RK		 4187}
4188
2c225fcb
RK		 4189.messageImage[value="plugin-hidden"] {
4190 list-style-image: url("chrome://browser/skin/notification-pluginNormal.png");
4191}
4192
4193/* Keep any changes to this style in sync with pluginProblem.css */
4194notification.pluginVulnerable {
4195}
4196
4197notification.pluginVulnerable .messageImage {
4198 list-style-image: url("chrome://browser/skin/notification-pluginBlocked.png");
4199}
4200
b27cc46e 4201/* === END plugin-doorhanger.inc.css === */
0142a07b 4202
43cc2806
RK		 4203/* === BEGIN customizeMode.inc.css === */
4204
4205/* Customization mode */
e28f3f71 4206
5401f433
RK		 4207#main-window:-moz-any([customize-entering],[customize-entered]) #browser-bottombox {
4208 margin-bottom: 1em;
e28f3f71
RK		 4209}
4210
5401f433
RK		 4211#main-window:-moz-any([customize-entering],[customize-entered]) #content-deck,
4212#main-window:-moz-any([customize-entering],[customize-entered]) #browser-bottombox,
e28f3f71
RK		 4213#main-window:-moz-any([customize-entering],[customize-entered]) #navigator-toolbox {
4214 margin-left: 1em;
4215 margin-right: 1em;
43cc2806
RK		 4216}
4217
e28f3f71
RK		 4218#main-window:-moz-any([customize-entering],[customize-exiting]) #tab-view-deck {
4219 pointer-events: none;
4220}
4221
4222#main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar))::before,
43cc2806 4223#PanelUI-contents > .panel-customization-placeholder {
e28f3f71 4224 -moz-outline-radius: 2.5px;
43cc2806
RK		 4225 outline: 1px dashed transparent;
4226}
4227
e28f3f71
RK		 4228#main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar))::before {
4229 /* Prevent jumping of tabs when switching a window between inactive and active (bug 853415). */
4230 -moz-box-ordinal-group: 0;
4231 content: "";
4232 display: -moz-box;
4233 height: 100%;
4234 left: 0;
4235 outline-offset: -2px;
4236 pointer-events: none;
4237 position: absolute;
4238 top: 0;
4239 width: 100%;
4240}
4241
4242/* Shift the TabsToolbar outline up 2px since the #nav-bar is shifted up by 1px and the
4243 #TabsToolbar::after is a pixel higher to draw the bottom border of the tabstrip so this makes the
4244 offset from the bottom effectively the same as other targets (-2px). */
4245#main-window[customize-entered] #TabsToolbar.customization-target::before {
e20c83c3 4246/* top: -2px;*/
e28f3f71
RK		 4247}
4248
4249/* The parents of the outline pseudo-elements need to be positioned so that the outline is positioned relative to it. */
4250#main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar)):hover,
4251#main-window[customize-entered] .customization-target[customizing-dragovertarget]:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar)),
4252#main-window[customize-entered] #nav-bar-customization-target.customization-target {
4253 position: relative;
4254}
4255
4256/* Most target outlines are shown on hover and drag over but the panel menu uses
4257 placeholders instead. */
4258#main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar)):hover::before,
4259#main-window[customize-entered] .customization-target[customizing-dragovertarget]:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar))::before,
4260/* nav-bar and panel outlines are always shown */
4261#nav-bar[showoutline=true] > #nav-bar-customization-target.customization-target::before {
4262 outline-color: #A09090;
4263}
4264
4265#nav-bar[showoutline=true] > #nav-bar-customization-target.customization-target::before {
4266 transition: outline-color 250ms linear;
4267}
4268
4269#PanelUI-contents[showoutline=true] > .panel-customization-placeholder {
4270 transition: outline-color 250ms linear;
43cc2806
RK		 4271 outline-color: #9C9CFF;
4272}
4273
4274#PanelUI-contents > .panel-customization-placeholder {
4275 cursor: auto;
4276 outline-offset: -5px;
4277}
4278
e28f3f71 4279#main-window[customizing] .customization-target:not(#PanelUI-contents) {
43cc2806 4280 min-width: 100px;
e20c83c3
RK		 4281/* padding-left: 10px;
4282 padding-right: 10px;*/
4283}
4284
4285#main-window:-moz-any([customize-entering],[customize-entered]) #tab-view-deck {
4286 padding: 0 2em 2em;
43cc2806
RK		 4287}
4288
4289#customization-container {
4290 background-color: #000000;
4291}
4292
e28f3f71
RK		 4293#customization-palette,
4294#customization-empty {
4295 padding: 0 15px 15px;
43cc2806
RK		 4296}
4297
4298#customization-header {
4299 font-size: 1.5em;
4300 line-height: 1.5em;
4301 color: #9C9CFF;
4302 font-weight: lighter;
4303 margin-bottom: 1em;
e28f3f71 4304 padding: 15px 15px 0;
43cc2806
RK		 4305}
4306
4307#customization-panel-container {
e28f3f71
RK		 4308 padding: 10px 10px 0px;
4309}
4310
5401f433 4311#main-window:-moz-any([customize-entering],[customize-entered]) #browser-bottombox,
e28f3f71
RK		 4312#customization-footer {
4313 /*background-color: rgb(236,236,236);*/
5401f433
RK		 4314}
4315
4316#customization-footer {
e28f3f71
RK		 4317 border-top: 1px solid #9C9CFF;
4318 padding: 15px;
4319}
4320
4321.customizationmode-button {
4322 margin: 0;
4323}
4324
4325.customizationmode-button:hover {
4326}
4327
4328.customizationmode-button[disabled="true"] {
4329}
4330
4331#customization-titlebar-visibility-button {
4332 list-style-image: url("chrome://browser/skin/customizableui/customize-titleBar-toggle.png");
b7f3670c
RK		 4333 -moz-image-region: rect(0, 16px, 16px, 0);
4334 padding: 0px 5px;
e28f3f71
RK		 4335 -moz-margin-end: 10px;
4336}
4337
b7f3670c
RK		 4338#customization-titlebar-visibility-button:hover {
4339 -moz-image-region: rect(16px, 16px, 32px, 0);
4340}
4341
4342#customization-titlebar-visibility-button > .button-box {
4343 padding-top: 0;
4344 padding-bottom: 1px;
4345}
4346
4347#customization-titlebar-visibility-button:hover:active > .button-box {
4348 padding-top: 1px;
4349 padding-bottom: 0;
4350}
4351
e28f3f71
RK		 4352#customization-titlebar-visibility-button > .button-box > .button-text {
4353 /* Sadly, button.css thinks its margins are perfect for everyone. */
b7f3670c 4354 -moz-margin-start: 5px !important;
e28f3f71
RK		 4355}
4356
4357#customization-titlebar-visibility-button[checked] {
b7f3670c 4358 -moz-image-region: rect(0, 32px, 16px, 16px);
e28f3f71
RK		 4359 background-color: #008484;
4360}
4361
b7f3670c
RK		 4362#customization-titlebar-visibility-button[checked]:hover {
4363 -moz-image-region: rect(16px, 32px, 32px, 16px);
4364 background-color: #FFCF00;
4365}
4366
4367#customization-titlebar-visibility-button[checked]:hover:active {
4368 background-color: #FF9F00;
4369}
4370
e28f3f71
RK		 4371#customization-undo-reset-button {
4372 -moz-margin-end: 10px;
4373}
4374
4375#main-window[customize-entered] #customization-panel-container {
43cc2806
RK		 4376 background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png");
4377 background-position: left top;
4378 background-repeat: repeat;
4379 background-size: auto;
4380 background-attachment: fixed;
4381}
4382
e28f3f71
RK		 4383toolbarpaletteitem[place="toolbar"] {
4384 transition: border-width 250ms ease-in-out;
43cc2806
RK		 4385}
4386
4387toolbarpaletteitem[mousedown] {
4388 outline: 1px solid #008484;
4389 cursor: -moz-grabbing;
4390 opacity: 0.8;
4391}
4392
4393.panel-customization-placeholder,
4394toolbarpaletteitem[place="palette"],
4395toolbarpaletteitem[place="panel"] {
e28f3f71
RK		 4396 transition: transform .3s ease-in-out;
4397}
4398
4399#customization-palette {
4400 transition: opacity .3s ease-in-out;
4401 opacity: 0;
43cc2806
RK		 4402}
4403
e28f3f71
RK		 4404#customization-palette[showing="true"] {
4405 opacity: 1;
4406}
4407
4408toolbarpaletteitem[notransition].panel-customization-placeholder,
4409toolbarpaletteitem[notransition][place="toolbar"],
43cc2806
RK		 4410toolbarpaletteitem[notransition][place="palette"],
4411toolbarpaletteitem[notransition][place="panel"] {
e28f3f71 4412 transition: none;
43cc2806
RK		 4413}
4414
e28f3f71
RK		 4415toolbarpaletteitem > toolbarbutton > .toolbarbutton-icon,
4416toolbarpaletteitem > toolbaritem.panel-wide-item,
4417toolbarpaletteitem > toolbarbutton[type="menu-button"] {
4418 transition: transform .3s cubic-bezier(.6, 2, .75, 1.5) !important;
43cc2806
RK		 4419}
4420
4421toolbarpaletteitem[mousedown] > toolbarbutton > .toolbarbutton-icon {
e28f3f71
RK		 4422 transform: scale(1.3);
4423}
4424
4425toolbarpaletteitem[mousedown] > toolbaritem.panel-wide-item,
4426toolbarpaletteitem[mousedown] > toolbarbutton[type="menu-button"] {
43cc2806
RK		 4427 transform: scale(1.1);
4428}
4429
4430/* Override the toolkit styling for items being dragged over. */
4431toolbarpaletteitem[place="toolbar"] {
4432 border-left-width: 0;
4433 border-right-width: 0;
4434 margin-right: 0;
4435 margin-left: 0;
4436}
4437
4438#customization-palette:not([hidden]) {
4439 margin-bottom: 25px;
4440}
4441
43cc2806
RK		 4442#wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton,
4443#wrapper-edit-controls[place="palette"] > #edit-controls > separator,
e28f3f71
RK		 4444#wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton,
4445#wrapper-zoom-controls[place="palette"] > #zoom-controls > separator {
4446 margin-top: 20px;
43cc2806
RK		 4447}
4448
4449#wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton,
c0f6797e 4450#wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton {
43cc2806
RK		 4451 margin-left: 0;
4452 margin-right: 0;
e28f3f71
RK		 4453 max-width: 24px;
4454 min-width: 24px;
43cc2806 4455 max-height: 24px;
5401f433 4456 min-height: 24px;
e28f3f71 4457 padding: 4px;
43cc2806
RK		 4458}
4459
e28f3f71
RK		 4460#wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton > .toolbarbutton-icon,
4461#wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton > .toolbarbutton-icon {
4462 width: 16px;
43cc2806
RK		 4463}
4464
e28f3f71
RK		 4465#wrapper-edit-controls > #edit-controls > toolbarbutton > .toolbarbutton-icon {
4466 opacity: 1; /* To ensure these buttons always look enabled in customize mode */
4467}
4468
c0f6797e
RK		 4469#wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-reset-button,
4470#wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-reset-button + separator {
e28f3f71
RK		 4471 display: none;
4472}
4473
4474#wrapper-personal-bookmarks:not([place="toolbar"]) > #personal-bookmarks {
4475 -moz-box-pack: center;
4476 min-height: 48px;
43cc2806
RK		 4477}
4478
4479#customization-palette > toolbarpaletteitem > label {
4480 text-align: center;
4481 margin-left: 0;
4482 margin-right: 0;
4483}
4484
4485/* === END customizeMode.inc.css === */
4486
e28f3f71
RK		 4487/* === BEGIN customizeTip.inc.css === */
4488
4489#customization-tipPanel > .panel-arrowcontainer > .panel-arrowcontent {
4490 padding: 0;
4491 margin: 0;
4492 min-width: 400px;
4493 max-width: 1000px;
4494 min-height: 200px;
4495 border-radius: 3px;
4496/* background-image: linear-gradient(90deg, #a0dfff 0%, #ceeeff 100%);*/
4497 border: 1px solid #9C9CFF;
4498}
4499
4500#customization-tipPanel > .panel-arrowcontainer > .panel-arrowcontent:-moz-locale-dir(rtl) {
4501/* background-image: linear-gradient(90deg, #ceeeff 0%, #a0dfff 100%);*/
4502}
4503
4504.customization-tipPanel-infoBox {
4505 margin: 20px 25px 25px;
4506 width: 25px;
4507 background-image: url("chrome://browser/skin/customizableui/info-icon-customizeTip.png");
4508 background-repeat: no-repeat;
4509}
4510
4511.customization-tipPanel-content {
4512 margin: 25px 0;
4513 font-size: 12px;
4514 line-height: 18px;
4515}
4516
4517.customization-tipPanel-em {
4518 margin: 0;
4519 font-weight: bold;
4520}
4521
4522.customization-tipPanel-contentImage {
4523 margin-top: 25px;
4524 list-style-image: url("chrome://browser/skin/customizableui/customize-illustration.png");
4525 min-width: 300px;
4526 max-width: 300px;
4527 min-height: 190px;
4528 max-height: 190px;
4529 display: -moz-box;
4530}
4531
4532.customization-tipPanel-contentImage:-moz-locale-dir(rtl) {
4533 list-style-image: url("chrome://browser/skin/customizableui/customize-illustration-rtl.png");
4534}
4535
4536.customization-tipPanel-link {
4537 -moz-appearance: none;
4538 background: transparent;
4539 border: none;
4540 box-shadow: none;
4541 color: #3333FF;
4542 margin: 0;
4543 cursor: pointer;
4544}
4545
4546.customization-tipPanel-link > .button-box > .button-text {
4547 margin: 0 !important;
4548}
4549
4550.customization-tipPanel-closeBox > .close-icon {
4551 -moz-appearance: none;
4552 border: 0;
4553 -moz-margin-end: -25px;
4554}
4555
4556#customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="left"],
4557#customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="right"] {
4558 list-style-image: url("chrome://browser/skin/customizableui/panelarrow-customizeTip.png");
4559}
4560
4561/* === END customizeTip.inc.css === */
4562
c0f6797e
RK		 4563/**
4564 * This next rule is a hack to disable subpixel anti-aliasing on all
4565 * labels during the customize mode transition. Subpixel anti-aliasing
4566 * on Windows with Direct2D layers acceleration is particularly slow to
4567 * paint, so this hack is how we sidestep that performance bottleneck.
4568 */
4569#main-window:-moz-any([customize-entering],[customize-exiting]) label {
4570 transform: perspective(0.01px);
4571}
4572
e20c83c3 4573#main-window[customize-entered] {
43cc2806
RK		 4574 background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png");
4575 background-attachment: fixed;
4576}
4577
5401f433
RK		 4578#main-window[customize-entered] #browser-bottombox,
4579#main-window[customize-entered] #customization-container {
43cc2806
RK		 4580 border-left: 1px solid #9C9CFF;
4581 border-right: 1px solid #9C9CFF;
4582 background-clip: padding-box;
4583}
4584
5401f433
RK		 4585#main-window[customize-entered] #browser-bottombox {
4586 border-bottom: 1px solid #9C9CFF;
4587}
4588
e20c83c3
RK		 4589#customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="left"] {
4590 margin-right: -2px;
4591}
4592
4593#customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="right"] {
4594 margin-left: -2px;
4595}
4596
4597/* End customization mode */
4598
51994fad
RK		 4599/* Private browsing indicators */
4600
4601/**
4602 * Currently, we have two places where we put private browsing indicators on
4603 * Windows. When tabsintitlebar is enabled, we draw the indicator in the titlebar.
4604 * When tabsintitlebar is disabled, we draw the indicator at the end of the
4605 * tabstrip. The titlebar indicator is the fiddliest of the bunch, since we
4606 * want the bottom border of the image to line up with the bottom of the window
4607 * caption buttons. That's why there's so much special-casing going on in here.
4608 */
4609.private-browsing-indicator {
4610 display: none;
4611 pointer-events: none;
e20c83c3
RK		 4612}
4613
51994fad
RK		 4614#private-browsing-indicator-titlebar {
4615 display: block;
4616 position: absolute;
e20c83c3
RK		 4617}
4618
51994fad
RK		 4619#main-window[privatebrowsingmode=temporary][tabsintitlebar] #private-browsing-indicator-titlebar > .private-browsing-indicator {
4620 display: block;
e20c83c3
RK		 4621}
4622
51994fad
RK		 4623#main-window[privatebrowsingmode=temporary]:-moz-any([inFullscreen],:not([tabsintitlebar])) #TabsToolbar > .private-browsing-indicator {
4624 display: -moz-box;
4625}
4626
4627#TabsToolbar > .private-browsing-indicator {
4628 background: url("chrome://browser/skin/privatebrowsing-mask-tabstrip.png") no-repeat center -3px;
4629 -moz-margin-start: 4px;
4630 width: 48px;
4631}
4632
4633/* Bug 1008183: We're intentionally using the titlebar asset here for fullscreen
4634 * mode, since the tabstrip "mimics" the titlebar in that case with its own
4635 * min/max/close window buttons.
4636 */
4637#private-browsing-indicator-titlebar > .private-browsing-indicator,
4638#main-window[inFullscreen] #TabsToolbar > .private-browsing-indicator {
4639 background: url("chrome://browser/skin/privatebrowsing-mask-titlebar.png") no-repeat center 0px;
4640 -moz-margin-end: 4px;
43cc2806 4641 width: 40px;
51994fad
RK		 4642 height: 20px;
4643 position: relative;
43cc2806
RK		 4644}
4645
51994fad
RK		 4646/* This one is for Linux */
4647#main-window[privatebrowsingmode=temporary] #private-browsing-indicator {
4648 background: url("chrome://browser/skin/privatebrowsing-mask-tabstrip.png") center no-repeat;
4649 width: 48px;
4650}
4651
4652/* End private browsing indicators */
4653
43cc2806
RK		 4654/* === BEGIN UITour.inc.css === */
4655
4656/* UI Tour */
4657
2a8b2b48
RK		 4658#UITourHighlightContainer {
4659 -moz-appearance: none;
4660 border: none;
4661 background-color: transparent;
4662 /* This is a buffer to compensate for the movement in the "wobble" effect */
4663 padding: 4px;
4664}
4665
4666#UITourHighlight {
4667 background-image: radial-gradient(50% 100%, rgba(0,132,132,0.4) 50%, rgba(0,132,132,0.6) 100%);
4668 border-radius: 40px;
4669 border: 1px solid #9C9CFF;
4670 /* The box-shadow opacity needs to be < 0.5 so it doesn't appear at 100% opacity
4671 on Linux without an X compositor where opacity is either 0 or 1. */
4672 box-shadow: 0 0 3px 0 rgba(0,0,0,0.49);
43cc2806
RK		 4673 min-height: 32px;
4674 min-width: 32px;
1bf116f8
RK		 4675}
4676
2a8b2b48
RK		 4677#UITourTooltipBody {
4678 -moz-margin-end: 14px;
4679}
4680
4681#UITourTooltipBody > vbox {
4682 padding-top: 4px;
43cc2806
RK		 4683}
4684
2a8b2b48
RK		 4685#UITourTooltipIconContainer {
4686 -moz-margin-start: -16px;
4687}
4688
4689#UITourTooltipIcon {
4690 width: 48px;
4691 height: 48px;
4692 -moz-margin-start: 28px;
4693 -moz-margin-end: 28px;
4694}
4695
4696#UITourTooltipTitle,
4697#UITourTooltipDescription {
4698 max-width: 20rem;
43cc2806
RK		 4699}
4700
4701#UITourTooltipTitle {
2a8b2b48 4702 font-size: 1.45rem;
43cc2806 4703 font-weight: bold;
2a8b2b48
RK		 4704 -moz-margin-start: 0;
4705 -moz-margin-end: 0;
4706 margin: 0 0 9px 0;
43cc2806
RK		 4707}
4708
4709#UITourTooltipDescription {
2a8b2b48
RK		 4710 -moz-margin-start: 0;
4711 -moz-margin-end: 0;
4712 font-size: 1.15rem;
4713 line-height: 1.8rem;
4714 margin-bottom: 0; /* Override global.css */
4715}
4716
4717#UITourTooltipClose {
4718 -moz-appearance: none;
4719 border: none;
4720 background-color: transparent;
4721 min-width: 0;
4722 -moz-margin-start: 4px;
4723 margin-top: -2px;
4724}
4725
4726#UITourTooltipClose > .toolbarbutton-text {
4727 display: none;
4728}
4729
4730#UITourTooltipButtons {
4731 -moz-box-pack: end;
4732 background-color: rgba(0,0,0,.2);
4733 border-top: 1px solid rgba(0,0,0,.4);
4734 margin: 24px -16px -16px;
4735 padding: 2em 15px;
4736}
4737
4738#UITourTooltipButtons > button {
4739 margin: 0 15px;
4740}
4741
4742#UITourTooltipButtons > button:first-child {
4743 -moz-margin-start: 0;
4744}
4745
4746#UITourTooltipButtons > button[image] > .button-box > .button-icon {
4747 width: 16px;
4748 height: 16px;
4749 -moz-margin-end: 5px;
4750}
4751
4752#UITourTooltipButtons > button .button-text {
4753 font-size: 1.15rem;
4754}
4755
4756#UITourTooltipButtons > button:not(.button-link) {
4757 -moz-appearance: none;
4758 background-color: #C09070;
4759 border-radius: 3000px;
4760 border: none;
4761 color: #000000;
4762 padding: 4px 30px;
4763 transition-property: background-color, color;
4764 transition-duration: 150ms;
4765}
4766
4767#UITourTooltipButtons > button:not(.button-link):not(:active):hover {
4768 background-color: #FFCF00;
4769 color: #000000;
4770}
4771
4772#UITourTooltipButtons > button.button-link {
4773 -moz-appearance: none;
4774 background: transparent;
4775 border: none;
4776 box-shadow: none;
4777 color: rgba(0,0,0,0.35);
4778 padding-left: 10px;
4779 padding-right: 10px;
4780}
4781
4782#UITourTooltipButtons > button.button-link:hover {
4783 color: black;
4784}
4785
4786/* The primary button gets the same color as the customize button. */
4787#UITourTooltipButtons > button.button-primary {
4788 background-color: #A06060; /* LCARS default button background color */
4789 color: #000000;
4790 padding-left: 30px;
4791 padding-right: 30px;
4792}
4793
4794#UITourTooltipButtons > button.button-primary:not(:active):hover {
4795 background-color: #FFCF00;
4796 color: #000000;
43cc2806
RK		 4797}
4798
4799/* === END UITour.inc.css === */
c0f6797e
RK		 4800
4801#UITourTooltipButtons {
4802 margin: 24px -4px -4px;
4803}
fff8097b
RK		 4804
4805/* === BEGIN contextmenu.inc.css === */
4806
4807menugroup > .menuitem-iconic[disabled="true"] > .menu-iconic-left {
4808}
4809
4810#context-navigation > .menuitem-iconic {
4811 -moz-box-flex: 1;
4812 -moz-box-pack: center;
4813 -moz-box-align: center;
4814}
4815
4816#context-navigation > .menuitem-iconic[disabled="true"] {
4817 background-color: transparent;
4818}
4819
4820#context-navigation > .menuitem-iconic > .menu-iconic-left {
4821 -moz-appearance: none;
4822}
4823
4824#context-navigation > #context-back > .menu-iconic-left {
4825 list-style-image: url("chrome://browser/skin/ToolbarFx.png");
4826 -moz-image-region: rect(0, 54px, 18px, 36px);
4827}
4828
4829#context-navigation > #context-back:not([disabled="true"]):hover > .menu-iconic-left {
4830 -moz-image-region: rect(18px, 54px, 36px, 36px);
4831}
4832
4833#context-navigation > #context-back[disabled="true"] > .menu-iconic-left {
4834 -moz-image-region: rect(36px, 54px, 54px, 36px);
4835}
4836
4837#context-navigation > #context-forward > .menu-iconic-left {
4838 list-style-image: url("chrome://browser/skin/ToolbarFx.png");
4839 -moz-image-region: rect(0, 72px, 18px, 54px);
4840}
4841
4842#context-navigation > #context-forward:not([disabled="true"]):hover > .menu-iconic-left {
4843 -moz-image-region: rect(18px, 72px, 36px, 54px);
4844}
4845
4846#context-navigation > #context-forward[disabled="true"] > .menu-iconic-left {
4847 -moz-image-region: rect(36px, 72px, 54px, 54px);
4848}
4849
4850#context-navigation > #context-reload > .menu-iconic-left {
4851 list-style-image: url("chrome://browser/skin/reload-stop-go.png");
4852 -moz-image-region: rect(0, 14px, 14px, 0);
4853}
4854
4855#context-navigation > #context-reload:not([disabled="true"]):hover > .menu-iconic-left {
4856 -moz-image-region: rect(14px, 14px, 28px, 0);
4857}
4858
4859#context-navigation > #context-reload[disabled="true"] > .menu-iconic-left {
4860 -moz-image-region: rect(28px, 14px, 42px, 0);
4861}
4862
4863#context-navigation > #context-stop > .menu-iconic-left {
4864 list-style-image: url("chrome://browser/skin/reload-stop-go.png");
4865 -moz-image-region: rect(0, 28px, 14px, 14px);
4866}
4867
4868#context-navigation > #context-stop:not([disabled="true"]):hover > .menu-iconic-left {
4869 -moz-image-region: rect(14px, 28px, 28px, 14px);
4870}
4871
4872#context-navigation > #context-stop[disabled="true"] > .menu-iconic-left {
4873 -moz-image-region: rect(28px, 28px, 42px, 14px);
4874}
4875
4876#context-navigation > #context-bookmarkpage > .menu-iconic-left {
4877 list-style-image: url("chrome://browser/skin/ToolbarFx.png");
4878 -moz-image-region: rect(0, 144px, 18px, 126px);
4879}
4880
4881#context-navigation > #context-bookmarkpage:not([disabled="true"]):hover > .menu-iconic-left {
4882 -moz-image-region: rect(18px, 144px, 36px, 126px);
4883}
4884
4885#context-navigation > #context-bookmarkpage[disabled="true"] > .menu-iconic-left {
4886 -moz-image-region: rect(36px, 144px, 54px, 126px);
4887}
4888
4889#context-back:-moz-locale-dir(rtl),
4890#context-forward:-moz-locale-dir(rtl),
4891#context-reload:-moz-locale-dir(rtl) {
4892 transform: scaleX(-1);
4893}
4894
4895#context-navigation > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon {
4896 width: 18px;
4897 height: 18px;
4898 margin: 7px;
4899}
4900
4901#context-navigation > #context-reload > .menu-iconic-left > .menu-iconic-icon,
4902#context-navigation > #context-stop > .menu-iconic-left > .menu-iconic-icon {
4903 width: 14px;
4904 height: 14px;
4905 margin: 9px;
4906}
4907
4908/* === END contextmenu.inc.css === */
KaiRo's SeaMonkey themes