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