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