1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
|
/*----------------------------------------------------------------------------
Color CSS file for Addons.mozilla.org
Created by Craig Cook - focalcurve.com
on December 30, 2007
Color Reference
Body text (almost black): #333
Links (medium blue): #1d587f
Visited links (blue-gray): #748d9e
Headings (dark blue): #2d3b58
Box border (light blue-gray): #d8dcdf
Special box border (dark blue): #5d6c8c
-----------------------------------------------------------------------------*/
/*** =General elements ***/
body { background: #fff; color: #333; }
a:link { color: #1d587f; }
a:visited { color: #748d9e; }
a:active, a:hover, a:focus { color: #000000; }
a.view { background: transparent url("../img/sprite.png?20081210") 100% -247px no-repeat; }
.html-ltr a.view:hover { background-position: 100% -301px; }
.html-rtl a.view { background-position: 100% -486px; }
.html-rtl a.view:hover { background-position: 100% -540px; }
h3, h4, h5, h6 { color: #2d3b58; }
td, th { border-bottom: 1px solid #eee; }
thead th { color: #555; }
input, button, select, textarea { color: inherit; }
a img { border: none; }
div.error-notice { background: #fffefa url("../img/warning.png") 10px 10px no-repeat; border: 1px solid #eee; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
/*** =Site-notice ***/
#site-notice { background: #ffe; border-bottom: 2px solid #ccc; }
/*** =Access nav ***/
#nav-access a:active, #nav-access a:focus { color: #000; background: #fff; border: 1px solid #475470; outline: 0; }
/*** =Header ***/
h4#moz a { background: transparent url("../img/sprite-alpha.png") no-repeat 0 -1px; }
h4#moz a:hover, h1#moz a:active, h1#moz a:focus { background-position: 0 -51px; }
/* =Page title */
#page-title { background: transparent url("../img/brandbanner-bg.png") 0 40% repeat-x; }
#page-title p.page-intro { color: #354a4f; }
#page-title.firefox h1, #page-title.firefox h1 a { color: #bd1d01; } /* red */
#page-title.thunderbird h1, #page-title.thunderbird h1 a { color: #0b4190; } /* blue */
#page-title.fennec h1, #page-title.fennec h1 a { color: #0b4190; } /* blue */
#page-title.seamonkey h1, #page-title.seamonkey h1 a { color: #3f38a3; } /* purple */
#page-title.sunbird h1, #page-title.sunbird h1 a { color: #337b5a; } /* green */
#page-title.generic h1, #page-title.generic h1 a { color: #bd1d01; } /* red */
#page-title.developers h1, #page-title.developers h1 a { color: #bd1d01; } /* red */
#page-title h2 { color: #2D3B58; }
/* =User nav */
.html-ltr #nav-user li { border-left: 1px solid #666; }
.html-rtl #nav-user li { border-right: 1px solid #666; }
#nav-user li:first-child { border-left: 0; }
#nav-user li:first-child { border-right: 0; }
#nav-user a:link { color: #000; }
#nav-user a:visited { color: #666; }
#nav-user a:hover, #nav-user a:active, #nav-user a:focus { color: #000; }
/* =Other Applications */
#other-apps { background-color: #b3deee; border: 1px solid #90c8dd; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
#other-apps h3 { color: #4d757b; }
#other-apps.js h3 { border-bottom: 1px solid #90c8dd; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
#other-apps.js h3 { background: transparent url("../img/sprite.png?20081210") 4px -262px no-repeat; }
.html-rtl #other-apps.js h3 { background-position: 14px -262px; }
#other-apps.js h3:hover { background-color: #c5e3ee; }
#nav-apps a { color: #1f0084; background-repeat: no-repeat; background-position: 0 50%; }
#nav-apps a:hover, #nav-apps a:active, #nav-apps a:focus { color: #1d587f; }
.html-ltr #other-apps.js #nav-apps #app-seamonkey a { background: url("../img/sprite-alpha.png") -465px 0 no-repeat;}
.html-rtl #other-apps.js #nav-apps #app-seamonkey a { background: url("../img/sprite-alpha.png") -390px 0 no-repeat;}
.html-ltr #other-apps.js #nav-apps #app-sunbird a { background: url("../img/sprite-alpha.png") -616px 0 no-repeat;}
.html-rtl #other-apps.js #nav-apps #app-sunbird a { background: url("../img/sprite-alpha.png") -541px 0 no-repeat; }
.html-ltr #other-apps.js #nav-apps #app-thunderbird a { background: url("../img/sprite-alpha.png") -766px 0 no-repeat; }
.html-rtl #other-apps.js #nav-apps #app-thunderbird a { background: url("../img/sprite-alpha.png") -691px 0 no-repeat; }
.html-ltr #other-apps.js #nav-apps #app-fennec a { background: url("../img/sprite-alpha.png") -766px 0 no-repeat; }
.html-rtl #other-apps.js #nav-apps #app-fennec a { background: url("../img/sprite-alpha.png") -691px 0 no-repeat; }
.html-ltr #other-apps.js #nav-apps #app-firefox a { background: url("../img/sprite-alpha.png") -321px 0 no-repeat; }
.html-rtl #other-apps.js #nav-apps #app-firefox a { background: url("../img/sprite-alpha.png") -246px 0 no-repeat; }
.html-ltr #other-apps.collapsed h3 { border-bottom: 0; background-position: 6px -320px; }
.html-rtl #other-apps.collapsed h3 { border-bottom: 0; background-position: 16px -320px; }
/*** =Search form ***/
#search-bubble-outer { background: transparent url("../img/sprite.png?20081210") right top no-repeat; }
#search-bubble-inner { background: transparent url("../img/sprite.png?20081210") left top no-repeat; }
#search-form li { color: #666; }
.html-ltr #search-form #query { background: #fff url("../img/sprite.png?20081210") -977px -686px no-repeat; }
.html-rtl #search-form #query { background: #fff url("../img/sprite.png?20081210") 100% -686px no-repeat; }
#search-form #search-category label { color: #426a13; }
.html-ltr #search-form #my-submit { background: url("../img/sprite-alpha.png") -120px 0 no-repeat; }
.html-ltr #search-form #my-submit:hover { background-position: -157px 0;}
.html-rtl #search-form #my-submit { background: url("../img/sprite-alpha.png") -120px -40px no-repeat; }
.html-rtl #search-form #my-submit:hover { background: url("../img/sprite-alpha.png") -157px -40px no-repeat;}
#advanced-search {background-color: #e6e6e6; border: 1px solid #68B41C; }
#advanced-search-toggle {background: url("../img/sprite.png?20081210") right -68px no-repeat; }
#advanced-search-toggle div {background: transparent url("../img/sprite.png?20081210") left -68px no-repeat;}
#advanced-search-toggle a {color: black; text-decoration: none; padding:1px 3px 1px 3px;}
.html-ltr #advanced-search-toggle a.asclosed { background: url("../img/sprite.png?20081210") right -354px no-repeat;}
.html-ltr #advanced-search-toggle a.asopen { background: url("../img/sprite.png?20081210") right -369px no-repeat;}
.html-rtl #advanced-search-toggle a.asclosed {background: url("../img/sprite.png?20081210") -989px -354px no-repeat;}
.html-rtl #advanced-search-toggle a.asopen { background: url("../img/sprite.png?20081210") -989px -369px no-repeat;}
#advanced-search-toggle #toggle-outer {background: url("../img/sprite.png?20081210") right -87px no-repeat; }
#advanced-search-toggle #toggle-inner {background: url("../img/sprite.png?20081210") -861px -87px no-repeat; }
/*** =Footer ***/
#footer { color: #888; padding: 1em 0; background: transparent url("../img/foot-bg.png") repeat-x; }
#footer a:link, #footer a:visited { color: #777; }
#footer a:hover, #footer a:active, #footer a:focus { color: #000; }
/*** =Extra content ***/
#content-extra .extra { border: 1px solid #d8dcdf; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
/*** =Categories ***/
#categories h3 { background: #79be1b url("../img/sprite.png?20081210") -104px -106px no-repeat; border-bottom: 1px solid #abe071; }
#categories h3 span { color: #426a13; background: transparent url("../img/sprite.png?20081210") -230px -106px no-repeat; }
#categories.collapsed h3 { background-position: 0 -106px; }
#categories.collapsed h3.open { background-position: -26px -106px; }
#categories, #categories.collapsed #cat-list { background-color: #f6f6f6; border: 1px solid #d8dcdf; border-width: 0 1px 1px; }
#categories, #categories.collapsed #cat-list { /* redundancy compensates for varying browser support */
-moz-border-radius-bottomright: 6px;
-moz-border-radius-bottomleft: 6px;
-webkit-border-bottom-right-radius: 6px;
-webkit-border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
border-bottom-left-radius: 6px;
}
#cat-list { border-top: 1px solid #e8e6e6; }
#cat-list li { border-bottom: 3px double #e8e6e6; }
#cat-list a { background: #f4f2f2 url("../img/cat-link.png") repeat-x left top; }
#categories a:link { color: #4e4e4e; }
#categories a:visited { color: #777; }
#categories a:hover, #categories a:active, #categories a:focus { color: #1d587f; background: #f1f0f0 url("../img/cat-link.png") repeat-x left -100px; }
#categories.collapsed h3 span { background-position: -242px -106px; }
#categories.collapsed h3:hover { color: #4f7f17; background-position: -52px -106px; }
#categories.collapsed h3.open:hover { background-position: -78px -106px; }
#categories.collapsed h3:hover span { background-position: -533px -106px; }
#categories p { border-top: 1px solid #e8e6e6; }
/*** =Add-on boxes ***/
.addon { border-left: 1px solid #d8dcdf; background: transparent url("../img/sprite.png?20081210") right -1256px no-repeat; }
.addon .vex { background: transparent url("../img/sprite.png?20081210") right bottom no-repeat; }
.addon .vex span { background: transparent url("../img/sprite.png?20081210") left bottom no-repeat; }
.addon .preview-img { background: transparent url("../img/sprite.png?20081210") left -1256px no-repeat; }
.addon .stats em { color: #d54601; }
.addon .flag { border: 1px solid #ccc; border-width: 0 1px 1px 0; }
#addon-listing .addon .vex { background: transparent url("../img/sprite.png?20081210") no-repeat right bottom; }
/* =Secondary featured add-ons */
.sub .irk { background: transparent url("../img/sprite.png?20081210") left -1256px no-repeat; }
.sub .preview-img { background-image: none; }
/* =Recommended add-ons */
.rec { background: url("../img/rec-tr.png") no-repeat right top; border-left-color: #c1e1c1; }
.rec .preview-img { background: transparent url("../img/rec-tl.png") left top no-repeat; }
.rec .flag { color: #360; background: #f8f8f7 url("../img/rec-flag.png") no-repeat; }
.rec .vex { background-image: url("../img/rec-br.png"); }
.rec .vex span { background-image: url("../img/rec-bl.png"); }
/* =Experimental add-ons */
.exp { background: url("../img/exp-tr.png") no-repeat right top; border-left-color: #e3c1c1; }
.exp .preview-img { background: transparent url("../img/exp-tl.png") left top no-repeat; }
.exp .flag { color: #900; background: #f8f8f7 url("../img/exp-flag.png") no-repeat; }
.exp .vex { background-image: url("../img/exp-br.png"); }
.exp .vex span { background-image: url("../img/exp-bl.png"); }
/* =Listing items */
#addon-listing .more li { border-right: 1px solid #666; }
#addon-listing .more li:last-child { border: 0; }
/*** =Install button ***/
.install-button a { color: #062445; background: #7cc11c url("../img/sprite.png?20081210") 100% -730px no-repeat; }
.install-button a span { background: transparent url("../img/installbtn-edges.png") left bottom no-repeat; }
.install-button a span span { background: transparent url("../img/installbtn-edges.png") right bottom no-repeat; }
.install-button a span span span { background: transparent url("../img/installbtn-edges.png") left top no-repeat; }
.install-button a span span span strong { background: transparent url("../img/installbtn-edges.png") right top no-repeat; }
.install-button a:hover, .install-button a:focus, .install-button a:active { color: #0a3b73; background-color: #9dd34c; background-position: 100% -860px; }
/* In listings - general add-ons */
.install-button a span,
.install-button a span span,
.install-button a span span span,
.install-button a span span span strong { background-image: url("../img/installbtn-edges-list.png"); }
/* In listings - experimental add-ons */
.exp .install-button a span,
.exp .install-button a span span,
.exp .install-button a span span span,
.exp .install-button a span span span strong { background-image: url("../img/installbtn-edges-exp.png"); }
/* In listings - recommended add-ons */
#addon-listing .rec .install-button a span,
#addon-listing .rec .install-button a span span,
#addon-listing .rec .install-button a span span span,
#addon-listing .rec .install-button a span span span strong { background-image: url("../img/installbtn-edges-rec.png"); }
/* Experimental add-ons - while logged out */
#content-main .exp-loggedout { border: 1px solid #d8d8d8; background: #fff; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
#content-main .exp-loggedout .install-button a { color: #aaa; background-color: #fff; background-position: 100% -995px; }
#content-main .exp-loggedout .install-button a span,
#content-main .exp-loggedout .install-button a span span,
#content-main .exp-loggedout .install-button a span span span,
#content-main .exp-loggedout .install-button a span span span strong { background-image: url("../img/installbtn-edges-dis.png"); }
#content-main .exp-loggedout .install-button a:hover { background-color: #f3f3f3; background-position: 100% -1125px; }
/* Unavailable add-ons */
#content-main .install-container .not-avail { padding: 5px 10px; float: left; color: #666; border: 1px solid #d8d8d8; background: #fff; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
/*** =Pitch ***/
.pitch { background-color: #f8f8f8; border: 1px solid #e4f3fa; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
.pitch h3 { color: #042253; }
/*** =Landing pages ***/
#recommended { background: #f2f8fd; border: 1px solid #e9f1f8; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
#recommended .addon { background: #fff url("../img/landrec-tr.png") no-repeat top right; }
#recommended .addon .preview-img { background: url("../img/landrec-tl.png") no-repeat top left; }
#recommended .addon .vex { background-image: url("../img/landrec-br.png"); }
#recommended .vex span { background-image: url("../img/landrec-bl.png"); }
#content.landing #secondaries .exp .irk { background-image: url("../img/exp-tl.png"); }
#content.landing #secondaries .sub .vex { background-image: url("../img/addon-br.png"); }
#content.landing #secondaries .exp .vex { background-image: url("../img/exp-br.png"); }
#content.landing #secondaries .exp .preview-img { background-image: none; }
#content.landing .more-addons { border: 1px solid #5d6c8c; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
.browse-list a { background: #fafafa; border: 1px solid #e8e6e6; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
.browse-list a:hover { background-color: #f1f0f0; border-color: #e1dfdf; }
/*** =Dictionaries ***/
#dictionaries { background-color: #f7fafc; border: 1px solid #eef1f3; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
#dictionaries th, #dictionaries td { border-bottom: 1px solid #eee; }
#dictionaries tbody tr.alt th, #dictionaries tbody tr.alt td { background-color: #fff; }
/*** =Detail page ***/
.addon-cats li { border-left: 1px solid #666; }
.addon-cats li:first-child { border-left: 0; }
#addon-info, #addon-advanced { border: 1px solid #d8dcdf; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
.addon-images a img { border: 1px solid #1d587f; }
.addon-reviews li, .addon-versions li { border-top: 1px solid #d8dcdf; }
#addon-info .addon-reviews li { background-color: #f7fafc; border: 1px solid #eef1f3; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
#addon-advanced h5 { border-top: 1px solid #d8dcdf; }
/* =Version History Page */
#latest-version { border: 1px solid #5d6c8c; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
div.oldversion { -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
/* =Review form */
#form-review { background-color: #f8f8f8; border: 1px solid #e4f3fa; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
/* =reCaptchas */
#recaptcha_image { border: 1px solid #d8dcdf; }
/* =Star rating */
#rate-it legend span { color: #042758; }
/*
ul.star-rating { background: #fff; padding: 3px 5px; border: 1px solid #edbe97; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
*/
/* =More add-ons */
.more-addons h3 a.view { background: transparent url("../img/sprite.png?20081210") 100% -387px no-repeat; }
.html-ltr .more-addons h3 a.view:hover { background-position: 100% -437px; }
.html-rtl .more-addons h3 a.view { background-position: 100% -597px; }
.html-rtl .more-addons h3 a.view:hover { background-position: 100% -647px; }
/*** =Pagination ***/
.pagination { background-color: #f7fafc; border: 1px solid #eef1f3; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
.pages a { border: 1px solid #fff; }
.pages a:hover { background-color: #ccf29b; border-color: #bbde92; }
.pages .current strong { background-color: #ccf29b; border: 1px solid #83c53f; }
.pages .prev a { background: transparent url("../img/arr-prev.png") 0 50% no-repeat; }
.pages .prev a:hover { background-color: #ccf29b; }
.pages .next a { background: transparent url("../img/arr-next.png") 100% 50% no-repeat; }
.pages .next a:hover { background-color: #ccf29b; }
/*** =Listing control bar ***/
#form-listcontrol { background: #f2f8fd; border: 1px solid #e9eff4; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
#order-by button { color: #7598b5; background-color: #fff; border: 1px solid #89a8c1; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
#order-by button:hover { background-color: #e9eff4; color: #496377; }
#order-by button.current, #order-by button.current:hover { background-color: #89a8c1; color: #fff; }
#form-listcontrol #experimental label { background: #fff; border: 1px solid #933; color: #933; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
/*** =Thumbnail browser layout */
#thumb-subcategories ul { -moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px; border-color:#D8DCDF; border-style:solid; border-width:0pt 1px 1px; }
#thumb-subcategories ul li { border-top:1px solid #E8E6E6; }
#thumb-subcategories a:link { color: #4e4e4e; }
#thumb-subcategories a:visited { color: #777; }
#thumb-subcategories a:hover, #thumb-subcategories a:active, #thumb-subcategories a:focus { background: #F2F8Fd }
#thumb-subcategories li.selected a:link, #thumb-subcategories li.selected a:visited { background-color:#89A8C1; color:#FFFFFF; }
#thumb-browser .thumbs li.thumb { background: transparent url(../img/sprite.png?20081210) no-repeat scroll right -1256px; }
#thumb-browser .thumbs li.thumb div.wrapper { background: transparent url(../img/sprite.png?20081210) no-repeat scroll left -1256px; }
#thumb-browser .thumbs li.exp { background: transparent url(../img/exp-tr.png) no-repeat scroll right top; }
#thumb-browser .thumbs li.exp div.wrapper { background: transparent url(../img/exp-tl.png) no-repeat scroll left top; }
#thumb-browser .thumbs li.thumb .vex { background:transparent url(../img/sprite.png?20081210) no-repeat scroll right bottom; }
#thumb-browser .thumbs li.thumb .vex span { background:transparent url(../img/sprite.png?20081210) no-repeat scroll left bottom; width: 10px; height: 10px; float: left;}
#thumb-browser .thumbs li.exp .vex { background:transparent url(../img/exp-br.png) no-repeat scroll right bottom; }
#thumb-browser .thumbs li.exp .vex span { background:transparent url(../img/exp-bl.png) no-repeat scroll left bottom; }
|
