gumby-rails 1.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,9 @@
1
+ /*=======================================================================
2
+
3
+ ❤❤❤ Gumby by Digital Surgeons. ❤❤❤
4
+
5
+ *** This is where you should keep all of your design specific styles ***
6
+
7
+ ========================================================================*/
8
+
9
+
@@ -0,0 +1,50 @@
1
+ /*=======================================================================
2
+
3
+ ❤❤❤ Gumby by Digital Surgeons. ❤❤❤
4
+
5
+ *** This is where you should keep all of your TEXT styles ***
6
+
7
+ ========================================================================*/
8
+
9
+
10
+
11
+
12
+
13
+
14
+
15
+
16
+
17
+
18
+
19
+
20
+
21
+
22
+
23
+
24
+
25
+
26
+
27
+
28
+
29
+
30
+
31
+
32
+
33
+
34
+
35
+
36
+ /* ==|== media queries ======================================================
37
+ PLACEHOLDER Media Queries for Responsive Design.
38
+ These override the primary ('mobile first') styles
39
+ Modify as content requires.
40
+ ========================================================================== */
41
+
42
+ @media only screen and (min-width: 480px) {
43
+ /* Style adjustments for viewports 480px and over go here */
44
+
45
+ }
46
+
47
+ @media only screen and (min-width: 768px) {
48
+ /* Style adjustments for viewports 768px and over go here */
49
+
50
+ }
@@ -0,0 +1,1613 @@
1
+ /*=======================================================================
2
+
3
+ ❤❤❤ A Beautifully Responsive UI Kit. Perfected by Digital Surgeons. ❤❤❤
4
+
5
+ ========================================================================*/
6
+
7
+
8
+
9
+
10
+ /*=======================================================================
11
+
12
+ Buttons
13
+
14
+ ========================================================================*/
15
+
16
+
17
+ .btn {
18
+
19
+ position: relative;
20
+ display: inline-block;
21
+
22
+ width: auto;
23
+ height: 36px;
24
+ font-size: 16px;
25
+ line-height: 36px;
26
+ border: 1px solid #999;
27
+ border-radius: 4px;
28
+ cursor: pointer;
29
+ margin: 0 0 20px 0;
30
+
31
+ -webkit-box-shadow: inset 0 1px 1px #fff,
32
+ 0 1px 2px rgba(0,0,0,0.31); /* Remove this line if you dont want a dropshadow on your buttons*/
33
+ box-shadow: inset 0 1px 1px #fff,
34
+ 0 1px 2px rgba(0,0,0,0.31); /* Remove this line if you dont want a dropshadow on your buttons*/
35
+
36
+ background: #ccc; /* Old browsers */
37
+ background: -moz-linear-gradient(top, #eee 0%, #ccc 100%); /* FF3.6+ */
38
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eee), color-stop(100%,#ccc)); /* Chrome,Safari4+ */
39
+ background: -webkit-linear-gradient(top, #eee 0%,#ccc 100%); /* Chrome10+,Safari5.1+ */
40
+ background: -o-linear-gradient(top, #eee 0%,#ccc 100%); /* Opera 11.10+ */
41
+ background: -ms-linear-gradient(top, #eee 0%,#ccc 100%); /* IE10+ */
42
+ background: linear-gradient(top, #eee 0%,#ccc 100%); /* W3C */
43
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
44
+ }
45
+
46
+ .btn:hover {
47
+ -webkit-box-shadow: inset 0 1px 1px #fff,
48
+ 0 1px 2px rgba(0,0,0,0.31); /* Remove this line if you dont want a dropshadow on your buttons*/
49
+ box-shadow: inset 0 1px 1px #fff,
50
+ 0 1px 2px rgba(0,0,0,0.31); /* Remove this line if you dont want a dropshadow on your buttons*/
51
+
52
+ background: #ccc; /* Old browsers */
53
+ background: -moz-linear-gradient(top, #fff 0%, #ddd 100%); /* FF3.6+ */
54
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#ddd)); /* Chrome,Safari4+ */
55
+ background: -webkit-linear-gradient(top, #fff 0%,#ddd 100%); /* Chrome10+,Safari5.1+ */
56
+ background: -o-linear-gradient(top, #fff 0%,#ddd 100%); /* Opera 11.10+ */
57
+ background: -ms-linear-gradient(top, #fff 0%,#ddd 100%); /* IE10+ */
58
+ background: linear-gradient(top, #fff 0%,#ddd 100%); /* W3C */
59
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */
60
+ }
61
+
62
+
63
+ .btn a, .btn:hover a {
64
+ display: block;
65
+ font-family: "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
66
+ font-weight: bold;
67
+ padding: 0 20px;
68
+ text-align: center;
69
+ text-decoration: none;
70
+ color: #444;
71
+ text-shadow: 0 1px 1px #fff;
72
+ }
73
+
74
+ .btn:hover a {
75
+ line-height: inherit;
76
+ }
77
+
78
+ .btn:active {
79
+ background: #ccc; /* Old browsers */
80
+ background: -moz-linear-gradient(top, #ddd 0%, #fff 100%); /* FF3.6+ */
81
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ddd), color-stop(100%,#fff)); /* Chrome,Safari4+ */
82
+ background: -webkit-linear-gradient(top, #ddd 0%,#fff 100%); /* Chrome10+,Safari5.1+ */
83
+ background: -o-linear-gradient(top, #ddd 0%,#fff 100%); /* Opera 11.10+ */
84
+ background: -ms-linear-gradient(top, #ddd 0%,#fff 100%); /* IE10+ */
85
+ background: linear-gradient(top, #ddd 0%,#fff 100%); /* W3C */
86
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
87
+ }
88
+
89
+ .btn.primary {
90
+ font-size: 24px;
91
+ height: 56px;
92
+ line-height: 56px;
93
+ border: 1px solid #7d180a;
94
+
95
+ background: #c54224; /* Old browsers */
96
+ background: -moz-linear-gradient(top, #ef6638 0%, #b62918 100%); /* FF3.6+ */
97
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ef6638), color-stop(100%,#b62918)); /* Chrome,Safari4+ */
98
+ background: -webkit-linear-gradient(top, #ef6638 0%,#b62918 100%); /* Chrome10+,Safari5.1+ */
99
+ background: -o-linear-gradient(top, #ef6638 0%,#b62918 100%); /* Opera 11.10+ */
100
+ background: -ms-linear-gradient(top, #ef6638 0%,#b62918 100%); /* IE10+ */
101
+ background: linear-gradient(top, #ef6638 0%,#b62918 100%); /* W3C */
102
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ef6638', endColorstr='#b62918',GradientType=0 ); /* IE6-9 */
103
+
104
+ -webkit-box-shadow: inset 0 1px 1px #fb926a,
105
+ 0 1px 2px rgba(0,0,0,0.61); /* Remove this line if you dont want a dropshadow on your buttons*/
106
+ box-shadow: inset 0 1px 1px #fb926a,
107
+ 0 1px 2px rgba(0,0,0,0.61); /* Remove this line if you dont want a dropshadow on your buttons*/
108
+
109
+ -webkit-box-sizing: border-box;
110
+ -moz-box-sizing: border-box;
111
+ -ms-box-sizing: border-box;
112
+ box-sizing: border-box;
113
+
114
+ }
115
+
116
+ .btn.primary:hover {
117
+ line-height: 56px;
118
+ background: #ed754e; /* Old browsers */
119
+ background: -moz-linear-gradient(top, #ed754e 0%, #c93e23 100%); /* FF3.6+ */
120
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ed754e), color-stop(100%,#c93e23)); /* Chrome,Safari4+ */
121
+ background: -webkit-linear-gradient(top, #ed754e 0%,#c93e23 100%); /* Chrome10+,Safari5.1+ */
122
+ background: -o-linear-gradient(top, #ed754e 0%,#c93e23 100%); /* Opera 11.10+ */
123
+ background: -ms-linear-gradient(top, #ed754e 0%,#c93e23 100%); /* IE10+ */
124
+ background: linear-gradient(top, #ed754e 0%,#c93e23 100%); /* W3C */
125
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ed754e', endColorstr='#c93e23',GradientType=0 ); /* IE6-9 */
126
+ }
127
+
128
+ .btn.primary a, btn.primary:hover a {
129
+ color: #fff;
130
+ text-shadow: 0 1px 2px #6f1c0e,
131
+ 0 1px 0 #6f1c0e;
132
+ }
133
+
134
+ .btn.primary:active {
135
+ background: #ed754e; /* Old browsers */
136
+ background: -moz-linear-gradient(top, #c93e23 0%, #ed754e 100%); /* FF3.6+ */
137
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c93e23), color-stop(100%,#ed754e)); /* Chrome,Safari4+ */
138
+ background: -webkit-linear-gradient(top, #c93e23 0%,#ed754e 100%); /* Chrome10+,Safari5.1+ */
139
+ background: -o-linear-gradient(top, #c93e23 0%,#ed754e 100%); /* Opera 11.10+ */
140
+ background: -ms-linear-gradient(top, #c93e23 0%,#ed754e 100%); /* IE10+ */
141
+ background: linear-gradient(top, #c93e23 0%,#ed754e 100%); /* W3C */
142
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c93e23', endColorstr='#ed754e',GradientType=0 ); /* IE6-9 */
143
+ }
144
+
145
+ .btn.secondary {
146
+ font-size: 24px;
147
+ height: 56px;
148
+ line-height: 56px;
149
+ border-color: #1d692d;
150
+
151
+ -webkit-box-shadow: inset 0 1px 1px #94dda6,
152
+ 0 1px 2px rgba(0,0,0,0.61); /* Remove this line if you dont want a dropshadow on your buttons*/
153
+ box-shadow: inset 0 1px 1px #94dda6,
154
+ 0 1px 2px rgba(0,0,0,0.61); /* Remove this line if you dont want a dropshadow on your buttons*/
155
+
156
+ background: #5dbb73; /* Old browsers */
157
+ background: -moz-linear-gradient(top, #5dbb73 0%, #2d9047 100%); /* FF3.6+ */
158
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5dbb73), color-stop(100%,#2d9047)); /* Chrome,Safari4+ */
159
+ background: -webkit-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* Chrome10+,Safari5.1+ */
160
+ background: -o-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* Opera 11.10+ */
161
+ background: -ms-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* IE10+ */
162
+ background: linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* W3C */
163
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5dbb73', endColorstr='#2d9047',GradientType=0 ); /* IE6-9 */
164
+ }
165
+
166
+ .btn.secondary:hover {
167
+ background: #68ce80; /* Old browsers */
168
+ background: -moz-linear-gradient(top, #68ce80 0%, #3cae5a 100%); /* FF3.6+ */
169
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#68ce80), color-stop(100%,#3cae5a)); /* Chrome,Safari4+ */
170
+ background: -webkit-linear-gradient(top, #68ce80 0%,#3cae5a 100%); /* Chrome10+,Safari5.1+ */
171
+ background: -o-linear-gradient(top, #68ce80 0%,#3cae5a 100%); /* Opera 11.10+ */
172
+ background: -ms-linear-gradient(top, #68ce80 0%,#3cae5a 100%); /* IE10+ */
173
+ background: linear-gradient(top, #68ce80 0%,#3cae5a 100%); /* W3C */
174
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#68ce80', endColorstr='#3cae5a',GradientType=0 ); /* IE6-9 */
175
+ }
176
+
177
+ .btn.secondary a, .btn.secondary:hover a {
178
+ color: #fff;
179
+ text-shadow: 0 1px 2px #114a1e,
180
+ 0 1px 0 #114a1e;
181
+ }
182
+
183
+ .btn.secondary:active {
184
+ background: #68ce80; /* Old browsers */
185
+ background: -moz-linear-gradient(top, #3cae5a 0%, #68ce80 100%); /* FF3.6+ */
186
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3cae5a), color-stop(100%,#68ce80)); /* Chrome,Safari4+ */
187
+ background: -webkit-linear-gradient(top, #3cae5a 0%,#68ce80 100%); /* Chrome10+,Safari5.1+ */
188
+ background: -o-linear-gradient(top, #3cae5a 0%,#68ce80 100%); /* Opera 11.10+ */
189
+ background: -ms-linear-gradient(top, #3cae5a 0%,#68ce80 100%); /* IE10+ */
190
+ background: linear-gradient(top, #3cae5a 0%,#68ce80 100%); /* W3C */
191
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3cae5a', endColorstr='#68ce80',GradientType=0 ); /* IE6-9 */
192
+ }
193
+
194
+ .btn.tertiary {
195
+ font-size: 20px;
196
+ height: 46px;
197
+ line-height: 46px;
198
+ border-color: #c19114;
199
+
200
+ background: #feeeb8; /* Old browsers */
201
+ background: -moz-linear-gradient(top, #feeeb8 0%, #fed554 100%); /* FF3.6+ */
202
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#feeeb8), color-stop(100%,#fed554)); /* Chrome,Safari4+ */
203
+ background: -webkit-linear-gradient(top, #feeeb8 0%,#fed554 100%); /* Chrome10+,Safari5.1+ */
204
+ background: -o-linear-gradient(top, #feeeb8 0%,#fed554 100%); /* Opera 11.10+ */
205
+ background: -ms-linear-gradient(top, #feeeb8 0%,#fed554 100%); /* IE10+ */
206
+ background: linear-gradient(top, #feeeb8 0%,#fed554 100%); /* W3C */
207
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feeeb8', endColorstr='#fed554',GradientType=0 ); /* IE6-9 */
208
+
209
+ -webkit-box-shadow: inset 0 2px 2px #fef9e9,
210
+ inset 0 -3px 5px #fcaa20,
211
+ 0 1px 2px rgba(0,0,0,0.61); /* Remove this line if you dont want a dropshadow on your buttons*/
212
+ box-shadow: inset 0 2px 2px #fef9e9,
213
+ inset 0 -3px 5px #fcaa20,
214
+ 0 1px 2px rgba(0,0,0,0.61); /* Remove this line if you dont want a dropshadow on your buttons*/
215
+ }
216
+
217
+ .btn.tertiary:hover {
218
+ background: #fef4d3; /* Old browsers */
219
+ background: -moz-linear-gradient(top, #fef4d3 0%, #fcde7e 100%); /* FF3.6+ */
220
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fef4d3), color-stop(100%,#fcde7e)); /* Chrome,Safari4+ */
221
+ background: -webkit-linear-gradient(top, #fef4d3 0%,#fcde7e 100%); /* Chrome10+,Safari5.1+ */
222
+ background: -o-linear-gradient(top, #fef4d3 0%,#fcde7e 100%); /* Opera 11.10+ */
223
+ background: -ms-linear-gradient(top, #fef4d3 0%,#fcde7e 100%); /* IE10+ */
224
+ background: linear-gradient(top, #fef4d3 0%,#fcde7e 100%); /* W3C */
225
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fef4d3', endColorstr='#fcde7e',GradientType=0 ); /* IE6-9 */
226
+
227
+ -webkit-box-shadow: inset 0 2px 2px #fef9e9,
228
+ inset 0 -3px 5px #fdc841,
229
+ 0 1px 2px rgba(0,0,0,0.61); /* Remove this line if you dont want a dropshadow on your buttons*/
230
+ box-shadow: inset 0 2px 2px #fef9e9,
231
+ inset 0 -3px 5px #fdc841,
232
+ 0 1px 2px rgba(0,0,0,0.61); /* Remove this line if you dont want a dropshadow on your buttons*/
233
+ }
234
+
235
+ .btn.tertiary a, .btn.tertiary:hover a {
236
+ color: #6a4a00;
237
+ text-shadow: 0 1px 2px #fff;
238
+ }
239
+
240
+ .btn.tertiary:active {
241
+ background: #fef4d3; /* Old browsers */
242
+ background: -moz-linear-gradient(top, #fcde7e 0%, #fef4d3 100%); /* FF3.6+ */
243
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcde7e), color-stop(100%,#fef4d3)); /* Chrome,Safari4+ */
244
+ background: -webkit-linear-gradient(top, #fcde7e 0%,#fef4d3 100%); /* Chrome10+,Safari5.1+ */
245
+ background: -o-linear-gradient(top, #fcde7e 0%,#fef4d3 100%); /* Opera 11.10+ */
246
+ background: -ms-linear-gradient(top, #fcde7e 0%,#fef4d3 100%); /* IE10+ */
247
+ background: linear-gradient(top, #fcde7e 0%,#fef4d3 100%); /* W3C */
248
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcde7e', endColorstr='#fef4d3',GradientType=0 ); /* IE6-9 */
249
+ }
250
+
251
+ .oval {
252
+ -moz-border-radius: 1000px;
253
+ -webkit-border-radius: 1000px;
254
+ border-radius: 1000px;
255
+ }
256
+
257
+ .btn.submit input {
258
+ font: 16px "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
259
+ font-weight: bold;
260
+ padding: 0 20px;
261
+ text-align: center;
262
+ text-decoration: none;
263
+ background: transparent;
264
+ color: #444;
265
+ text-shadow: 0 1px 1px #fff;
266
+ border: none;
267
+ margin: 0;
268
+ cursor: pointer;
269
+ }
270
+
271
+ .btn.submit {
272
+ text-align: center;
273
+ }
274
+
275
+ .btn.left {
276
+ text-align: left;
277
+ text-indent: 12px;
278
+ }
279
+
280
+
281
+
282
+ /*=====================================================================
283
+
284
+ Resize your buttons (Works in conjunction with .primary, .secondary,
285
+ .tertiary button styles as well!)
286
+
287
+ =======================================================================*/
288
+
289
+
290
+
291
+ .small.btn {
292
+ font-size: 12px;
293
+ line-height: 24px !important;
294
+ height: 24px;
295
+ }
296
+
297
+ .medium.btn {
298
+ font-size: 16px;
299
+ line-height: 40px !important;
300
+ height: 40px;
301
+ }
302
+
303
+ .large.btn {
304
+ font-size: 30px;
305
+ line-height: 65px !important;
306
+ height: 65px;
307
+ }
308
+
309
+ /* Mobile Buttons */
310
+
311
+ @media only screen and (max-width: 767px) {
312
+ .btn { display: block; }
313
+ button.btn { width: 100%; padding-left: 0px; padding-right: 0px; }
314
+
315
+ .btn.primary, .btn.secondary, .btn.tertiary, .btn.large {
316
+ width: 100% !important;
317
+ }
318
+
319
+ .btn.medium {
320
+ min-width: 75% !important;
321
+ }
322
+ }
323
+
324
+ @media only screen and (min-width:768px) and (max-width: 939px) {
325
+ /* Style adjustments for viewports between 768px and 940px */
326
+
327
+ .btn.shrink a {
328
+ font-size: 90%;
329
+ }
330
+
331
+ }
332
+
333
+ /* Correct FF button padding, thx ZURB */
334
+ @-moz-document url-prefix(http://) {
335
+ input[type=submit].button::-moz-focus-inner, button.button::-moz-focus-inner { border: 0; padding: 0; }
336
+ input[type=submit].small.button { padding: 7px 20px 8px; }
337
+ input[type=submit].medium.button { padding: 8px 34px 9px; }
338
+ input[type=submit].large.button { padding: 9px 48px 10px; }
339
+ }
340
+
341
+
342
+ /* --------------------------------------------------
343
+ Alerts
344
+ -------------------------------------------------- */
345
+
346
+ div.alert-box { display: block; padding: 6px 7px; font-weight: bold; font-size: 13px; background: #eee; border: 1px solid rgba(0,0,0,0.1); margin-bottom: 12px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; text-shadow: 0px 1px rgba(255,255,255,0.9); position: relative; }
347
+ .alert-box.success { background-color: #7fae00; color: #fff; text-shadow: 0px -1px rgba(0,0,0,0.3); }
348
+ .alert-box.warning { background-color: #c08c00; color: #fff; text-shadow: 0px -1px rgba(0,0,0,0.3); }
349
+ .alert-box.error { background-color: #c00000; color: #fff; text-shadow: 0px -1px rgba(0,0,0,0.3); }
350
+
351
+ .alert-box a.close { color: #000; position: absolute; right: 4px; top: 0px; font-size: 18px; opacity: 0.2; padding: 4px; }
352
+ .alert-box a.close:hover { opacity: 0.4; }
353
+
354
+
355
+
356
+ /*=======================================================================
357
+
358
+ Pagination
359
+
360
+ ========================================================================*/
361
+
362
+
363
+ ul.pagination { display: block; height: 24px; margin-left: -5px; }
364
+ ul.pagination li { float: left; display: block; height: 24px; color: #999; font-size: 15px; margin-left: 5px; }
365
+ ul.pagination li a { display: block; padding: 6px 7px 4px; color: #555; }
366
+ ul.pagination li.current a, ul.pagination li:hover a { border-bottom: solid 2px #00a6fc; color: #141414; }
367
+ ul.pagination li.unavailable a { cursor: default; color: #999; }
368
+ ul.pagination li.unavailable:hover a { border-bottom: none; }
369
+
370
+
371
+
372
+ /*=======================================================================
373
+
374
+ Tabs
375
+
376
+ ========================================================================*/
377
+
378
+ .tabs {
379
+ display: block;
380
+ }
381
+
382
+ .tabs ul {
383
+ margin: 0;
384
+ padding: 0;
385
+ height: 30px;
386
+ border-bottom: 1px solid #1d692d;
387
+ }
388
+
389
+ .tabs li {
390
+ display: block;
391
+ width: auto;
392
+ padding: 0;
393
+ margin: 0 10px 0 0;
394
+ line-height: 30px;
395
+ float: left;
396
+ color: #999;
397
+ cursor: default;
398
+ }
399
+
400
+ .tabs li a {
401
+ display: block;
402
+ width: auto;
403
+ height: 29px;
404
+ padding: 0 9px;
405
+ line-height: 30px;
406
+ border: 1px solid #1d692d;
407
+ margin: 0 -1px 0 0;
408
+ color: #05390a;
409
+ text-shadow: 0 1px 1px #77d58e;
410
+ background: #5dbb73;
411
+ }
412
+
413
+ .tabs li a:hover {
414
+ text-decoration: none;
415
+ }
416
+
417
+ .tabs li.active a {
418
+ height: 30px;
419
+ font-weight: bold;
420
+ background: #ebffef;
421
+ border-width: 1px 1px 0 1px;
422
+ text-shadow: 0 1px 1px #fff;
423
+ }
424
+
425
+ .tabs > div {
426
+ display: none;
427
+ padding: 20px 10px;
428
+ }
429
+
430
+ .tabs div.active {
431
+ display: block;
432
+ }
433
+
434
+ .tabs li:last-child {
435
+ margin-right: 0;
436
+ }
437
+
438
+ /**** Pretty Tab Styles ****/
439
+
440
+ .pretty.tabs ul {
441
+ display: table;
442
+ width: 100%;
443
+ border: 1px solid #999;
444
+ border-radius: 4px 4px 0 0;
445
+
446
+ -webkit-box-shadow: inset 0 1px 1px #fff;
447
+ box-shadow: inset 0 1px 1px #fff;
448
+
449
+ background: #ccc; /* Old browsers */
450
+ background: -moz-linear-gradient(top, #eee 0%, #ccc 100%); /* FF3.6+ */
451
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eee), color-stop(100%,#ccc)); /* Chrome,Safari4+ */
452
+ background: -webkit-linear-gradient(top, #eee 0%,#ccc 100%); /* Chrome10+,Safari5.1+ */
453
+ background: -o-linear-gradient(top, #eee 0%,#ccc 100%); /* Opera 11.10+ */
454
+ background: -ms-linear-gradient(top, #eee 0%,#ccc 100%); /* IE10+ */
455
+ background: linear-gradient(top, #eee 0%,#ccc 100%); /* W3C */
456
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
457
+
458
+ }
459
+
460
+ .pretty.tabs li {
461
+ display: table-cell;
462
+ float: none;
463
+ text-align: center;
464
+ }
465
+
466
+ .pretty.tabs li a {
467
+ padding: 0;
468
+ font-size: 16px;
469
+ height: 52px;
470
+ line-height: 52px;
471
+ color: #444;
472
+ border: none;
473
+ border-right: 1px solid #999;
474
+ text-shadow: 0 1px 1px #fff;
475
+ font-weight: bold;
476
+ background: transparent;
477
+ }
478
+
479
+ .pretty.tabs li:last-child a {
480
+ border-right: none;
481
+ }
482
+
483
+ .pretty.tabs li.active a {
484
+ font-weight: bold;
485
+ color: #fff;
486
+ position: relative;
487
+ border: none;
488
+ text-shadow: 0 2px 1px #1d692d,
489
+ 0 1px 1px #1d692d
490
+ ;
491
+
492
+ -webkit-box-shadow: inset 0 1px 1px #94dda6,
493
+ 0 1px 0 #1d692d,
494
+ 0 -1px 0 #1d692d,
495
+ 1px 0 0 #1d692d,
496
+ -1px 0 0 #1d692d
497
+ ;
498
+ box-shadow: inset 0 1px 1px #94dda6,
499
+ 0 1px 0 #1d692d,
500
+ 0 -1px 0 #1d692d,
501
+ 1px 0 0 #1d692d,
502
+ -1px 0 0 #1d692d
503
+ ;
504
+
505
+ background: #5dbb73; /* Old browsers */
506
+ background: -moz-linear-gradient(top, #5dbb73 0%, #2d9047 100%); /* FF3.6+ */
507
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5dbb73), color-stop(100%,#2d9047)); /* Chrome,Safari4+ */
508
+ background: -webkit-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* Chrome10+,Safari5.1+ */
509
+ background: -o-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* Opera 11.10+ */
510
+ background: -ms-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* IE10+ */
511
+ background: linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* W3C */
512
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5dbb73', endColorstr='#2d9047',GradientType=0 ); /* IE6-9 */
513
+
514
+ }
515
+
516
+ .pretty.tabs ul li.active:first-child a {
517
+ border-radius: 4px 0 0 0;
518
+ margin-left: 0;
519
+ }
520
+
521
+ .pretty.tabs ul li.active:last-child a {
522
+ border-radius: 0 4px 0 0;
523
+ }
524
+
525
+ .ie7 .pretty.tabs > ul { width: 100%; height: 51px; }
526
+ .ie7 .pretty.tabs > ul li { display: block; float: left; margin: 0; }
527
+ .ie7 .pretty.tabs > ul li a { padding: 0 20px; }
528
+
529
+
530
+
531
+ /**** Pill Tabs ****/
532
+
533
+ .pill.tabs { height: auto; }
534
+ .pill.tabs li, .pill.tabs li, .pretty.pill.tabs li { float: none; height: auto; }
535
+ .pill.tabs li a { display: block; width: auto; height: auto; padding: 15px 20px; line-height: 1; border: solid 0 #ccc; border-width: 1px 1px 0; margin: 0; color: #555; background: #eee; font-size: 15px; font-size: 1.5rem; }
536
+ .pill.tabs li a.active { height: auto; margin: 0; border-width: 1px 0 0; background: #fff; }
537
+
538
+ .pretty.pill.tabs { border-bottom: solid 1px #eee; height: auto; }
539
+ .pretty.pill.tabs li a { padding: 15px 20px; border: none; border-left: 1px solid #eee; border-right: 1px solid #eee; border-top: 1px solid #eee; background: #fff; }
540
+ .pretty.pill.tabs li a.active { border: none; background: #00a6fc; color: #fff; margin: 0; position: static; top: 0; height: auto; }
541
+ .pretty.pill.tabs li.active:first-child a { margin: 0; }
542
+
543
+
544
+ @media only screen and (max-width: 767px) {
545
+ .pretty.tabs ul {
546
+ border-radius: 4px;
547
+ overflow: hidden;
548
+ }
549
+
550
+ .pretty.tabs li a {
551
+ height: 36px;
552
+ line-height: 36px;
553
+ font-size: 14px;
554
+ }
555
+ }
556
+
557
+ /* Vertically Align Stuff */
558
+
559
+ .valign { display: table; width: 100%; }
560
+
561
+ .valign > div, .valign > article { display: table-cell; vertical-align: middle; }​
562
+
563
+
564
+ /*=======================================================================
565
+ ========================================================================
566
+
567
+ ❤❤❤ A Beautifully Responsive UI Kit. Perfected by Digital Surgeons. ❤❤❤
568
+
569
+ ========================================================================
570
+ ========================================================================*/
571
+
572
+
573
+
574
+
575
+ /*=======================================================================
576
+
577
+ Form Styles
578
+
579
+ ========================================================================*/
580
+
581
+ form {
582
+ margin: 0 0 18px;
583
+ }
584
+
585
+ form label {
586
+ display: block;
587
+ font-size: 16px;
588
+ line-height: 18px;
589
+ cursor: pointer;
590
+ margin-bottom: 9px;
591
+ }
592
+
593
+ form .field {
594
+ position: relative;
595
+ margin-bottom: 10px;
596
+ }
597
+
598
+ form dt {
599
+ margin: 0;
600
+ }
601
+
602
+ .field .text input, .field .text input[type="search"], form textarea {
603
+ font-size: 14px;
604
+ font-family: "Lucida Grande", sans-serif;
605
+ width: 100%;
606
+ border: none;
607
+ box-shadow: none;
608
+ -webkit-box-shadow: none;
609
+ border: none;
610
+ padding: 0;
611
+ margin: 0;
612
+ outline: none;
613
+ resize: none;
614
+ }
615
+
616
+ form textarea {
617
+ height: 150px;
618
+ }
619
+
620
+ .field .text input[type="search"] {
621
+ -webkit-appearance: textfield;
622
+ }
623
+
624
+ .field .text, .field .search, .field .textarea {
625
+ position: relative;
626
+ font-size: 14px;
627
+ padding: 8px 10px;
628
+ outline: none !important;
629
+ background: #fff;
630
+ -webkit-box-shadow: inset 0 2px 3px #ccc,
631
+ 0 1px 0 #f4fff6
632
+ ;
633
+ box-shadow: inset 0 2px 3px #ccc,
634
+ 0 1px 0 #f4fff6
635
+ ;
636
+ border: 1px solid #b7b7b7;
637
+ border-radius: 4px;
638
+ }
639
+
640
+ .field .text.oval {
641
+ border-radius: 1000px;
642
+ }
643
+
644
+ .field .search {
645
+ padding: 2px 10px;
646
+ line-height: 24px;
647
+ margin-bottom: 0;
648
+ border: 1px solid #1d692d;
649
+ -webkit-box-shadow: 0px 1px 1px #94dda6,
650
+ inset 0 1px 3px #888
651
+ ;
652
+ box-shadow: 0px 1px 1px #94dda6,
653
+ inset 0 1px 3px #888
654
+ ;
655
+ }
656
+
657
+ label + .text, label + textarea, label + select, label + div.dropdown, select + div.dropdown {
658
+ margin-top: -9px;
659
+ }
660
+
661
+ .field.error .text,
662
+ .field.error .textarea {
663
+ margin-top: 45px;
664
+ -webkit-box-shadow: inset 0 2px 3px #feb9a2,
665
+ 0 1px 0 #f4fff6
666
+ ;
667
+ box-shadow: inset 0 2px 3px #feb9a2,
668
+ 0 1px 0 #f4fff6
669
+ ;
670
+ -webkit-transition-duration: .2s; /* Saf3.2+, Chrome */
671
+ -moz-transition-duration: .2s; /* FF4+ */
672
+ -ms-transition-duration: .2s; /* IE10 */
673
+ -o-transition-duration: .2s; /* Opera 10.5+ */
674
+ transition-duration: .2s;
675
+ }
676
+
677
+ .field.error .text, .field.error .textarea, .field.error input, .field.error textarea {
678
+ color: #cd4225;
679
+ background: #ffdace;
680
+ }
681
+
682
+ /* style placeholder text for Webkit browsers */
683
+ .field.error input::-webkit-input-placeholder{
684
+ color: #cd4225;
685
+ }
686
+
687
+ /* style placeholder text for Firefox */
688
+ .field.error input:-moz-placeholder{
689
+ color: #cd4225;
690
+ }
691
+
692
+ form .msg {
693
+ display: block;
694
+ opacity: 0;
695
+ filter: alpha(opacity=0);
696
+ height: 0;
697
+ width: 100%;
698
+ overflow: hidden;
699
+ }
700
+
701
+ form .error > .msg {
702
+ opacity: 1;
703
+ filter: alpha(opacity=100);
704
+ height: auto;
705
+ overflow: visible;
706
+
707
+ position: absolute;
708
+ top: 0px;
709
+ display: block;
710
+
711
+ width: 100%;
712
+ background: #b72a18;
713
+ color: #fff;
714
+ font-weight: 500;
715
+ font-size: 14px;
716
+ text-align: center;
717
+ padding: 8px 0;
718
+ border-radius: 4px;
719
+ -webkit-transition-duration: .2s; /* Saf3.2+, Chrome */
720
+ -moz-transition-duration: .2s; /* FF4+ */
721
+ -ms-transition-duration: .2s; /* IE10 */
722
+ -o-transition-duration: .2s; /* Opera 10.5+ */
723
+ transition-duration: .2s;
724
+ }
725
+
726
+ form .error .msg .caret {
727
+ left: 50%;
728
+ top: 100%;
729
+ border-right: 5px solid transparent;
730
+ border-left: 5px solid transparent;
731
+ border-top: 5px solid #b72a18;
732
+ opacity: 1;
733
+ filter: alpha(opacity=100);
734
+ }
735
+
736
+ form .msg .caret {
737
+ opacity:0;
738
+ filter: alpha(opacity=0);
739
+ }
740
+
741
+ /* Form Picker Element (<select>) */
742
+
743
+ .picker {
744
+ position: relative;
745
+ width: auto;
746
+ height: 38px;
747
+ display: inline-block;
748
+ margin: 0 0 2px 1.2%;
749
+ }
750
+
751
+ .picker:first-child {
752
+ margin-left: 0;
753
+ }
754
+
755
+ .picker select {
756
+ position: absolute;
757
+ z-index: 0;
758
+ display:none;
759
+ }
760
+
761
+ .picker .toggle {
762
+ position: relative;
763
+ top: 0;
764
+ left: 0;
765
+ height: 36px;
766
+ padding: 0 35px 0 20px;
767
+ border: 1px solid #999;
768
+ border-radius: 4px;
769
+ font: bold 16px "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
770
+ line-height: 36px;
771
+ color: #444;
772
+ text-shadow: 0 1px 1px #fff;
773
+ display: inline-block;
774
+ z-index: 1;
775
+
776
+ background: #ccc; /* Old browsers */
777
+ background: -moz-linear-gradient(top, #eee 0%, #ccc 100%); /* FF3.6+ */
778
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eee), color-stop(100%,#ccc)); /* Chrome,Safari4+ */
779
+ background: -webkit-linear-gradient(top, #eee 0%,#ccc 100%); /* Chrome10+,Safari5.1+ */
780
+ background: -o-linear-gradient(top, #eee 0%,#ccc 100%); /* Opera 11.10+ */
781
+ background: -ms-linear-gradient(top, #eee 0%,#ccc 100%); /* IE10+ */
782
+ background: linear-gradient(top, #eee 0%,#ccc 100%); /* W3C */
783
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
784
+ -webkit-box-shadow: inset 0 1px 1px #fff,
785
+ 0 1px 2px rgba(0,0,0,0.31); /* Remove this line if you dont want a dropshadow on your buttons*/
786
+ box-shadow: inset 0 1px 1px #fff,
787
+ 0 1px 2px rgba(0,0,0,0.31); /* Remove this line if you dont want a dropshadow on your buttons*/
788
+ }
789
+
790
+ .picker .toggle:hover {
791
+ border-color: #bbb;
792
+ background: #eee; /* Old browsers */
793
+ background: -moz-linear-gradient(top, #fff 0%, #ddd 100%); /* FF3.6+ */
794
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#ddd)); /* Chrome,Safari4+ */
795
+ background: -webkit-linear-gradient(top, #fff 0%,#ddd 100%); /* Chrome10+,Safari5.1+ */
796
+ background: -o-linear-gradient(top, #fff 0%,#ddd 100%); /* Opera 11.10+ */
797
+ background: -ms-linear-gradient(top, #fff 0%,#ddd 100%); /* IE10+ */
798
+ background: linear-gradient(top, #fff 0%,#ddd 100%); /* W3C */
799
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */
800
+ }
801
+
802
+ .caret {
803
+ display: inline-block;
804
+ position: absolute;
805
+ width: 0;
806
+ height: 0;
807
+ text-indent: -99999px;
808
+ *text-indent: 0;
809
+ vertical-align: top;
810
+ border-left: 4px solid transparent;
811
+ border-right: 4px solid transparent;
812
+ border-top: 4px solid #000000;
813
+ opacity: 0.5;
814
+ filter: alpha(opacity=30);
815
+ content: "\2193";
816
+ -webkit-transition-duration: .2s; /* Saf3.2+, Chrome */
817
+ -moz-transition-duration: .2s; /* FF4+ */
818
+ -ms-transition-duration: .2s; /* IE10 */
819
+ -o-transition-duration: .2s; /* Opera 10.5+ */
820
+ transition-duration: .2s;
821
+ }
822
+
823
+ .picker .caret {
824
+ right: 12px;
825
+ top: 16px;
826
+ }
827
+
828
+ .picker:hover .caret, .picker.open .caret {
829
+ opacity: 1;
830
+ filter: alpha(opacity=100);
831
+ -webkit-transition-duration: .2s; /* Saf3.2+, Chrome */
832
+ -moz-transition-duration: .2s; /* FF4+ */
833
+ -ms-transition-duration: .2s; /* IE10 */
834
+ -o-transition-duration: .2s; /* Opera 10.5+ */
835
+ transition-duration: .2s;
836
+ }
837
+
838
+ .picker ul {
839
+ display: inline-block;
840
+ position: absolute;
841
+ text-align: center;
842
+ left: 0;
843
+ top: 20px;
844
+ min-width: 180px;
845
+ height: 0;
846
+ max-height: 0;
847
+ margin: 0;
848
+ overflow: hidden;
849
+ background: #fff;
850
+ border-radius: 4px;
851
+ }
852
+
853
+ .picker.open ul {
854
+ width: auto;
855
+ height: auto;
856
+ max-height: 1000px;
857
+ top: 40px;
858
+ border: 1px solid #bbb;
859
+ -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.31); /* Remove this line if you dont want a dropshadow on your buttons*/
860
+ box-shadow: 0 1px 2px rgba(0,0,0,0.31); /* Remove this line if you dont want a dropshadow on your buttons*/
861
+
862
+ -webkit-transition-duration: .4s; /* Saf3.2+, Chrome */
863
+ -moz-transition-duration: .4s; /* FF4+ */
864
+ -ms-transition-duration: .4s; /* IE10 */
865
+ -o-transition-duration: .4s; /* Opera 10.5+ */
866
+ transition-duration: .4s;
867
+ z-index: 99;
868
+ }
869
+
870
+ .picker ul li {
871
+ margin-bottom: 0;
872
+ border-bottom: 1px solid #eee;
873
+ text-align: left;
874
+ }
875
+
876
+ .picker ul li:last-child {
877
+ border-bottom: none;
878
+ }
879
+
880
+ .picker ul li a {
881
+ display: block;
882
+ padding: 10px 20px;
883
+ }
884
+
885
+ /* Inlined Label Style */
886
+ input.placeholder, textarea.placeholder { color: #888; }
887
+
888
+ /* Text input and textarea sizes */
889
+ input.input-text, textarea { width: 254px; }
890
+ input.small, textarea.small { width: 134px; }
891
+ input.medium, textarea.medium { width: 254px; }
892
+ input.large, textarea.large { width: 434px; }
893
+
894
+ /* Fieldsets */
895
+ form fieldset { padding: 9px 9px 2px 9px; border: solid 1px #ddd; margin: 18px 0; }
896
+
897
+ /* Inlined Radio & Checkbox */
898
+
899
+ form .field input[type=radio], form .field input[type=checkbox] {
900
+ display: inline;
901
+ width:auto;
902
+ margin-bottom:0;
903
+ }
904
+
905
+ form .field .radio span, form .field .checkbox span {
906
+ display: inline-block;
907
+ width: 16px;
908
+ height: 16px;
909
+ position: relative;
910
+ top: 2px;
911
+ border: solid 1px #ccc;
912
+ background: #fefefe;
913
+ }
914
+
915
+ form .field .radio.checked span, form .field .checkbox.checked span {
916
+ background: url(../img/sprite_checkradio.gif) #fefefe 0 1px no-repeat;
917
+ }
918
+
919
+ form .field .radio span {
920
+ border-radius: 8px;
921
+ -webkit-border-radius: 8px;
922
+ -moz-border-radius: 8px;
923
+ }
924
+
925
+ form .field .checkbox span {
926
+ border-radius: 3px;
927
+ -webkit-border-radius: 3px;
928
+ -moz-border-radius: 3px;
929
+ }
930
+
931
+ form .field .checkbox.checked span {
932
+ background-position: 0px -14px;
933
+ }
934
+
935
+
936
+
937
+ @media only screen and (max-width: 767px) {
938
+ /* Style adjustments for viewports lower than 768px go here */
939
+
940
+ /* inform JS */
941
+ .picker:after {
942
+ content: 'handheld';
943
+ display: none;
944
+ }
945
+
946
+ .picker select {
947
+ display: inline-block;
948
+ position: relative;
949
+ opacity: 1;
950
+ z-index: 1;
951
+
952
+ max-width: 100%;
953
+ height: 38px;
954
+ line-height: 38px;
955
+ font-size: 15px;
956
+ }
957
+
958
+ .picker .toggle {
959
+ display: none;
960
+ }
961
+
962
+ }
963
+
964
+
965
+
966
+ /*=====================================================
967
+
968
+ Tables
969
+
970
+ ======================================================*/
971
+
972
+ table { background: #fff; -moz-border-radius: 3px; -webkit-border-radius: 3px; width: 100%; margin: 0 0 18px; border: 1px solid #ddd; }
973
+
974
+ table thead { background: #f5f5f5; }
975
+ table thead tr th,
976
+ table tbody tr td { font-size: 12px; line-height: 18px; text-align: left; }
977
+ table thead tr th { padding: 8px 10px 9px; font-size: 14px; font-weight: bold; color: #222; }
978
+ table thead tr th:first-child { border-left: none; }
979
+ table thead tr th:last-child { border-right: none; }
980
+
981
+ table thead tr { }
982
+ table tbody { }
983
+ table tbody tr { }
984
+ table tbody tr.even,
985
+ table tbody tr.alt { background: #f1f8fe; }
986
+ table tbody tr:nth-child(even) { background: #f1f8fe; }
987
+ table tbody tr td { color: #999; padding: 9px 10px; vertical-align: top; border: none;}
988
+
989
+
990
+ /*=====================================================
991
+
992
+ Navigation (with dropdowns)
993
+
994
+ ======================================================*/
995
+
996
+
997
+ .navbar {
998
+ width: 100%;
999
+ display: table;
1000
+ border: 1px solid #1d692d;
1001
+ margin-bottom: 20px;
1002
+ background: #5dbb73; /* Change this to suit the color theme of your site */
1003
+ -webkit-box-sizing: border-box;
1004
+ -moz-box-sizing: border-box;
1005
+ -ms-box-sizing: border-box;
1006
+ box-sizing: border-box;
1007
+ }
1008
+
1009
+ .navbar .logo {
1010
+ display: table-cell;
1011
+ height: 55px;
1012
+ margin: 0;
1013
+ line-height: 0;
1014
+ vertical-align: middle;
1015
+ }
1016
+
1017
+ .navbar .logo a {
1018
+ display: block;
1019
+ height: 55px;
1020
+ line-height: 60px;
1021
+ padding: 0 0 0 15px;
1022
+ overflow: hidden;
1023
+ }
1024
+
1025
+ .navbar a.toggle {
1026
+ display: none;
1027
+ }
1028
+
1029
+ .navbar ul {
1030
+ display: table;
1031
+ width: 100%;
1032
+ float: none;
1033
+ vertical-align: middle;
1034
+ margin-bottom: 0;
1035
+ }
1036
+
1037
+ .navbar ul li {
1038
+ display: table-cell;
1039
+ float: none;
1040
+ list-style-type: none;
1041
+ margin-bottom: 0;
1042
+ margin-left: 0;
1043
+ text-align: center;
1044
+ border-right: 1px solid #114a1e;
1045
+ }
1046
+
1047
+ .navbar > ul > li > a {
1048
+ display: block;
1049
+ height: 55px;
1050
+ line-height: 55px;
1051
+ font-size: 16px;
1052
+ padding: 0 15px;
1053
+ white-space: nowrap;
1054
+ color: #fff;
1055
+ font-weight: bold;
1056
+ text-shadow: 0 1px 2px #114a1e,
1057
+ 0 1px 0 #114a1e;
1058
+ }
1059
+
1060
+ .navbar > ul > li .field {
1061
+ position: relative;
1062
+ display: inline-block;
1063
+ text-align: center;
1064
+ }
1065
+
1066
+ .navbar > ul > li .field .search input {
1067
+ line-height: 14px;
1068
+ }
1069
+
1070
+ .navbar > ul > li:hover > a {
1071
+ position: relative;
1072
+ background: #05390a;
1073
+ z-index: 1000;
1074
+ }
1075
+
1076
+ .navbar > ul > li > li > a {
1077
+ padding: 0 33px;
1078
+ }
1079
+
1080
+ .navbar > ul > li:last-child, .navbar > ul > li:last-child a:hover {
1081
+ border-right: none;
1082
+ }
1083
+
1084
+
1085
+ /**** Navbar positioning for Microsoft's browser who deserves not to be mentioned ****/
1086
+ .ie7 .navbar > ul { width: auto; }
1087
+
1088
+ .ie7 .navbar, .ie7 .navbar > ul > li > a { display: block; }
1089
+
1090
+ .ie7 .navbar .logo, .ie7 .navbar ul, .ie7 .navbar ul li { float: left; display: inline-block; }
1091
+
1092
+ .ie7 .navbar .logo a { display: block; overflow: hidden; }
1093
+
1094
+ .ie7 .navbar > ul > li .field { display: block; padding: 12px 18px 0; width: 80%; }
1095
+
1096
+ /******** Pretty Navbar Styles *********/
1097
+
1098
+ .pretty.navbar {
1099
+ border-radius: 4px;
1100
+
1101
+ background: -moz-linear-gradient(top, #5dbb73 0%, #2d9047 100%); /* FF3.6+ */
1102
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5dbb73), color-stop(100%,#2d9047)); /* Chrome,Safari4+ */
1103
+ background: -webkit-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* Chrome10+,Safari5.1+ */
1104
+ background: -o-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* Opera 11.10+ */
1105
+ background: -ms-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* IE10+ */
1106
+ background: linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* W3C */
1107
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5dbb73', endColorstr='#2d9047',GradientType=0 ); /* IE6-9 */
1108
+
1109
+ -webkit-box-shadow: inset 0 1px 1px #94dda6,
1110
+ 0 1px 2px rgba(0,0,0,0.61) !important; /* Remove this line if you dont want a dropshadow on your navigation*/
1111
+ box-shadow: inset 0 1px 1px #94dda6,
1112
+ 0 1px 2px rgba(0,0,0,0.61) !important; /* Remove this line if you dont want a dropshadow on your navigation*/
1113
+ }
1114
+
1115
+ .pretty.navbar li {
1116
+ -webkit-box-shadow:
1117
+ inset 1px 0 0 #94dda6;
1118
+ box-shadow:
1119
+ inset 1px 0 0 #94dda6;
1120
+ }
1121
+
1122
+ .pretty.navbar ul:first-child li:first-child a {
1123
+ border-radius: 4px 0 0 4px;
1124
+ }
1125
+
1126
+ .pretty.navbar ul li:last-child a {
1127
+ border-radius: 0 4px 4px 0;
1128
+ }
1129
+
1130
+ .pretty.navbar > ul > li:hover > a {
1131
+ -webkit-box-shadow: 2px 0 0 #114a1e;
1132
+ box-shadow: 2px 0 0 #114a1e;
1133
+ }
1134
+
1135
+ .pretty.navbar > ul > li:first-child, .pretty.navbar > ul > li:first-child a:hover {
1136
+ box-shadow: none;
1137
+ }
1138
+
1139
+
1140
+
1141
+ /******** CSS3 Dropdown Menu Styles **********/
1142
+
1143
+ .navbar li .dropdown {
1144
+ width: auto;
1145
+ min-width: 0px;
1146
+ max-width: 380px;
1147
+ height: 0;
1148
+ position: absolute;
1149
+ background: #fff;
1150
+ overflow: hidden;
1151
+ z-index: 999;
1152
+ }
1153
+
1154
+ .navbar li:hover .dropdown {
1155
+ min-height: 60px;
1156
+ max-height: 500px;
1157
+ height: auto;
1158
+ width: 100%;
1159
+ padding: 0;
1160
+ border-top: 1px solid #1d692d;
1161
+
1162
+ -webkit-box-shadow: 0px 3px 4px rgba(0,0,0,.3);
1163
+ box-shadow: 0px 3px 4px rgba(0,0,0,.3);
1164
+
1165
+
1166
+ -webkit-transition: ease-in-out .2s;
1167
+ -moz-transition: ease-in-out .2s;
1168
+ -o-transition: ease-in-out .2s;
1169
+ -ms-transition: ease-in-out .2s;
1170
+ transition: ease-in-out .2s;
1171
+ }
1172
+
1173
+ .navbar li .dropdown ul {
1174
+ margin: 0;
1175
+ }
1176
+
1177
+ .navbar li .dropdown ul > li {
1178
+ display: block;
1179
+ width: 100%;
1180
+ float: left;
1181
+ text-align: left;
1182
+ height: auto;
1183
+ font: 16px "Helvetica Neue", arial, sans-serif;
1184
+ border-radius: none;
1185
+ }
1186
+
1187
+ .navbar li .dropdown ul > li a {
1188
+ display: block;
1189
+ line-height: 26px;
1190
+ height: 26px;
1191
+ padding: 10px 20px;
1192
+ border-bottom: 1px solid #ddd;
1193
+ }
1194
+
1195
+ .navbar ul .dropdown ul li:first-child a {
1196
+ border-radius: 0;
1197
+ }
1198
+
1199
+ .navbar li .dropdown li a:hover {
1200
+ background: #ebfeee;
1201
+ }
1202
+
1203
+ @media only screen and (max-width: 767px) {
1204
+
1205
+ .navbar, .pretty.navbar {
1206
+ position: relative;
1207
+ background: transparent;
1208
+ border: none;
1209
+ text-align: center;
1210
+ }
1211
+
1212
+ .navbar .logo {
1213
+ float: left;
1214
+ display: inline;
1215
+ }
1216
+
1217
+ .navbar a.toggle {
1218
+ position: relative;
1219
+ float: right;
1220
+ display: inline-block;
1221
+ right: 10px; /* Move me around */
1222
+ top: 10px; /* Move me around */
1223
+ background: #3c8f4f;
1224
+ width: 42px;
1225
+ height: 36px;
1226
+ line-height: 42px;
1227
+ border-radius: 4px;
1228
+ -webkit-transition-duration: .1s; /* Saf3.2+, Chrome */
1229
+ -moz-transition-duration: .1s; /* FF4+ */
1230
+ -ms-transition-duration: .1s; /* IE10 */
1231
+ -o-transition-duration: .1s; /* Opera 10.5+ */
1232
+ transition-duration: .1s;
1233
+ }
1234
+
1235
+ .pretty.navbar a.toggle {
1236
+ border: 1px solid #1d692d;
1237
+
1238
+ background: -moz-linear-gradient(top, #5dbb73 0%, #2d9047 100%); /* FF3.6+ */
1239
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5dbb73), color-stop(100%,#2d9047)); /* Chrome,Safari4+ */
1240
+ background: -webkit-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* Chrome10+,Safari5.1+ */
1241
+ background: -o-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* Opera 11.10+ */
1242
+ background: -ms-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* IE10+ */
1243
+ background: linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* W3C */
1244
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5dbb73', endColorstr='#2d9047',GradientType=0 ); /* IE6-9 */
1245
+
1246
+ -webkit-box-shadow: inset 0 1px 1px #94dda6,
1247
+ 0 1px 1px #94dda6;
1248
+ box-shadow: inset 0 1px 1px #94dda6,
1249
+ 0 1px 1px #94dda6;
1250
+ }
1251
+
1252
+ .navbar a.toggle:hover, .navbar a.toggle.active {
1253
+ background: #5dbb73;
1254
+ -webkit-box-shadow: none;
1255
+ box-shadow: none;
1256
+ -webkit-transition-duration: .1s; /* Saf3.2+, Chrome */
1257
+ -moz-transition-duration: .1s; /* FF4+ */
1258
+ -ms-transition-duration: .1s; /* IE10 */
1259
+ -o-transition-duration: .1s; /* Opera 10.5+ */
1260
+ transition-duration: .1s;
1261
+ }
1262
+
1263
+ .navbar a.toggle.active {
1264
+ background: #114a1e;
1265
+ }
1266
+
1267
+ .navbar ul {
1268
+ position: absolute;
1269
+ width: 93.75%;
1270
+ height: 0;
1271
+ max-height: 0;
1272
+ top: 54px;
1273
+ right: 3.125%;
1274
+ overflow: hidden;
1275
+ display: inline-block;
1276
+
1277
+ background: #fff;
1278
+ border-radius: 4px;
1279
+
1280
+ -webkit-transition-duration: .2s; /* Saf3.2+, Chrome */
1281
+ -moz-transition-duration: .2s; /* FF4+ */
1282
+ -ms-transition-duration: .2s; /* IE10 */
1283
+ -o-transition-duration: .2s; /* Opera 10.5+ */
1284
+ transition-duration: .2s;
1285
+
1286
+ -webkit-box-shadow: 0px 3px 4px rgba(0,0,0,.3);
1287
+ box-shadow: 0px 3px 4px rgba(0,0,0,.3);
1288
+ }
1289
+
1290
+ .navbar ul.active {
1291
+ width: 93.75%;
1292
+ height: auto;
1293
+ max-height: 600px;
1294
+ z-index: 999;
1295
+ -webkit-transition-duration: .5s; /* Saf3.2+, Chrome */
1296
+ -moz-transition-duration: .5s; /* FF4+ */
1297
+ -ms-transition-duration: .5s; /* IE10 */
1298
+ -o-transition-duration: .5s; /* Opera 10.5+ */
1299
+ transition-duration: .5s;
1300
+ }
1301
+
1302
+ .navbar ul li {
1303
+ display: block;
1304
+ width: 100%;
1305
+ border-right: 0 !important;
1306
+ -webkit-box-shadow: none;
1307
+ box-shadow: none;
1308
+ }
1309
+
1310
+ .pretty.navbar ul li {
1311
+ -webkit-box-shadow: none;
1312
+ box-shadow: none;
1313
+ }
1314
+
1315
+ .navbar ul li > a {
1316
+ font-size: 22px !important;
1317
+ border: 1px solid #1d692d;
1318
+ background: #5dbb73; /* Old browsers */
1319
+ }
1320
+
1321
+ .navbar > ul > li .field {
1322
+ padding-top: 10px;
1323
+ padding-bottom: 10px;
1324
+ width: 90%;
1325
+ }
1326
+
1327
+ .navbar > ul > li .search {
1328
+ border: 1px solid #bbb;
1329
+ -webkit-box-shadow: inset 0 1px 3px #ccc;
1330
+ box-shadow: inset 0 1px 3px #ccc;
1331
+ }
1332
+
1333
+ .navbar li a:hover, .navbar > ul > li:first-child, .navbar > ul > li:first-child a:hover, .navbar > ul > li:last-child, .navbar > ul > li:last-child a:hover {
1334
+ -webkit-box-shadow: none;
1335
+ box-shadow: none;
1336
+ }
1337
+
1338
+ .navbar > ul > li:last-child, .navbar > ul > li:last-child a:hover {
1339
+ border-right: none;
1340
+ }
1341
+
1342
+ .navbar li:first-child a {
1343
+ border-radius: 4px 4px 0 0 !important;
1344
+ }
1345
+
1346
+ .navbar li:last-child a {
1347
+ border-radius: 0 0 4px 4px !important;
1348
+ }
1349
+
1350
+ .navbar li:hover .dropdown {
1351
+ display: none;
1352
+ }
1353
+
1354
+ .navbar ul li > a {
1355
+ background: transparent;
1356
+ border: none;
1357
+ color: #d04526;
1358
+ font-size: 16px;
1359
+ border-bottom: 1px solid #ccc;
1360
+ border-radius: none;
1361
+ text-shadow: none;
1362
+ }
1363
+
1364
+ .navbar ul li:hover > a {
1365
+ background: #f5f5f5;
1366
+ border-right: none;
1367
+ -webkit-box-shadow: none !important;
1368
+ box-shadow: none !important;
1369
+ }
1370
+
1371
+ .pretty.navbar {
1372
+ border: 1px solid #1d692d;
1373
+
1374
+ background: -moz-linear-gradient(top, #5dbb73 0%, #2d9047 100%); /* FF3.6+ */
1375
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5dbb73), color-stop(100%,#2d9047)); /* Chrome,Safari4+ */
1376
+ background: -webkit-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* Chrome10+,Safari5.1+ */
1377
+ background: -o-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* Opera 11.10+ */
1378
+ background: -ms-linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* IE10+ */
1379
+ background: linear-gradient(top, #5dbb73 0%,#2d9047 100%); /* W3C */
1380
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5dbb73', endColorstr='#2d9047',GradientType=0 ); /* IE6-9 */
1381
+
1382
+ -webkit-box-shadow: inset 0 1px 1px #94dda6,
1383
+ 0 1px 2px rgba(0,0,0,0.61) !important; /* Remove this line if you dont want a dropshadow on your buttons*/
1384
+ box-shadow: inset 0 1px 1px #94dda6,
1385
+ 0 1px 2px rgba(0,0,0,0.61) !important; /* Remove this line if you dont want a dropshadow on your buttons*/
1386
+ border-radius: 0;
1387
+ }
1388
+
1389
+ .pretty.navbar ul li .btn {
1390
+ margin-top: 20px;
1391
+ }
1392
+
1393
+ }
1394
+
1395
+
1396
+ /*=====================================================
1397
+
1398
+ Sub Navigation
1399
+
1400
+ ======================================================*/
1401
+
1402
+
1403
+ .subnav {
1404
+ display: block;
1405
+ width: auto;
1406
+ overflow: hidden;
1407
+ margin: 0 0 18px 0;
1408
+ padding-top: 4px;
1409
+ }
1410
+
1411
+ .subnav li, .subnav dt, .subnav dd {
1412
+ float: left;
1413
+ display: inline;
1414
+ margin-left: 9px;
1415
+ margin-bottom: 4px;
1416
+ }
1417
+
1418
+ .subnav li:first-child, .subnav dt:first-child, .subnav dd:first-child {
1419
+ margin-left: 0;
1420
+ }
1421
+
1422
+ .sub-nav dt {
1423
+ color: #999;
1424
+ font-weight: normal;
1425
+ }
1426
+
1427
+ .subnav li a, .subnav dd a {
1428
+ color: #05390a;
1429
+ font-size: 15px;
1430
+ text-decoration: none;
1431
+ -webkit-border-radius: 4px;
1432
+ -moz-border-radius: 4px;
1433
+ border-radius: 4px;
1434
+ }
1435
+
1436
+ .subnav li.active a, .subnav dd.active a {
1437
+ background: #5dbb73;
1438
+ padding: 5px 9px;
1439
+ text-shadow: 0 1px 1px #77d58e;
1440
+ }
1441
+
1442
+
1443
+ /** Drawers **/
1444
+
1445
+ .drawer {
1446
+ position: relative;
1447
+ width: 100%;
1448
+ max-height: 0;
1449
+ background: #222;
1450
+ -webkit-box-shadow: inset 0 -3px 5px #000,
1451
+ inset 0 3px 5px #000
1452
+ ;
1453
+ box-shadow: inset 0 -3px 5px #000,
1454
+ inset 0 3px 5px #000
1455
+ ;
1456
+ overflow: hidden;
1457
+ -webkit-transition-duration: .3s; /* Saf3.2+, Chrome */
1458
+ -moz-transition-duration: .3s; /* FF4+ */
1459
+ -ms-transition-duration: .3s; /* IE10 */
1460
+ -o-transition-duration: .3s; /* Opera 10.5+ */
1461
+ transition-duration: .3s;
1462
+ }
1463
+
1464
+ .drawer.active {
1465
+ height: auto;
1466
+ max-height: 800px;
1467
+ -webkit-transition-duration: .5s; /* Saf3.2+, Chrome */
1468
+ -moz-transition-duration: .5s; /* FF4+ */
1469
+ -ms-transition-duration: .5s; /* IE10 */
1470
+ -o-transition-duration: .5s; /* Opera 10.5+ */
1471
+ transition-duration: .5s;
1472
+ }
1473
+
1474
+
1475
+ /** Intrinsic Ratio video embedding (maintains aspect ratio) **/
1476
+
1477
+ body .video {
1478
+ width: 100%;
1479
+ position: relative;
1480
+ height: 0;
1481
+ padding-bottom: 56.25%;
1482
+ }
1483
+
1484
+ .youtube.video, .vimeo.video {
1485
+ padding-top: 30px;
1486
+ }
1487
+
1488
+ .video > video, .video > iframe, .video > object, .video > embed {
1489
+ position: absolute;
1490
+ top: 0;
1491
+ left: 0;
1492
+ width: 100%;
1493
+ height: 100%;
1494
+ }
1495
+
1496
+
1497
+ /** Line Section Row Dividers **/
1498
+
1499
+
1500
+ .line {
1501
+ padding-bottom: 20px;
1502
+ margin-bottom: 20px;
1503
+ border-bottom-style: solid;
1504
+ border-bottom-color: #ccc;
1505
+ }
1506
+
1507
+ .thin.line {
1508
+ border-width: 1px;
1509
+ }
1510
+
1511
+ .medium.line {
1512
+ border-width: 2px;
1513
+ }
1514
+
1515
+ .thick.line {
1516
+ border-width: 4px;
1517
+ }
1518
+
1519
+
1520
+ /* Skip Links */
1521
+
1522
+ .skipnav li {
1523
+ display: inline-block;
1524
+ margin-left: 2%;
1525
+ }
1526
+
1527
+ .skipnav li:first-child {
1528
+ margin-left: 0;
1529
+ }
1530
+
1531
+ .skiplink a, .skipnav a {
1532
+ background: #5dbb73;
1533
+ color: #05390a;
1534
+ padding: 6px 15px;
1535
+ border-radius: 4px;
1536
+ text-shadow: 0 1px 1px #77d58e;
1537
+ }
1538
+
1539
+ .skiplink a:hover, .skipnav a:hover {
1540
+ background: #72dd8d;
1541
+ }
1542
+
1543
+ .skiplink a i, .skipnav a i {
1544
+ margin-left: 10px;
1545
+ }
1546
+
1547
+
1548
+ /* Preformatted Text */
1549
+
1550
+ pre {
1551
+ background-color: #1b1b1b;
1552
+ -moz-border-radius: 4px;
1553
+ -webkit-border-radius: 4px;
1554
+ -o-border-radius: 4px;
1555
+ -ms-border-radius: 4px;
1556
+ -khtml-border-radius: 4px;
1557
+ border-radius: 4px;
1558
+ -webkit-box-shadow: inset 0 2px 2px #000;
1559
+ box-shadow: inset 0 2px 2px #000;
1560
+ border: 1px solid #e6ffeb;
1561
+ color: #fff;
1562
+ font-family: Courier, monospace;
1563
+ font-size: 14px;
1564
+ text-align: left;
1565
+ overflow: hidden !important;
1566
+ padding: 20px;
1567
+ white-space: pre-wrap;
1568
+ -webkit-box-sizing: border-box;
1569
+ -moz-box-sizing: border-box;
1570
+ -ms-box-sizing: border-box;
1571
+ box-sizing: border-box;
1572
+ }
1573
+
1574
+ code {
1575
+ color: #D04526;
1576
+ font-family: Courier, monospace;
1577
+ font-size: 14px;
1578
+ padding: 2px 4px 2px 4px;
1579
+ background: #e7ffec;
1580
+ border-radius: 4px;
1581
+ }
1582
+
1583
+
1584
+ /* Contain floats: h5bp.com/q */
1585
+ .clearfix:before, .clearfix:after { content: ""; display: table; }
1586
+ .clearfix:after { clear: both; }
1587
+ .clearfix { zoom: 1; }
1588
+
1589
+
1590
+
1591
+ /* ==========================================================================
1592
+
1593
+ Styles targeting cavemen who still use printers.
1594
+ Who prints in 2012? Seriously...
1595
+ Inlined to avoid required HTTP connection: h5bp.com/r
1596
+
1597
+ ========================================================================== */
1598
+
1599
+ @media print {
1600
+ * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
1601
+ a, a:visited { text-decoration: underline; }
1602
+ a[href]:after { content: " (" attr(href) ")"; }
1603
+ abbr[title]:after { content: " (" attr(title) ")"; }
1604
+ .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
1605
+ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
1606
+ thead { display: table-header-group; } /* h5bp.com/t */
1607
+ tr, img { page-break-inside: avoid; }
1608
+ img { max-width: 100% !important; }
1609
+ @page { margin: 0.5cm; }
1610
+ p, h2, h3 { orphans: 3; widows: 3; }
1611
+ h2, h3 { page-break-after: avoid; }
1612
+
1613
+ }