picasso 0.3.6.beta.4 → 0.3.6

Sign up to get free protection for your applications and to get access to all the features.
Files changed (42) hide show
  1. data/README.md +5 -2
  2. data/docs/_picasso.html +1 -2599
  3. data/docs/all.html +1 -2601
  4. data/docs/config.rb +1 -1
  5. data/docs/css/picasso-demos.css +1 -2598
  6. data/docs/css/picasso-docs.css +1 -93
  7. data/docs/index.html +3 -2601
  8. data/docs/picasso-_components.html +1 -2599
  9. data/docs/picasso-_despegar.html +1 -2599
  10. data/docs/picasso-_utils.html +2 -2601
  11. data/docs/picasso-components-_accordions.html +4 -2604
  12. data/docs/picasso-components-_arrows.html +22 -2622
  13. data/docs/picasso-components-_bubbles.html +40 -2665
  14. data/docs/picasso-components-_buttons.html +1 -2599
  15. data/docs/picasso-components-_inputs.html +1 -2599
  16. data/docs/picasso-components-_list-grids.html +1 -2599
  17. data/docs/picasso-components-_navs.html +1 -2599
  18. data/docs/picasso-components-_pagination.html +2 -2599
  19. data/docs/picasso-components-_popups.html +21 -2638
  20. data/docs/picasso-components-_tooltips.html +1 -2603
  21. data/docs/picasso-components-buttons-_3d.html +7 -2599
  22. data/docs/picasso-components-buttons-_glossy.html +1 -2599
  23. data/docs/picasso-components-buttons-_mini.html +1 -2599
  24. data/docs/picasso-despegar-_variables.html +1 -2599
  25. data/docs/picasso-utils-_clearfix.html +1 -2599
  26. data/docs/picasso-utils-_grid.html +1 -2599
  27. data/docs/picasso-utils-_ie.html +1 -2599
  28. data/docs/picasso-utils-_sprite.html +1 -2599
  29. data/docs/sass/picasso-demos.scss +5 -19
  30. data/docs/sass/picasso-docs.scss +0 -14
  31. data/lib/picasso/version.rb +1 -1
  32. data/stylesheets/picasso/_utils.scss +1 -2
  33. data/stylesheets/picasso/components/_accordions.scss +2 -3
  34. data/stylesheets/picasso/components/_arrows.scss +20 -21
  35. data/stylesheets/picasso/components/_bubbles.scss +39 -58
  36. data/stylesheets/picasso/components/_pagination.scss +1 -0
  37. data/stylesheets/picasso/components/_popups.scss +20 -39
  38. data/stylesheets/picasso/components/_tooltips.scss +0 -2
  39. data/stylesheets/picasso/components/buttons/_3d.scss +6 -0
  40. metadata +7 -13
  41. data/docs/picasso-utils-_rem.html +0 -2756
  42. data/stylesheets/picasso/utils/_rem.scss +0 -137
data/docs/picasso-components-_list-grids.html CHANGED
@@ -1,2602 +1,5 @@
1
1
  <!DOCTYPE html><!--[if IE 7]><html class="ie7"></html><![endif]--><!--[if IE 8]><html class="ie8"></html><![endif]--><!--[if IE 9]><html class="ie9"></html><![endif]--><!-- [if gt IE 9] <!--><html><head><title>_list-grids | Picasso. Framework CSS/Sass.
2
- </title><meta charset="utf-8"><link rel="stylesheet" href="docs.css"><link rel="stylesheet" href="css/picasso-docs.css"><!--[if IE]><link rel="stylesheet" href="css/picasso-demos.css"><![endif]--><style type="text/preview">html {
3
- font-size: 16px;
4
- }
5
-
6
- body {
7
- font-family: sans-serif;
8
- padding: 20px 0;
9
- }
10
-
11
- .ie7 .preview, .ie8 .preview, .ie9 .preview {
12
- padding: 15px;
13
- }
14
-
15
- .tooltip-demo-1 {
16
- display: block;
17
- position: absolute;
18
- padding: 0.267em;
19
- font-size: 0.8em;
20
- background-color: black;
21
- color: white;
22
- -webkit-border-radius: 2px;
23
- -moz-border-radius: 2px;
24
- -ms-border-radius: 2px;
25
- -o-border-radius: 2px;
26
- border-radius: 2px;
27
- -webkit-box-shadow: black 0 0 3px;
28
- -moz-box-shadow: black 0 0 3px;
29
- box-shadow: black 0 0 3px;
30
- left: 20px;
31
- }
32
- .tooltip-demo-1.tooltip-left:after, .ie7 .tooltip-demo-1.tooltip-left span {
33
- position: absolute;
34
- top: 0;
35
- padding: 0.267em 0;
36
- left: -0.82em;
37
- content: "\25C4";
38
- }
39
- .ie7 .tooltip-demo-1.tooltip-left {
40
- zoom: expression(this.runtimeStyle.zoom="1", this.insertBefore(document.createElement("span"), this.firstChild).innerHTML="&#9668;");
41
- }
42
- .tooltip-demo-1.tooltip-left:after, .ie7 .tooltip-demo-1 span {
43
- font-family: arial, sans-serif;
44
- font-size: 1em;
45
- color: black;
46
- }
47
- .ie8 .tooltip-demo-1.tooltip-left:after {
48
- font-size: 0.8em;
49
- }
50
-
51
- .tooltip-demo-2 {
52
- display: block;
53
- position: absolute;
54
- padding: 0.267em;
55
- font-size: 0.8em;
56
- background-color: black;
57
- color: white;
58
- -webkit-border-radius: 2px;
59
- -moz-border-radius: 2px;
60
- -ms-border-radius: 2px;
61
- -o-border-radius: 2px;
62
- border-radius: 2px;
63
- -webkit-box-shadow: black 0 0 3px;
64
- -moz-box-shadow: black 0 0 3px;
65
- box-shadow: black 0 0 3px;
66
- left: 140px;
67
- }
68
- .tooltip-demo-2.tooltip-right:after, .ie7 .tooltip-demo-2.tooltip-right span {
69
- position: absolute;
70
- top: 0;
71
- padding: 0.267em 0;
72
- right: -0.82em;
73
- content: "\25BA";
74
- }
75
- .ie7 .tooltip-demo-2.tooltip-right {
76
- zoom: expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("span")).innerHTML="&#9658;");
77
- }
78
- .tooltip-demo-2.tooltip-right:after, .ie7 .tooltip-demo-2 span {
79
- font-family: arial, sans-serif;
80
- font-size: 1em;
81
- color: black;
82
- }
83
- .ie8 .tooltip-demo-2.tooltip-right:after {
84
- font-size: 0.8em;
85
- }
86
-
87
- .tooltip-demo-3 {
88
- display: block;
89
- position: absolute;
90
- padding: 0.4em;
91
- font-size: 1.2em;
92
- background-color: #0074cc;
93
- color: white;
94
- -webkit-border-radius: 2px;
95
- -moz-border-radius: 2px;
96
- -ms-border-radius: 2px;
97
- -o-border-radius: 2px;
98
- border-radius: 2px;
99
- -webkit-box-shadow: #0074cc 0 0 3px;
100
- -moz-box-shadow: #0074cc 0 0 3px;
101
- box-shadow: #0074cc 0 0 3px;
102
- left: 20px;
103
- }
104
- .tooltip-demo-3.tooltip-left:after, .ie7 .tooltip-demo-3.tooltip-left span {
105
- position: absolute;
106
- top: 0;
107
- padding: 0.4em 0;
108
- left: -0.82em;
109
- content: "\25C4";
110
- }
111
- .ie7 .tooltip-demo-3.tooltip-left {
112
- zoom: expression(this.runtimeStyle.zoom="1", this.insertBefore(document.createElement("span"), this.firstChild).innerHTML="&#9668;");
113
- }
114
- .tooltip-demo-3.tooltip-left:after, .ie7 .tooltip-demo-3 span {
115
- font-family: arial, sans-serif;
116
- font-size: 1em;
117
- color: #0074cc;
118
- }
119
- .ie8 .tooltip-demo-3.tooltip-left:after {
120
- font-size: 1.2em;
121
- }
122
-
123
- .tooltip-demo-4 {
124
- display: block;
125
- position: absolute;
126
- padding: 0.4em;
127
- font-size: 1.2em;
128
- background-color: #faa732;
129
- color: white;
130
- -webkit-border-radius: 2px;
131
- -moz-border-radius: 2px;
132
- -ms-border-radius: 2px;
133
- -o-border-radius: 2px;
134
- border-radius: 2px;
135
- -webkit-box-shadow: #faa732 0 0 3px;
136
- -moz-box-shadow: #faa732 0 0 3px;
137
- box-shadow: #faa732 0 0 3px;
138
- left: 300px;
139
- }
140
- .tooltip-demo-4.tooltip-right:after, .ie7 .tooltip-demo-4.tooltip-right span {
141
- position: absolute;
142
- top: 0;
143
- padding: 0.4em 0;
144
- right: -0.82em;
145
- content: "\25BA";
146
- }
147
- .ie7 .tooltip-demo-4.tooltip-right {
148
- zoom: expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("span")).innerHTML="&#9658;");
149
- }
150
- .tooltip-demo-4.tooltip-right:after, .ie7 .tooltip-demo-4 span {
151
- font-family: arial, sans-serif;
152
- font-size: 1em;
153
- color: #faa732;
154
- }
155
- .ie8 .tooltip-demo-4.tooltip-right:after {
156
- font-size: 1.2em;
157
- }
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
- .button-3d-demo-1 {
529
- overflow: hidden;
530
- display: inline-block;
531
- line-height: 2.2em;
532
- color: white;
533
- border: 1px solid #c00811;
534
- font-family: sans-serif;
535
- font-size: 13px;
536
- text-decoration: none;
537
- text-align: center;
538
- cursor: pointer;
539
- text-shadow: 0 1px 0 black;
540
- -webkit-border-radius: 0.4em;
541
- -moz-border-radius: 0.4em;
542
- -ms-border-radius: 0.4em;
543
- -o-border-radius: 0.4em;
544
- border-radius: 0.4em;
545
- }
546
- .button-3d-demo-1:active {
547
- position: relative;
548
- top: 1px;
549
- }
550
- .button-3d-demo-1.disabled:active {
551
- position: static;
552
- }
553
- .button-3d-demo-1 span {
554
- display: block;
555
- padding: 0 13px;
556
- }
557
- .button-3d-demo-1:visited {
558
- color: white;
559
- }
560
- .button-3d-demo-1:hover {
561
- text-decoration: none;
562
- color: white;
563
- }
564
- .button-3d-demo-1 span {
565
- background-color: #f73741;
566
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f73741), color-stop(100%, #8f060d));
567
- background-image: -webkit-linear-gradient(#f73741, #8f060d);
568
- background-image: -moz-linear-gradient(#f73741, #8f060d);
569
- background-image: -o-linear-gradient(#f73741, #8f060d);
570
- background-image: linear-gradient(#f73741, #8f060d);
571
- -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);
572
- -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);
573
- box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
574
- }
575
- .button-3d-demo-1 span:hover {
576
- background-color: #ff2f3a;
577
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #c00811));
578
- background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #c00811);
579
- background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #c00811);
580
- background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #c00811);
581
- background-image: linear-gradient(rgba(255, 255, 255, 0), #c00811);
582
- -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 #ff2f3a;
583
- -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 #ff2f3a;
584
- 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 #ff2f3a;
585
- }
586
- .button-3d-demo-1 span:active {
587
- text-shadow: 0 -1px 0 black;
588
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f73741), color-stop(100%, #8f060d));
589
- background-image: -webkit-linear-gradient(#f73741, #8f060d);
590
- background-image: -moz-linear-gradient(#f73741, #8f060d);
591
- background-image: -o-linear-gradient(#f73741, #8f060d);
592
- background-image: linear-gradient(#f73741, #8f060d);
593
- -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);
594
- -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);
595
- 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);
596
- }
597
- .button-3d-demo-1.disabled {
598
- border: 1px solid #755354;
599
- cursor: not-allowed;
600
- color: white;
601
- }
602
- .button-3d-demo-1.disabled span, .button-3d-demo-1.disabled span:hover, .button-3d-demo-1.disabled span:active {
603
- text-shadow: 0 -1px 0 black;
604
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));
605
- background-image: -webkit-linear-gradient(#979797, #4b4b4b);
606
- background-image: -moz-linear-gradient(#979797, #4b4b4b);
607
- background-image: -o-linear-gradient(#979797, #4b4b4b);
608
- background-image: linear-gradient(#979797, #4b4b4b);
609
- -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
610
- -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
611
- box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
612
- }
613
- .ie7 .button-3d-demo-1 span, .ie8 .button-3d-demo-1 span, .ie9 .button-3d-demo-1 span {
614
- *zoom: 1;
615
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00F73741', endColorstr='#FF8F060D');
616
- }
617
- .ie7 .button-3d-demo-1 span:hover, .ie8 .button-3d-demo-1 span:hover, .ie9 .button-3d-demo-1 span:hover {
618
- *zoom: 1;
619
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FFC00811');
620
- }
621
- .ie7 .button-3d-demo-1 span:active, .ie8 .button-3d-demo-1 span:active, .ie9 .button-3d-demo-1 span:active {
622
- *zoom: 1;
623
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00F73741', endColorstr='#FF8F060D');
624
- }
625
- .ie7 .button-3d-demo-1.disabled span, .ie7 .button-3d-demo-1.disabled span:hover, .ie7 .button-3d-demo-1.disabled span:active, .ie8 .button-3d-demo-1.disabled span, .ie8 .button-3d-demo-1.disabled span:hover, .ie8 .button-3d-demo-1.disabled span:active, .ie9 .button-3d-demo-1.disabled span, .ie9 .button-3d-demo-1.disabled span:hover, .ie9 .button-3d-demo-1.disabled span:active {
626
- *zoom: 1;
627
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
628
- }
629
-
630
- .button-3d-demo-2 {
631
- overflow: hidden;
632
- display: inline-block;
633
- line-height: 2.2em;
634
- color: white;
635
- border: 1px solid #004466;
636
- font-family: sans-serif;
637
- font-size: 13px;
638
- text-decoration: none;
639
- text-align: center;
640
- cursor: pointer;
641
- text-shadow: 0 1px 0 black;
642
- -webkit-border-radius: 0.4em;
643
- -moz-border-radius: 0.4em;
644
- -ms-border-radius: 0.4em;
645
- -o-border-radius: 0.4em;
646
- border-radius: 0.4em;
647
- }
648
- .button-3d-demo-2:active {
649
- position: relative;
650
- top: 1px;
651
- }
652
- .button-3d-demo-2.disabled:active {
653
- position: static;
654
- }
655
- .button-3d-demo-2 span {
656
- display: block;
657
- padding: 0 13px;
658
- }
659
- .button-3d-demo-2:visited {
660
- color: white;
661
- }
662
- .button-3d-demo-2:hover {
663
- text-decoration: none;
664
- color: white;
665
- }
666
- .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);
673
- -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
- -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
- 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
- }
677
- .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;
687
- }
688
- .button-3d-demo-2 span:active {
689
- 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);
695
- -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
- -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
- 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);
698
- }
699
- .button-3d-demo-2.disabled {
700
- border: 1px solid #755354;
701
- cursor: not-allowed;
702
- color: white;
703
- }
704
- .button-3d-demo-2.disabled span, .button-3d-demo-2.disabled span:hover, .button-3d-demo-2.disabled span:active {
705
- text-shadow: 0 -1px 0 black;
706
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));
707
- background-image: -webkit-linear-gradient(#979797, #4b4b4b);
708
- background-image: -moz-linear-gradient(#979797, #4b4b4b);
709
- background-image: -o-linear-gradient(#979797, #4b4b4b);
710
- background-image: linear-gradient(#979797, #4b4b4b);
711
- -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
712
- -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
713
- box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
714
- }
715
- .ie7 .button-3d-demo-2 span, .ie8 .button-3d-demo-2 span, .ie9 .button-3d-demo-2 span {
716
- *zoom: 1;
717
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#000088CC', endColorstr='#FF002233');
718
- }
719
- .ie7 .button-3d-demo-2 span:hover, .ie8 .button-3d-demo-2 span:hover, .ie9 .button-3d-demo-2 span:hover {
720
- *zoom: 1;
721
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FF004466');
722
- }
723
- .ie7 .button-3d-demo-2 span:active, .ie8 .button-3d-demo-2 span:active, .ie9 .button-3d-demo-2 span:active {
724
- *zoom: 1;
725
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#000088CC', endColorstr='#FF002233');
726
- }
727
- .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
- *zoom: 1;
729
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
730
- }
731
-
732
- .button-3d-demo-3 {
733
- overflow: hidden;
734
- display: inline-block;
735
- line-height: 2.2em;
736
- color: white;
737
- border: 1px solid #e08505;
738
- font-family: sans-serif;
739
- font-size: 13px;
740
- text-decoration: none;
741
- text-align: center;
742
- cursor: pointer;
743
- text-shadow: 0 1px 0 black;
744
- -webkit-border-radius: 0.4em;
745
- -moz-border-radius: 0.4em;
746
- -ms-border-radius: 0.4em;
747
- -o-border-radius: 0.4em;
748
- border-radius: 0.4em;
749
- }
750
- .button-3d-demo-3:active {
751
- position: relative;
752
- top: 1px;
753
- }
754
- .button-3d-demo-3.disabled:active {
755
- position: static;
756
- }
757
- .button-3d-demo-3 span {
758
- display: block;
759
- padding: 0 13px;
760
- }
761
- .button-3d-demo-3:visited {
762
- color: white;
763
- }
764
- .button-3d-demo-3:hover {
765
- text-decoration: none;
766
- color: white;
767
- }
768
- .button-3d-demo-3 span {
769
- background-color: #fbb450;
770
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbb450), color-stop(100%, #ae6704));
771
- background-image: -webkit-linear-gradient(#fbb450, #ae6704);
772
- background-image: -moz-linear-gradient(#fbb450, #ae6704);
773
- background-image: -o-linear-gradient(#fbb450, #ae6704);
774
- background-image: linear-gradient(#fbb450, #ae6704);
775
- -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);
776
- -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);
777
- box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
778
- }
779
- .button-3d-demo-3 span:hover {
780
- background-color: #ffb54c;
781
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #e08505));
782
- background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #e08505);
783
- background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #e08505);
784
- background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #e08505);
785
- background-image: linear-gradient(rgba(255, 255, 255, 0), #e08505);
786
- -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 #ffb54c;
787
- -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 #ffb54c;
788
- 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 #ffb54c;
789
- }
790
- .button-3d-demo-3 span:active {
791
- text-shadow: 0 -1px 0 black;
792
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbb450), color-stop(100%, #ae6704));
793
- background-image: -webkit-linear-gradient(#fbb450, #ae6704);
794
- background-image: -moz-linear-gradient(#fbb450, #ae6704);
795
- background-image: -o-linear-gradient(#fbb450, #ae6704);
796
- background-image: linear-gradient(#fbb450, #ae6704);
797
- -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);
798
- -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);
799
- 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);
800
- }
801
- .button-3d-demo-3.disabled {
802
- border: 1px solid #755354;
803
- cursor: not-allowed;
804
- color: white;
805
- }
806
- .button-3d-demo-3.disabled span, .button-3d-demo-3.disabled span:hover, .button-3d-demo-3.disabled span:active {
807
- text-shadow: 0 -1px 0 black;
808
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));
809
- background-image: -webkit-linear-gradient(#979797, #4b4b4b);
810
- background-image: -moz-linear-gradient(#979797, #4b4b4b);
811
- background-image: -o-linear-gradient(#979797, #4b4b4b);
812
- background-image: linear-gradient(#979797, #4b4b4b);
813
- -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
814
- -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
815
- box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
816
- }
817
- .ie7 .button-3d-demo-3 span, .ie8 .button-3d-demo-3 span, .ie9 .button-3d-demo-3 span {
818
- *zoom: 1;
819
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FBB450', endColorstr='#FFAE6704');
820
- }
821
- .ie7 .button-3d-demo-3 span:hover, .ie8 .button-3d-demo-3 span:hover, .ie9 .button-3d-demo-3 span:hover {
822
- *zoom: 1;
823
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FFE08505');
824
- }
825
- .ie7 .button-3d-demo-3 span:active, .ie8 .button-3d-demo-3 span:active, .ie9 .button-3d-demo-3 span:active {
826
- *zoom: 1;
827
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FBB450', endColorstr='#FFAE6704');
828
- }
829
- .ie7 .button-3d-demo-3.disabled span, .ie7 .button-3d-demo-3.disabled span:hover, .ie7 .button-3d-demo-3.disabled span:active, .ie8 .button-3d-demo-3.disabled span, .ie8 .button-3d-demo-3.disabled span:hover, .ie8 .button-3d-demo-3.disabled span:active, .ie9 .button-3d-demo-3.disabled span, .ie9 .button-3d-demo-3.disabled span:hover, .ie9 .button-3d-demo-3.disabled span:active {
830
- *zoom: 1;
831
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
832
- }
833
-
834
- .button-3d-demo-4 {
835
- overflow: hidden;
836
- display: block;
837
- line-height: 2.2em;
838
- color: white;
839
- border: 1px solid #00132e;
840
- font-family: sans-serif;
841
- font-size: 24px;
842
- text-decoration: none;
843
- text-align: center;
844
- cursor: pointer;
845
- text-shadow: 0 1px 0 black;
846
- -webkit-border-radius: 0.4em;
847
- -moz-border-radius: 0.4em;
848
- -ms-border-radius: 0.4em;
849
- -o-border-radius: 0.4em;
850
- border-radius: 0.4em;
851
- }
852
- .button-3d-demo-4:active {
853
- position: relative;
854
- top: 1px;
855
- }
856
- .button-3d-demo-4.disabled:active {
857
- position: static;
858
- }
859
- .button-3d-demo-4 span {
860
- display: block;
861
- padding: 0 24px;
862
- }
863
- .button-3d-demo-4:visited {
864
- color: white;
865
- }
866
- .button-3d-demo-4:hover {
867
- text-decoration: none;
868
- color: white;
869
- }
870
- .button-3d-demo-4 span {
871
- background-color: #013d93;
872
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #013d93), color-stop(100%, #000000));
873
- background-image: -webkit-linear-gradient(#013d93, #000000);
874
- background-image: -moz-linear-gradient(#013d93, #000000);
875
- background-image: -o-linear-gradient(#013d93, #000000);
876
- background-image: linear-gradient(#013d93, #000000);
877
- -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);
878
- -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);
879
- box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
880
- }
881
- .button-3d-demo-4 span:hover {
882
- background-color: #003d94;
883
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #00132e));
884
- background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #00132e);
885
- background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #00132e);
886
- background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #00132e);
887
- background-image: linear-gradient(rgba(255, 255, 255, 0), #00132e);
888
- -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;
889
- -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;
890
- 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;
891
- }
892
- .button-3d-demo-4 span:active {
893
- text-shadow: 0 -1px 0 black;
894
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #013d93), color-stop(100%, #000000));
895
- background-image: -webkit-linear-gradient(#013d93, #000000);
896
- background-image: -moz-linear-gradient(#013d93, #000000);
897
- background-image: -o-linear-gradient(#013d93, #000000);
898
- background-image: linear-gradient(#013d93, #000000);
899
- -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);
900
- -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);
901
- 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);
902
- }
903
- .button-3d-demo-4.disabled {
904
- border: 1px solid #755354;
905
- cursor: not-allowed;
906
- color: white;
907
- }
908
- .button-3d-demo-4.disabled span, .button-3d-demo-4.disabled span:hover, .button-3d-demo-4.disabled span:active {
909
- text-shadow: 0 -1px 0 black;
910
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));
911
- background-image: -webkit-linear-gradient(#979797, #4b4b4b);
912
- background-image: -moz-linear-gradient(#979797, #4b4b4b);
913
- background-image: -o-linear-gradient(#979797, #4b4b4b);
914
- background-image: linear-gradient(#979797, #4b4b4b);
915
- -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
916
- -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
917
- box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
918
- }
919
- .ie7 .button-3d-demo-4 span, .ie8 .button-3d-demo-4 span, .ie9 .button-3d-demo-4 span {
920
- *zoom: 1;
921
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00013D93', endColorstr='#FF000000');
922
- }
923
- .ie7 .button-3d-demo-4 span:hover, .ie8 .button-3d-demo-4 span:hover, .ie9 .button-3d-demo-4 span:hover {
924
- *zoom: 1;
925
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FF00132E');
926
- }
927
- .ie7 .button-3d-demo-4 span:active, .ie8 .button-3d-demo-4 span:active, .ie9 .button-3d-demo-4 span:active {
928
- *zoom: 1;
929
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00013D93', endColorstr='#FF000000');
930
- }
931
- .ie7 .button-3d-demo-4.disabled span, .ie7 .button-3d-demo-4.disabled span:hover, .ie7 .button-3d-demo-4.disabled span:active, .ie8 .button-3d-demo-4.disabled span, .ie8 .button-3d-demo-4.disabled span:hover, .ie8 .button-3d-demo-4.disabled span:active, .ie9 .button-3d-demo-4.disabled span, .ie9 .button-3d-demo-4.disabled span:hover, .ie9 .button-3d-demo-4.disabled span:active {
932
- *zoom: 1;
933
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
934
- }
935
-
936
- .button-3d-demo-5 {
937
- overflow: hidden;
938
- display: inline-block;
939
- line-height: 1.75em;
940
- color: #013d93;
941
- border: 1px solid #bbbbbb;
942
- font-family: sans-serif;
943
- font-size: 11px;
944
- text-decoration: none;
945
- text-align: center;
946
- cursor: pointer;
947
- text-shadow: 0 1px 0 #b5b5b5;
948
- -webkit-border-radius: 1.1em;
949
- -moz-border-radius: 1.1em;
950
- -ms-border-radius: 1.1em;
951
- -o-border-radius: 1.1em;
952
- border-radius: 1.1em;
953
- }
954
- .button-3d-demo-5:active {
955
- position: relative;
956
- top: 1px;
957
- }
958
- .button-3d-demo-5.disabled:active {
959
- position: static;
960
- }
961
- .button-3d-demo-5 span {
962
- display: block;
963
- padding: 0 11px;
964
- }
965
- .button-3d-demo-5:visited {
966
- color: #013d93;
967
- }
968
- .button-3d-demo-5:hover {
969
- text-decoration: none;
970
- color: #013d93;
971
- }
972
- .button-3d-demo-5 span {
973
- background-color: #eeeeee;
974
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eeeeee), color-stop(100%, #a2a2a2));
975
- background-image: -webkit-linear-gradient(#eeeeee, #a2a2a2);
976
- background-image: -moz-linear-gradient(#eeeeee, #a2a2a2);
977
- background-image: -o-linear-gradient(#eeeeee, #a2a2a2);
978
- background-image: linear-gradient(#eeeeee, #a2a2a2);
979
- -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);
980
- -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);
981
- box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.5);
982
- }
983
- .button-3d-demo-5 span:hover {
984
- background-color: #f0ecec;
985
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #bbbbbb));
986
- background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #bbbbbb);
987
- background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #bbbbbb);
988
- background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #bbbbbb);
989
- background-image: linear-gradient(rgba(255, 255, 255, 0), #bbbbbb);
990
- -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 #f0ecec;
991
- -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 #f0ecec;
992
- 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 #f0ecec;
993
- }
994
- .button-3d-demo-5 span:active {
995
- text-shadow: 0 -1px 0 #b5b5b5;
996
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eeeeee), color-stop(100%, #a2a2a2));
997
- background-image: -webkit-linear-gradient(#eeeeee, #a2a2a2);
998
- background-image: -moz-linear-gradient(#eeeeee, #a2a2a2);
999
- background-image: -o-linear-gradient(#eeeeee, #a2a2a2);
1000
- background-image: linear-gradient(#eeeeee, #a2a2a2);
1001
- -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);
1002
- -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);
1003
- 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);
1004
- }
1005
- .button-3d-demo-5.disabled {
1006
- border: 1px solid #755354;
1007
- cursor: not-allowed;
1008
- color: white;
1009
- }
1010
- .button-3d-demo-5.disabled span, .button-3d-demo-5.disabled span:hover, .button-3d-demo-5.disabled span:active {
1011
- text-shadow: 0 -1px 0 black;
1012
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));
1013
- background-image: -webkit-linear-gradient(#979797, #4b4b4b);
1014
- background-image: -moz-linear-gradient(#979797, #4b4b4b);
1015
- background-image: -o-linear-gradient(#979797, #4b4b4b);
1016
- background-image: linear-gradient(#979797, #4b4b4b);
1017
- -webkit-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
1018
- -moz-box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
1019
- box-shadow: 0 0.1em 0.1em rgba(0, 0, 0, 0.5), inset 0 0.1em 0 rgba(255, 255, 255, 0.25), inset 0 0 1em rgba(0, 0, 0, 0.75);
1020
- }
1021
- .ie7 .button-3d-demo-5 span, .ie8 .button-3d-demo-5 span, .ie9 .button-3d-demo-5 span {
1022
- *zoom: 1;
1023
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00EEEEEE', endColorstr='#FFA2A2A2');
1024
- }
1025
- .ie7 .button-3d-demo-5 span:hover, .ie8 .button-3d-demo-5 span:hover, .ie9 .button-3d-demo-5 span:hover {
1026
- *zoom: 1;
1027
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FFBBBBBB');
1028
- }
1029
- .ie7 .button-3d-demo-5 span:active, .ie8 .button-3d-demo-5 span:active, .ie9 .button-3d-demo-5 span:active {
1030
- *zoom: 1;
1031
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00EEEEEE', endColorstr='#FFA2A2A2');
1032
- }
1033
- .ie7 .button-3d-demo-5.disabled span, .ie7 .button-3d-demo-5.disabled span:hover, .ie7 .button-3d-demo-5.disabled span:active, .ie8 .button-3d-demo-5.disabled span, .ie8 .button-3d-demo-5.disabled span:hover, .ie8 .button-3d-demo-5.disabled span:active, .ie9 .button-3d-demo-5.disabled span, .ie9 .button-3d-demo-5.disabled span:hover, .ie9 .button-3d-demo-5.disabled span:active {
1034
- *zoom: 1;
1035
- filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B');
1036
- }
1037
-
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
- .list-grid-demo-1:before, .list-grid-demo-1:after {
1311
- content: "";
1312
- display: table;
1313
- }
1314
- .list-grid-demo-1:after {
1315
- clear: both;
1316
- }
1317
- .ie6 .list-grid-demo-1, .ie7 .list-grid-demo-1 {
1318
- zoom: 1;
1319
- }
1320
- .list-grid-demo-1 ul {
1321
- float: left;
1322
- padding: 0px;
1323
- margin: 0px;
1324
- width: 130px;
1325
- }
1326
- .list-grid-demo-1 ul li {
1327
- height: 30px;
1328
- line-height: 30px;
1329
- padding-left: 10px;
1330
- padding-right: 10px;
1331
- }
1332
- .list-grid-demo-1 ul {
1333
- list-style: none outside none;
1334
- border-top: 1px solid #cccccc;
1335
- border-bottom: 1px solid #cccccc;
1336
- border-right: 1px solid #cccccc;
1337
- }
1338
- .list-grid-demo-1 ul:first-child {
1339
- border-left: 1px solid #cccccc;
1340
- }
1341
- .list-grid-demo-1 ul li {
1342
- text-align: center;
1343
- border: 1px solid transparent;
1344
- }
1345
- .list-grid-demo-1 ul li:first-child {
1346
- border-bottom: 1px solid #cccccc;
1347
- }
1348
- .list-grid-demo-1 ul li:nth-child(odd) {
1349
- background: none repeat scroll 0 0 #eeeeee;
1350
- }
1351
- .list-grid-demo-1 ul li:nth-child(even) {
1352
- background: none repeat scroll 0 0 white;
1353
- }
1354
- .list-grid-demo-1 ul li.cell-hover:hover {
1355
- border: 1px solid #319fda;
1356
- background: #f4fafd;
1357
- cursor: pointer;
1358
- }
1359
- .ie7 .list-grid-demo-1 ul li:first-child, .ie8 .list-grid-demo-1 ul li:first-child {
1360
- background: none repeat scroll 0 0 #eeeeee;
1361
- }
1362
- .ie7 .list-grid-demo-1 ul li.even, .ie8 .list-grid-demo-1 ul li.even {
1363
- background: none repeat scroll 0 0 white;
1364
- }
1365
- .ie7 .list-grid-demo-1 ul li.odd, .ie8 .list-grid-demo-1 ul li.odd {
1366
- background: none repeat scroll 0 0 #eeeeee;
1367
- }
1368
-
1369
- .nav-demo-1:before, .nav-demo-1:after {
1370
- content: "";
1371
- display: table;
1372
- }
1373
- .nav-demo-1:after {
1374
- clear: both;
1375
- }
1376
- .ie6 .nav-demo-1, .ie7 .nav-demo-1 {
1377
- zoom: 1;
1378
- }
1379
- .nav-demo-1 ul {
1380
- margin: 0;
1381
- padding: 0;
1382
- text-align: center;
1383
- float: left;
1384
- }
1385
- .nav-demo-1 ul:before, .nav-demo-1 ul:after {
1386
- content: "";
1387
- display: table;
1388
- }
1389
- .nav-demo-1 ul:after {
1390
- clear: both;
1391
- }
1392
- .ie6 .nav-demo-1 ul, .ie7 .nav-demo-1 ul {
1393
- zoom: 1;
1394
- }
1395
- .nav-demo-1 ul li {
1396
- display: inline-block;
1397
- height: 40px;
1398
- line-height: 40px;
1399
- float: left;
1400
- }
1401
- .nav-demo-1 ul li a {
1402
- display: block;
1403
- padding: 0 15px;
1404
- }
1405
- .ie7 .nav-demo-1 ul li, .ie8 .nav-demo-1 ul li, .ie9 .nav-demo-1 ul li {
1406
- height: 46px;
1407
- }
1408
- .nav-demo-1 ul {
1409
- list-style: none;
1410
- -webkit-box-shadow: 0 6px 6px -6px black;
1411
- -moz-box-shadow: 0 6px 6px -6px black;
1412
- box-shadow: 0 6px 6px -6px black;
1413
- }
1414
- .nav-demo-1 ul li {
1415
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #e6e6e6));
1416
- background-image: -webkit-linear-gradient(#ffffff, #e6e6e6);
1417
- background-image: -moz-linear-gradient(#ffffff, #e6e6e6);
1418
- background-image: -o-linear-gradient(#ffffff, #e6e6e6);
1419
- background-image: linear-gradient(#ffffff, #e6e6e6);
1420
- border-left: 1px solid #acacac;
1421
- border-top: 1px solid #acacac;
1422
- border-bottom: 1px solid #acacac;
1423
- }
1424
- .nav-demo-1 ul li:hover {
1425
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #f2f2f2));
1426
- background-image: -webkit-linear-gradient(#ffffff, #f2f2f2);
1427
- background-image: -moz-linear-gradient(#ffffff, #f2f2f2);
1428
- background-image: -o-linear-gradient(#ffffff, #f2f2f2);
1429
- background-image: linear-gradient(#ffffff, #f2f2f2);
1430
- }
1431
- .nav-demo-1 ul li:first-child {
1432
- -moz-border-radius-topleft: 5px;
1433
- -webkit-border-top-left-radius: 5px;
1434
- border-top-left-radius: 5px;
1435
- -moz-border-radius-bottomleft: 5px;
1436
- -webkit-border-bottom-left-radius: 5px;
1437
- border-bottom-left-radius: 5px;
1438
- }
1439
- .nav-demo-1 ul li:last-child {
1440
- -moz-border-radius-topright: 5px;
1441
- -webkit-border-top-right-radius: 5px;
1442
- border-top-right-radius: 5px;
1443
- -moz-border-radius-bottomright: 5px;
1444
- -webkit-border-bottom-right-radius: 5px;
1445
- border-bottom-right-radius: 5px;
1446
- border-right: 1px solid #acacac;
1447
- }
1448
- .nav-demo-1 ul li a {
1449
- font-size: 16px;
1450
- font-family: sans-serif;
1451
- }
1452
- .nav-demo-1 ul .active {
1453
- background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e6e6e6), color-stop(100%, #ffffff));
1454
- background-image: -webkit-linear-gradient(#e6e6e6, #ffffff);
1455
- background-image: -moz-linear-gradient(#e6e6e6, #ffffff);
1456
- background-image: -o-linear-gradient(#e6e6e6, #ffffff);
1457
- background-image: linear-gradient(#e6e6e6, #ffffff);
1458
- }
1459
- .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;
1467
- }
1468
- .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;
1470
- }
1471
- .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;
1482
- }
1483
- .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;
1488
- }
1489
- .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;
1494
- }
1495
- .ie9 .nav-demo-1 ul {
1496
- -webkit-box-shadow: none;
1497
- -moz-box-shadow: none;
1498
- box-shadow: none;
1499
- }
1500
- .ie9 .nav-demo-1 ul li:first-child {
1501
- -moz-border-radius-topleft: none;
1502
- -webkit-border-top-left-radius: none;
1503
- border-top-left-radius: none;
1504
- -moz-border-radius-bottomleft: none;
1505
- -webkit-border-bottom-left-radius: none;
1506
- border-bottom-left-radius: none;
1507
- }
1508
- .ie9 .nav-demo-1 ul li:last-child {
1509
- -moz-border-radius-topright: none;
1510
- -webkit-border-top-right-radius: none;
1511
- border-top-right-radius: none;
1512
- -moz-border-radius-bottomright: none;
1513
- -webkit-border-bottom-right-radius: none;
1514
- border-bottom-right-radius: none;
1515
- border: none;
1516
- }
1517
-
1518
- .popup-demo-1 {
1519
- padding: 10px;
1520
- position: absolute;
1521
- }
1522
- .popup-demo-1:after, .ie7 .popup-demo-1 .after {
1523
- content: "";
1524
- position: absolute;
1525
- top: 0;
1526
- left: 0;
1527
- width: 100%;
1528
- height: 100%;
1529
- z-index: 0;
1530
- }
1531
- .popup-demo-1 .popup-header h4 {
1532
- line-height: 20px;
1533
- padding: 10px;
1534
- }
1535
- .popup-demo-1 .popup-container {
1536
- z-index: 1;
1537
- position: relative;
1538
- }
1539
- .popup-demo-1 .popup-arrow {
1540
- position: absolute;
1541
- height: 0;
1542
- width: 0;
1543
- }
1544
- .popup-demo-1 .popup-arrow-bottom {
1545
- bottom: -10px;
1546
- left: 10px;
1547
- }
1548
- .popup-demo-1 .popup-arrow-top {
1549
- top: -10px;
1550
- left: 10px;
1551
- }
1552
- .popup-demo-1 .popup-arrow-left {
1553
- left: -10px;
1554
- top: 10px;
1555
- }
1556
- .popup-demo-1 .popup-arrow-right {
1557
- right: -10px;
1558
- top: 10px;
1559
- }
1560
- .popup-demo-1 .popup-close {
1561
- position: absolute;
1562
- z-index: 10;
1563
- text-align: center;
1564
- line-height: 20px;
1565
- height: 20px;
1566
- width: 20px;
1567
- top: -13px;
1568
- right: -13px;
1569
- -webkit-box-sizing: content-box;
1570
- -moz-box-sizing: content-box;
1571
- box-sizing: content-box;
1572
- }
1573
- .ie7 .popup-demo-1 {
1574
- zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
1575
- }
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
- .popup-demo-1:after {
1584
- background: black;
1585
- background: rgba(0, 0, 0, 0.7);
1586
- -webkit-border-radius: 3px;
1587
- -moz-border-radius: 3px;
1588
- -ms-border-radius: 3px;
1589
- -o-border-radius: 3px;
1590
- border-radius: 3px;
1591
- -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1592
- -moz-box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1593
- box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1594
- }
1595
- .popup-demo-1 .popup-header {
1596
- background: none repeat scroll 0 0 #f7f7f7;
1597
- display: block;
1598
- }
1599
- .popup-demo-1 .popup-header h4 {
1600
- margin: 0;
1601
- color: #003770;
1602
- font-family: sans-serif;
1603
- font-size: 16px;
1604
- font-weight: normal;
1605
- }
1606
- .popup-demo-1 .popup-content {
1607
- background: white;
1608
- border: 1px solid transparent;
1609
- }
1610
- .popup-demo-1 .popup-arrow-bottom {
1611
- border-left: 10px solid transparent;
1612
- border-right: 10px solid transparent;
1613
- border-top: 10px solid rgba(0, 0, 0, 0.7);
1614
- }
1615
- .popup-demo-1 .popup-arrow-top {
1616
- border-left: 10px solid transparent;
1617
- border-right: 10px solid transparent;
1618
- border-bottom: 10px solid rgba(0, 0, 0, 0.7);
1619
- }
1620
- .popup-demo-1 .popup-arrow-left {
1621
- border-top: 10px solid transparent;
1622
- border-bottom: 10px solid transparent;
1623
- border-right: 10px solid rgba(0, 0, 0, 0.7);
1624
- }
1625
- .popup-demo-1 .popup-arrow-right {
1626
- border-top: 10px solid transparent;
1627
- border-bottom: 10px solid transparent;
1628
- border-left: 10px solid rgba(0, 0, 0, 0.7);
1629
- }
1630
- .popup-demo-1 .popup-close {
1631
- cursor: pointer;
1632
- border: 3px solid white;
1633
- color: white;
1634
- font-weight: bold;
1635
- font-family: arial, sans-serif;
1636
- font-size: 20px;
1637
- background: #319fda;
1638
- -webkit-border-radius: 20px;
1639
- -moz-border-radius: 20px;
1640
- -ms-border-radius: 20px;
1641
- -o-border-radius: 20px;
1642
- border-radius: 20px;
1643
- -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1644
- -moz-box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1645
- box-shadow: rgba(0, 0, 0, 0.5) 0 0 10px;
1646
- }
1647
- .ie7 .popup-demo-1 .after {
1648
- background-color: black;
1649
- filter: alpha(opacity=70);
1650
- }
1651
- .ie8 .popup-demo-1:after {
1652
- background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAQAAADYv8WvAAAAEElEQVR4nGNi2MywmYkBCAAJ8gFrYOfxtwAAAABJRU5ErkJggg==');
1653
- }
1654
- .ie7 .popup-demo-1 .popup-arrow, .ie8 .popup-demo-1 .popup-arrow {
1655
- filter: alpha(opacity=70);
1656
- }
1657
- .ie7 .popup-demo-1 .popup-arrow-bottom, .ie8 .popup-demo-1 .popup-arrow-bottom {
1658
- border-top: 10px solid black;
1659
- }
1660
- .ie7 .popup-demo-1 .popup-arrow-top, .ie8 .popup-demo-1 .popup-arrow-top {
1661
- border-bottom: 10px solid black;
1662
- }
1663
- .ie7 .popup-demo-1 .popup-arrow-left, .ie8 .popup-demo-1 .popup-arrow-left {
1664
- border-right: 10px solid black;
1665
- }
1666
- .ie7 .popup-demo-1 .popup-arrow-right, .ie8 .popup-demo-1 .popup-arrow-right {
1667
- border-left: 10px solid black;
1668
- }
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
-
1676
- .popup-demo-2 {
1677
- padding: 10px;
1678
- position: absolute;
1679
- color: white;
1680
- }
1681
- .popup-demo-2:after, .ie7 .popup-demo-2 .after {
1682
- content: "";
1683
- position: absolute;
1684
- top: 0;
1685
- left: 0;
1686
- width: 100%;
1687
- height: 100%;
1688
- z-index: 0;
1689
- }
1690
- .popup-demo-2 .popup-header h4 {
1691
- line-height: 20px;
1692
- padding: 10px;
1693
- }
1694
- .popup-demo-2 .popup-container {
1695
- z-index: 1;
1696
- position: relative;
1697
- }
1698
- .popup-demo-2 .popup-arrow {
1699
- position: absolute;
1700
- height: 0;
1701
- width: 0;
1702
- }
1703
- .popup-demo-2 .popup-arrow-bottom {
1704
- bottom: -10px;
1705
- left: 10px;
1706
- }
1707
- .popup-demo-2 .popup-arrow-top {
1708
- top: -10px;
1709
- left: 10px;
1710
- }
1711
- .popup-demo-2 .popup-arrow-left {
1712
- left: -10px;
1713
- top: 10px;
1714
- }
1715
- .popup-demo-2 .popup-arrow-right {
1716
- right: -10px;
1717
- top: 10px;
1718
- }
1719
- .popup-demo-2 .popup-close {
1720
- position: absolute;
1721
- z-index: 10;
1722
- text-align: center;
1723
- line-height: 20px;
1724
- height: 20px;
1725
- width: 20px;
1726
- top: -13px;
1727
- right: -13px;
1728
- -webkit-box-sizing: content-box;
1729
- -moz-box-sizing: content-box;
1730
- box-sizing: content-box;
1731
- }
1732
- .ie7 .popup-demo-2 {
1733
- zoom: expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" );
1734
- }
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
- .popup-demo-2:after {
1743
- background: gray;
1744
- background: rgba(128, 128, 128, 0.5);
1745
- -webkit-border-radius: 10px;
1746
- -moz-border-radius: 10px;
1747
- -ms-border-radius: 10px;
1748
- -o-border-radius: 10px;
1749
- border-radius: 10px;
1750
- -webkit-box-shadow: 0px 0px 5px #333333;
1751
- -moz-box-shadow: 0px 0px 5px #333333;
1752
- box-shadow: 0px 0px 5px #333333;
1753
- }
1754
- .popup-demo-2 .popup-header {
1755
- background: white;
1756
- display: block;
1757
- }
1758
- .popup-demo-2 .popup-header h4 {
1759
- margin: 0;
1760
- color: black;
1761
- font-family: sans-serif;
1762
- font-size: 16px;
1763
- font-weight: normal;
1764
- }
1765
- .popup-demo-2 .popup-content {
1766
- background: black;
1767
- border: 1px solid transparent;
1768
- }
1769
- .popup-demo-2 .popup-arrow-bottom {
1770
- border-left: 10px solid transparent;
1771
- border-right: 10px solid transparent;
1772
- border-top: 10px solid rgba(128, 128, 128, 0.5);
1773
- }
1774
- .popup-demo-2 .popup-arrow-top {
1775
- border-left: 10px solid transparent;
1776
- border-right: 10px solid transparent;
1777
- border-bottom: 10px solid rgba(128, 128, 128, 0.5);
1778
- }
1779
- .popup-demo-2 .popup-arrow-left {
1780
- border-top: 10px solid transparent;
1781
- border-bottom: 10px solid transparent;
1782
- border-right: 10px solid rgba(128, 128, 128, 0.5);
1783
- }
1784
- .popup-demo-2 .popup-arrow-right {
1785
- border-top: 10px solid transparent;
1786
- border-bottom: 10px solid transparent;
1787
- border-left: 10px solid rgba(128, 128, 128, 0.5);
1788
- }
1789
- .popup-demo-2 .popup-close {
1790
- cursor: pointer;
1791
- border: 3px solid white;
1792
- color: white;
1793
- font-weight: bold;
1794
- font-family: arial, sans-serif;
1795
- font-size: 20px;
1796
- background: black;
1797
- -webkit-border-radius: 20px;
1798
- -moz-border-radius: 20px;
1799
- -ms-border-radius: 20px;
1800
- -o-border-radius: 20px;
1801
- border-radius: 20px;
1802
- -webkit-box-shadow: 0px 0px 5px #333333;
1803
- -moz-box-shadow: 0px 0px 5px #333333;
1804
- box-shadow: 0px 0px 5px #333333;
1805
- }
1806
- .ie7 .popup-demo-2 .after {
1807
- background-color: gray;
1808
- filter: alpha(opacity=50);
1809
- }
1810
- .ie8 .popup-demo-2:after {
1811
- background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAQAAADYv8WvAAAAD0lEQVR4nGNqAAImBiAAAA8oAgWZ/tnVAAAAAElFTkSuQmCC');
1812
- }
1813
- .ie7 .popup-demo-2 .popup-arrow, .ie8 .popup-demo-2 .popup-arrow {
1814
- filter: alpha(opacity=50);
1815
- }
1816
- .ie7 .popup-demo-2 .popup-arrow-bottom, .ie8 .popup-demo-2 .popup-arrow-bottom {
1817
- border-top: 10px solid gray;
1818
- }
1819
- .ie7 .popup-demo-2 .popup-arrow-top, .ie8 .popup-demo-2 .popup-arrow-top {
1820
- border-bottom: 10px solid gray;
1821
- }
1822
- .ie7 .popup-demo-2 .popup-arrow-left, .ie8 .popup-demo-2 .popup-arrow-left {
1823
- border-right: 10px solid gray;
1824
- }
1825
- .ie7 .popup-demo-2 .popup-arrow-right, .ie8 .popup-demo-2 .popup-arrow-right {
1826
- border-left: 10px solid gray;
1827
- }
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
-
1835
- .bubble-demo-1 {
1836
- margin: 0 0 30px 0;
1837
- }
1838
-
1839
- .bubble-demo-1 {
1840
- padding: 0.7em;
1841
- position: relative;
1842
- background: #eeeeee;
1843
- -webkit-border-radius: 0.5em;
1844
- -moz-border-radius: 0.5em;
1845
- -ms-border-radius: 0.5em;
1846
- -o-border-radius: 0.5em;
1847
- border-radius: 0.5em;
1848
- }
1849
- .bubble-demo-1 blockquote, .bubble-demo-1 h4 {
1850
- margin: 0;
1851
- }
1852
- .bubble-demo-1:after {
1853
- content: '';
1854
- position: absolute;
1855
- right: 1em;
1856
- bottom: -1em;
1857
- }
1858
- .bubble-demo-1 blockquote {
1859
- color: #999999;
1860
- }
1861
- .bubble-demo-1:after {
1862
- border-left: 0.7em solid transparent;
1863
- border-right: 0.7em solid transparent;
1864
- border-top: 1em solid #eeeeee;
1865
- }
1866
-
1867
- .bubble-demo-2 {
1868
- padding: 0.7em;
1869
- position: relative;
1870
- background: #eeeeee;
1871
- -webkit-border-radius: 0.5em;
1872
- -moz-border-radius: 0.5em;
1873
- -ms-border-radius: 0.5em;
1874
- -o-border-radius: 0.5em;
1875
- border-radius: 0.5em;
1876
- }
1877
- .bubble-demo-2 blockquote, .bubble-demo-2 h4 {
1878
- margin: 0;
1879
- }
1880
- .bubble-demo-2:after {
1881
- content: '';
1882
- position: absolute;
1883
- left: 1em;
1884
- bottom: -1em;
1885
- }
1886
- .bubble-demo-2 blockquote {
1887
- color: #999999;
1888
- }
1889
- .bubble-demo-2:after {
1890
- border-left: 0.7em solid transparent;
1891
- border-right: 0.7em solid transparent;
1892
- border-top: 1em solid #eeeeee;
1893
- }
1894
-
1895
- .bubble-demo-3 {
1896
- padding: 0.7em;
1897
- position: relative;
1898
- background: #eeeeee;
1899
- -webkit-border-radius: 0.5em;
1900
- -moz-border-radius: 0.5em;
1901
- -ms-border-radius: 0.5em;
1902
- -o-border-radius: 0.5em;
1903
- border-radius: 0.5em;
1904
- }
1905
- .bubble-demo-3 blockquote, .bubble-demo-3 h4 {
1906
- margin: 0;
1907
- }
1908
- .bubble-demo-3 blockquote {
1909
- width: 100%;
1910
- }
1911
- .bubble-demo-3:after {
1912
- content: '';
1913
- position: absolute;
1914
- right: 1em;
1915
- bottom: -1em;
1916
- }
1917
- .bubble-demo-3 blockquote {
1918
- color: #999999;
1919
- white-space: nowrap;
1920
- overflow: hidden;
1921
- -ms-text-overflow: ellipsis;
1922
- -o-text-overflow: ellipsis;
1923
- text-overflow: ellipsis;
1924
- }
1925
- .bubble-demo-3:after {
1926
- border-left: 0.7em solid transparent;
1927
- border-right: 0.7em solid transparent;
1928
- border-top: 1em solid #eeeeee;
1929
- }
1930
-
1931
- .accordion-demo-1 {
1932
- border: 1px solid #cccccc;
1933
- }
1934
- .accordion-demo-1 .accordion-section {
1935
- margin-top: 1px;
1936
- }
1937
- .accordion-demo-1 .accordion-section:first-child {
1938
- margin-top: 0;
1939
- }
1940
- .accordion-demo-1 .accordion-header {
1941
- padding: 0.407em 10px;
1942
- }
1943
- .accordion-demo-1 .accordion-header:before, .accordion-demo-1 .accordion-header:after {
1944
- content: "";
1945
- display: table;
1946
- }
1947
- .accordion-demo-1 .accordion-header:after {
1948
- clear: both;
1949
- }
1950
- .ie6 .accordion-demo-1 .accordion-header, .ie7 .accordion-demo-1 .accordion-header {
1951
- zoom: 1;
1952
- }
1953
- .accordion-demo-1 .accordion-header h4 {
1954
- margin: 0;
1955
- float: left;
1956
- }
1957
- .accordion-demo-1 .accordion-header .accordion-arrow {
1958
- float: right;
1959
- }
1960
- .accordion-demo-1 .accordion-header {
1961
- background-color: #013d93;
1962
- color: white;
1963
- cursor: pointer;
1964
- font-size: 0.813em;
1965
- line-height: 0.813em;
1966
- }
1967
- .accordion-demo-1 .accordion-header.accordion-header-open .accordion-arrow:after {
1968
- content: "\25BC";
1969
- }
1970
- .accordion-demo-1 .accordion-header.accordion-header-close .accordion-arrow:after {
1971
- content: "\25BA";
1972
- }
1973
-
1974
- .pagination-demo-1 {
1975
- text-align: center;
1976
- }
1977
- .pagination-demo-1 ul {
1978
- display: inline-block;
1979
- }
1980
- .pagination-demo-1 ul li {
1981
- height: 27px;
1982
- text-align: center;
1983
- float: left;
1984
- margin-left: 2px;
1985
- margin-right: 2px;
1986
- }
1987
- .pagination-demo-1 ul li a {
1988
- display: block;
1989
- line-height: 27px;
1990
- min-width: 27px;
1991
- }
1992
- .pagination-demo-1 ul .prev {
1993
- margin: 0 10px 0 0;
1994
- }
1995
- .pagination-demo-1 ul .next {
1996
- margin: 0 0 0 10px;
1997
- }
1998
- .pagination-demo-1 li {
1999
- background: #eeeeee;
2000
- border: 1px solid #cccccc;
2001
- -webkit-border-radius: 5px;
2002
- -moz-border-radius: 5px;
2003
- -ms-border-radius: 5px;
2004
- -o-border-radius: 5px;
2005
- border-radius: 5px;
2006
- list-style: none;
2007
- }
2008
- .pagination-demo-1 li a {
2009
- color: #319fda;
2010
- }
2011
- .pagination-demo-1 li a:hover {
2012
- color: white;
2013
- }
2014
- .pagination-demo-1 li:hover {
2015
- background: #013d93;
2016
- }
2017
- .pagination-demo-1 .active, .pagination-demo-1 .prev, .pagination-demo-1 .next, .pagination-demo-1 .dots {
2018
- background: none;
2019
- border: none;
2020
- }
2021
- .pagination-demo-1 .active a:hover, .pagination-demo-1 .prev a:hover, .pagination-demo-1 .next a:hover, .pagination-demo-1 .dots a:hover {
2022
- color: #319fda;
2023
- }
2024
- .pagination-demo-1 .active:hover, .pagination-demo-1 .prev:hover, .pagination-demo-1 .next:hover, .pagination-demo-1 .dots:hover {
2025
- background: none;
2026
- }
2027
- .pagination-demo-1 .prev a:hover, .pagination-demo-1 .next a:hover {
2028
- text-decoration: underline;
2029
- }
2030
- .pagination-demo-1 .active a, .pagination-demo-1 .dots a {
2031
- color: #888888;
2032
- cursor: default;
2033
- text-decoration: none;
2034
- }
2035
- .pagination-demo-1 .active a:hover, .pagination-demo-1 .dots a:hover {
2036
- color: #888888;
2037
- text-decoration: none;
2038
- }
2039
- .pagination-demo-1 .disabled {
2040
- background: none;
2041
- border: none;
2042
- }
2043
- .pagination-demo-1 .disabled:hover {
2044
- background: none;
2045
- }
2046
- .pagination-demo-1 .disabled a {
2047
- color: #cccccc;
2048
- text-decoration: none;
2049
- cursor: not-allowed;
2050
- }
2051
- .pagination-demo-1 .disabled a:hover {
2052
- text-decoration: none;
2053
- color: #cccccc;
2054
- }
2055
-
2056
- .text-input-demo-1 {
2057
- width: 200px;
2058
- height: 20px;
2059
- line-height: 20px;
2060
- padding: 1px;
2061
- border: 1px solid #dddddd;
2062
- border-top: 1px solid #919191;
2063
- color: #333333;
2064
- font-size: 11px;
2065
- -webkit-box-sizing: border-box;
2066
- -moz-box-sizing: border-box;
2067
- box-sizing: border-box;
2068
- -webkit-border-radius: 3px 3px 3px 3px;
2069
- -moz-border-radius: 3px 3px 3px 3px;
2070
- -ms-border-radius: 3px 3px 3px 3px;
2071
- -o-border-radius: 3px 3px 3px 3px;
2072
- border-radius: 3px 3px 3px 3px;
2073
- -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2074
- -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2075
- box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2076
- }
2077
- .text-input-demo-1:focus {
2078
- outline: 0;
2079
- border: 1px solid #319fda;
2080
- -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2081
- -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2082
- box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2083
- }
2084
-
2085
- .select-demo-1 {
2086
- width: 200px;
2087
- height: 20px;
2088
- line-height: 20px;
2089
- padding: 1px;
2090
- border: 1px solid #dddddd;
2091
- border-top: 1px solid #919191;
2092
- color: #333333;
2093
- font-size: 11px;
2094
- -webkit-box-sizing: border-box;
2095
- -moz-box-sizing: border-box;
2096
- box-sizing: border-box;
2097
- -webkit-border-radius: 3px 3px 3px 3px;
2098
- -moz-border-radius: 3px 3px 3px 3px;
2099
- -ms-border-radius: 3px 3px 3px 3px;
2100
- -o-border-radius: 3px 3px 3px 3px;
2101
- border-radius: 3px 3px 3px 3px;
2102
- -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2103
- -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2104
- box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
2105
- }
2106
- .select-demo-1:focus {
2107
- outline: 0;
2108
- border: 1px solid #319fda;
2109
- -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2110
- -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2111
- box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset, #01a9db 0 0 2px 0;
2112
- }
2113
-
2114
- .arrow-demo-1, .arrow-demo-3 {
2115
- margin: 0 40px 0 0;
2116
- }
2117
-
2118
- .arrow-demo-1 {
2119
- position: relative;
2120
- height: 1.6em;
2121
- line-height: 1.6em;
2122
- display: inline-block;
2123
- padding: 0 0 0 0.5em;
2124
- font-style: normal;
2125
- font-size: 10px;
2126
- font-size: 0.625rem;
2127
- background: black;
2128
- color: white;
2129
- -moz-border-radius-topleft: 0.1em;
2130
- -webkit-border-top-left-radius: 0.1em;
2131
- border-top-left-radius: 0.1em;
2132
- -moz-border-radius-bottomleft: 0.1em;
2133
- -webkit-border-bottom-left-radius: 0.1em;
2134
- border-bottom-left-radius: 0.1em;
2135
- }
2136
- .arrow-demo-1:after {
2137
- content: '';
2138
- position: absolute;
2139
- left: 100%;
2140
- }
2141
- .ie7 .arrow-demo-1 {
2142
- padding: 0 0.5em;
2143
- }
2144
- .arrow-demo-1:after {
2145
- border-top: 0.8em solid transparent;
2146
- border-bottom: 0.8em solid transparent;
2147
- border-left: 0.8em solid black;
2148
- }
2149
-
2150
- .arrow-demo-2 {
2151
- position: relative;
2152
- height: 1.6em;
2153
- line-height: 1.6em;
2154
- display: inline-block;
2155
- padding: 0 0.5em 0 0;
2156
- font-style: normal;
2157
- font-size: 10px;
2158
- font-size: 0.625rem;
2159
- background: black;
2160
- color: white;
2161
- -moz-border-radius-topright: 0.1em;
2162
- -webkit-border-top-right-radius: 0.1em;
2163
- border-top-right-radius: 0.1em;
2164
- -moz-border-radius-bottomright: 0.1em;
2165
- -webkit-border-bottom-right-radius: 0.1em;
2166
- border-bottom-right-radius: 0.1em;
2167
- }
2168
- .arrow-demo-2:after {
2169
- content: '';
2170
- position: absolute;
2171
- right: 100%;
2172
- }
2173
- .ie7 .arrow-demo-2 {
2174
- padding: 0 0.5em;
2175
- }
2176
- .arrow-demo-2:after {
2177
- border-top: 0.8em solid transparent;
2178
- border-bottom: 0.8em solid transparent;
2179
- border-right: 0.8em solid black;
2180
- }
2181
-
2182
- .arrow-demo-3 {
2183
- position: relative;
2184
- height: 1.6em;
2185
- line-height: 1.6em;
2186
- display: inline-block;
2187
- padding: 0 0 0 0.5em;
2188
- font-style: normal;
2189
- font-size: 25px;
2190
- font-size: 1.563rem;
2191
- background: #5fc8ff;
2192
- color: white;
2193
- -moz-border-radius-topleft: 0.1em;
2194
- -webkit-border-top-left-radius: 0.1em;
2195
- border-top-left-radius: 0.1em;
2196
- -moz-border-radius-bottomleft: 0.1em;
2197
- -webkit-border-bottom-left-radius: 0.1em;
2198
- border-bottom-left-radius: 0.1em;
2199
- }
2200
- .arrow-demo-3:after {
2201
- content: '';
2202
- position: absolute;
2203
- left: 100%;
2204
- }
2205
- .ie7 .arrow-demo-3 {
2206
- padding: 0 0.5em;
2207
- }
2208
- .arrow-demo-3:after {
2209
- border-top: 0.8em solid transparent;
2210
- border-bottom: 0.8em solid transparent;
2211
- border-left: 0.8em solid #5fc8ff;
2212
- }
2213
-
2214
- .arrow-demo-4 {
2215
- position: relative;
2216
- height: 1.6em;
2217
- line-height: 1.6em;
2218
- display: inline-block;
2219
- padding: 0 0.5em 0 0;
2220
- font-style: normal;
2221
- font-size: 25px;
2222
- font-size: 1.563rem;
2223
- background: #5fc8ff;
2224
- color: white;
2225
- -moz-border-radius-topright: 0.1em;
2226
- -webkit-border-top-right-radius: 0.1em;
2227
- border-top-right-radius: 0.1em;
2228
- -moz-border-radius-bottomright: 0.1em;
2229
- -webkit-border-bottom-right-radius: 0.1em;
2230
- border-bottom-right-radius: 0.1em;
2231
- }
2232
- .arrow-demo-4:after {
2233
- content: '';
2234
- position: absolute;
2235
- right: 100%;
2236
- }
2237
- .ie7 .arrow-demo-4 {
2238
- padding: 0 0.5em;
2239
- }
2240
- .arrow-demo-4:after {
2241
- border-top: 0.8em solid transparent;
2242
- border-bottom: 0.8em solid transparent;
2243
- border-right: 0.8em solid #5fc8ff;
2244
- }
2245
-
2246
- .container {
2247
- width: 90%;
2248
- max-width: 1200px;
2249
- min-width: 950px;
2250
- }
2251
-
2252
- .row-col {
2253
- width: 100%;
2254
- }
2255
- .row-col:before, .row-col:after {
2256
- content: "";
2257
- display: table;
2258
- }
2259
- .row-col:after {
2260
- clear: both;
2261
- }
2262
- .ie6 .row-col, .ie7 .row-col {
2263
- zoom: 1;
2264
- }
2265
- .row-col [class^="col"] {
2266
- width: 100%;
2267
- min-height: 25px;
2268
- display: block;
2269
- float: left;
2270
- margin-left: 2.174%;
2271
- -webkit-box-sizing: border-box;
2272
- -moz-box-sizing: border-box;
2273
- box-sizing: border-box;
2274
- }
2275
- .row-col [class^="col"]:first-child {
2276
- margin-left: 0;
2277
- }
2278
- .row-col [class^="col"] img {
2279
- max-width: 100%;
2280
- }
2281
- .row-col .col1 {
2282
- width: 6.341%;
2283
- }
2284
- .ie7 .row-col .col1 {
2285
- width: 6.249%;
2286
- }
2287
- .row-col [class^="col"].offset1 {
2288
- margin-left: 10.507%;
2289
- }
2290
- .row-col [class^="col"].offset1:first-child {
2291
- margin-left: 8.424%;
2292
- }
2293
- .row-col .col2 {
2294
- width: 14.855%;
2295
- }
2296
- .ie7 .row-col .col2 {
2297
- width: 14.763%;
2298
- }
2299
- .row-col [class^="col"].offset2 {
2300
- margin-left: 19.022%;
2301
- }
2302
- .row-col [class^="col"].offset2:first-child {
2303
- margin-left: 16.938%;
2304
- }
2305
- .row-col .col3 {
2306
- width: 23.37%;
2307
- }
2308
- .ie7 .row-col .col3 {
2309
- width: 23.278%;
2310
- }
2311
- .row-col [class^="col"].offset3 {
2312
- margin-left: 27.536%;
2313
- }
2314
- .row-col [class^="col"].offset3:first-child {
2315
- margin-left: 25.453%;
2316
- }
2317
- .row-col .col4 {
2318
- width: 31.884%;
2319
- }
2320
- .ie7 .row-col .col4 {
2321
- width: 31.792%;
2322
- }
2323
- .row-col [class^="col"].offset4 {
2324
- margin-left: 36.051%;
2325
- }
2326
- .row-col [class^="col"].offset4:first-child {
2327
- margin-left: 33.967%;
2328
- }
2329
- .row-col .col5 {
2330
- width: 40.399%;
2331
- }
2332
- .ie7 .row-col .col5 {
2333
- width: 40.307%;
2334
- }
2335
- .row-col [class^="col"].offset5 {
2336
- margin-left: 44.565%;
2337
- }
2338
- .row-col [class^="col"].offset5:first-child {
2339
- margin-left: 42.482%;
2340
- }
2341
- .row-col .col6 {
2342
- width: 48.913%;
2343
- }
2344
- .ie7 .row-col .col6 {
2345
- width: 48.821%;
2346
- }
2347
- .row-col [class^="col"].offset6 {
2348
- margin-left: 53.08%;
2349
- }
2350
- .row-col [class^="col"].offset6:first-child {
2351
- margin-left: 50.996%;
2352
- }
2353
- .row-col .col7 {
2354
- width: 57.428%;
2355
- }
2356
- .ie7 .row-col .col7 {
2357
- width: 57.336%;
2358
- }
2359
- .row-col [class^="col"].offset7 {
2360
- margin-left: 61.594%;
2361
- }
2362
- .row-col [class^="col"].offset7:first-child {
2363
- margin-left: 59.511%;
2364
- }
2365
- .row-col .col8 {
2366
- width: 65.942%;
2367
- }
2368
- .ie7 .row-col .col8 {
2369
- width: 65.85%;
2370
- }
2371
- .row-col [class^="col"].offset8 {
2372
- margin-left: 70.109%;
2373
- }
2374
- .row-col [class^="col"].offset8:first-child {
2375
- margin-left: 68.025%;
2376
- }
2377
- .row-col .col9 {
2378
- width: 74.457%;
2379
- }
2380
- .ie7 .row-col .col9 {
2381
- width: 74.365%;
2382
- }
2383
- .row-col [class^="col"].offset9 {
2384
- margin-left: 78.623%;
2385
- }
2386
- .row-col [class^="col"].offset9:first-child {
2387
- margin-left: 76.54%;
2388
- }
2389
- .row-col .col10 {
2390
- width: 82.971%;
2391
- }
2392
- .ie7 .row-col .col10 {
2393
- width: 82.879%;
2394
- }
2395
- .row-col [class^="col"].offset10 {
2396
- margin-left: 87.138%;
2397
- }
2398
- .row-col [class^="col"].offset10:first-child {
2399
- margin-left: 85.054%;
2400
- }
2401
- .row-col .col11 {
2402
- width: 91.486%;
2403
- }
2404
- .ie7 .row-col .col11 {
2405
- width: 91.394%;
2406
- }
2407
- .row-col [class^="col"].offset11 {
2408
- margin-left: 95.652%;
2409
- }
2410
- .row-col [class^="col"].offset11:first-child {
2411
- margin-left: 93.569%;
2412
- }
2413
- .row-col .col12 {
2414
- width: 100%;
2415
- }
2416
- .row-col [class^="col"].offset12 {
2417
- margin-left: 104.167%;
2418
- }
2419
- .row-col [class^="col"].offset12:first-child {
2420
- margin-left: 102.083%;
2421
- }
2422
-
2423
- .row-col {
2424
- margin: 10px 0;
2425
- }
2426
-
2427
- [class^="col"] {
2428
- -webkit-border-radius: 5px;
2429
- -moz-border-radius: 5px;
2430
- -ms-border-radius: 5px;
2431
- -o-border-radius: 5px;
2432
- border-radius: 5px;
2433
- background: #CCC;
2434
- }
2435
-
2436
- [class^="col"] [class^="col"] {
2437
- background: #AAA;
2438
- }
2439
-
2440
- [class^="col"] [class^="col"] [class^="col"] {
2441
- background: #696969;
2442
- color: #C0C0C0;
2443
- }
2444
-
2445
- .clearfix-demo {
2446
- background: #58608D;
2447
- width: 90%;
2448
- padding: 10px;
2449
- }
2450
- .clearfix-demo:before, .clearfix-demo:after {
2451
- content: "";
2452
- display: table;
2453
- }
2454
- .clearfix-demo:after {
2455
- clear: both;
2456
- }
2457
- .ie6 .clearfix-demo, .ie7 .clearfix-demo {
2458
- zoom: 1;
2459
- }
2460
- .clearfix-demo div {
2461
- background: white;
2462
- }
2463
-
2464
- .despegar-size-1-demo {
2465
- font-size: 11px;
2466
- }
2467
-
2468
- .despegar-size-2-demo {
2469
- font-size: 13px;
2470
- }
2471
-
2472
- .despegar-size-3-demo {
2473
- font-size: 16px;
2474
- }
2475
-
2476
- .despegar-size-4-demo {
2477
- font-size: 20px;
2478
- }
2479
-
2480
- .despegar-size-5-demo {
2481
- font-size: 24px;
2482
- }
2483
-
2484
- .despegar-size-6-demo {
2485
- font-size: 28px;
2486
- }
2487
-
2488
- .despegar-black-demo {
2489
- padding: 10px;
2490
- background: black;
2491
- color: white;
2492
- }
2493
-
2494
- .despegar-white-demo {
2495
- padding: 10px;
2496
- background: white;
2497
- }
2498
-
2499
- .despegar-yellow-demo {
2500
- padding: 10px;
2501
- background: #ffff33;
2502
- }
2503
-
2504
- .despegar-red-demo {
2505
- padding: 10px;
2506
- background: red;
2507
- }
2508
-
2509
- .despegar-blue-demo {
2510
- padding: 10px;
2511
- background: #013d93;
2512
- color: white;
2513
- }
2514
-
2515
- .despegar-gray-1-demo {
2516
- padding: 10px;
2517
- background: #222222;
2518
- color: white;
2519
- }
2520
-
2521
- .despegar-gray-2-demo {
2522
- padding: 10px;
2523
- background: #444444;
2524
- color: white;
2525
- }
2526
-
2527
- .despegar-gray-3-demo {
2528
- padding: 10px;
2529
- background: #666666;
2530
- color: white;
2531
- }
2532
-
2533
- .despegar-gray-4-demo {
2534
- padding: 10px;
2535
- background: #888888;
2536
- color: white;
2537
- }
2538
-
2539
- .despegar-gray-5-demo {
2540
- padding: 10px;
2541
- background: #aaaaaa;
2542
- color: white;
2543
- }
2544
-
2545
- .despegar-gray-6-demo {
2546
- padding: 10px;
2547
- background: #cccccc;
2548
- }
2549
-
2550
- .despegar-gray-7-demo {
2551
- padding: 10px;
2552
- background: #eeeeee;
2553
- }
2554
-
2555
- .despegar-searchbox-bg-demo {
2556
- padding: 10px;
2557
- background: #ffff33;
2558
- }
2559
-
2560
- .despegar-title-color-demo {
2561
- padding: 10px;
2562
- background: #013d93;
2563
- color: white;
2564
- }
2565
-
2566
- .despegar-titlealt-color-demo {
2567
- padding: 10px;
2568
- background: #ff9900;
2569
- }
2570
-
2571
- .despegar-link-color-demo {
2572
- padding: 10px;
2573
- background: #319fda;
2574
- }
2575
-
2576
- .despegar-link-color-hover-demo {
2577
- padding: 10px;
2578
- background: #66ccff;
2579
- }
2580
-
2581
- .despegar-error-bg-demo {
2582
- padding: 10px;
2583
- background: #ffe6e6;
2584
- }
2585
-
2586
- .despegar-error-border-demo {
2587
- padding: 10px;
2588
- background: red;
2589
- }
2590
-
2591
- .despegar-warning-bg-demo {
2592
- padding: 10px;
2593
- background: #ffffe1;
2594
- }
2595
-
2596
- .despegar-warning-border-demo {
2597
- padding: 10px;
2598
- background: #ffcc33;
2599
- }
2
+ </title><meta charset="utf-8"><link rel="stylesheet" href="docs.css"><link rel="stylesheet" href="css/picasso-docs.css"><!--[if IE]><link rel="stylesheet" href="css/picasso-demos.css"><![endif]--><style type="text/preview">body{font-family:sans-serif;font-size:16px;padding:20px 0}.ie7 .preview,.ie8 .preview,.ie9 .preview{padding:15px}.tooltip-demo-1{display:block;position:absolute;padding:0.267em;font-size:0.8em;background-color:#000;color:#fff;-webkit-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;border-radius:2px;-webkit-box-shadow:#000 0 0 3px;-moz-box-shadow:#000 0 0 3px;box-shadow:#000 0 0 3px;left:20px}.tooltip-demo-1.tooltip-left:after,.ie7 .tooltip-demo-1.tooltip-left span{position:absolute;top:0;padding:0.267em 0;left:-0.82em;content:"\25C4"}.ie7 .tooltip-demo-1.tooltip-left{zoom:expression(this.runtimeStyle.zoom="1", this.insertBefore(document.createElement("span"), this.firstChild).innerHTML="&#9668;")}.tooltip-demo-1.tooltip-left:after,.ie7 .tooltip-demo-1 span{font-family:arial, sans-serif;font-size:1em;color:#000}.ie8 .tooltip-demo-1.tooltip-left:after{font-size:0.8em}.tooltip-demo-2{display:block;position:absolute;padding:0.267em;font-size:0.8em;background-color:#000;color:#fff;-webkit-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;border-radius:2px;-webkit-box-shadow:#000 0 0 3px;-moz-box-shadow:#000 0 0 3px;box-shadow:#000 0 0 3px;left:140px}.tooltip-demo-2.tooltip-right:after,.ie7 .tooltip-demo-2.tooltip-right span{position:absolute;top:0;padding:0.267em 0;right:-0.82em;content:"\25BA"}.ie7 .tooltip-demo-2.tooltip-right{zoom:expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("span")).innerHTML="&#9658;")}.tooltip-demo-2.tooltip-right:after,.ie7 .tooltip-demo-2 span{font-family:arial, sans-serif;font-size:1em;color:#000}.ie8 .tooltip-demo-2.tooltip-right:after{font-size:0.8em}.tooltip-demo-3{display:block;position:absolute;padding:0.4em;font-size:1.2em;background-color:#0074cc;color:#fff;-webkit-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;border-radius:2px;-webkit-box-shadow:#0074cc 0 0 3px;-moz-box-shadow:#0074cc 0 0 3px;box-shadow:#0074cc 0 0 3px;left:20px}.tooltip-demo-3.tooltip-left:after,.ie7 .tooltip-demo-3.tooltip-left span{position:absolute;top:0;padding:0.4em 0;left:-0.82em;content:"\25C4"}.ie7 .tooltip-demo-3.tooltip-left{zoom:expression(this.runtimeStyle.zoom="1", this.insertBefore(document.createElement("span"), this.firstChild).innerHTML="&#9668;")}.tooltip-demo-3.tooltip-left:after,.ie7 .tooltip-demo-3 span{font-family:arial, sans-serif;font-size:1em;color:#0074cc}.ie8 .tooltip-demo-3.tooltip-left:after{font-size:1.2em}.tooltip-demo-4{display:block;position:absolute;padding:0.4em;font-size:1.2em;background-color:#faa732;color:#fff;-webkit-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;border-radius:2px;-webkit-box-shadow:#faa732 0 0 3px;-moz-box-shadow:#faa732 0 0 3px;box-shadow:#faa732 0 0 3px;left:300px}.tooltip-demo-4.tooltip-right:after,.ie7 .tooltip-demo-4.tooltip-right span{position:absolute;top:0;padding:0.4em 0;right:-0.82em;content:"\25BA"}.ie7 .tooltip-demo-4.tooltip-right{zoom:expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("span")).innerHTML="&#9658;")}.tooltip-demo-4.tooltip-right:after,.ie7 .tooltip-demo-4 span{font-family:arial, sans-serif;font-size:1em;color:#faa732}.ie8 .tooltip-demo-4.tooltip-right:after{font-size:1.2em}.button-glossy-demo-1{width:90px;height:30px;display:inline-block;text-align:center;position:relative;z-index:1;font-family:sans-serif;font-size:12px;text-decoration:none;cursor:pointer;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));background:-webkit-linear-gradient(#de1f2a,#c81c26),-webkit-linear-gradient(#b11922,#6e0f15);background:-moz-linear-gradient(#de1f2a,#c81c26),-moz-linear-gradient(#b11922,#6e0f15);background:-o-linear-gradient(#de1f2a,#c81c26),-o-linear-gradient(#b11922,#6e0f15);background:linear-gradient(#de1f2a,#c81c26),linear-gradient(#b11922,#6e0f15);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;background-position:left top,left 15px}.button-glossy-demo-1:after,.button-glossy-demo-1:before{content:"";position:absolute;display:inline-block}.button-glossy-demo-1:after{width:88px;height:28px;left:1px;top:1px;z-index:2}.button-glossy-demo-1:before{width:86px;height:26px;left:2px;top:2px;z-index:3}.button-glossy-demo-1 span{position:relative;z-index:4;line-height:30px}.button-glossy-demo-1 span{color:#fff}.button-glossy-demo-1:after,.button-glossy-demo-1:before{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px}.button-glossy-demo-1:after{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(15%, #f2a4a8), color-stop(100%, #150304)) 50%;background:-webkit-linear-gradient(#f2a4a8 15%,#150304) 50%;background:-moz-linear-gradient(#f2a4a8 15%,#150304) 50%;background:-o-linear-gradient(#f2a4a8 15%,#150304) 50%;background:linear-gradient(#f2a4a8 15%,#150304) 50%}.button-glossy-demo-1:before{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));background:-webkit-linear-gradient(#de1f2a,#c81c26),-webkit-linear-gradient(#b11922,#6e0f15);background:-moz-linear-gradient(#de1f2a,#c81c26),-moz-linear-gradient(#b11922,#6e0f15);background:-o-linear-gradient(#de1f2a,#c81c26),-o-linear-gradient(#b11922,#6e0f15);background:linear-gradient(#de1f2a,#c81c26),linear-gradient(#b11922,#6e0f15);background-position:left top,left 13px}.button-glossy-demo-1,.button-glossy-demo-1:before{background-size:100% 50%;background-repeat:no-repeat}.button-glossy-demo-1:hover{text-decoration:none;background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e96168), color-stop(50%, #bf1b24), color-stop(100%, #f10c19));background:-webkit-linear-gradient(#e96168,#bf1b24,#f10c19);background:-moz-linear-gradient(#e96168,#bf1b24,#f10c19);background:-o-linear-gradient(#e96168,#bf1b24,#f10c19);background:linear-gradient(#e96168,#bf1b24,#f10c19)}.button-glossy-demo-1:hover:after{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4b1b5), color-stop(100%, #d11d27)) 50%;background:-webkit-linear-gradient(#f4b1b5 20%,#d11d27) 50%;background:-moz-linear-gradient(#f4b1b5 20%,#d11d27) 50%;background:-o-linear-gradient(#f4b1b5 20%,#d11d27) 50%;background:linear-gradient(#f4b1b5 20%,#d11d27) 50%}.button-glossy-demo-1:hover:before{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e96168), color-stop(50%, #bf1b24), color-stop(100%, #f10c19));background:-webkit-linear-gradient(#e96168,#bf1b24,#f10c19);background:-moz-linear-gradient(#e96168,#bf1b24,#f10c19);background:-o-linear-gradient(#e96168,#bf1b24,#f10c19);background:linear-gradient(#e96168,#bf1b24,#f10c19)}.button-glossy-demo-1:hover,.button-glossy-demo-1:hover:before{background-size:100% 100%;background-position:left top;background-repeat:no-repeat}.ie7 .button-glossy-demo-1,.ie8 .button-glossy-demo-1,.ie9 .button-glossy-demo-1{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;background:url('../img/picasso-buttons-glossy.png');background-position:0 -1px}.ie7 .button-glossy-demo-1:hover,.ie8 .button-glossy-demo-1:hover,.ie9 .button-glossy-demo-1:hover{background-position:0 -31px}.ie9 .button-glossy-demo-1{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none}.button-glossy-demo-2{width:70px;height:30px;display:inline-block;text-align:center;position:relative;z-index:1;font-family:sans-serif;font-size:12px;text-decoration:none;cursor:pointer;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));background:-webkit-linear-gradient(#0088cc,#0077b3),-webkit-linear-gradient(#006699,#00334d);background:-moz-linear-gradient(#0088cc,#0077b3),-moz-linear-gradient(#006699,#00334d);background:-o-linear-gradient(#0088cc,#0077b3),-o-linear-gradient(#006699,#00334d);background:linear-gradient(#0088cc,#0077b3),linear-gradient(#006699,#00334d);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;background-position:left top,left 15px}.button-glossy-demo-2:after,.button-glossy-demo-2:before{content:"";position:absolute;display:inline-block}.button-glossy-demo-2:after{width:68px;height:28px;left:1px;top:1px;z-index:2}.button-glossy-demo-2:before{width:66px;height:26px;left:2px;top:2px;z-index:3}.button-glossy-demo-2 span{position:relative;z-index:4;line-height:30px}.button-glossy-demo-2 span{color:#fff}.button-glossy-demo-2:after,.button-glossy-demo-2:before{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px}.button-glossy-demo-2:after{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(15%, #66ccff), color-stop(100%, #000000)) 50%;background:-webkit-linear-gradient(#66ccff 15%,#000000) 50%;background:-moz-linear-gradient(#66ccff 15%,#000000) 50%;background:-o-linear-gradient(#66ccff 15%,#000000) 50%;background:linear-gradient(#66ccff 15%,#000000) 50%}.button-glossy-demo-2:before{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));background:-webkit-linear-gradient(#0088cc,#0077b3),-webkit-linear-gradient(#006699,#00334d);background:-moz-linear-gradient(#0088cc,#0077b3),-moz-linear-gradient(#006699,#00334d);background:-o-linear-gradient(#0088cc,#0077b3),-o-linear-gradient(#006699,#00334d);background:linear-gradient(#0088cc,#0077b3),linear-gradient(#006699,#00334d);background-position:left top,left 13px}.button-glossy-demo-2,.button-glossy-demo-2:before{background-size:100% 50%;background-repeat:no-repeat}.button-glossy-demo-2:hover{text-decoration:none;background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1ab2ff), color-stop(50%, #0070a8), color-stop(100%, #0088cc));background:-webkit-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:-moz-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:-o-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:linear-gradient(#1ab2ff,#0070a8,#0088cc)}.button-glossy-demo-2:hover:after{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #75d1ff), color-stop(100%, #007ebd)) 50%;background:-webkit-linear-gradient(#75d1ff 20%,#007ebd) 50%;background:-moz-linear-gradient(#75d1ff 20%,#007ebd) 50%;background:-o-linear-gradient(#75d1ff 20%,#007ebd) 50%;background:linear-gradient(#75d1ff 20%,#007ebd) 50%}.button-glossy-demo-2:hover:before{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1ab2ff), color-stop(50%, #0070a8), color-stop(100%, #0088cc));background:-webkit-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:-moz-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:-o-linear-gradient(#1ab2ff,#0070a8,#0088cc);background:linear-gradient(#1ab2ff,#0070a8,#0088cc)}.button-glossy-demo-2:hover,.button-glossy-demo-2:hover:before{background-size:100% 100%;background-position:left top;background-repeat:no-repeat}.ie7 .button-glossy-demo-2,.ie8 .button-glossy-demo-2,.ie9 .button-glossy-demo-2{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;background:url('../img/picasso-buttons-glossy.png');background-position:0 -61px}.ie7 .button-glossy-demo-2:hover,.ie8 .button-glossy-demo-2:hover,.ie9 .button-glossy-demo-2:hover{background-position:0 -91px}.ie9 .button-glossy-demo-2{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none}.button-glossy-demo-3{width:80px;height:30px;display:inline-block;text-align:center;position:relative;z-index:1;font-family:sans-serif;font-size:12px;text-decoration:none;cursor:pointer;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));background:-webkit-linear-gradient(#fbb450,#faa937),-webkit-linear-gradient(#fa9f1e,#c77605);background:-moz-linear-gradient(#fbb450,#faa937),-moz-linear-gradient(#fa9f1e,#c77605);background:-o-linear-gradient(#fbb450,#faa937),-o-linear-gradient(#fa9f1e,#c77605);background:linear-gradient(#fbb450,#faa937),linear-gradient(#fa9f1e,#c77605);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;background-position:left top,left 15px}.button-glossy-demo-3:after,.button-glossy-demo-3:before{content:"";position:absolute;display:inline-block}.button-glossy-demo-3:after{width:78px;height:28px;left:1px;top:1px;z-index:2}.button-glossy-demo-3:before{width:76px;height:26px;left:2px;top:2px;z-index:3}.button-glossy-demo-3 span{position:relative;z-index:4;line-height:30px}.button-glossy-demo-3 span{color:#fff}.button-glossy-demo-3:after,.button-glossy-demo-3:before{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px}.button-glossy-demo-3:after{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(15%, #fef4e6), color-stop(100%, #633b02)) 50%;background:-webkit-linear-gradient(#fef4e6 15%,#633b02) 50%;background:-moz-linear-gradient(#fef4e6 15%,#633b02) 50%;background:-o-linear-gradient(#fef4e6 15%,#633b02) 50%;background:linear-gradient(#fef4e6 15%,#633b02) 50%}.button-glossy-demo-3:before{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));background:-webkit-linear-gradient(#fbb450,#faa937),-webkit-linear-gradient(#fa9f1e,#c77605);background:-moz-linear-gradient(#fbb450,#faa937),-moz-linear-gradient(#fa9f1e,#c77605);background:-o-linear-gradient(#fbb450,#faa937),-o-linear-gradient(#fa9f1e,#c77605);background:linear-gradient(#fbb450,#faa937),linear-gradient(#fa9f1e,#c77605);background-position:left top,left 13px}.button-glossy-demo-3,.button-glossy-demo-3:before{background-size:100% 50%;background-repeat:no-repeat}.button-glossy-demo-3:hover{text-decoration:none;background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fdd49b), color-stop(50%, #faa52d), color-stop(100%, #ffb54c));background:-webkit-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:-moz-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:-o-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:linear-gradient(#fdd49b,#faa52d,#ffb54c)}.button-glossy-demo-3:hover:after{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #fffbf5), color-stop(100%, #fbae41)) 50%;background:-webkit-linear-gradient(#fffbf5 20%,#fbae41) 50%;background:-moz-linear-gradient(#fffbf5 20%,#fbae41) 50%;background:-o-linear-gradient(#fffbf5 20%,#fbae41) 50%;background:linear-gradient(#fffbf5 20%,#fbae41) 50%}.button-glossy-demo-3:hover:before{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fdd49b), color-stop(50%, #faa52d), color-stop(100%, #ffb54c));background:-webkit-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:-moz-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:-o-linear-gradient(#fdd49b,#faa52d,#ffb54c);background:linear-gradient(#fdd49b,#faa52d,#ffb54c)}.button-glossy-demo-3:hover,.button-glossy-demo-3:hover:before{background-size:100% 100%;background-position:left top;background-repeat:no-repeat}.ie7 .button-glossy-demo-3,.ie8 .button-glossy-demo-3,.ie9 .button-glossy-demo-3{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;background:url('../img/picasso-buttons-glossy.png');background-position:0 -121px}.ie7 .button-glossy-demo-3:hover,.ie8 .button-glossy-demo-3:hover,.ie9 .button-glossy-demo-3:hover{background-position:0 -151px}.ie9 .button-glossy-demo-3{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none}.button-3d-demo-1{overflow:hidden;display:inline-block;line-height:2.2em;color:#fff;border:1px solid #c00811;font-family:sans-serif;font-size:13px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 #000;-webkit-border-radius:0.4em;-moz-border-radius:0.4em;-ms-border-radius:0.4em;-o-border-radius:0.4em;border-radius:0.4em}.button-3d-demo-1:active{position:relative;top:1px}.button-3d-demo-1.disabled:active{position:static}.button-3d-demo-1 span{display:block;padding:0 13px}.button-3d-demo-1:visited{color:#fff}.button-3d-demo-1:hover{text-decoration:none;color:#fff}.button-3d-demo-1 span{background-color:#f73741;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f73741), color-stop(100%, #8f060d));background-image:-webkit-linear-gradient(#f73741,#8f060d);background-image:-moz-linear-gradient(#f73741,#8f060d);background-image:-o-linear-gradient(#f73741,#8f060d);background-image:linear-gradient(#f73741,#8f060d);-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);-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);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5)}.button-3d-demo-1 span:hover{background-color:#ff2f3a;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, #c00811));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#c00811);background-image:-moz-linear-gradient(rgba(255,255,255,0),#c00811);background-image:-o-linear-gradient(rgba(255,255,255,0),#c00811);background-image:linear-gradient(rgba(255,255,255,0),#c00811);-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 #ff2f3a;-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 #ff2f3a;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 #ff2f3a}.button-3d-demo-1 span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f73741), color-stop(100%, #8f060d));background-image:-webkit-linear-gradient(#f73741,#8f060d);background-image:-moz-linear-gradient(#f73741,#8f060d);background-image:-o-linear-gradient(#f73741,#8f060d);background-image:linear-gradient(#f73741,#8f060d);-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);-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);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);-webkit-border-radius:0.4em}.button-3d-demo-1.disabled{border:1px solid #755354;cursor:not-allowed;color:#fff}.button-3d-demo-1.disabled span,.button-3d-demo-1.disabled span:hover,.button-3d-demo-1.disabled span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));background-image:-webkit-linear-gradient(#979797,#4b4b4b);background-image:-moz-linear-gradient(#979797,#4b4b4b);background-image:-o-linear-gradient(#979797,#4b4b4b);background-image:linear-gradient(#979797,#4b4b4b);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75)}.ie7 .button-3d-demo-1 span,.ie8 .button-3d-demo-1 span,.ie9 .button-3d-demo-1 span{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00F73741', endColorstr='#FF8F060D')}.ie7 .button-3d-demo-1 span:hover,.ie8 .button-3d-demo-1 span:hover,.ie9 .button-3d-demo-1 span:hover{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FFC00811')}.ie7 .button-3d-demo-1 span:active,.ie8 .button-3d-demo-1 span:active,.ie9 .button-3d-demo-1 span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00F73741', endColorstr='#FF8F060D')}.ie7 .button-3d-demo-1.disabled span,.ie7 .button-3d-demo-1.disabled span:hover,.ie7 .button-3d-demo-1.disabled span:active,.ie8 .button-3d-demo-1.disabled span,.ie8 .button-3d-demo-1.disabled span:hover,.ie8 .button-3d-demo-1.disabled span:active,.ie9 .button-3d-demo-1.disabled span,.ie9 .button-3d-demo-1.disabled span:hover,.ie9 .button-3d-demo-1.disabled span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B')}.button-3d-demo-2{overflow:hidden;display:inline-block;line-height:2.2em;color:#fff;border:1px solid #046;font-family:sans-serif;font-size:13px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 #000;-webkit-border-radius:0.4em;-moz-border-radius:0.4em;-ms-border-radius:0.4em;-o-border-radius:0.4em;border-radius:0.4em}.button-3d-demo-2:active{position:relative;top:1px}.button-3d-demo-2.disabled:active{position:static}.button-3d-demo-2 span{display:block;padding:0 13px}.button-3d-demo-2:visited{color:#fff}.button-3d-demo-2:hover{text-decoration:none;color:#fff}.button-3d-demo-2 span{background-color:#08c;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #002233));background-image:-webkit-linear-gradient(#0088cc,#002233);background-image:-moz-linear-gradient(#0088cc,#002233);background-image:-o-linear-gradient(#0088cc,#002233);background-image:linear-gradient(#0088cc,#002233);-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);-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);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5)}.button-3d-demo-2 span:hover{background-color:#08c;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, #004466));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#004466);background-image:-moz-linear-gradient(rgba(255,255,255,0),#004466);background-image:-o-linear-gradient(rgba(255,255,255,0),#004466);background-image:linear-gradient(rgba(255,255,255,0),#004466);-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 #08c;-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 #08c;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 #08c}.button-3d-demo-2 span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(100%, #002233));background-image:-webkit-linear-gradient(#0088cc,#002233);background-image:-moz-linear-gradient(#0088cc,#002233);background-image:-o-linear-gradient(#0088cc,#002233);background-image:linear-gradient(#0088cc,#002233);-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);-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);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);-webkit-border-radius:0.4em}.button-3d-demo-2.disabled{border:1px solid #755354;cursor:not-allowed;color:#fff}.button-3d-demo-2.disabled span,.button-3d-demo-2.disabled span:hover,.button-3d-demo-2.disabled span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));background-image:-webkit-linear-gradient(#979797,#4b4b4b);background-image:-moz-linear-gradient(#979797,#4b4b4b);background-image:-o-linear-gradient(#979797,#4b4b4b);background-image:linear-gradient(#979797,#4b4b4b);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75)}.ie7 .button-3d-demo-2 span,.ie8 .button-3d-demo-2 span,.ie9 .button-3d-demo-2 span{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#000088CC', endColorstr='#FF002233')}.ie7 .button-3d-demo-2 span:hover,.ie8 .button-3d-demo-2 span:hover,.ie9 .button-3d-demo-2 span:hover{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FF004466')}.ie7 .button-3d-demo-2 span:active,.ie8 .button-3d-demo-2 span:active,.ie9 .button-3d-demo-2 span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#000088CC', endColorstr='#FF002233')}.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{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B')}.button-3d-demo-3{overflow:hidden;display:inline-block;line-height:2.2em;color:#fff;border:1px solid #e08505;font-family:sans-serif;font-size:13px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 #000;-webkit-border-radius:0.4em;-moz-border-radius:0.4em;-ms-border-radius:0.4em;-o-border-radius:0.4em;border-radius:0.4em}.button-3d-demo-3:active{position:relative;top:1px}.button-3d-demo-3.disabled:active{position:static}.button-3d-demo-3 span{display:block;padding:0 13px}.button-3d-demo-3:visited{color:#fff}.button-3d-demo-3:hover{text-decoration:none;color:#fff}.button-3d-demo-3 span{background-color:#fbb450;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbb450), color-stop(100%, #ae6704));background-image:-webkit-linear-gradient(#fbb450,#ae6704);background-image:-moz-linear-gradient(#fbb450,#ae6704);background-image:-o-linear-gradient(#fbb450,#ae6704);background-image:linear-gradient(#fbb450,#ae6704);-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);-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);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5)}.button-3d-demo-3 span:hover{background-color:#ffb54c;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, #e08505));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#e08505);background-image:-moz-linear-gradient(rgba(255,255,255,0),#e08505);background-image:-o-linear-gradient(rgba(255,255,255,0),#e08505);background-image:linear-gradient(rgba(255,255,255,0),#e08505);-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 #ffb54c;-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 #ffb54c;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 #ffb54c}.button-3d-demo-3 span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbb450), color-stop(100%, #ae6704));background-image:-webkit-linear-gradient(#fbb450,#ae6704);background-image:-moz-linear-gradient(#fbb450,#ae6704);background-image:-o-linear-gradient(#fbb450,#ae6704);background-image:linear-gradient(#fbb450,#ae6704);-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);-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);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);-webkit-border-radius:0.4em}.button-3d-demo-3.disabled{border:1px solid #755354;cursor:not-allowed;color:#fff}.button-3d-demo-3.disabled span,.button-3d-demo-3.disabled span:hover,.button-3d-demo-3.disabled span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));background-image:-webkit-linear-gradient(#979797,#4b4b4b);background-image:-moz-linear-gradient(#979797,#4b4b4b);background-image:-o-linear-gradient(#979797,#4b4b4b);background-image:linear-gradient(#979797,#4b4b4b);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75)}.ie7 .button-3d-demo-3 span,.ie8 .button-3d-demo-3 span,.ie9 .button-3d-demo-3 span{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FBB450', endColorstr='#FFAE6704')}.ie7 .button-3d-demo-3 span:hover,.ie8 .button-3d-demo-3 span:hover,.ie9 .button-3d-demo-3 span:hover{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FFE08505')}.ie7 .button-3d-demo-3 span:active,.ie8 .button-3d-demo-3 span:active,.ie9 .button-3d-demo-3 span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FBB450', endColorstr='#FFAE6704')}.ie7 .button-3d-demo-3.disabled span,.ie7 .button-3d-demo-3.disabled span:hover,.ie7 .button-3d-demo-3.disabled span:active,.ie8 .button-3d-demo-3.disabled span,.ie8 .button-3d-demo-3.disabled span:hover,.ie8 .button-3d-demo-3.disabled span:active,.ie9 .button-3d-demo-3.disabled span,.ie9 .button-3d-demo-3.disabled span:hover,.ie9 .button-3d-demo-3.disabled span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B')}.button-3d-demo-4{overflow:hidden;display:block;line-height:2.2em;color:#fff;border:1px solid #00132e;font-family:sans-serif;font-size:24px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 #000;-webkit-border-radius:0.4em;-moz-border-radius:0.4em;-ms-border-radius:0.4em;-o-border-radius:0.4em;border-radius:0.4em}.button-3d-demo-4:active{position:relative;top:1px}.button-3d-demo-4.disabled:active{position:static}.button-3d-demo-4 span{display:block;padding:0 24px}.button-3d-demo-4:visited{color:#fff}.button-3d-demo-4:hover{text-decoration:none;color:#fff}.button-3d-demo-4 span{background-color:#013d93;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #013d93), color-stop(100%, #000000));background-image:-webkit-linear-gradient(#013d93,#000000);background-image:-moz-linear-gradient(#013d93,#000000);background-image:-o-linear-gradient(#013d93,#000000);background-image:linear-gradient(#013d93,#000000);-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);-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);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5)}.button-3d-demo-4 span:hover{background-color:#003d94;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, #00132e));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#00132e);background-image:-moz-linear-gradient(rgba(255,255,255,0),#00132e);background-image:-o-linear-gradient(rgba(255,255,255,0),#00132e);background-image:linear-gradient(rgba(255,255,255,0),#00132e);-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;-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;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}.button-3d-demo-4 span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #013d93), color-stop(100%, #000000));background-image:-webkit-linear-gradient(#013d93,#000000);background-image:-moz-linear-gradient(#013d93,#000000);background-image:-o-linear-gradient(#013d93,#000000);background-image:linear-gradient(#013d93,#000000);-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);-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);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);-webkit-border-radius:0.4em}.button-3d-demo-4.disabled{border:1px solid #755354;cursor:not-allowed;color:#fff}.button-3d-demo-4.disabled span,.button-3d-demo-4.disabled span:hover,.button-3d-demo-4.disabled span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));background-image:-webkit-linear-gradient(#979797,#4b4b4b);background-image:-moz-linear-gradient(#979797,#4b4b4b);background-image:-o-linear-gradient(#979797,#4b4b4b);background-image:linear-gradient(#979797,#4b4b4b);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75)}.ie7 .button-3d-demo-4 span,.ie8 .button-3d-demo-4 span,.ie9 .button-3d-demo-4 span{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00013D93', endColorstr='#FF000000')}.ie7 .button-3d-demo-4 span:hover,.ie8 .button-3d-demo-4 span:hover,.ie9 .button-3d-demo-4 span:hover{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FF00132E')}.ie7 .button-3d-demo-4 span:active,.ie8 .button-3d-demo-4 span:active,.ie9 .button-3d-demo-4 span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00013D93', endColorstr='#FF000000')}.ie7 .button-3d-demo-4.disabled span,.ie7 .button-3d-demo-4.disabled span:hover,.ie7 .button-3d-demo-4.disabled span:active,.ie8 .button-3d-demo-4.disabled span,.ie8 .button-3d-demo-4.disabled span:hover,.ie8 .button-3d-demo-4.disabled span:active,.ie9 .button-3d-demo-4.disabled span,.ie9 .button-3d-demo-4.disabled span:hover,.ie9 .button-3d-demo-4.disabled span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B')}.button-3d-demo-5{overflow:hidden;display:inline-block;line-height:1.75em;color:#013d93;border:1px solid #bbb;font-family:sans-serif;font-size:11px;text-decoration:none;text-align:center;cursor:pointer;text-shadow:0 1px 0 #b5b5b5;-webkit-border-radius:1.1em;-moz-border-radius:1.1em;-ms-border-radius:1.1em;-o-border-radius:1.1em;border-radius:1.1em}.button-3d-demo-5:active{position:relative;top:1px}.button-3d-demo-5.disabled:active{position:static}.button-3d-demo-5 span{display:block;padding:0 11px}.button-3d-demo-5:visited{color:#013d93}.button-3d-demo-5:hover{text-decoration:none;color:#013d93}.button-3d-demo-5 span{background-color:#eee;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eeeeee), color-stop(100%, #a2a2a2));background-image:-webkit-linear-gradient(#eeeeee,#a2a2a2);background-image:-moz-linear-gradient(#eeeeee,#a2a2a2);background-image:-o-linear-gradient(#eeeeee,#a2a2a2);background-image:linear-gradient(#eeeeee,#a2a2a2);-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);-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);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.5)}.button-3d-demo-5 span:hover{background-color:#f0ecec;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, #bbbbbb));background-image:-webkit-linear-gradient(rgba(255,255,255,0),#bbbbbb);background-image:-moz-linear-gradient(rgba(255,255,255,0),#bbbbbb);background-image:-o-linear-gradient(rgba(255,255,255,0),#bbbbbb);background-image:linear-gradient(rgba(255,255,255,0),#bbbbbb);-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 #f0ecec;-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 #f0ecec;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 #f0ecec}.button-3d-demo-5 span:active{text-shadow:0 -1px 0 #b5b5b5;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eeeeee), color-stop(100%, #a2a2a2));background-image:-webkit-linear-gradient(#eeeeee,#a2a2a2);background-image:-moz-linear-gradient(#eeeeee,#a2a2a2);background-image:-o-linear-gradient(#eeeeee,#a2a2a2);background-image:linear-gradient(#eeeeee,#a2a2a2);-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);-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);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);-webkit-border-radius:1.1em}.button-3d-demo-5.disabled{border:1px solid #755354;cursor:not-allowed;color:#fff}.button-3d-demo-5.disabled span,.button-3d-demo-5.disabled span:hover,.button-3d-demo-5.disabled span:active{text-shadow:0 -1px 0 #000;background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #979797), color-stop(100%, #4b4b4b));background-image:-webkit-linear-gradient(#979797,#4b4b4b);background-image:-moz-linear-gradient(#979797,#4b4b4b);background-image:-o-linear-gradient(#979797,#4b4b4b);background-image:linear-gradient(#979797,#4b4b4b);-webkit-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);-moz-box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75);box-shadow:0 0.1em 0.1em rgba(0,0,0,0.5),inset 0 0.1em 0 rgba(255,255,255,0.25),inset 0 0 1em rgba(0,0,0,0.75)}.ie7 .button-3d-demo-5 span,.ie8 .button-3d-demo-5 span,.ie9 .button-3d-demo-5 span{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00EEEEEE', endColorstr='#FFA2A2A2')}.ie7 .button-3d-demo-5 span:hover,.ie8 .button-3d-demo-5 span:hover,.ie9 .button-3d-demo-5 span:hover{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00FFFFFF', endColorstr='#FFBBBBBB')}.ie7 .button-3d-demo-5 span:active,.ie8 .button-3d-demo-5 span:active,.ie9 .button-3d-demo-5 span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#00EEEEEE', endColorstr='#FFA2A2A2')}.ie7 .button-3d-demo-5.disabled span,.ie7 .button-3d-demo-5.disabled span:hover,.ie7 .button-3d-demo-5.disabled span:active,.ie8 .button-3d-demo-5.disabled span,.ie8 .button-3d-demo-5.disabled span:hover,.ie8 .button-3d-demo-5.disabled span:active,.ie9 .button-3d-demo-5.disabled span,.ie9 .button-3d-demo-5.disabled span:hover,.ie9 .button-3d-demo-5.disabled span:active{*zoom:1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF979797', endColorstr='#FF4B4B4B')}.button-mini-demo-1{display:inline-block;height:20px;padding-right:10px;padding-right:10px;font-family:sans-serif;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f0f0f0), color-stop(50%, #e3e3e3), color-stop(51%, #d6d6d6), color-stop(100%, #cacaca));background:-webkit-linear-gradient(top, #f0f0f0 0%,#e3e3e3 50%,#d6d6d6 51%,#cacaca 100%);background:-moz-linear-gradient(top, #f0f0f0 0%,#e3e3e3 50%,#d6d6d6 51%,#cacaca 100%);background:-o-linear-gradient(top, #f0f0f0 0%,#e3e3e3 50%,#d6d6d6 51%,#cacaca 100%);background:linear-gradient(top, #f0f0f0 0%,#e3e3e3 50%,#d6d6d6 51%,#cacaca 100%);-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:#333 0px 1px 2px 0px;-moz-box-shadow:#333 0px 1px 2px 0px;box-shadow:#333 0px 1px 2px 0px}.button-mini-demo-1 span{height:20px;line-height:20px;padding-left:10px;display:block}.button-mini-demo-1:hover{text-decoration:none;background:#e3e3e3}.button-mini-demo-1:active{background:#cacaca;-webkit-box-shadow:#999 0px 0px 3px 3px inset;-moz-box-shadow:#999 0px 0px 3px 3px inset;box-shadow:#999 0px 0px 3px 3px inset}.button-mini-demo-1 span{color:#0e6695;font-size:11px}.ie7 .button-mini-demo-1,.ie8 .button-mini-demo-1,.ie9 .button-mini-demo-1{background:url('../img/picasso-buttons-mini.png');background-position:right -1px}.ie7 .button-mini-demo-1:hover,.ie8 .button-mini-demo-1:hover,.ie9 .button-mini-demo-1:hover{background-position:right -21px}.ie7 .button-mini-demo-1 span,.ie8 .button-mini-demo-1 span,.ie9 .button-mini-demo-1 span{background-image:url('../img/picasso-buttons-mini.png');background-color:white;background-position:0 -1px}.ie7 .button-mini-demo-1 span:hover,.ie8 .button-mini-demo-1 span:hover,.ie9 .button-mini-demo-1 span:hover{background-position:0 -21px}.ie9 .button-mini-demo-1{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.button-mini-demo-2{display:inline-block;height:20px;padding-right:10px;padding-right:10px;font-family:sans-serif;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0088cc), color-stop(50%, #0077b3), color-stop(51%, #006699), color-stop(100%, #005580));background:-webkit-linear-gradient(top, #0088cc 0%,#0077b3 50%,#006699 51%,#005580 100%);background:-moz-linear-gradient(top, #0088cc 0%,#0077b3 50%,#006699 51%,#005580 100%);background:-o-linear-gradient(top, #0088cc 0%,#0077b3 50%,#006699 51%,#005580 100%);background:linear-gradient(top, #0088cc 0%,#0077b3 50%,#006699 51%,#005580 100%);-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:#333 0px 1px 2px 0px;-moz-box-shadow:#333 0px 1px 2px 0px;box-shadow:#333 0px 1px 2px 0px}.button-mini-demo-2 span{height:20px;line-height:20px;padding-left:10px;display:block}.button-mini-demo-2:hover{text-decoration:none;background:#0077b3}.button-mini-demo-2:active{background:#005580;-webkit-box-shadow:#999 0px 0px 3px 3px inset;-moz-box-shadow:#999 0px 0px 3px 3px inset;box-shadow:#999 0px 0px 3px 3px inset}.button-mini-demo-2 span{color:#fff;font-size:11px}.ie7 .button-mini-demo-2,.ie8 .button-mini-demo-2,.ie9 .button-mini-demo-2{background:url('../img/picasso-buttons-mini.png');background-position:right -41px}.ie7 .button-mini-demo-2:hover,.ie8 .button-mini-demo-2:hover,.ie9 .button-mini-demo-2:hover{background-position:right -61px}.ie7 .button-mini-demo-2 span,.ie8 .button-mini-demo-2 span,.ie9 .button-mini-demo-2 span{background-image:url('../img/picasso-buttons-mini.png');background-color:white;background-position:0 -41px}.ie7 .button-mini-demo-2 span:hover,.ie8 .button-mini-demo-2 span:hover,.ie9 .button-mini-demo-2 span:hover{background-position:0 -61px}.ie9 .button-mini-demo-2{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.button-mini-demo-3{display:inline-block;height:20px;padding-right:10px;padding-right:10px;font-family:sans-serif;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #da4f49), color-stop(50%, #d63b34), color-stop(51%, #c72f29), color-stop(100%, #b22a24));background:-webkit-linear-gradient(top, #da4f49 0%,#d63b34 50%,#c72f29 51%,#b22a24 100%);background:-moz-linear-gradient(top, #da4f49 0%,#d63b34 50%,#c72f29 51%,#b22a24 100%);background:-o-linear-gradient(top, #da4f49 0%,#d63b34 50%,#c72f29 51%,#b22a24 100%);background:linear-gradient(top, #da4f49 0%,#d63b34 50%,#c72f29 51%,#b22a24 100%);-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:#333 0px 1px 2px 0px;-moz-box-shadow:#333 0px 1px 2px 0px;box-shadow:#333 0px 1px 2px 0px}.button-mini-demo-3 span{height:20px;line-height:20px;padding-left:10px;display:block}.button-mini-demo-3:hover{text-decoration:none;background:#d63b34}.button-mini-demo-3:active{background:#b22a24;-webkit-box-shadow:#999 0px 0px 3px 3px inset;-moz-box-shadow:#999 0px 0px 3px 3px inset;box-shadow:#999 0px 0px 3px 3px inset}.button-mini-demo-3 span{color:#fff;font-size:11px}.ie7 .button-mini-demo-3,.ie8 .button-mini-demo-3,.ie9 .button-mini-demo-3{background:url('../img/picasso-buttons-mini.png');background-position:right -81px}.ie7 .button-mini-demo-3:hover,.ie8 .button-mini-demo-3:hover,.ie9 .button-mini-demo-3:hover{background-position:right -101px}.ie7 .button-mini-demo-3 span,.ie8 .button-mini-demo-3 span,.ie9 .button-mini-demo-3 span{background-image:url('../img/picasso-buttons-mini.png');background-color:white;background-position:0 -81px}.ie7 .button-mini-demo-3 span:hover,.ie8 .button-mini-demo-3 span:hover,.ie9 .button-mini-demo-3 span:hover{background-position:0 -101px}.ie9 .button-mini-demo-3{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.button-mini-demo-4{display:inline-block;height:20px;padding-right:10px;padding-right:10px;font-family:sans-serif;text-decoration:none;cursor:pointer;background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #414141), color-stop(50%, #343434), color-stop(51%, #272727), color-stop(100%, #1b1b1b));background:-webkit-linear-gradient(top, #414141 0%,#343434 50%,#272727 51%,#1b1b1b 100%);background:-moz-linear-gradient(top, #414141 0%,#343434 50%,#272727 51%,#1b1b1b 100%);background:-o-linear-gradient(top, #414141 0%,#343434 50%,#272727 51%,#1b1b1b 100%);background:linear-gradient(top, #414141 0%,#343434 50%,#272727 51%,#1b1b1b 100%);-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:#333 0px 1px 2px 0px;-moz-box-shadow:#333 0px 1px 2px 0px;box-shadow:#333 0px 1px 2px 0px}.button-mini-demo-4 span{height:20px;line-height:20px;padding-left:10px;display:block}.button-mini-demo-4:hover{text-decoration:none;background:#343434}.button-mini-demo-4:active{background:#1b1b1b;-webkit-box-shadow:#999 0px 0px 3px 3px inset;-moz-box-shadow:#999 0px 0px 3px 3px inset;box-shadow:#999 0px 0px 3px 3px inset}.button-mini-demo-4 span{color:#fff;font-size:11px}.ie7 .button-mini-demo-4,.ie8 .button-mini-demo-4,.ie9 .button-mini-demo-4{background:url('../img/picasso-buttons-mini.png');background-position:right -121px}.ie7 .button-mini-demo-4:hover,.ie8 .button-mini-demo-4:hover,.ie9 .button-mini-demo-4:hover{background-position:right -141px}.ie7 .button-mini-demo-4 span,.ie8 .button-mini-demo-4 span,.ie9 .button-mini-demo-4 span{background-image:url('../img/picasso-buttons-mini.png');background-color:white;background-position:0 -121px}.ie7 .button-mini-demo-4 span:hover,.ie8 .button-mini-demo-4 span:hover,.ie9 .button-mini-demo-4 span:hover{background-position:0 -141px}.ie9 .button-mini-demo-4{-webkit-border-radius:none;-moz-border-radius:none;-ms-border-radius:none;-o-border-radius:none;border-radius:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.list-grid-demo-1:before,.list-grid-demo-1:after{content:"";display:table}.list-grid-demo-1:after{clear:both}.ie6 .list-grid-demo-1,.ie7 .list-grid-demo-1{zoom:1}.list-grid-demo-1 ul{float:left;padding:0px;margin:0px;width:130px}.list-grid-demo-1 ul li{height:30px;line-height:30px;padding-left:10px;padding-right:10px}.list-grid-demo-1 ul{list-style:none outside none;border-top:1px solid #ccc;border-bottom:1px solid #ccc;border-right:1px solid #ccc}.list-grid-demo-1 ul:first-child{border-left:1px solid #ccc}.list-grid-demo-1 ul li{text-align:center;border:1px solid transparent}.list-grid-demo-1 ul li:first-child{border-bottom:1px solid #ccc}.list-grid-demo-1 ul li:nth-child(odd){background:none repeat scroll 0 0 #eee}.list-grid-demo-1 ul li:nth-child(even){background:none repeat scroll 0 0 #fff}.list-grid-demo-1 ul li.cell-hover:hover{border:1px solid #319fda;background:#f4fafd;cursor:pointer}.ie7 .list-grid-demo-1 ul li:first-child,.ie8 .list-grid-demo-1 ul li:first-child{background:none repeat scroll 0 0 #eee}.ie7 .list-grid-demo-1 ul li.even,.ie8 .list-grid-demo-1 ul li.even{background:none repeat scroll 0 0 #fff}.ie7 .list-grid-demo-1 ul li.odd,.ie8 .list-grid-demo-1 ul li.odd{background:none repeat scroll 0 0 #eee}.nav-demo-1:before,.nav-demo-1:after{content:"";display:table}.nav-demo-1:after{clear:both}.ie6 .nav-demo-1,.ie7 .nav-demo-1{zoom:1}.nav-demo-1 ul{margin:0;padding:0;text-align:center;float:left}.nav-demo-1 ul:before,.nav-demo-1 ul:after{content:"";display:table}.nav-demo-1 ul:after{clear:both}.ie6 .nav-demo-1 ul,.ie7 .nav-demo-1 ul{zoom:1}.nav-demo-1 ul li{display:inline-block;height:40px;line-height:40px;float:left}.nav-demo-1 ul li a{display:block;padding:0 15px}.ie7 .nav-demo-1 ul li,.ie8 .nav-demo-1 ul li,.ie9 .nav-demo-1 ul li{height:46px}.nav-demo-1 ul{list-style:none;-webkit-box-shadow:0 6px 6px -6px #000;-moz-box-shadow:0 6px 6px -6px #000;box-shadow:0 6px 6px -6px #000}.nav-demo-1 ul li{background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #e6e6e6));background-image:-webkit-linear-gradient(#ffffff,#e6e6e6);background-image:-moz-linear-gradient(#ffffff,#e6e6e6);background-image:-o-linear-gradient(#ffffff,#e6e6e6);background-image:linear-gradient(#ffffff,#e6e6e6);border-left:1px solid #acacac;border-top:1px solid #acacac;border-bottom:1px solid #acacac}.nav-demo-1 ul li:hover{background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #f2f2f2));background-image:-webkit-linear-gradient(#ffffff,#f2f2f2);background-image:-moz-linear-gradient(#ffffff,#f2f2f2);background-image:-o-linear-gradient(#ffffff,#f2f2f2);background-image:linear-gradient(#ffffff,#f2f2f2)}.nav-demo-1 ul li:first-child{-moz-border-radius-topleft:5px;-webkit-border-top-left-radius:5px;border-top-left-radius:5px;-moz-border-radius-bottomleft:5px;-webkit-border-bottom-left-radius:5px;border-bottom-left-radius:5px}.nav-demo-1 ul li:last-child{-moz-border-radius-topright:5px;-webkit-border-top-right-radius:5px;border-top-right-radius:5px;-moz-border-radius-bottomright:5px;-webkit-border-bottom-right-radius:5px;border-bottom-right-radius:5px;border-right:1px solid #acacac}.nav-demo-1 ul li a{font-size:16px;font-family:sans-serif}.nav-demo-1 ul .active{background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e6e6e6), color-stop(100%, #ffffff));background-image:-webkit-linear-gradient(#e6e6e6,#ffffff);background-image:-moz-linear-gradient(#e6e6e6,#ffffff);background-image:-o-linear-gradient(#e6e6e6,#ffffff);background-image:linear-gradient(#e6e6e6,#ffffff)}.ie7 .nav-demo-1 ul li,.ie8 .nav-demo-1 ul li,.ie9 .nav-demo-1 ul li{border-left:none;border-top:none;border-bottom:none;background:transparent url('../img/picasso-nav.png') no-repeat center -1px}.ie7 .nav-demo-1 ul li a,.ie8 .nav-demo-1 ul li a,.ie9 .nav-demo-1 ul li a{border-left:1px solid #acacac}.ie7 .nav-demo-1 ul li:hover,.ie8 .nav-demo-1 ul li:hover,.ie9 .nav-demo-1 ul li:hover{background:transparent url('../img/picasso-nav.png') center -47px no-repeat}.ie7 .nav-demo-1 ul li:first-child,.ie8 .nav-demo-1 ul li:first-child,.ie9 .nav-demo-1 ul li:first-child{background:transparent url('../img/picasso-nav.png') no-repeat left -1px}.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{border-left:none}.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{background:transparent url('../img/picasso-nav.png') left -47px no-repeat}.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{background:transparent url('../img/picasso-nav.png') no-repeat left -47px}.ie7 .nav-demo-1 ul .last,.ie8 .nav-demo-1 ul .last,.ie9 .nav-demo-1 ul .last{background:transparent url('../img/picasso-nav.png') no-repeat right -47px}.ie7 .nav-demo-1 ul .last:hover,.ie8 .nav-demo-1 ul .last:hover,.ie9 .nav-demo-1 ul .last:hover{background:transparent url('../img/picasso-nav.png') right -47px no-repeat}.ie7 .nav-demo-1 ul .active,.ie8 .nav-demo-1 ul .active,.ie9 .nav-demo-1 ul .active{background:transparent url('../img/picasso-nav.png') no-repeat center -47px}.ie7 .nav-demo-1 ul .last.active,.ie8 .nav-demo-1 ul .last.active,.ie9 .nav-demo-1 ul .last.active{background:transparent url('../img/picasso-nav.png') no-repeat right -47px}.ie9 .nav-demo-1 ul{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ie9 .nav-demo-1 ul li:first-child{-moz-border-radius-topleft:none;-webkit-border-top-left-radius:none;border-top-left-radius:none;-moz-border-radius-bottomleft:none;-webkit-border-bottom-left-radius:none;border-bottom-left-radius:none}.ie9 .nav-demo-1 ul li:last-child{-moz-border-radius-topright:none;-webkit-border-top-right-radius:none;border-top-right-radius:none;-moz-border-radius-bottomright:none;-webkit-border-bottom-right-radius:none;border-bottom-right-radius:none;border:none}.popup-demo-1{padding:10px;position:absolute}.popup-demo-1:after,.ie7 .popup-demo-1 .after{content:"";position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:0}.popup-demo-1 .popup-header h4{line-height:20px;padding:10px}.popup-demo-1 .popup-container{z-index:1;position:relative}.popup-demo-1 .popup-arrow{position:absolute;height:0px;width:0px}.popup-demo-1 .popup-arrow-bottom{bottom:-10px;left:10px}.popup-demo-1 .popup-arrow-top{top:-10px;left:10px}.popup-demo-1 .popup-arrow-left{left:-10px;top:10px}.popup-demo-1 .popup-arrow-right{right:-10px;top:10px}.popup-demo-1 .popup-close{position:absolute;z-index:10;text-align:center;line-height:17px;height:20px;width:20px;top:-13px;right:-13px}.ie7 .popup-demo-1 .popup-close,.ie8 .popup-demo-1 .popup-close{line-height:23px;height:26px;width:26px;top:-13px;right:-13px}.ie7 .popup-demo-1{zoom:expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" )}.popup-demo-1:after,.ie7 .popup-demo-1 .after{background:rgba(0,0,0,0.7);-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px;-webkit-box-shadow:rgba(0,0,0,0.5) 0px 0px 10px;-moz-box-shadow:rgba(0,0,0,0.5) 0px 0px 10px;box-shadow:rgba(0,0,0,0.5) 0px 0px 10px}.popup-demo-1 .popup-header{background:none repeat scroll 0 0 #f7f7f7;display:block}.popup-demo-1 .popup-header h4{margin:0;color:#003770;font-family:sans-serif;font-size:16px;font-weight:normal}.popup-demo-1 .popup-content{background:#fff;border:1px solid transparent}.popup-demo-1 .popup-arrow-bottom{border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgba(0,0,0,0.7)}.popup-demo-1 .popup-arrow-top{border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid rgba(0,0,0,0.7)}.popup-demo-1 .popup-arrow-left{border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid rgba(0,0,0,0.7)}.popup-demo-1 .popup-arrow-right{border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:10px solid rgba(0,0,0,0.7)}.popup-demo-1 .popup-close{cursor:pointer;border:3px solid #fff;color:#fff;font-weight:bold;font-family:sans-serif;font-size:16px;background:#319fda;-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:rgba(0,0,0,0.5) 0px 0px 10px;-moz-box-shadow:rgba(0,0,0,0.5) 0px 0px 10px;box-shadow:rgba(0,0,0,0.5) 0px 0px 10px}.ie7 .popup-demo-1:after,.ie7 .popup-demo-1 .after,.ie8 .popup-demo-1:after,.ie8 .popup-demo-1 .after{background:#000;filter:alpha(opacity=70)}.ie7 .popup-demo-1 .popup-arrow,.ie8 .popup-demo-1 .popup-arrow{filter:alpha(opacity=70)}.ie7 .popup-demo-1 .popup-arrow-bottom,.ie8 .popup-demo-1 .popup-arrow-bottom{border-top:10px solid #000}.ie7 .popup-demo-1 .popup-arrow-top,.ie8 .popup-demo-1 .popup-arrow-top{border-bottom:10px solid #000}.ie7 .popup-demo-1 .popup-arrow-left,.ie8 .popup-demo-1 .popup-arrow-left{border-right:10px solid #000}.ie7 .popup-demo-1 .popup-arrow-right,.ie8 .popup-demo-1 .popup-arrow-right{border-left:10px solid #000}.ie7 .popup-demo-1 .popup-close,.ie8 .popup-demo-1 .popup-close{border-width:0px;background-color:transparent;background:url('../img/picasso-popup.png');background-position:0px -1px}.popup-demo-2{padding:10px;position:absolute;color:white}.popup-demo-2:after,.ie7 .popup-demo-2 .after{content:"";position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:0}.popup-demo-2 .popup-header h4{line-height:20px;padding:10px}.popup-demo-2 .popup-container{z-index:1;position:relative}.popup-demo-2 .popup-arrow{position:absolute;height:0px;width:0px}.popup-demo-2 .popup-arrow-bottom{bottom:-10px;left:10px}.popup-demo-2 .popup-arrow-top{top:-10px;left:10px}.popup-demo-2 .popup-arrow-left{left:-10px;top:10px}.popup-demo-2 .popup-arrow-right{right:-10px;top:10px}.popup-demo-2 .popup-close{position:absolute;z-index:10;text-align:center;line-height:17px;height:20px;width:20px;top:-13px;right:-13px}.ie7 .popup-demo-2 .popup-close,.ie8 .popup-demo-2 .popup-close{line-height:23px;height:26px;width:26px;top:-13px;right:-13px}.ie7 .popup-demo-2{zoom:expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" )}.popup-demo-2:after,.ie7 .popup-demo-2 .after{background:rgba(128,128,128,0.5);-webkit-border-radius:10px;-moz-border-radius:10px;-ms-border-radius:10px;-o-border-radius:10px;border-radius:10px;-webkit-box-shadow:0px 0px 5px #333;-moz-box-shadow:0px 0px 5px #333;box-shadow:0px 0px 5px #333}.popup-demo-2 .popup-header{background:#fff;display:block}.popup-demo-2 .popup-header h4{margin:0;color:#000;font-family:sans-serif;font-size:16px;font-weight:normal}.popup-demo-2 .popup-content{background:#000;border:1px solid transparent}.popup-demo-2 .popup-arrow-bottom{border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgba(128,128,128,0.5)}.popup-demo-2 .popup-arrow-top{border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid rgba(128,128,128,0.5)}.popup-demo-2 .popup-arrow-left{border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid rgba(128,128,128,0.5)}.popup-demo-2 .popup-arrow-right{border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:10px solid rgba(128,128,128,0.5)}.popup-demo-2 .popup-close{cursor:pointer;border:3px solid #fff;color:#fff;font-weight:bold;font-family:sans-serif;font-size:16px;background:#000;-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border-radius:20px;-webkit-box-shadow:0px 0px 5px #333;-moz-box-shadow:0px 0px 5px #333;box-shadow:0px 0px 5px #333}.ie7 .popup-demo-2:after,.ie7 .popup-demo-2 .after,.ie8 .popup-demo-2:after,.ie8 .popup-demo-2 .after{background:gray;filter:alpha(opacity=50)}.ie7 .popup-demo-2 .popup-arrow,.ie8 .popup-demo-2 .popup-arrow{filter:alpha(opacity=50)}.ie7 .popup-demo-2 .popup-arrow-bottom,.ie8 .popup-demo-2 .popup-arrow-bottom{border-top:10px solid gray}.ie7 .popup-demo-2 .popup-arrow-top,.ie8 .popup-demo-2 .popup-arrow-top{border-bottom:10px solid gray}.ie7 .popup-demo-2 .popup-arrow-left,.ie8 .popup-demo-2 .popup-arrow-left{border-right:10px solid gray}.ie7 .popup-demo-2 .popup-arrow-right,.ie8 .popup-demo-2 .popup-arrow-right{border-left:10px solid gray}.ie7 .popup-demo-2 .popup-close,.ie8 .popup-demo-2 .popup-close{border-width:0px;background-color:transparent;background:url('../img/picasso-popup.png');background-position:0px -27px}.bubble-demo-1{padding:10px;display:block;width:auto;position:relative;background:#eee;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px}.bubble-demo-1:after,.ie7 .bubble-demo-1 .after{content:"";position:absolute;bottom:-15px;right:20px;width:0;height:0}.ie7 .bubble-demo-1{zoom:expression(this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="after" )}.bubble-demo-1 blockquote{color:#999}.bubble-demo-1:after,.ie7 .bubble-demo-1 .after{border-left:10px solid transparent;border-right:10px solid transparent;border-top:15px solid #eee}.accordion-demo-1{border:1px solid #ccc}.accordion-demo-1 .accordion-section{margin-top:1px}.accordion-demo-1 .accordion-section:first-child{margin-top:0}.accordion-demo-1 .accordion-header{padding:0.4em 10px;overflow:hidden}.accordion-demo-1 .accordion-header h4{margin:0;float:left}.accordion-demo-1 .accordion-header .accordion-arrow{float:right}.accordion-demo-1 .accordion-header{background-color:#013d93;color:#fff;cursor:pointer;font-size:0.8em;line-height:0.8em}.accordion-demo-1 .accordion-header.accordion-header-open .accordion-arrow:after{content:"\25BC"}.accordion-demo-1 .accordion-header.accordion-header-close .accordion-arrow:after{content:"\25BA"}.pagination-demo-1{text-align:center}.pagination-demo-1 ul{display:inline-block}.pagination-demo-1 ul li{display:inline-block;height:27px;text-align:center;float:left;margin-left:2px;margin-right:2px}.pagination-demo-1 ul li a{display:block;line-height:27px;min-width:27px}.pagination-demo-1 ul .prev{margin:0 10px 0 0}.pagination-demo-1 ul .next{margin:0 0 0 10px}.pagination-demo-1 li{background:#eee;border:1px solid #ccc;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;list-style:none}.pagination-demo-1 li a{color:#319fda}.pagination-demo-1 li a:hover{color:#fff}.pagination-demo-1 li:hover{background:#013d93}.pagination-demo-1 .active,.pagination-demo-1 .prev,.pagination-demo-1 .next,.pagination-demo-1 .dots{background:none;border:none}.pagination-demo-1 .active a:hover,.pagination-demo-1 .prev a:hover,.pagination-demo-1 .next a:hover,.pagination-demo-1 .dots a:hover{color:#319fda}.pagination-demo-1 .active:hover,.pagination-demo-1 .prev:hover,.pagination-demo-1 .next:hover,.pagination-demo-1 .dots:hover{background:none}.pagination-demo-1 .prev a:hover,.pagination-demo-1 .next a:hover{text-decoration:underline}.pagination-demo-1 .active a,.pagination-demo-1 .dots a{color:#888;cursor:default;text-decoration:none}.pagination-demo-1 .active a:hover,.pagination-demo-1 .dots a:hover{color:#888;text-decoration:none}.pagination-demo-1 .disabled{background:none;border:none}.pagination-demo-1 .disabled:hover{background:none}.pagination-demo-1 .disabled a{color:#ccc;text-decoration:none;cursor:not-allowed}.pagination-demo-1 .disabled a:hover{text-decoration:none;color:#ccc}.text-input-demo-1{width:200px;height:20px;line-height:20px;padding:1px;border:1px solid #ddd;border-top:1px solid #919191;color:#333;font-size:11px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-border-radius:3px 3px 3px 3px;-moz-border-radius:3px 3px 3px 3px;-ms-border-radius:3px 3px 3px 3px;-o-border-radius:3px 3px 3px 3px;border-radius:3px 3px 3px 3px;-webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,0.2) inset;-moz-box-shadow:0 1px 2px 0 rgba(0,0,0,0.2) inset;box-shadow:0 1px 2px 0 rgba(0,0,0,0.2) inset}.text-input-demo-1:focus{outline:0;border:1px solid #319fda;-webkit-box-shadow:rgba(0,0,0,0.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0;-moz-box-shadow:rgba(0,0,0,0.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0;box-shadow:rgba(0,0,0,0.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0}.select-demo-1{width:200px;height:20px;line-height:20px;padding:1px;border:1px solid #ddd;border-top:1px solid #919191;color:#333;font-size:11px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-border-radius:3px 3px 3px 3px;-moz-border-radius:3px 3px 3px 3px;-ms-border-radius:3px 3px 3px 3px;-o-border-radius:3px 3px 3px 3px;border-radius:3px 3px 3px 3px;-webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,0.2) inset;-moz-box-shadow:0 1px 2px 0 rgba(0,0,0,0.2) inset;box-shadow:0 1px 2px 0 rgba(0,0,0,0.2) inset}.select-demo-1:focus{outline:0;border:1px solid #319fda;-webkit-box-shadow:rgba(0,0,0,0.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0;-moz-box-shadow:rgba(0,0,0,0.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0;box-shadow:rgba(0,0,0,0.2) 0 1px 2px 0 inset,#01a9db 0 0 2px 0}.arrow-demo-1,.arrow-demo-3{margin:0 40px 0 0}.arrow-demo-1{position:relative;height:1.556em;line-height:1.556em;display:inline-block;padding:0 0 0 0.5em;font-style:normal;font-size:0.563em;background:#000;color:#fff;-webkit-border-radius:0.1em;-moz-border-radius:0.1em;-ms-border-radius:0.1em;-o-border-radius:0.1em;border-radius:0.1em}.arrow-demo-1:after{content:'';position:absolute;left:100%}.ie7 .arrow-demo-1{padding:0 0.5em}.arrow-demo-1:after{border-top:0.778em solid transparent;border-bottom:0.778em solid transparent;border-left:0.778em solid #000}.arrow-demo-2{position:relative;height:1.556em;line-height:1.556em;display:inline-block;padding:0 0.5em 0 0;font-style:normal;font-size:0.563em;background:#000;color:#fff;-webkit-border-radius:0.1em;-moz-border-radius:0.1em;-ms-border-radius:0.1em;-o-border-radius:0.1em;border-radius:0.1em}.arrow-demo-2:after{content:'';position:absolute;right:100%}.ie7 .arrow-demo-2{padding:0 0.5em}.arrow-demo-2:after{border-top:0.778em solid transparent;border-bottom:0.778em solid transparent;border-right:0.778em solid #000}.arrow-demo-3{position:relative;height:1.556em;line-height:1.556em;display:inline-block;padding:0 0 0 0.5em;font-style:normal;font-size:1.313em;background:#5fc8ff;color:#fff;-webkit-border-radius:0.1em;-moz-border-radius:0.1em;-ms-border-radius:0.1em;-o-border-radius:0.1em;border-radius:0.1em}.arrow-demo-3:after{content:'';position:absolute;left:100%}.ie7 .arrow-demo-3{padding:0 0.5em}.arrow-demo-3:after{border-top:0.778em solid transparent;border-bottom:0.778em solid transparent;border-left:0.778em solid #5fc8ff}.arrow-demo-4{position:relative;height:1.556em;line-height:1.556em;display:inline-block;padding:0 0.5em 0 0;font-style:normal;font-size:1.5em;background:#5fc8ff;color:#fff;-webkit-border-radius:0.1em;-moz-border-radius:0.1em;-ms-border-radius:0.1em;-o-border-radius:0.1em;border-radius:0.1em}.arrow-demo-4:after{content:'';position:absolute;right:100%}.ie7 .arrow-demo-4{padding:0 0.5em}.arrow-demo-4:after{border-top:0.778em solid transparent;border-bottom:0.778em solid transparent;border-right:0.778em solid #5fc8ff}.container{width:90%;max-width:1200px;min-width:950px}.row-col{width:100%}.row-col:before,.row-col:after{content:"";display:table}.row-col:after{clear:both}.ie6 .row-col,.ie7 .row-col{zoom:1}.row-col [class^="col"]{width:100%;min-height:25px;display:block;float:left;margin-left:2.174%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.row-col [class^="col"]:first-child{margin-left:0}.row-col [class^="col"] img{max-width:100%}.row-col .col1{width:6.341%}.ie7 .row-col .col1{width:6.249%}.row-col [class^="col"].offset1{margin-left:10.507%}.row-col [class^="col"].offset1:first-child{margin-left:8.424%}.row-col .col2{width:14.855%}.ie7 .row-col .col2{width:14.763%}.row-col [class^="col"].offset2{margin-left:19.022%}.row-col [class^="col"].offset2:first-child{margin-left:16.938%}.row-col .col3{width:23.37%}.ie7 .row-col .col3{width:23.278%}.row-col [class^="col"].offset3{margin-left:27.536%}.row-col [class^="col"].offset3:first-child{margin-left:25.453%}.row-col .col4{width:31.884%}.ie7 .row-col .col4{width:31.792%}.row-col [class^="col"].offset4{margin-left:36.051%}.row-col [class^="col"].offset4:first-child{margin-left:33.967%}.row-col .col5{width:40.399%}.ie7 .row-col .col5{width:40.307%}.row-col [class^="col"].offset5{margin-left:44.565%}.row-col [class^="col"].offset5:first-child{margin-left:42.482%}.row-col .col6{width:48.913%}.ie7 .row-col .col6{width:48.821%}.row-col [class^="col"].offset6{margin-left:53.08%}.row-col [class^="col"].offset6:first-child{margin-left:50.996%}.row-col .col7{width:57.428%}.ie7 .row-col .col7{width:57.336%}.row-col [class^="col"].offset7{margin-left:61.594%}.row-col [class^="col"].offset7:first-child{margin-left:59.511%}.row-col .col8{width:65.942%}.ie7 .row-col .col8{width:65.85%}.row-col [class^="col"].offset8{margin-left:70.109%}.row-col [class^="col"].offset8:first-child{margin-left:68.025%}.row-col .col9{width:74.457%}.ie7 .row-col .col9{width:74.365%}.row-col [class^="col"].offset9{margin-left:78.623%}.row-col [class^="col"].offset9:first-child{margin-left:76.54%}.row-col .col10{width:82.971%}.ie7 .row-col .col10{width:82.879%}.row-col [class^="col"].offset10{margin-left:87.138%}.row-col [class^="col"].offset10:first-child{margin-left:85.054%}.row-col .col11{width:91.486%}.ie7 .row-col .col11{width:91.394%}.row-col [class^="col"].offset11{margin-left:95.652%}.row-col [class^="col"].offset11:first-child{margin-left:93.569%}.row-col .col12{width:100%}.row-col [class^="col"].offset12{margin-left:104.167%}.row-col [class^="col"].offset12:first-child{margin-left:102.083%}.row-col{margin:10px 0}[class^="col"]{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;background:#CCC}[class^="col"] [class^="col"]{background:#AAA}[class^="col"] [class^="col"] [class^="col"]{background:#696969;color:#C0C0C0}.clearfix-demo{background:#58608D;width:90%;padding:10px}.clearfix-demo:before,.clearfix-demo:after{content:"";display:table}.clearfix-demo:after{clear:both}.ie6 .clearfix-demo,.ie7 .clearfix-demo{zoom:1}.clearfix-demo div{background:white}.despegar-size-1-demo{font-size:11px}.despegar-size-2-demo{font-size:13px}.despegar-size-3-demo{font-size:16px}.despegar-size-4-demo{font-size:20px}.despegar-size-5-demo{font-size:24px}.despegar-size-6-demo{font-size:28px}.despegar-black-demo{padding:10px;background:#000;color:white}.despegar-white-demo{padding:10px;background:#fff}.despegar-yellow-demo{padding:10px;background:#ff3}.despegar-red-demo{padding:10px;background:red}.despegar-blue-demo{padding:10px;background:#013d93;color:white}.despegar-gray-1-demo{padding:10px;background:#222;color:white}.despegar-gray-2-demo{padding:10px;background:#444;color:white}.despegar-gray-3-demo{padding:10px;background:#666;color:white}.despegar-gray-4-demo{padding:10px;background:#888;color:white}.despegar-gray-5-demo{padding:10px;background:#aaa;color:white}.despegar-gray-6-demo{padding:10px;background:#ccc}.despegar-gray-7-demo{padding:10px;background:#eee}.despegar-searchbox-bg-demo{padding:10px;background:#ff3}.despegar-title-color-demo{padding:10px;background:#013d93;color:white}.despegar-titlealt-color-demo{padding:10px;background:#f90}.despegar-link-color-demo{padding:10px;background:#319fda}.despegar-link-color-hover-demo{padding:10px;background:#6cf}.despegar-error-bg-demo{padding:10px;background:#ffe6e6}.despegar-error-border-demo{padding:10px;background:red}.despegar-warning-bg-demo{padding:10px;background:#ffffe1}.despegar-warning-border-demo{padding:10px;background:#fc3}
2600
3
  </style><!--[if lt IE 9]><script src="js/html5shiv.js"></script><![endif]--></head><body class="picasso-_list-grids"><section class="container"><aside><h1><a href="index.html">Docs</a></h1><nav><ul><li><a href="_picasso.html">_picasso
2601
4
  </a></li><li><p>picasso</p><ul><li><a href="picasso-_components.html">_components
2602
5
  </a></li><li><a href="picasso-_despegar.html">_despegar
@@ -2618,7 +21,6 @@ body {
2618
21
  </a></li></ul></li><li><p>utils</p><ul><li><a href="picasso-utils-_clearfix.html">_clearfix
2619
22
  </a></li><li><a href="picasso-utils-_grid.html">_grid
2620
23
  </a></li><li><a href="picasso-utils-_ie.html">_ie
2621
- </a></li><li><a href="picasso-utils-_rem.html">_rem
2622
24
  </a></li><li><a href="picasso-utils-_sprite.html">_sprite
2623
25
  </a></li></ul></li></ul></nav></aside><section class="content"><article id="" class="section"><div class="docs"><h2>List Grid</h2>
2624
26
  <p> Para mostrar datos en una grilla utilizando listas.