picasso 0.4.2 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. data/README.md +13 -2
  2. data/docs/_picasso.html +45 -723
  3. data/docs/config.rb +0 -3
  4. data/docs/css/picasso-demos.css +45 -721
  5. data/docs/index.html +59 -727
  6. data/docs/picasso-_components.html +45 -723
  7. data/docs/picasso-_despegar.html +45 -723
  8. data/docs/picasso-_utils.html +45 -723
  9. data/docs/picasso-components-_accordions.html +45 -723
  10. data/docs/picasso-components-_arrows.html +45 -723
  11. data/docs/picasso-components-_bubbles.html +45 -723
  12. data/docs/picasso-components-_buttons.html +46 -728
  13. data/docs/picasso-components-_clusters.html +45 -723
  14. data/docs/picasso-components-_inputs.html +45 -723
  15. data/docs/picasso-components-_list-grids.html +45 -723
  16. data/docs/picasso-components-_navs.html +61 -858
  17. data/docs/picasso-components-_pagination.html +45 -723
  18. data/docs/picasso-components-_popups.html +49 -769
  19. data/docs/picasso-components-_tooltips.html +49 -723
  20. data/docs/picasso-components-buttons-_3d.html +45 -724
  21. data/docs/picasso-components-buttons-_glossy.html +25 -25
  22. data/docs/picasso-components-buttons-_mini.html +25 -25
  23. data/docs/picasso-despegar-_mixins.html +45 -723
  24. data/docs/picasso-despegar-_variables.html +66 -740
  25. data/docs/picasso-utils-_clearfix.html +45 -723
  26. data/docs/picasso-utils-_grid.html +45 -723
  27. data/docs/picasso-utils-_ie.html +45 -723
  28. data/docs/picasso-utils-_rem.html +45 -723
  29. data/docs/picasso-utils-_sprite.html +45 -723
  30. data/docs/sass/picasso-demos.scss +13 -33
  31. data/lib/picasso/version.rb +1 -1
  32. data/picasso.gemspec +0 -1
  33. data/stylesheets/picasso/components/_buttons.scss +1 -5
  34. data/stylesheets/picasso/components/_navs.scss +16 -135
  35. data/stylesheets/picasso/components/_popups.scss +5 -46
  36. data/stylesheets/picasso/components/_tooltips.scss +5 -0
  37. data/stylesheets/picasso/components/buttons/_3d.scss +0 -1
  38. data/stylesheets/picasso/despegar/_variables.scss +17 -14
  39. metadata +5 -25
  40. data/docs/img/picasso-buttons-glossy.png +0 -0
  41. data/docs/img/picasso-buttons-mini.png +0 -0
  42. data/docs/img/picasso-nav.png +0 -0
  43. data/docs/img/picasso-popup.png +0 -0
  44. data/stylesheets/picasso/components/buttons/_glossy.scss +0 -266
  45. data/stylesheets/picasso/components/buttons/_mini.scss +0 -197
@@ -156,375 +156,6 @@ body {
156
156
  font-size: 1.2em;
157
157
  }
158
158
 
159
- .button-glossy-demo-1 {
160
- width: 90px;
161
- height: 30px;
162
- display: inline-block;
163
- text-align: center;
164
- position: relative;
165
- z-index: 1;
166
- font-family: sans-serif;
167
- font-size: 12px;
168
- text-decoration: none;
169
- cursor: pointer;
170
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #de1f2a), color-stop(100%, #c81c26)), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b11922), color-stop(100%, #6e0f15));
171
- background: -webkit-linear-gradient(#de1f2a, #c81c26), -webkit-linear-gradient(#b11922, #6e0f15);
172
- background: -moz-linear-gradient(#de1f2a, #c81c26), -moz-linear-gradient(#b11922, #6e0f15);
173
- background: -o-linear-gradient(#de1f2a, #c81c26), -o-linear-gradient(#b11922, #6e0f15);
174
- background: linear-gradient(#de1f2a, #c81c26), linear-gradient(#b11922, #6e0f15);
175
- -webkit-border-radius: 5px;
176
- -moz-border-radius: 5px;
177
- -ms-border-radius: 5px;
178
- -o-border-radius: 5px;
179
- border-radius: 5px;
180
- background-position: left top, left 15px;
181
- }
182
- .button-glossy-demo-1:after, .button-glossy-demo-1:before {
183
- content: "";
184
- position: absolute;
185
- display: inline-block;
186
- }
187
- .button-glossy-demo-1:after {
188
- width: 88px;
189
- height: 28px;
190
- left: 1px;
191
- top: 1px;
192
- z-index: 2;
193
- }
194
- .button-glossy-demo-1:before {
195
- width: 86px;
196
- height: 26px;
197
- left: 2px;
198
- top: 2px;
199
- z-index: 3;
200
- }
201
- .button-glossy-demo-1 span {
202
- position: relative;
203
- z-index: 4;
204
- line-height: 30px;
205
- }
206
- .button-glossy-demo-1 span {
207
- color: white;
208
- }
209
- .button-glossy-demo-1:after, .button-glossy-demo-1:before {
210
- -webkit-border-radius: 4px;
211
- -moz-border-radius: 4px;
212
- -ms-border-radius: 4px;
213
- -o-border-radius: 4px;
214
- border-radius: 4px;
215
- }
216
- .button-glossy-demo-1:after {
217
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(15%, #f2a4a8), color-stop(100%, #150304)) 50%;
218
- background: -webkit-linear-gradient(#f2a4a8 15%, #150304) 50%;
219
- background: -moz-linear-gradient(#f2a4a8 15%, #150304) 50%;
220
- background: -o-linear-gradient(#f2a4a8 15%, #150304) 50%;
221
- background: linear-gradient(#f2a4a8 15%, #150304) 50%;
222
- }
223
- .button-glossy-demo-1:before {
224
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #de1f2a), color-stop(100%, #c81c26)), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b11922), color-stop(100%, #6e0f15));
225
- background: -webkit-linear-gradient(#de1f2a, #c81c26), -webkit-linear-gradient(#b11922, #6e0f15);
226
- background: -moz-linear-gradient(#de1f2a, #c81c26), -moz-linear-gradient(#b11922, #6e0f15);
227
- background: -o-linear-gradient(#de1f2a, #c81c26), -o-linear-gradient(#b11922, #6e0f15);
228
- background: linear-gradient(#de1f2a, #c81c26), linear-gradient(#b11922, #6e0f15);
229
- background-position: left top, left 13px;
230
- }
231
- .button-glossy-demo-1, .button-glossy-demo-1:before {
232
- background-size: 100% 50%;
233
- background-repeat: no-repeat;
234
- }
235
- .button-glossy-demo-1:hover {
236
- text-decoration: none;
237
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e96168), color-stop(50%, #bf1b24), color-stop(100%, #f10c19));
238
- background: -webkit-linear-gradient(#e96168, #bf1b24, #f10c19);
239
- background: -moz-linear-gradient(#e96168, #bf1b24, #f10c19);
240
- background: -o-linear-gradient(#e96168, #bf1b24, #f10c19);
241
- background: linear-gradient(#e96168, #bf1b24, #f10c19);
242
- }
243
- .button-glossy-demo-1:hover:after {
244
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4b1b5), color-stop(100%, #d11d27)) 50%;
245
- background: -webkit-linear-gradient(#f4b1b5 20%, #d11d27) 50%;
246
- background: -moz-linear-gradient(#f4b1b5 20%, #d11d27) 50%;
247
- background: -o-linear-gradient(#f4b1b5 20%, #d11d27) 50%;
248
- background: linear-gradient(#f4b1b5 20%, #d11d27) 50%;
249
- }
250
- .button-glossy-demo-1:hover:before {
251
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e96168), color-stop(50%, #bf1b24), color-stop(100%, #f10c19));
252
- background: -webkit-linear-gradient(#e96168, #bf1b24, #f10c19);
253
- background: -moz-linear-gradient(#e96168, #bf1b24, #f10c19);
254
- background: -o-linear-gradient(#e96168, #bf1b24, #f10c19);
255
- background: linear-gradient(#e96168, #bf1b24, #f10c19);
256
- }
257
- .button-glossy-demo-1:hover, .button-glossy-demo-1:hover:before {
258
- background-size: 100% 100%;
259
- background-position: left top;
260
- background-repeat: no-repeat;
261
- }
262
- .ie7 .button-glossy-demo-1, .ie8 .button-glossy-demo-1, .ie9 .button-glossy-demo-1 {
263
- -webkit-border-radius: none;
264
- -moz-border-radius: none;
265
- -ms-border-radius: none;
266
- -o-border-radius: none;
267
- border-radius: none;
268
- background: url('../img/picasso-buttons-glossy.png');
269
- background-position: 0 -1px;
270
- }
271
- .ie7 .button-glossy-demo-1:hover, .ie8 .button-glossy-demo-1:hover, .ie9 .button-glossy-demo-1:hover {
272
- background-position: 0 -31px;
273
- }
274
- .ie9 .button-glossy-demo-1 {
275
- -webkit-border-radius: none;
276
- -moz-border-radius: none;
277
- -ms-border-radius: none;
278
- -o-border-radius: none;
279
- border-radius: none;
280
- }
281
-
282
- .button-glossy-demo-2 {
283
- width: 70px;
284
- height: 30px;
285
- display: inline-block;
286
- text-align: center;
287
- position: relative;
288
- z-index: 1;
289
- font-family: sans-serif;
290
- font-size: 12px;
291
- text-decoration: none;
292
- cursor: pointer;
293
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #0077b3)), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #006699), color-stop(100%, #00334d));
294
- background: -webkit-linear-gradient(#0088cc, #0077b3), -webkit-linear-gradient(#006699, #00334d);
295
- background: -moz-linear-gradient(#0088cc, #0077b3), -moz-linear-gradient(#006699, #00334d);
296
- background: -o-linear-gradient(#0088cc, #0077b3), -o-linear-gradient(#006699, #00334d);
297
- background: linear-gradient(#0088cc, #0077b3), linear-gradient(#006699, #00334d);
298
- -webkit-border-radius: 5px;
299
- -moz-border-radius: 5px;
300
- -ms-border-radius: 5px;
301
- -o-border-radius: 5px;
302
- border-radius: 5px;
303
- background-position: left top, left 15px;
304
- }
305
- .button-glossy-demo-2:after, .button-glossy-demo-2:before {
306
- content: "";
307
- position: absolute;
308
- display: inline-block;
309
- }
310
- .button-glossy-demo-2:after {
311
- width: 68px;
312
- height: 28px;
313
- left: 1px;
314
- top: 1px;
315
- z-index: 2;
316
- }
317
- .button-glossy-demo-2:before {
318
- width: 66px;
319
- height: 26px;
320
- left: 2px;
321
- top: 2px;
322
- z-index: 3;
323
- }
324
- .button-glossy-demo-2 span {
325
- position: relative;
326
- z-index: 4;
327
- line-height: 30px;
328
- }
329
- .button-glossy-demo-2 span {
330
- color: white;
331
- }
332
- .button-glossy-demo-2:after, .button-glossy-demo-2:before {
333
- -webkit-border-radius: 4px;
334
- -moz-border-radius: 4px;
335
- -ms-border-radius: 4px;
336
- -o-border-radius: 4px;
337
- border-radius: 4px;
338
- }
339
- .button-glossy-demo-2:after {
340
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(15%, #66ccff), color-stop(100%, #000000)) 50%;
341
- background: -webkit-linear-gradient(#66ccff 15%, #000000) 50%;
342
- background: -moz-linear-gradient(#66ccff 15%, #000000) 50%;
343
- background: -o-linear-gradient(#66ccff 15%, #000000) 50%;
344
- background: linear-gradient(#66ccff 15%, #000000) 50%;
345
- }
346
- .button-glossy-demo-2:before {
347
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #0077b3)), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #006699), color-stop(100%, #00334d));
348
- background: -webkit-linear-gradient(#0088cc, #0077b3), -webkit-linear-gradient(#006699, #00334d);
349
- background: -moz-linear-gradient(#0088cc, #0077b3), -moz-linear-gradient(#006699, #00334d);
350
- background: -o-linear-gradient(#0088cc, #0077b3), -o-linear-gradient(#006699, #00334d);
351
- background: linear-gradient(#0088cc, #0077b3), linear-gradient(#006699, #00334d);
352
- background-position: left top, left 13px;
353
- }
354
- .button-glossy-demo-2, .button-glossy-demo-2:before {
355
- background-size: 100% 50%;
356
- background-repeat: no-repeat;
357
- }
358
- .button-glossy-demo-2:hover {
359
- text-decoration: none;
360
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1ab2ff), color-stop(50%, #0070a8), color-stop(100%, #0088cc));
361
- background: -webkit-linear-gradient(#1ab2ff, #0070a8, #0088cc);
362
- background: -moz-linear-gradient(#1ab2ff, #0070a8, #0088cc);
363
- background: -o-linear-gradient(#1ab2ff, #0070a8, #0088cc);
364
- background: linear-gradient(#1ab2ff, #0070a8, #0088cc);
365
- }
366
- .button-glossy-demo-2:hover:after {
367
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #75d1ff), color-stop(100%, #007ebd)) 50%;
368
- background: -webkit-linear-gradient(#75d1ff 20%, #007ebd) 50%;
369
- background: -moz-linear-gradient(#75d1ff 20%, #007ebd) 50%;
370
- background: -o-linear-gradient(#75d1ff 20%, #007ebd) 50%;
371
- background: linear-gradient(#75d1ff 20%, #007ebd) 50%;
372
- }
373
- .button-glossy-demo-2:hover:before {
374
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1ab2ff), color-stop(50%, #0070a8), color-stop(100%, #0088cc));
375
- background: -webkit-linear-gradient(#1ab2ff, #0070a8, #0088cc);
376
- background: -moz-linear-gradient(#1ab2ff, #0070a8, #0088cc);
377
- background: -o-linear-gradient(#1ab2ff, #0070a8, #0088cc);
378
- background: linear-gradient(#1ab2ff, #0070a8, #0088cc);
379
- }
380
- .button-glossy-demo-2:hover, .button-glossy-demo-2:hover:before {
381
- background-size: 100% 100%;
382
- background-position: left top;
383
- background-repeat: no-repeat;
384
- }
385
- .ie7 .button-glossy-demo-2, .ie8 .button-glossy-demo-2, .ie9 .button-glossy-demo-2 {
386
- -webkit-border-radius: none;
387
- -moz-border-radius: none;
388
- -ms-border-radius: none;
389
- -o-border-radius: none;
390
- border-radius: none;
391
- background: url('../img/picasso-buttons-glossy.png');
392
- background-position: 0 -61px;
393
- }
394
- .ie7 .button-glossy-demo-2:hover, .ie8 .button-glossy-demo-2:hover, .ie9 .button-glossy-demo-2:hover {
395
- background-position: 0 -91px;
396
- }
397
- .ie9 .button-glossy-demo-2 {
398
- -webkit-border-radius: none;
399
- -moz-border-radius: none;
400
- -ms-border-radius: none;
401
- -o-border-radius: none;
402
- border-radius: none;
403
- }
404
-
405
- .button-glossy-demo-3 {
406
- width: 80px;
407
- height: 30px;
408
- display: inline-block;
409
- text-align: center;
410
- position: relative;
411
- z-index: 1;
412
- font-family: sans-serif;
413
- font-size: 12px;
414
- text-decoration: none;
415
- cursor: pointer;
416
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbb450), color-stop(100%, #faa937)), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fa9f1e), color-stop(100%, #c77605));
417
- background: -webkit-linear-gradient(#fbb450, #faa937), -webkit-linear-gradient(#fa9f1e, #c77605);
418
- background: -moz-linear-gradient(#fbb450, #faa937), -moz-linear-gradient(#fa9f1e, #c77605);
419
- background: -o-linear-gradient(#fbb450, #faa937), -o-linear-gradient(#fa9f1e, #c77605);
420
- background: linear-gradient(#fbb450, #faa937), linear-gradient(#fa9f1e, #c77605);
421
- -webkit-border-radius: 5px;
422
- -moz-border-radius: 5px;
423
- -ms-border-radius: 5px;
424
- -o-border-radius: 5px;
425
- border-radius: 5px;
426
- background-position: left top, left 15px;
427
- }
428
- .button-glossy-demo-3:after, .button-glossy-demo-3:before {
429
- content: "";
430
- position: absolute;
431
- display: inline-block;
432
- }
433
- .button-glossy-demo-3:after {
434
- width: 78px;
435
- height: 28px;
436
- left: 1px;
437
- top: 1px;
438
- z-index: 2;
439
- }
440
- .button-glossy-demo-3:before {
441
- width: 76px;
442
- height: 26px;
443
- left: 2px;
444
- top: 2px;
445
- z-index: 3;
446
- }
447
- .button-glossy-demo-3 span {
448
- position: relative;
449
- z-index: 4;
450
- line-height: 30px;
451
- }
452
- .button-glossy-demo-3 span {
453
- color: white;
454
- }
455
- .button-glossy-demo-3:after, .button-glossy-demo-3:before {
456
- -webkit-border-radius: 4px;
457
- -moz-border-radius: 4px;
458
- -ms-border-radius: 4px;
459
- -o-border-radius: 4px;
460
- border-radius: 4px;
461
- }
462
- .button-glossy-demo-3:after {
463
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(15%, #fef4e6), color-stop(100%, #633b02)) 50%;
464
- background: -webkit-linear-gradient(#fef4e6 15%, #633b02) 50%;
465
- background: -moz-linear-gradient(#fef4e6 15%, #633b02) 50%;
466
- background: -o-linear-gradient(#fef4e6 15%, #633b02) 50%;
467
- background: linear-gradient(#fef4e6 15%, #633b02) 50%;
468
- }
469
- .button-glossy-demo-3:before {
470
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbb450), color-stop(100%, #faa937)), -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fa9f1e), color-stop(100%, #c77605));
471
- background: -webkit-linear-gradient(#fbb450, #faa937), -webkit-linear-gradient(#fa9f1e, #c77605);
472
- background: -moz-linear-gradient(#fbb450, #faa937), -moz-linear-gradient(#fa9f1e, #c77605);
473
- background: -o-linear-gradient(#fbb450, #faa937), -o-linear-gradient(#fa9f1e, #c77605);
474
- background: linear-gradient(#fbb450, #faa937), linear-gradient(#fa9f1e, #c77605);
475
- background-position: left top, left 13px;
476
- }
477
- .button-glossy-demo-3, .button-glossy-demo-3:before {
478
- background-size: 100% 50%;
479
- background-repeat: no-repeat;
480
- }
481
- .button-glossy-demo-3:hover {
482
- text-decoration: none;
483
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fdd49b), color-stop(50%, #faa52d), color-stop(100%, #ffb54c));
484
- background: -webkit-linear-gradient(#fdd49b, #faa52d, #ffb54c);
485
- background: -moz-linear-gradient(#fdd49b, #faa52d, #ffb54c);
486
- background: -o-linear-gradient(#fdd49b, #faa52d, #ffb54c);
487
- background: linear-gradient(#fdd49b, #faa52d, #ffb54c);
488
- }
489
- .button-glossy-demo-3:hover:after {
490
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #fffbf5), color-stop(100%, #fbae41)) 50%;
491
- background: -webkit-linear-gradient(#fffbf5 20%, #fbae41) 50%;
492
- background: -moz-linear-gradient(#fffbf5 20%, #fbae41) 50%;
493
- background: -o-linear-gradient(#fffbf5 20%, #fbae41) 50%;
494
- background: linear-gradient(#fffbf5 20%, #fbae41) 50%;
495
- }
496
- .button-glossy-demo-3:hover:before {
497
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fdd49b), color-stop(50%, #faa52d), color-stop(100%, #ffb54c));
498
- background: -webkit-linear-gradient(#fdd49b, #faa52d, #ffb54c);
499
- background: -moz-linear-gradient(#fdd49b, #faa52d, #ffb54c);
500
- background: -o-linear-gradient(#fdd49b, #faa52d, #ffb54c);
501
- background: linear-gradient(#fdd49b, #faa52d, #ffb54c);
502
- }
503
- .button-glossy-demo-3:hover, .button-glossy-demo-3:hover:before {
504
- background-size: 100% 100%;
505
- background-position: left top;
506
- background-repeat: no-repeat;
507
- }
508
- .ie7 .button-glossy-demo-3, .ie8 .button-glossy-demo-3, .ie9 .button-glossy-demo-3 {
509
- -webkit-border-radius: none;
510
- -moz-border-radius: none;
511
- -ms-border-radius: none;
512
- -o-border-radius: none;
513
- border-radius: none;
514
- background: url('../img/picasso-buttons-glossy.png');
515
- background-position: 0 -121px;
516
- }
517
- .ie7 .button-glossy-demo-3:hover, .ie8 .button-glossy-demo-3:hover, .ie9 .button-glossy-demo-3:hover {
518
- background-position: 0 -151px;
519
- }
520
- .ie9 .button-glossy-demo-3 {
521
- -webkit-border-radius: none;
522
- -moz-border-radius: none;
523
- -ms-border-radius: none;
524
- -o-border-radius: none;
525
- border-radius: none;
526
- }
527
-
528
159
  .button-3d-demo-1 {
529
160
  overflow: hidden;
530
161
  display: inline-block;
@@ -632,7 +263,7 @@ body {
632
263
  display: inline-block;
633
264
  line-height: 2.2em;
634
265
  color: white;
635
- border: 1px solid #004466;
266
+ border: 1px solid #00132e;
636
267
  font-family: sans-serif;
637
268
  font-size: 13px;
638
269
  text-decoration: none;
@@ -664,34 +295,34 @@ body {
664
295
  color: white;
665
296
  }
666
297
  .button-3d-demo-2 span {
667
- background-color: #0088cc;
668
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #002233));
669
- background-image: -webkit-linear-gradient(#0088cc, #002233);
670
- background-image: -moz-linear-gradient(#0088cc, #002233);
671
- background-image: -o-linear-gradient(#0088cc, #002233);
672
- background-image: linear-gradient(#0088cc, #002233);
298
+ background-color: #013d93;
299
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #013d93), color-stop(100%, #000000));
300
+ background-image: -webkit-linear-gradient(#013d93, #000000);
301
+ background-image: -moz-linear-gradient(#013d93, #000000);
302
+ background-image: -o-linear-gradient(#013d93, #000000);
303
+ background-image: linear-gradient(#013d93, #000000);
673
304
  -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
674
305
  -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
675
306
  box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
676
307
  }
677
308
  .button-3d-demo-2 span:hover {
678
- background-color: #0088cc;
679
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #004466));
680
- background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #004466);
681
- background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #004466);
682
- background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #004466);
683
- background-image: linear-gradient(rgba(255, 255, 255, 0), #004466);
684
- -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #0088cc;
685
- -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #0088cc;
686
- box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #0088cc;
309
+ background-color: #003d94;
310
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #00132e));
311
+ background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #00132e);
312
+ background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #00132e);
313
+ background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #00132e);
314
+ background-image: linear-gradient(rgba(255, 255, 255, 0), #00132e);
315
+ -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #003d94;
316
+ -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #003d94;
317
+ box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5), inset 0 0 1em #003d94;
687
318
  }
688
319
  .button-3d-demo-2 span:active {
689
320
  text-shadow: 0 -1px 0 black;
690
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #002233));
691
- background-image: -webkit-linear-gradient(#0088cc, #002233);
692
- background-image: -moz-linear-gradient(#0088cc, #002233);
693
- background-image: -o-linear-gradient(#0088cc, #002233);
694
- background-image: linear-gradient(#0088cc, #002233);
321
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #013d93), color-stop(100%, #000000));
322
+ background-image: -webkit-linear-gradient(#013d93, #000000);
323
+ background-image: -moz-linear-gradient(#013d93, #000000);
324
+ background-image: -o-linear-gradient(#013d93, #000000);
325
+ background-image: linear-gradient(#013d93, #000000);
695
326
  -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
696
327
  -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
697
328
  box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.1), inset 0 0.1em 0.2em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(0, 0, 0, 0.1), inset 0 0 1em rgba(0, 0, 0, 0.75);
@@ -714,15 +345,15 @@ body {
714
345
  }
715
346
  .ie7 .button-3d-demo-2 span, .ie8 .button-3d-demo-2 span, .ie9 .button-3d-demo-2 span {
716
347
  *zoom: 1;
717
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#000088CC', endColorstr='#FF002233');
348
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00013D93', endColorstr='#FF000000');
718
349
  }
719
350
  .ie7 .button-3d-demo-2 span:hover, .ie8 .button-3d-demo-2 span:hover, .ie9 .button-3d-demo-2 span:hover {
720
351
  *zoom: 1;
721
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FF004466');
352
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FF00132E');
722
353
  }
723
354
  .ie7 .button-3d-demo-2 span:active, .ie8 .button-3d-demo-2 span:active, .ie9 .button-3d-demo-2 span:active {
724
355
  *zoom: 1;
725
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#000088CC', endColorstr='#FF002233');
356
+ filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00013D93', endColorstr='#FF000000');
726
357
  }
727
358
  .ie7 .button-3d-demo-2.disabled span, .ie7 .button-3d-demo-2.disabled span:hover, .ie7 .button-3d-demo-2.disabled span:active, .ie8 .button-3d-demo-2.disabled span, .ie8 .button-3d-demo-2.disabled span:hover, .ie8 .button-3d-demo-2.disabled span:active, .ie9 .button-3d-demo-2.disabled span, .ie9 .button-3d-demo-2.disabled span:hover, .ie9 .button-3d-demo-2.disabled span:active {
728
359
  *zoom: 1;
@@ -1035,278 +666,6 @@ body {
1035
666
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
1036
667
  }
1037
668
 
1038
- .button-mini-demo-1 {
1039
- display: inline-block;
1040
- height: 20px;
1041
- padding-right: 10px;
1042
- padding-right: 10px;
1043
- font-family: sans-serif;
1044
- text-decoration: none;
1045
- cursor: pointer;
1046
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f0f0f0), color-stop(50%, #e3e3e3), color-stop(51%, #d6d6d6), color-stop(100%, #cacaca));
1047
- background: -webkit-linear-gradient(top, #f0f0f0 0%, #e3e3e3 50%, #d6d6d6 51%, #cacaca 100%);
1048
- background: -moz-linear-gradient(top, #f0f0f0 0%, #e3e3e3 50%, #d6d6d6 51%, #cacaca 100%);
1049
- background: -o-linear-gradient(top, #f0f0f0 0%, #e3e3e3 50%, #d6d6d6 51%, #cacaca 100%);
1050
- background: linear-gradient(top, #f0f0f0 0%, #e3e3e3 50%, #d6d6d6 51%, #cacaca 100%);
1051
- -webkit-border-radius: 20px;
1052
- -moz-border-radius: 20px;
1053
- -ms-border-radius: 20px;
1054
- -o-border-radius: 20px;
1055
- border-radius: 20px;
1056
- -webkit-box-shadow: #333333 0px 1px 2px 0px;
1057
- -moz-box-shadow: #333333 0px 1px 2px 0px;
1058
- box-shadow: #333333 0px 1px 2px 0px;
1059
- }
1060
- .button-mini-demo-1 span {
1061
- height: 20px;
1062
- line-height: 20px;
1063
- padding-left: 10px;
1064
- display: block;
1065
- }
1066
- .button-mini-demo-1:hover {
1067
- text-decoration: none;
1068
- background: #e3e3e3;
1069
- }
1070
- .button-mini-demo-1:active {
1071
- background: #cacaca;
1072
- -webkit-box-shadow: #999999 0px 0px 3px 3px inset;
1073
- -moz-box-shadow: #999999 0px 0px 3px 3px inset;
1074
- box-shadow: #999999 0px 0px 3px 3px inset;
1075
- }
1076
- .button-mini-demo-1 span {
1077
- color: #0e6695;
1078
- font-size: 11px;
1079
- }
1080
- .ie7 .button-mini-demo-1, .ie8 .button-mini-demo-1, .ie9 .button-mini-demo-1 {
1081
- background: url('../img/picasso-buttons-mini.png');
1082
- background-position: right -1px;
1083
- }
1084
- .ie7 .button-mini-demo-1:hover, .ie8 .button-mini-demo-1:hover, .ie9 .button-mini-demo-1:hover {
1085
- background-position: right -21px;
1086
- }
1087
- .ie7 .button-mini-demo-1 span, .ie8 .button-mini-demo-1 span, .ie9 .button-mini-demo-1 span {
1088
- background-image: url('../img/picasso-buttons-mini.png');
1089
- background-color: white;
1090
- background-position: 0 -1px;
1091
- }
1092
- .ie7 .button-mini-demo-1 span:hover, .ie8 .button-mini-demo-1 span:hover, .ie9 .button-mini-demo-1 span:hover {
1093
- background-position: 0 -21px;
1094
- }
1095
- .ie9 .button-mini-demo-1 {
1096
- -webkit-border-radius: none;
1097
- -moz-border-radius: none;
1098
- -ms-border-radius: none;
1099
- -o-border-radius: none;
1100
- border-radius: none;
1101
- -webkit-box-shadow: none;
1102
- -moz-box-shadow: none;
1103
- box-shadow: none;
1104
- }
1105
-
1106
- .button-mini-demo-2 {
1107
- display: inline-block;
1108
- height: 20px;
1109
- padding-right: 10px;
1110
- padding-right: 10px;
1111
- font-family: sans-serif;
1112
- text-decoration: none;
1113
- cursor: pointer;
1114
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(50%, #0077b3), color-stop(51%, #006699), color-stop(100%, #005580));
1115
- background: -webkit-linear-gradient(top, #0088cc 0%, #0077b3 50%, #006699 51%, #005580 100%);
1116
- background: -moz-linear-gradient(top, #0088cc 0%, #0077b3 50%, #006699 51%, #005580 100%);
1117
- background: -o-linear-gradient(top, #0088cc 0%, #0077b3 50%, #006699 51%, #005580 100%);
1118
- background: linear-gradient(top, #0088cc 0%, #0077b3 50%, #006699 51%, #005580 100%);
1119
- -webkit-border-radius: 20px;
1120
- -moz-border-radius: 20px;
1121
- -ms-border-radius: 20px;
1122
- -o-border-radius: 20px;
1123
- border-radius: 20px;
1124
- -webkit-box-shadow: #333333 0px 1px 2px 0px;
1125
- -moz-box-shadow: #333333 0px 1px 2px 0px;
1126
- box-shadow: #333333 0px 1px 2px 0px;
1127
- }
1128
- .button-mini-demo-2 span {
1129
- height: 20px;
1130
- line-height: 20px;
1131
- padding-left: 10px;
1132
- display: block;
1133
- }
1134
- .button-mini-demo-2:hover {
1135
- text-decoration: none;
1136
- background: #0077b3;
1137
- }
1138
- .button-mini-demo-2:active {
1139
- background: #005580;
1140
- -webkit-box-shadow: #999999 0px 0px 3px 3px inset;
1141
- -moz-box-shadow: #999999 0px 0px 3px 3px inset;
1142
- box-shadow: #999999 0px 0px 3px 3px inset;
1143
- }
1144
- .button-mini-demo-2 span {
1145
- color: white;
1146
- font-size: 11px;
1147
- }
1148
- .ie7 .button-mini-demo-2, .ie8 .button-mini-demo-2, .ie9 .button-mini-demo-2 {
1149
- background: url('../img/picasso-buttons-mini.png');
1150
- background-position: right -41px;
1151
- }
1152
- .ie7 .button-mini-demo-2:hover, .ie8 .button-mini-demo-2:hover, .ie9 .button-mini-demo-2:hover {
1153
- background-position: right -61px;
1154
- }
1155
- .ie7 .button-mini-demo-2 span, .ie8 .button-mini-demo-2 span, .ie9 .button-mini-demo-2 span {
1156
- background-image: url('../img/picasso-buttons-mini.png');
1157
- background-color: white;
1158
- background-position: 0 -41px;
1159
- }
1160
- .ie7 .button-mini-demo-2 span:hover, .ie8 .button-mini-demo-2 span:hover, .ie9 .button-mini-demo-2 span:hover {
1161
- background-position: 0 -61px;
1162
- }
1163
- .ie9 .button-mini-demo-2 {
1164
- -webkit-border-radius: none;
1165
- -moz-border-radius: none;
1166
- -ms-border-radius: none;
1167
- -o-border-radius: none;
1168
- border-radius: none;
1169
- -webkit-box-shadow: none;
1170
- -moz-box-shadow: none;
1171
- box-shadow: none;
1172
- }
1173
-
1174
- .button-mini-demo-3 {
1175
- display: inline-block;
1176
- height: 20px;
1177
- padding-right: 10px;
1178
- padding-right: 10px;
1179
- font-family: sans-serif;
1180
- text-decoration: none;
1181
- cursor: pointer;
1182
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #da4f49), color-stop(50%, #d63b34), color-stop(51%, #c72f29), color-stop(100%, #b22a24));
1183
- background: -webkit-linear-gradient(top, #da4f49 0%, #d63b34 50%, #c72f29 51%, #b22a24 100%);
1184
- background: -moz-linear-gradient(top, #da4f49 0%, #d63b34 50%, #c72f29 51%, #b22a24 100%);
1185
- background: -o-linear-gradient(top, #da4f49 0%, #d63b34 50%, #c72f29 51%, #b22a24 100%);
1186
- background: linear-gradient(top, #da4f49 0%, #d63b34 50%, #c72f29 51%, #b22a24 100%);
1187
- -webkit-border-radius: 20px;
1188
- -moz-border-radius: 20px;
1189
- -ms-border-radius: 20px;
1190
- -o-border-radius: 20px;
1191
- border-radius: 20px;
1192
- -webkit-box-shadow: #333333 0px 1px 2px 0px;
1193
- -moz-box-shadow: #333333 0px 1px 2px 0px;
1194
- box-shadow: #333333 0px 1px 2px 0px;
1195
- }
1196
- .button-mini-demo-3 span {
1197
- height: 20px;
1198
- line-height: 20px;
1199
- padding-left: 10px;
1200
- display: block;
1201
- }
1202
- .button-mini-demo-3:hover {
1203
- text-decoration: none;
1204
- background: #d63b34;
1205
- }
1206
- .button-mini-demo-3:active {
1207
- background: #b22a24;
1208
- -webkit-box-shadow: #999999 0px 0px 3px 3px inset;
1209
- -moz-box-shadow: #999999 0px 0px 3px 3px inset;
1210
- box-shadow: #999999 0px 0px 3px 3px inset;
1211
- }
1212
- .button-mini-demo-3 span {
1213
- color: white;
1214
- font-size: 11px;
1215
- }
1216
- .ie7 .button-mini-demo-3, .ie8 .button-mini-demo-3, .ie9 .button-mini-demo-3 {
1217
- background: url('../img/picasso-buttons-mini.png');
1218
- background-position: right -81px;
1219
- }
1220
- .ie7 .button-mini-demo-3:hover, .ie8 .button-mini-demo-3:hover, .ie9 .button-mini-demo-3:hover {
1221
- background-position: right -101px;
1222
- }
1223
- .ie7 .button-mini-demo-3 span, .ie8 .button-mini-demo-3 span, .ie9 .button-mini-demo-3 span {
1224
- background-image: url('../img/picasso-buttons-mini.png');
1225
- background-color: white;
1226
- background-position: 0 -81px;
1227
- }
1228
- .ie7 .button-mini-demo-3 span:hover, .ie8 .button-mini-demo-3 span:hover, .ie9 .button-mini-demo-3 span:hover {
1229
- background-position: 0 -101px;
1230
- }
1231
- .ie9 .button-mini-demo-3 {
1232
- -webkit-border-radius: none;
1233
- -moz-border-radius: none;
1234
- -ms-border-radius: none;
1235
- -o-border-radius: none;
1236
- border-radius: none;
1237
- -webkit-box-shadow: none;
1238
- -moz-box-shadow: none;
1239
- box-shadow: none;
1240
- }
1241
-
1242
- .button-mini-demo-4 {
1243
- display: inline-block;
1244
- height: 20px;
1245
- padding-right: 10px;
1246
- padding-right: 10px;
1247
- font-family: sans-serif;
1248
- text-decoration: none;
1249
- cursor: pointer;
1250
- background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #414141), color-stop(50%, #343434), color-stop(51%, #272727), color-stop(100%, #1b1b1b));
1251
- background: -webkit-linear-gradient(top, #414141 0%, #343434 50%, #272727 51%, #1b1b1b 100%);
1252
- background: -moz-linear-gradient(top, #414141 0%, #343434 50%, #272727 51%, #1b1b1b 100%);
1253
- background: -o-linear-gradient(top, #414141 0%, #343434 50%, #272727 51%, #1b1b1b 100%);
1254
- background: linear-gradient(top, #414141 0%, #343434 50%, #272727 51%, #1b1b1b 100%);
1255
- -webkit-border-radius: 20px;
1256
- -moz-border-radius: 20px;
1257
- -ms-border-radius: 20px;
1258
- -o-border-radius: 20px;
1259
- border-radius: 20px;
1260
- -webkit-box-shadow: #333333 0px 1px 2px 0px;
1261
- -moz-box-shadow: #333333 0px 1px 2px 0px;
1262
- box-shadow: #333333 0px 1px 2px 0px;
1263
- }
1264
- .button-mini-demo-4 span {
1265
- height: 20px;
1266
- line-height: 20px;
1267
- padding-left: 10px;
1268
- display: block;
1269
- }
1270
- .button-mini-demo-4:hover {
1271
- text-decoration: none;
1272
- background: #343434;
1273
- }
1274
- .button-mini-demo-4:active {
1275
- background: #1b1b1b;
1276
- -webkit-box-shadow: #999999 0px 0px 3px 3px inset;
1277
- -moz-box-shadow: #999999 0px 0px 3px 3px inset;
1278
- box-shadow: #999999 0px 0px 3px 3px inset;
1279
- }
1280
- .button-mini-demo-4 span {
1281
- color: white;
1282
- font-size: 11px;
1283
- }
1284
- .ie7 .button-mini-demo-4, .ie8 .button-mini-demo-4, .ie9 .button-mini-demo-4 {
1285
- background: url('../img/picasso-buttons-mini.png');
1286
- background-position: right -121px;
1287
- }
1288
- .ie7 .button-mini-demo-4:hover, .ie8 .button-mini-demo-4:hover, .ie9 .button-mini-demo-4:hover {
1289
- background-position: right -141px;
1290
- }
1291
- .ie7 .button-mini-demo-4 span, .ie8 .button-mini-demo-4 span, .ie9 .button-mini-demo-4 span {
1292
- background-image: url('../img/picasso-buttons-mini.png');
1293
- background-color: white;
1294
- background-position: 0 -121px;
1295
- }
1296
- .ie7 .button-mini-demo-4 span:hover, .ie8 .button-mini-demo-4 span:hover, .ie9 .button-mini-demo-4 span:hover {
1297
- background-position: 0 -141px;
1298
- }
1299
- .ie9 .button-mini-demo-4 {
1300
- -webkit-border-radius: none;
1301
- -moz-border-radius: none;
1302
- -ms-border-radius: none;
1303
- -o-border-radius: none;
1304
- border-radius: none;
1305
- -webkit-box-shadow: none;
1306
- -moz-box-shadow: none;
1307
- box-shadow: none;
1308
- }
1309
-
1310
669
  .list-grid-demo-1:before, .list-grid-demo-1:after {
1311
670
  content: "";
1312
671
  display: table;
@@ -1403,7 +762,7 @@ body {
1403
762
  padding: 0 15px;
1404
763
  }
1405
764
  .ie7 .nav-demo-1 ul li, .ie8 .nav-demo-1 ul li, .ie9 .nav-demo-1 ul li {
1406
- height: 46px;
765
+ height: 40px;
1407
766
  }
1408
767
  .nav-demo-1 ul {
1409
768
  list-style: none;
@@ -1457,40 +816,21 @@ body {
1457
816
  background-image: linear-gradient(#e6e6e6, #ffffff);
1458
817
  }
1459
818
  .ie7 .nav-demo-1 ul li, .ie8 .nav-demo-1 ul li, .ie9 .nav-demo-1 ul li {
1460
- border-left: none;
1461
- border-top: none;
1462
- border-bottom: none;
1463
- background: transparent url('../img/picasso-nav.png') no-repeat center -1px;
1464
- }
1465
- .ie7 .nav-demo-1 ul li a, .ie8 .nav-demo-1 ul li a, .ie9 .nav-demo-1 ul li a {
1466
- border-left: 1px solid #acacac;
819
+ border-top: 1px solid #acacac;
820
+ border-bottom: 1px solid #acacac;
821
+ background-color: white;
1467
822
  }
1468
823
  .ie7 .nav-demo-1 ul li:hover, .ie8 .nav-demo-1 ul li:hover, .ie9 .nav-demo-1 ul li:hover {
1469
- background: transparent url('../img/picasso-nav.png') center -47px no-repeat;
824
+ background: #f2f2f2;
1470
825
  }
1471
826
  .ie7 .nav-demo-1 ul li:first-child, .ie8 .nav-demo-1 ul li:first-child, .ie9 .nav-demo-1 ul li:first-child {
1472
- background: transparent url('../img/picasso-nav.png') no-repeat left -1px;
1473
- }
1474
- .ie7 .nav-demo-1 ul li:first-child a, .ie8 .nav-demo-1 ul li:first-child a, .ie9 .nav-demo-1 ul li:first-child a {
1475
- border-left: none;
1476
- }
1477
- .ie7 .nav-demo-1 ul li:first-child:hover, .ie8 .nav-demo-1 ul li:first-child:hover, .ie9 .nav-demo-1 ul li:first-child:hover {
1478
- background: transparent url('../img/picasso-nav.png') left -47px no-repeat;
1479
- }
1480
- .ie7 .nav-demo-1 ul li:first-child.active, .ie8 .nav-demo-1 ul li:first-child.active, .ie9 .nav-demo-1 ul li:first-child.active {
1481
- background: transparent url('../img/picasso-nav.png') no-repeat left -47px;
827
+ border-left: 1px solid #acacac;
1482
828
  }
1483
829
  .ie7 .nav-demo-1 ul .last, .ie8 .nav-demo-1 ul .last, .ie9 .nav-demo-1 ul .last {
1484
- background: transparent url('../img/picasso-nav.png') no-repeat right -47px;
1485
- }
1486
- .ie7 .nav-demo-1 ul .last:hover, .ie8 .nav-demo-1 ul .last:hover, .ie9 .nav-demo-1 ul .last:hover {
1487
- background: transparent url('../img/picasso-nav.png') right -47px no-repeat;
830
+ border-right: 1px solid #acacac;
1488
831
  }
1489
832
  .ie7 .nav-demo-1 ul .active, .ie8 .nav-demo-1 ul .active, .ie9 .nav-demo-1 ul .active {
1490
- background: transparent url('../img/picasso-nav.png') no-repeat center -47px;
1491
- }
1492
- .ie7 .nav-demo-1 ul .last.active, .ie8 .nav-demo-1 ul .last.active, .ie9 .nav-demo-1 ul .last.active {
1493
- background: transparent url('../img/picasso-nav.png') no-repeat right -47px;
833
+ background: #e6e6e6;
1494
834
  }
1495
835
  .ie9 .nav-demo-1 ul {
1496
836
  -webkit-box-shadow: none;
@@ -1573,13 +913,6 @@ body {
1573
913
  .ie7 .popup-demo-1 {
1574
914
  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
1575
915
  }
1576
- .ie7 .popup-demo-1 .popup-close, .ie8 .popup-demo-1 .popup-close {
1577
- line-height: 26px;
1578
- height: 26px;
1579
- width: 26px;
1580
- top: -13px;
1581
- right: -13px;
1582
- }
1583
916
  .popup-demo-1:after {
1584
917
  background: black;
1585
918
  background: rgba(0, 0, 0, 0.7);
@@ -1649,7 +982,7 @@ body {
1649
982
  filter: alpha(opacity=70);
1650
983
  }
1651
984
  .ie8 .popup-demo-1:after {
1652
- background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAQAAADYv8WvAAAAEElEQVR4nGNi2MywmYkBCAAJ8gFrYOfxtwAAAABJRU5ErkJggg==');
985
+ background: magick-canvas(2px, 2px, magick-fill(black) magick-effect(fade, 0.3));
1653
986
  }
1654
987
  .ie7 .popup-demo-1 .popup-arrow, .ie8 .popup-demo-1 .popup-arrow {
1655
988
  filter: alpha(opacity=70);
@@ -1666,12 +999,6 @@ body {
1666
999
  .ie7 .popup-demo-1 .popup-arrow-right, .ie8 .popup-demo-1 .popup-arrow-right {
1667
1000
  border-left: 10px solid black;
1668
1001
  }
1669
- .ie7 .popup-demo-1 .popup-close, .ie8 .popup-demo-1 .popup-close {
1670
- border-width: 0;
1671
- background-color: transparent;
1672
- background: url('../img/picasso-popup.png');
1673
- background-position: 0 -1px;
1674
- }
1675
1002
 
1676
1003
  .popup-demo-2 {
1677
1004
  padding: 10px;
@@ -1732,13 +1059,6 @@ body {
1732
1059
  .ie7 .popup-demo-2 {
1733
1060
  zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
1734
1061
  }
1735
- .ie7 .popup-demo-2 .popup-close, .ie8 .popup-demo-2 .popup-close {
1736
- line-height: 26px;
1737
- height: 26px;
1738
- width: 26px;
1739
- top: -13px;
1740
- right: -13px;
1741
- }
1742
1062
  .popup-demo-2:after {
1743
1063
  background: gray;
1744
1064
  background: rgba(128, 128, 128, 0.5);
@@ -1808,7 +1128,7 @@ body {
1808
1128
  filter: alpha(opacity=50);
1809
1129
  }
1810
1130
  .ie8 .popup-demo-2:after {
1811
- background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAQAAADYv8WvAAAAD0lEQVR4nGNqAAImBiAAAA8oAgWZ/tnVAAAAAElFTkSuQmCC');
1131
+ background: magick-canvas(2px, 2px, magick-fill(gray) magick-effect(fade, 0.5));
1812
1132
  }
1813
1133
  .ie7 .popup-demo-2 .popup-arrow, .ie8 .popup-demo-2 .popup-arrow {
1814
1134
  filter: alpha(opacity=50);
@@ -1825,12 +1145,6 @@ body {
1825
1145
  .ie7 .popup-demo-2 .popup-arrow-right, .ie8 .popup-demo-2 .popup-arrow-right {
1826
1146
  border-left: 10px solid gray;
1827
1147
  }
1828
- .ie7 .popup-demo-2 .popup-close, .ie8 .popup-demo-2 .popup-close {
1829
- border-width: 0;
1830
- background-color: transparent;
1831
- background: url('../img/picasso-popup.png');
1832
- background-position: 0 -27px;
1833
- }
1834
1148
 
1835
1149
  .bubble-demo-1 {
1836
1150
  margin: 0 0 30px 0;
@@ -2626,7 +1940,7 @@ body {
2626
1940
 
2627
1941
  .despegar-warning-border-demo {
2628
1942
  padding: 10px;
2629
- background: #ff9900;
1943
+ background: #ffcc33;
2630
1944
  }
2631
1945
 
2632
1946
  .despegar-fill-bg-demo {
@@ -2634,6 +1948,16 @@ body {
2634
1948
  background: #84a8fb;
2635
1949
  }
2636
1950
 
1951
+ .despegar-body-bg-demo {
1952
+ padding: 10px;
1953
+ background: #e9eaee;
1954
+ }
1955
+
1956
+ .despegar-promo-text-demo {
1957
+ padding: 10px;
1958
+ background: #008c23;
1959
+ }
1960
+
2637
1961
  .clusters-demo-1 .cluster {
2638
1962
  margin-bottom: 15px;
2639
1963
  border: 1px solid #cccccc;
@@ -2722,8 +2046,6 @@ body {
2722
2046
  </a></li><li><a href="picasso-components-_popups.html">_popups
2723
2047
  </a></li><li><a href="picasso-components-_tooltips.html">_tooltips
2724
2048
  </a></li></ul></li><li><p>buttons</p><ul><li><a href="picasso-components-buttons-_3d.html">_3d
2725
- </a></li><li><a href="picasso-components-buttons-_glossy.html">_glossy
2726
- </a></li><li><a href="picasso-components-buttons-_mini.html">_mini
2727
2049
  </a></li></ul></li><li><p>despegar</p><ul><li><a href="picasso-despegar-_mixins.html">_mixins
2728
2050
  </a></li><li><a href="picasso-despegar-_variables.html">_variables
2729
2051
  </a></li></ul></li><li><p>utils</p><ul><li><a href="picasso-utils-_clearfix.html">_clearfix
@@ -2787,22 +2109,15 @@ body {
2787
2109
  </ul>
2788
2110
  <p> <code>@include nav(435px, 30px, #1164BF, #083C78, black, right);</code>
2789
2111
  </p>
2790
- <h3>Fallback IE</h3>
2791
- <ul>
2792
- <li><code>$nav-ie-fallback</code>: Esta variable permite seleccionar la estrategia de estilos para mostrar el componente en Internet Explorer. Valores disponibles:
2793
- <code>sprites</code> / <code>GD</code>. Valor por defecto: <code>sprites</code>.</li>
2794
- </ul>
2795
2112
  </div><div class="code"><pre><code>@import "compass/css3/images";
2796
2113
  @import "compass/css3/box-shadow";
2797
2114
  @import "compass/css3/border-radius";
2798
- @import "../utils/sprite";
2799
2115
 
2800
2116
  $nav-default-font-size: 16px !default;
2801
2117
  $nav-default-font-family: sans-serif !default;
2802
2118
  $nav-default-image-dir: '' !default;
2803
2119
  $nav-sprite-created: false !default;
2804
2120
  $nav-sprite-name: "picasso-nav" !default;
2805
- $nav-ie-fallback: "sprites" !default;
2806
2121
  $nav-active-item-class: "active" !default;
2807
2122
  $nav-last-item-class: "last" !default;
2808
2123
 
@@ -2866,18 +2181,8 @@ $nav-default-float: left !default;
2866
2181
 
2867
2182
  .ie7 &, .ie8 &, .ie9 &{
2868
2183
 
2869
- @if $nav-ie-fallback == "sprites" {
2870
-
2871
- li{
2872
- height: $height + 6;
2873
- }
2874
-
2875
- } @else {
2876
-
2877
- li{
2878
- height: $height;
2879
- }
2880
-
2184
+ li{
2185
+ height: $height;
2881
2186
  }
2882
2187
 
2883
2188
  }
@@ -2924,129 +2229,27 @@ $nav-default-float: left !default;
2924
2229
 
2925
2230
  .ie7 &, .ie8 &, .ie9 &{
2926
2231
 
2927
- @if $nav-ie-fallback == "sprites" {
2928
-
2929
- $nav-image: magick-canvas($width, $height * 3 + (6 * 3),
2930
-
2931
- //Normal
2932
- magick-compose(
2933
- magick-canvas($width, $height + 6,
2934
- magick-compose(magick-canvas($width, $height,
2935
- magick-fill(magick-linear-gradient($background, darken($background, 10%)))
2936
- magick-corners(5px)
2937
- magick-border($border, 5px, 1px)
2938
- ))
2939
- magick-drop-shadow(270deg, 2px, 6px, $shadow)
2940
- ),
2941
- 0, 0
2942
- ),
2943
-
2944
- //Hover
2945
- magick-compose(
2946
- magick-canvas($width, $height + 6,
2947
- magick-compose(magick-canvas($width, $height,
2948
- magick-fill(magick-linear-gradient($background, darken($background, 5%)))
2949
- magick-corners(5px)
2950
- magick-border($border, 5px, 1px)
2951
- ))
2952
- magick-drop-shadow(270deg, 2px, 6px, $shadow)
2953
- ),
2954
- 0, $height + 6
2955
- ),
2956
-
2957
- //Active
2958
- magick-compose(
2959
- magick-canvas($width, $height + 6,
2960
- magick-compose(magick-canvas($width, $height,
2961
- magick-fill(magick-linear-gradient(darken($background, 10%), $background))
2962
- magick-corners(5px)
2963
- magick-border($border, 5px, 1px)
2964
- ))
2965
- magick-drop-shadow(270deg, 2px, 6px, $shadow)
2966
- ),
2967
- 0, ($height * 2) + (6 * 2)
2968
- )
2969
-
2970
- );
2971
-
2972
- $initial-position: insert-in-sprite($nav-sprite-created, $nav-sprite-name, $nav-image, $width, (($height * 3) + (6 * 3)));
2973
- $nav-sprite-created: true;
2974
-
2975
- li{
2976
- border-left: none;
2977
- border-top: none;
2978
- border-bottom: none;
2979
- background: transparent image-url($nav-sprite-name + ".png", false, false) no-repeat center ((-1) * $initial-position);
2980
-
2981
- a{
2982
- border-left: 1px solid $border;
2983
- }
2984
-
2985
- &:hover{
2986
- background: transparent image-url($nav-sprite-name + ".png", false, false) center ((-1) * ($initial-position + $height + 6)) no-repeat;
2987
- }
2988
-
2989
- &:first-child {
2990
- background: transparent image-url($nav-sprite-name + ".png", false, false) no-repeat left ((-1) * $initial-position);
2991
-
2992
- a{
2993
- border-left: none;
2994
- }
2995
-
2996
- &:hover{
2997
- background: transparent image-url($nav-sprite-name + ".png", false, false) left ((-1) * ($initial-position + $height + 6)) no-repeat;
2998
- }
2999
-
3000
- }
3001
-
3002
- &:first-child.#{$nav-active-item-class}{
3003
- background: transparent image-url($nav-sprite-name + ".png", false, false) no-repeat left ((-1) * ($initial-position + $height + 6));
3004
- }
3005
-
3006
- }
3007
-
3008
- .#{$nav-last-item-class}{
3009
- background: transparent image-url($nav-sprite-name + ".png", false, false) no-repeat right ((-1) * ($initial-position + $height + 6));
3010
-
3011
- &:hover{
3012
- background: transparent image-url($nav-sprite-name + ".png", false, false) right ((-1) * ($initial-position + $height + 6)) no-repeat;
3013
- }
3014
-
3015
- }
3016
-
3017
- .#{$nav-active-item-class}{
3018
- background: transparent image-url($nav-sprite-name + ".png", false, false) no-repeat center ((-1) * ($initial-position + $height + 6));
3019
- }
2232
+ li{
2233
+ border-top: 1px solid $border;
2234
+ border-bottom: 1px solid $border;
2235
+ background-color: $background;
3020
2236
 
3021
- .#{$nav-last-item-class}.#{$nav-active-item-class}{
3022
- background: transparent image-url($nav-sprite-name + ".png", false, false) no-repeat right ((-1) * ($initial-position + $height + 6));
2237
+ &:hover{
2238
+ background: darken($background, 5%);
3023
2239
  }
3024
2240
 
3025
- } @else {
3026
-
3027
- li{
3028
- border-top: 1px solid $border;
3029
- border-bottom: 1px solid $border;
3030
- background-color: $background;
3031
-
3032
- &:hover{
3033
- background: darken($background, 5%);
3034
- }
3035
-
3036
- &:first-child {
3037
- border-left: 1px solid $border;
3038
- }
3039
-
2241
+ &:first-child {
2242
+ border-left: 1px solid $border;
3040
2243
  }
3041
2244
 
3042
- .#{$nav-last-item-class} {
3043
- border-right: 1px solid $border;
3044
- }
2245
+ }
3045
2246
 
3046
- .#{$nav-active-item-class}{
3047
- background: darken($background, 10%);
3048
- }
2247
+ .#{$nav-last-item-class} {
2248
+ border-right: 1px solid $border;
2249
+ }
3049
2250
 
2251
+ .#{$nav-active-item-class}{
2252
+ background: darken($background, 10%);
3050
2253
  }
3051
2254
 
3052
2255
  }