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