|
1 /* |
|
2 * Forms styles |
|
3 */ |
|
4 |
|
5 .form { |
|
6 hr { |
|
7 margin-left: -13px; |
|
8 margin-right: -13px; |
|
9 border-color: rgba(0, 0, 0, .1); |
|
10 margin-top: 20px; |
|
11 margin-bottom: 20px; |
|
12 } |
|
13 fieldset { |
|
14 display: block; |
|
15 border: 0; |
|
16 background: rgba(255, 255, 255, .9); |
|
17 position: relative; |
|
18 } |
|
19 header, |
|
20 legend { |
|
21 display: block; |
|
22 padding: 8px 0; |
|
23 border-bottom: 1px dashed rgba(0, 0, 0, .2); |
|
24 background: #fff; |
|
25 font-size: 16px; |
|
26 font-weight: 300; |
|
27 color: #222; |
|
28 margin: 25px 0 20px; |
|
29 } |
|
30 .no-padding & header { |
|
31 margin: 25px 14px 0; |
|
32 } |
|
33 header:first-child { |
|
34 margin-top: 10px; |
|
35 } |
|
36 .form-group:last-child, |
|
37 .form-group:last-child .note, |
|
38 fieldset .form-group:last-child, |
|
39 fieldset .form-group:last-child .note { |
|
40 margin-bottom: 0; |
|
41 } |
|
42 } |
|
43 |
|
44 fieldset { |
|
45 position: relative; |
|
46 } |
|
47 |
|
48 legend { |
|
49 font-weight: 400; |
|
50 margin-top: 0; |
|
51 background: 0 0; |
|
52 } |
|
53 |
|
54 i.hint { |
|
55 vertical-align: super; |
|
56 opacity: 0.5; |
|
57 |
|
58 &:hover { |
|
59 opacity: 0.9!important; |
|
60 } |
|
61 .nohints & { |
|
62 display: none; |
|
63 } |
|
64 } |
|
65 |
|
66 .input-group-addon { |
|
67 padding: 6px 10px 5px; |
|
68 border-radius: 0; |
|
69 transition: background-color .3s; |
|
70 -webkit-transition: background-color .3s; |
|
71 |
|
72 .fa { |
|
73 font-size: 14px; |
|
74 } |
|
75 .fa-2x, |
|
76 .fa-lg { |
|
77 font-size: 2em; |
|
78 } |
|
79 .fa-3x, |
|
80 .fa-4x, |
|
81 .fa-5x { |
|
82 font-size: 30px; |
|
83 } |
|
84 .checkbox, |
|
85 .radio { |
|
86 min-height: 0; |
|
87 margin-right: 0!important; |
|
88 padding-top: 0; |
|
89 } |
|
90 label input[type=checkbox].checkbox + span, |
|
91 label input[type=checkbox].checkbox + span:before, |
|
92 label input[type=radio].radiobox + span, |
|
93 label input[type=radio].radiobox+span:before { |
|
94 margin-right: 0; |
|
95 } |
|
96 .onoffswitch, |
|
97 .onoffswitch-label { |
|
98 margin: 0; |
|
99 } |
|
100 input[type=text]:focus + & { |
|
101 border-color: #0091d9; |
|
102 background-color: #72a0ce; |
|
103 color: #fff; |
|
104 } |
|
105 .has-warning input[type=text]:focus + & { |
|
106 border-color: #7f6a1e; |
|
107 background-color: #cead35; |
|
108 color: #fff; |
|
109 } |
|
110 .has-error input[type=text]:focus + & { |
|
111 border-color: #c46a69; |
|
112 background-color: #c46a69; |
|
113 color: #fff; |
|
114 } |
|
115 .has-success input[type=text]:focus + & { |
|
116 border-color: #446b46; |
|
117 background-color: #588a5a; |
|
118 color: #fff; |
|
119 } |
|
120 } |
|
121 |
|
122 .input-icon-left { |
|
123 >i { |
|
124 right: auto; |
|
125 left: 24px; |
|
126 } |
|
127 .form-control { |
|
128 padding-left: 29px; |
|
129 } |
|
130 } |
|
131 |
|
132 .input-icon-right { |
|
133 position: relative; |
|
134 |
|
135 .form-control { |
|
136 padding-right: 27px; |
|
137 } |
|
138 } |
|
139 |
|
140 .input-icon-left, |
|
141 .input-icon-right { |
|
142 >i { |
|
143 position: absolute; |
|
144 right: 10px; |
|
145 top: 30%; |
|
146 font-size: 16px; |
|
147 color: #bfbfbf; |
|
148 } |
|
149 } |
|
150 |
|
151 .form-actions { |
|
152 display: block; |
|
153 padding: 13px 14px 15px; |
|
154 border-top: 1px solid rgba(0, 0, 0, .1); |
|
155 background: rgba(249, 249, 249, .9); |
|
156 margin-top: 25px; |
|
157 margin-left: -13px; |
|
158 margin-right: -13px; |
|
159 margin-bottom: -13px; |
|
160 text-align: right; |
|
161 |
|
162 .well & { |
|
163 margin-left: -19px; |
|
164 margin-right: -19px; |
|
165 margin-bottom: -19px; |
|
166 } |
|
167 .well.well-lg & { |
|
168 margin-left: -24px; |
|
169 margin-right: -24px; |
|
170 margin-bottom: -24px; |
|
171 } |
|
172 .well.well-sm & { |
|
173 margin-left: -9px; |
|
174 margin-right: -9px; |
|
175 margin-bottom: -9px; |
|
176 } |
|
177 .popover-content & { |
|
178 margin: 0 -14px -9px; |
|
179 border-radius: 0 0 3px 3px; |
|
180 padding: 9px 14px; |
|
181 } |
|
182 .no-padding .form & { |
|
183 margin: 0; |
|
184 display: block; |
|
185 padding: 13px 14px 15px; |
|
186 border-top: 1px solid rgba(0, 0, 0, .1); |
|
187 background: rgba(248, 248, 248, .9); |
|
188 text-align: right; |
|
189 margin-top: 25px; |
|
190 } |
|
191 } |
|
192 |
|
193 :focus { |
|
194 outline: 0!important; |
|
195 } |
|
196 |
|
197 .filter_column input { |
|
198 padding: 0px 3px; |
|
199 } |
|
200 .filter_column input, |
|
201 .filter_column select { |
|
202 width: 100%; |
|
203 color: rgba(0, 0, 0, 0.5); |
|
204 border: 1px solid #CCC; |
|
205 border-radius: 0; |
|
206 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); |
|
207 -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); |
|
208 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); |
|
209 } |
|
210 |
|
211 .uneditable-input:focus, |
|
212 input[type=color]:focus, |
|
213 input[type=date]:focus, |
|
214 input[type=datetime-local]:focus, |
|
215 input[type=datetime]:focus, |
|
216 input[type=email]:focus, |
|
217 input[type=month]:focus, |
|
218 input[type=number]:focus, |
|
219 input[type=password]:focus, |
|
220 input[type=search]:focus, |
|
221 input[type=tel]:focus, |
|
222 input[type=text]:focus, |
|
223 input[type=time]:focus, |
|
224 input[type=url]:focus, |
|
225 input[type=week]:focus, |
|
226 .filter_column input:focus, |
|
227 .filter_column select:focus, |
|
228 select:focus, |
|
229 textarea:focus { |
|
230 border-color: rgba(82, 168, 236, 0.8); |
|
231 outline: 0; |
|
232 outline: thin dotted 9; |
|
233 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6); |
|
234 -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6); |
|
235 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6); |
|
236 } |
|
237 |
|
238 .form-control { |
|
239 padding: 7px 12px 5px; |
|
240 } |
|
241 |
|
242 .form-control, |
|
243 .input-lg, |
|
244 .input-sm, |
|
245 .input-xs { |
|
246 border-radius: 0 !important; |
|
247 } |
|
248 |
|
249 .input-xs { |
|
250 height: 24px; |
|
251 padding: 3px 10px 1px; |
|
252 font-size: 11px; |
|
253 line-height: 1.5; |
|
254 } |
|
255 |
|
256 .fileinput { |
|
257 padding-top: 3px; |
|
258 } |
|
259 |
|
260 |
|
261 input[type=checkbox].checkbox, |
|
262 input[type=radio].radiobox { |
|
263 visibility: hidden; |
|
264 position: absolute; |
|
265 z-index: 20; |
|
266 width: 18px; |
|
267 height: 18px; |
|
268 |
|
269 .checkbox &+span, |
|
270 .checkbox-inline &+span, |
|
271 .radio &+span, |
|
272 .radiobox-inline &+span { |
|
273 margin-left: -20px; |
|
274 |
|
275 .form-inline & { |
|
276 margin-left: 0; |
|
277 } |
|
278 } |
|
279 &+span, |
|
280 label &+span { |
|
281 vertical-align: middle; |
|
282 line-height: 20px; |
|
283 } |
|
284 &+span, |
|
285 &+span:after, |
|
286 &:before { |
|
287 box-sizing: content-box!important; |
|
288 -webkit-box-sizing: content-box!important; |
|
289 -moz-box-sizing: content-box!important; |
|
290 } |
|
291 label &+span { |
|
292 position: relative; |
|
293 z-index: 19; |
|
294 display: inline-block; |
|
295 margin: 0; |
|
296 line-height: 17px; |
|
297 min-height: 14px; |
|
298 min-width: 14px; |
|
299 margin-right: 5px; |
|
300 |
|
301 &:hover { |
|
302 cursor: pointer; |
|
303 } |
|
304 &:before { |
|
305 font-family: FontAwesome; |
|
306 font-size: 12px; |
|
307 border-radius: 0; |
|
308 content: "\a0"; |
|
309 display: inline-block; |
|
310 text-align: center; |
|
311 vertical-align: middle; |
|
312 padding: 1px; |
|
313 height: 12px; |
|
314 line-height: 12px; |
|
315 min-width: 12px; |
|
316 margin-right: 5px; |
|
317 border: 1px solid #bfbfbf; |
|
318 background-color: #f4f4f4; |
|
319 font-weight: 400; |
|
320 margin-top: -1px; |
|
321 } |
|
322 } |
|
323 } |
|
324 |
|
325 input[type=checkbox] { |
|
326 label & { |
|
327 &.checkbox { |
|
328 +span:before { |
|
329 content: "\a0"; |
|
330 } |
|
331 &:checked+span { |
|
332 font-weight: 700; |
|
333 |
|
334 &:before { |
|
335 content: "\f00c"; |
|
336 color: #2E7BCC; |
|
337 } |
|
338 } |
|
339 &.style-1 { |
|
340 &+span:before { |
|
341 color: #333; |
|
342 background: #fff; |
|
343 text-shadow: none; |
|
344 -webkit-box-shadow: none!important; |
|
345 box-shadow: none!important; |
|
346 border-width: 1px; |
|
347 height: 12px; |
|
348 line-height: 13px; |
|
349 min-width: 12px; |
|
350 } |
|
351 &:checked+span { |
|
352 font-weight: 400; |
|
353 |
|
354 &:before { |
|
355 color: #333; |
|
356 border-color: #333; |
|
357 } |
|
358 } |
|
359 } |
|
360 &.style-2+span:before { |
|
361 background: 0 0; |
|
362 border-color: #c1c1c1; |
|
363 -webkit-box-shadow: none; |
|
364 box-shadow: none; |
|
365 } |
|
366 &.style-2:checked+span { |
|
367 font-weight: 400; |
|
368 |
|
369 &:before { |
|
370 content: "\f00c"; |
|
371 color: #66665e; |
|
372 border-color: #4d90fe; |
|
373 background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MUQ0MEM4RUFEQUE4MTFFMkEwMjM5NzlCRjAxM0UwRjciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MUQ0MEM4RUJEQUE4MTFFMkEwMjM5NzlCRjAxM0UwRjciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxRDQwQzhFOERBQTgxMUUyQTAyMzk3OUJGMDEzRTBGNyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxRDQwQzhFOURBQTgxMUUyQTAyMzk3OUJGMDEzRTBGNyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsD/PVAAAAAQSURBVHjaYv7//78vQIABAAlYA05NMPppAAAAAElFTkSuQmCC) #fff; |
|
374 } |
|
375 } |
|
376 &.style-3:checked+span:before { |
|
377 color: #fff; |
|
378 border-color: #a90329; |
|
379 background: #a90329; |
|
380 } |
|
381 } |
|
382 } |
|
383 label:active & { |
|
384 &.checkbox { |
|
385 +span:before { |
|
386 -webkit-box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .3), 0 1px 0 0 rgba(255, 255, 255, .4); |
|
387 box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .3), 0 1px 0 0 rgba(255, 255, 255, .4); |
|
388 } |
|
389 } |
|
390 } |
|
391 label:hover & { |
|
392 &.checkbox { |
|
393 +span:before { |
|
394 color: #2E7BCC; |
|
395 border-color: #2E7BCC; |
|
396 } |
|
397 &.style-1+span:before { |
|
398 border-color: #333; |
|
399 } |
|
400 &.style-2 { |
|
401 +span:before { |
|
402 -webkit-box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .1), 0 1px 0 0 rgba(255, 255, 255, .2); |
|
403 box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .1), 0 1px 0 0 rgba(255, 255, 255, .2); |
|
404 } |
|
405 &:checked+span:before { |
|
406 -webkit-box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .3), 0 1px 0 0 rgba(255, 255, 255, .4); |
|
407 box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .3), 0 1px 0 0 rgba(255, 255, 255, .4); |
|
408 } |
|
409 } |
|
410 &.style-3+span:before { |
|
411 color: #fff; |
|
412 border-color: #A90327; |
|
413 } |
|
414 } |
|
415 } |
|
416 label:active & { |
|
417 &.checkbox { |
|
418 &:checked+span:before { |
|
419 color: #fff; |
|
420 background: #2E7BCC; |
|
421 border-color: #2E7BCC; |
|
422 } |
|
423 &.style-1:checked+span:before { |
|
424 color: #fff; |
|
425 background: #333; |
|
426 border-color: #333; |
|
427 } |
|
428 &.style-2+span:before, |
|
429 &.style-2:checked+span:before { |
|
430 color: #66665e; |
|
431 background: 0 0; |
|
432 border-color: #c1c1c1; |
|
433 -webkit-box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .3), 0 1px 0 0 rgba(255, 255, 255, .4); |
|
434 box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .3), 0 1px 0 0 rgba(255, 255, 255, .4); |
|
435 } |
|
436 &.style-3:checked+span:before { |
|
437 color: #a90329; |
|
438 background: #fff; |
|
439 border-color: #a90329; |
|
440 } |
|
441 } |
|
442 } |
|
443 label &[disabled] { |
|
444 &.checkbox { |
|
445 +span, |
|
446 &:checked+span { |
|
447 color: #A7A7A7; |
|
448 cursor: not-allowed; |
|
449 } |
|
450 &:checked+span:before { |
|
451 content: "\f00c"; |
|
452 } |
|
453 &.style-2:checked+span:before { |
|
454 content: "\f00c"; |
|
455 } |
|
456 +span:before, |
|
457 &:checked+span:before, |
|
458 &:checked+span:before { |
|
459 background: #eee!important; |
|
460 border-color: #CCC!important; |
|
461 -webkit-box-shadow: none; |
|
462 color: #A7A7A7; |
|
463 box-shadow: none!important; |
|
464 } |
|
465 } |
|
466 } |
|
467 label:hover &[disabled] { |
|
468 &.checkbox { |
|
469 &:checked+span:before { |
|
470 color: #A7A7A7; |
|
471 cursor: not-allowed; |
|
472 } |
|
473 &:checked+span:before { |
|
474 background: #eee!important; |
|
475 border-color: #CCC!important; |
|
476 -webkit-box-shadow: none; |
|
477 color: #A7A7A7; |
|
478 box-shadow: none!important; |
|
479 } |
|
480 } |
|
481 } |
|
482 } |
|
483 |
|
484 input[type=radio] { |
|
485 &.radiobox { |
|
486 label & { |
|
487 +span:before { |
|
488 content: "\a0"; |
|
489 border-radius: 50%; |
|
490 -webkit-box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .1), 0 1px 0 0 rgba(255, 255, 255, .2); |
|
491 box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .1), 0 1px 0 0 rgba(255, 255, 255, .2); |
|
492 } |
|
493 &:checked+span { |
|
494 font-weight: 700; |
|
495 |
|
496 &:before { |
|
497 content: "\f111"; |
|
498 color: #2E7BCC; |
|
499 } |
|
500 } |
|
501 &.style-1 { |
|
502 +span:before { |
|
503 font-size: 9px; |
|
504 background: #fff; |
|
505 text-shadow: none; |
|
506 -webkit-box-shadow: none!important; |
|
507 box-shadow: none!important; |
|
508 border-width: 1px; |
|
509 height: 13px; |
|
510 line-height: 13px; |
|
511 min-width: 13px; |
|
512 } |
|
513 &:checked+span:before { |
|
514 font-size: 10px; |
|
515 color: #333; |
|
516 border-color: #333; |
|
517 background: #fff; |
|
518 } |
|
519 &:checked+span { |
|
520 font-weight: 400; |
|
521 } |
|
522 } |
|
523 &.style-2 { |
|
524 &:checked+span { |
|
525 font-weight: 400; |
|
526 |
|
527 &:before { |
|
528 color: #66665e; |
|
529 border-color: #4d90fe; |
|
530 font-size: 9px; |
|
531 } |
|
532 } |
|
533 } |
|
534 &.style-3 { |
|
535 &:checked+span:before { |
|
536 color: #a90329; |
|
537 border-color: #a90329; |
|
538 } |
|
539 } |
|
540 } |
|
541 label:hover & { |
|
542 +span:before, |
|
543 &:checked+span:before { |
|
544 color: #2E7BCC; |
|
545 border-color: #2E7BCC; |
|
546 } |
|
547 &.style-1 { |
|
548 &+span:before, |
|
549 &:checked+span:before { |
|
550 color: #333; |
|
551 border-color: #333; |
|
552 background: #fff; |
|
553 } |
|
554 } |
|
555 &.style-2 { |
|
556 &:checked+span:before { |
|
557 color: #66665e; |
|
558 border-color: #4d90fe; |
|
559 } |
|
560 } |
|
561 &.style-3 { |
|
562 &+span:before, |
|
563 &:checked+span:before { |
|
564 color: #a90329; |
|
565 border-color: #a90329; |
|
566 } |
|
567 } |
|
568 } |
|
569 label:active & { |
|
570 +span:before { |
|
571 -webkit-box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .3), 0 1px 0 0 rgba(255, 255, 255, .4); |
|
572 box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .3), 0 1px 0 0 rgba(255, 255, 255, .4); |
|
573 } |
|
574 } |
|
575 } |
|
576 label &[disabled] { |
|
577 &.radiobox { |
|
578 +span, |
|
579 &:checked+span, |
|
580 &:checked+span:before { |
|
581 color: #A7A7A7; |
|
582 cursor: not-allowed; |
|
583 } |
|
584 &:checked+span:before { |
|
585 content: "\f111"; |
|
586 } |
|
587 +span:before, |
|
588 &:checked+span:before { |
|
589 background: #eee!important; |
|
590 border-color: #CCC!important; |
|
591 -webkit-box-shadow: none; |
|
592 box-shadow: none; |
|
593 color: #A7A7A7; |
|
594 } |
|
595 } |
|
596 } |
|
597 label:active &, |
|
598 label:hover & { |
|
599 &[disabled].radiobox:checked+span:before { |
|
600 background: #eee!important; |
|
601 border-color: #CCC!important; |
|
602 -webkit-box-shadow: none; |
|
603 box-shadow: none; |
|
604 color: #A7A7A7; |
|
605 } |
|
606 } |
|
607 } |
|
608 |
|
609 |
|
610 textarea { |
|
611 &.clone { |
|
612 position: absolute; |
|
613 visibility: hidden; |
|
614 } |
|
615 } |
|
616 |
|
617 .textarea-div { |
|
618 background-color: #FFF; |
|
619 border: 1px solid #CCC; |
|
620 border-bottom: 0; |
|
621 margin: 10px 0 0; |
|
622 } |
|
623 .textarea-controls { |
|
624 box-sizing: border-box; |
|
625 -moz-box-sizing: border-box; |
|
626 -webkit-box-sizing: border-box; |
|
627 padding: 5px; |
|
628 display: block; |
|
629 background-color: #FFF; |
|
630 border: 1px solid #CCC; |
|
631 border-top: 0; |
|
632 height: 43px; |
|
633 line-height: 33px; |
|
634 overflow: hidden; |
|
635 |
|
636 >label { |
|
637 margin: 3px 10px 0; |
|
638 } |
|
639 .ams-form .checkbox { |
|
640 padding-left: 22px!important; |
|
641 } |
|
642 } |
|
643 |
|
644 .typearea { |
|
645 cursor: text; |
|
646 overflow-x: hidden; |
|
647 overflow-y: auto; |
|
648 max-height: 90px; |
|
649 padding: 5px 25px 5px 5px; |
|
650 position: relative; |
|
651 border-bottom: 1px solid #EEE; |
|
652 |
|
653 textarea { |
|
654 width: 100%; |
|
655 border-color: transparent!important; |
|
656 box-sizing: border-box; |
|
657 box-shadow: none; |
|
658 -moz-box-sizing: border-box; |
|
659 -webkit-box-sizing: border-box; |
|
660 -webkit-box-shadow: none; |
|
661 overflow: hidden; |
|
662 padding: 0; |
|
663 margin: 0; |
|
664 -webkit-transition: height .2s; |
|
665 transition: height .2s; |
|
666 outline: 0; |
|
667 resize: none; |
|
668 min-height: 61px; |
|
669 } |
|
670 } |
|
671 |
|
672 |
|
673 .error-box { |
|
674 max-width: 900px; |
|
675 margin: 0 auto; |
|
676 } |
|
677 |
|
678 .error-text { |
|
679 font-weight: 400; |
|
680 color: #fff; |
|
681 letter-spacing: -4px; |
|
682 font-size: 700%; |
|
683 margin-bottom: 30px; |
|
684 text-shadow: 0 1px 0 #ccc, 0 2px 0 #bfbfbf, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, .1), 0 0 5px rgba(0, 0, 0, .1), 0 1px 3px rgba(0, 0, 0, .3), 0 3px 5px rgba(0, 0, 0, .2), 0 5px 10px rgba(0, 0, 0, .25), 0 10px 10px rgba(0, 0, 0, .2), 0 20px 20px rgba(0, 0, 0, .15); |
|
685 } |
|
686 |
|
687 .error-search { |
|
688 width: 300px; |
|
689 margin: 0 auto 20px; |
|
690 } |
|
691 |
|
692 .error-icon-shadow { |
|
693 text-shadow: 0 1px 0 #803838, 0 2px 0 #a85d5d, 0 3px 0 #b86565, 0 4px 0 #d86f6f, 0 5px 0 #b3a5a5, 0 6px 1px rgba(131, 51, 51, .1), 0 0 5px rgba(102, 30, 30, .1), 0 1px 3px rgba(95, 15, 15, .3), 0 3px 5px rgba(100, 23, 23, .2), 0 5px 10px rgba(114, 30, 30, .25), 0 10px 10px rgba(94, 15, 15, .2), 0 20px 20px rgba(121, 38, 38, .15); |
|
694 } |
|
695 |
|
696 .form-inline { |
|
697 .checkbox, |
|
698 .radiobox { |
|
699 padding-left: 0; |
|
700 } |
|
701 } |
|
702 |
|
703 |
|
704 .ams-form { |
|
705 position: relative; |
|
706 margin: 0; |
|
707 outline: 0; |
|
708 color: #333; |
|
709 |
|
710 *, |
|
711 :after, |
|
712 :before { |
|
713 margin: 0; |
|
714 padding: 0; |
|
715 -webkit-box-sizing: content-box; |
|
716 -moz-box-sizing: content-box; |
|
717 box-sizing: content-box; |
|
718 } |
|
719 header { |
|
720 display: block; |
|
721 padding: 8px 0; |
|
722 border-bottom: 1px dashed rgba(0, 0, 0, .2); |
|
723 background: #fff; |
|
724 font-size: 16px; |
|
725 font-weight: 300; |
|
726 color: #232323; |
|
727 margin: 10px 14px 0; |
|
728 } |
|
729 fieldset { |
|
730 display: block; |
|
731 position: relative; |
|
732 padding: 10px 15px 5px; |
|
733 border: 0; |
|
734 background: rgba(255, 255, 255, .9); |
|
735 |
|
736 &[disabled] { |
|
737 >section, |
|
738 >article, |
|
739 >div { |
|
740 opacity: 0.5; |
|
741 } |
|
742 LEGEND.checker { |
|
743 .checkbox { |
|
744 cursor: pointer; |
|
745 } |
|
746 } |
|
747 } |
|
748 &.switched { |
|
749 >section, |
|
750 >article, |
|
751 >div { |
|
752 display: none; |
|
753 } |
|
754 legend { |
|
755 border-bottom: 0; |
|
756 } |
|
757 } |
|
758 &.bordered { |
|
759 margin: 10px; |
|
760 border: 1px solid rgba(192, 192, 192, 0.8); |
|
761 -webkit-border-radius: 3px; |
|
762 -moz-border-radius: 3px; |
|
763 border-radius: 3px; |
|
764 |
|
765 &.switched { |
|
766 border: 1px solid transparent; |
|
767 } |
|
768 legend { |
|
769 width: auto; |
|
770 padding: 3px 10px 1px; |
|
771 border: 1px solid rgba(192, 192, 192, 0.8); |
|
772 -webkit-border-radius: 3px; |
|
773 -moz-border-radius: 3px; |
|
774 border-radius: 3px; |
|
775 } |
|
776 } |
|
777 } |
|
778 fieldset+fieldset { |
|
779 border-top: 1px solid rgba(0, 0, 0, .1); |
|
780 } |
|
781 legend { |
|
782 padding-top: 10px; |
|
783 |
|
784 &.inner, |
|
785 .inner { |
|
786 font-weight: 300; |
|
787 font-size: 14.5px!important; |
|
788 } |
|
789 &.switcher { |
|
790 font-weight: 300; |
|
791 font-size: 16.5px; |
|
792 border: 0; |
|
793 padding-bottom: 0; |
|
794 cursor: pointer; |
|
795 } |
|
796 .fa { |
|
797 color: rgb(50, 118, 177); |
|
798 font-size: 75%; |
|
799 &.fa-stack { |
|
800 font-size: 100%; |
|
801 width: 1em; |
|
802 height: 1em; |
|
803 line-height: 1em; |
|
804 } |
|
805 } |
|
806 .hint { |
|
807 vertical-align: top; |
|
808 font-size: 1em; |
|
809 } |
|
810 label.checkbox { |
|
811 display: inline-block; |
|
812 margin-bottom: 0px; |
|
813 min-height: 18px; |
|
814 |
|
815 i { |
|
816 position: absolute; |
|
817 left: 3px; |
|
818 top: -1px; |
|
819 } |
|
820 } |
|
821 } |
|
822 >.modal-viewport >fieldset >legend { |
|
823 padding-top: 0; |
|
824 } |
|
825 section { |
|
826 margin-bottom: 10px; |
|
827 position: relative; |
|
828 } |
|
829 .form-group { |
|
830 padding: 5px 10px; |
|
831 } |
|
832 label { |
|
833 &.checkbox, |
|
834 &.radio { |
|
835 padding-top: 0; |
|
836 } |
|
837 &.input-file { |
|
838 img.thumbnail { |
|
839 display: inline-block; |
|
840 margin: 4px 10px 0 4px!important; |
|
841 padding: 4px!important; |
|
842 } |
|
843 } |
|
844 } |
|
845 input { |
|
846 &.input-lg { |
|
847 height: 44px; |
|
848 padding: 10px 16px; |
|
849 font-size: 17px; |
|
850 line-height: 1.33; |
|
851 } |
|
852 &.input-sm { |
|
853 height: 30px; |
|
854 padding: 5px 10px; |
|
855 font-size: 12px; |
|
856 line-height: 1.5; |
|
857 } |
|
858 &.input-xs { |
|
859 height: 24px; |
|
860 padding: 2px 10px; |
|
861 font-size: 11px; |
|
862 line-height: 1.5; |
|
863 } |
|
864 } |
|
865 select { |
|
866 &.input-sm { |
|
867 height: 30px; |
|
868 line-height: 15px; |
|
869 font-size: 12px; |
|
870 } |
|
871 &.input-sm+i { |
|
872 height: 10px; |
|
873 } |
|
874 &.input-lg { |
|
875 height: 44px; |
|
876 line-height: 22px; |
|
877 font-size: 17px; |
|
878 } |
|
879 &.input-lg+i { |
|
880 height: 11px; |
|
881 top: 17px; |
|
882 } |
|
883 } |
|
884 .row { |
|
885 margin: 0 -15px; |
|
886 |
|
887 &:after { |
|
888 display: table; |
|
889 content: ''; |
|
890 clear: both; |
|
891 } |
|
892 } |
|
893 .col-1 { |
|
894 width: 8.33%; |
|
895 } |
|
896 .col-2 { |
|
897 width: 16.66%; |
|
898 } |
|
899 .col-3 { |
|
900 width: 25%; |
|
901 } |
|
902 .col-4 { |
|
903 width: 33.33%; |
|
904 } |
|
905 .col-5 { |
|
906 width: 41.66%; |
|
907 } |
|
908 .col-6 { |
|
909 width: 50%; |
|
910 } |
|
911 .col-8 { |
|
912 width: 66.67%; |
|
913 } |
|
914 .col-9 { |
|
915 width: 75%; |
|
916 } |
|
917 .col-10 { |
|
918 width: 83.33%; |
|
919 } |
|
920 .col { |
|
921 float: left; |
|
922 min-height: 1px; |
|
923 padding-right: 15px; |
|
924 padding-left: 15px; |
|
925 -webkit-box-sizing: border-box; |
|
926 box-sizing: border-box; |
|
927 -moz-box-sizing: border-box; |
|
928 |
|
929 @media screen and (max-width:600px) { |
|
930 float: none; |
|
931 width: 100%; |
|
932 } |
|
933 .label { |
|
934 @media screen and (max-width: 600px) { |
|
935 text-align: left; |
|
936 padding-left: 20px; |
|
937 } |
|
938 } |
|
939 } |
|
940 footer { |
|
941 display: block; |
|
942 padding: 7px 25px 15px; |
|
943 border-top: 1px solid rgba(0, 0, 0, .1); |
|
944 background: rgba(248, 248, 248, .9); |
|
945 |
|
946 &:after { |
|
947 display: table; |
|
948 clear: both; |
|
949 content: ''; |
|
950 } |
|
951 .btn { |
|
952 float: right; |
|
953 height: 31px; |
|
954 margin: 10px 0 0 5px; |
|
955 padding: 0 22px; |
|
956 font: 300 15px/29px Ubuntu, Helvetica, Arial, sans-serif; |
|
957 cursor: pointer; |
|
958 |
|
959 &.btn-info { |
|
960 float: left; |
|
961 } |
|
962 } |
|
963 .submit-message { |
|
964 display: inline-block; |
|
965 } |
|
966 } |
|
967 .message { |
|
968 display: none; |
|
969 color: #6fb679; |
|
970 |
|
971 i { |
|
972 display: block; |
|
973 margin: 0 auto 20px; |
|
974 width: 81px; |
|
975 height: 81px; |
|
976 border: 1px solid #6fb679; |
|
977 border-radius: 50%; |
|
978 font-size: 30px; |
|
979 line-height: 81px; |
|
980 } |
|
981 } |
|
982 &.submitted { |
|
983 fieldset, |
|
984 footer { |
|
985 display: none; |
|
986 } |
|
987 .message { |
|
988 display: block; |
|
989 padding: 25px 30px; |
|
990 background: rgba(255, 255, 255, .9); |
|
991 font: 300 18px/27px Ubuntu, Helvetica, Arial, sans-serif; |
|
992 text-align: center; |
|
993 } |
|
994 } |
|
995 .note { |
|
996 margin-top: 6px; |
|
997 padding: 0 1px; |
|
998 font-size: 11px; |
|
999 line-height: 15px; |
|
1000 color: #999; |
|
1001 |
|
1002 a { |
|
1003 font-size: 13px; |
|
1004 } |
|
1005 } |
|
1006 .note-success { |
|
1007 color: #6fb679; |
|
1008 } |
|
1009 .control-label { |
|
1010 display: block; |
|
1011 margin-top: 4px; |
|
1012 margin-bottom: 6px; |
|
1013 padding-top: 0; |
|
1014 line-height: 19px; |
|
1015 font-weight: 400; |
|
1016 font-size: 13px; |
|
1017 color: #666; |
|
1018 text-align: right; |
|
1019 |
|
1020 @media screen and (max-width: 992px) { |
|
1021 text-align: left; |
|
1022 margin-bottom: 0; |
|
1023 } |
|
1024 &.col { |
|
1025 text-align: right; |
|
1026 |
|
1027 @media screen and (max-width: 600px) { |
|
1028 text-align: left; |
|
1029 padding-left: 20px; |
|
1030 } |
|
1031 } |
|
1032 span { |
|
1033 margin-right: 10px; |
|
1034 |
|
1035 &::after { |
|
1036 content: " *"; |
|
1037 color: transparent; |
|
1038 } |
|
1039 >.hint { |
|
1040 margin-top: -2px; |
|
1041 } |
|
1042 } |
|
1043 .col { |
|
1044 margin: 0; |
|
1045 padding-top: 7px; |
|
1046 } |
|
1047 } |
|
1048 label.input span.textline-field { |
|
1049 display: block; |
|
1050 margin-top: 4px; |
|
1051 margin-bottom: 6px; |
|
1052 padding-top: 0; |
|
1053 line-height: 19px; |
|
1054 font-size: 13px; |
|
1055 } |
|
1056 .required-field { |
|
1057 .control-label { |
|
1058 span::after { |
|
1059 color: red; |
|
1060 } |
|
1061 } |
|
1062 } |
|
1063 .tooltip { |
|
1064 position: absolute; |
|
1065 z-index: 99999; |
|
1066 left: -9999px; |
|
1067 padding: 2px 8px 3px; |
|
1068 font-size: 11px; |
|
1069 line-height: 16px; |
|
1070 font-weight: 400; |
|
1071 background: rgba(0, 0, 0, .9); |
|
1072 color: #fff; |
|
1073 opacity: 0; |
|
1074 transition: margin .3s, opacity .3s; |
|
1075 -webkit-transition: margin .3s, opacity .3s; |
|
1076 |
|
1077 &:after { |
|
1078 position: absolute; |
|
1079 content: ''; |
|
1080 } |
|
1081 } |
|
1082 .tooltip-top-right { |
|
1083 bottom: 100%; |
|
1084 margin-bottom: 15px; |
|
1085 |
|
1086 &:after { |
|
1087 top: 100%; |
|
1088 right: 11px; |
|
1089 border-top: 4px solid rgba(0, 0, 0, .9); |
|
1090 border-right: 4px solid transparent; |
|
1091 border-left: 4px solid transparent; |
|
1092 } |
|
1093 } |
|
1094 .input input:focus+.tooltip-top-right, |
|
1095 .textarea textarea:focus+.tooltip-top-right { |
|
1096 right: 0; |
|
1097 left: auto; |
|
1098 margin-bottom: 5px; |
|
1099 } |
|
1100 .tooltip-top-left { |
|
1101 bottom: 100%; |
|
1102 margin-bottom: 15px; |
|
1103 |
|
1104 &:after { |
|
1105 top: 100%; |
|
1106 left: 11px; |
|
1107 border-top: 4px solid rgba(0, 0, 0, .9); |
|
1108 border-right: 4px solid transparent; |
|
1109 border-left: 4px solid transparent; |
|
1110 } |
|
1111 } |
|
1112 .input input:focus+.tooltip-top-left, |
|
1113 .textarea textarea:focus+.tooltip-top-left { |
|
1114 right: auto; |
|
1115 left: 0; |
|
1116 margin-bottom: 5px; |
|
1117 } |
|
1118 .tooltip-right { |
|
1119 top: 4px; |
|
1120 white-space: nowrap; |
|
1121 margin-left: 15px; |
|
1122 |
|
1123 &:after { |
|
1124 top: 6px; |
|
1125 right: 100%; |
|
1126 border-top: 4px solid transparent; |
|
1127 border-right: 4px solid rgba(0, 0, 0, .9); |
|
1128 border-bottom: 4px solid transparent; |
|
1129 } |
|
1130 } |
|
1131 .input input:focus + .tooltip-right, |
|
1132 .textarea textarea:focus+.tooltip-right { |
|
1133 left: 100%; |
|
1134 margin-left: 5px; |
|
1135 } |
|
1136 .tooltip-left { |
|
1137 top: 4px; |
|
1138 white-space: nowrap; |
|
1139 margin-right: 15px; |
|
1140 |
|
1141 &:after { |
|
1142 top: 6px; |
|
1143 left: 100%; |
|
1144 border-top: 4px solid transparent; |
|
1145 border-bottom: 4px solid transparent; |
|
1146 border-left: 4px solid rgba(0, 0, 0, .9); |
|
1147 } |
|
1148 } |
|
1149 .input input:focus + .tooltip-left, |
|
1150 .textarea textarea:focus + .tooltip-left { |
|
1151 right: 100%; |
|
1152 left: auto; |
|
1153 margin-right: 5px; |
|
1154 } |
|
1155 .tooltip-bottom-right { |
|
1156 top: 100%; |
|
1157 margin-top: 15px; |
|
1158 |
|
1159 &:after { |
|
1160 bottom: 100%; |
|
1161 right: 11px; |
|
1162 border-right: 4px solid transparent; |
|
1163 border-bottom: 4px solid rgba(0, 0, 0, .9); |
|
1164 border-left: 4px solid transparent; |
|
1165 } |
|
1166 } |
|
1167 .input input:focus + .tooltip-bottom-right, |
|
1168 .textarea textarea:focus + .tooltip-bottom-right { |
|
1169 right: 0; |
|
1170 left: auto; |
|
1171 margin-top: 5px; |
|
1172 } |
|
1173 .tooltip-bottom-left { |
|
1174 top: 100%; |
|
1175 margin-top: 15px; |
|
1176 |
|
1177 &:after { |
|
1178 bottom: 100%; |
|
1179 left: 11px; |
|
1180 border-right: 4px solid transparent; |
|
1181 border-bottom: 4px solid rgba(0, 0, 0, .9); |
|
1182 border-left: 4px solid transparent; |
|
1183 } |
|
1184 } |
|
1185 .input input:focus + .tooltip-bottom-left, |
|
1186 .textarea textarea:focus + .tooltip-bottom-left { |
|
1187 right: auto; |
|
1188 left: 0; |
|
1189 margin-top: 5px; |
|
1190 } |
|
1191 .inline-group { |
|
1192 margin: 0 -30px -4px 0; |
|
1193 |
|
1194 &:after { |
|
1195 content: ''; |
|
1196 display: table; |
|
1197 clear: both; |
|
1198 } |
|
1199 .checkbox, |
|
1200 .radio { |
|
1201 float: left; |
|
1202 margin-right: 30px; |
|
1203 |
|
1204 &:last-child { |
|
1205 margin-bottom: 4px; |
|
1206 } |
|
1207 } |
|
1208 } |
|
1209 .input .inline-group { |
|
1210 margin: 0 0 -4px 0; |
|
1211 } |
|
1212 .btn { |
|
1213 -webkit-box-sizing: border-box; |
|
1214 -moz-box-sizing: border-box; |
|
1215 box-sizing: border-box; |
|
1216 } |
|
1217 .button { |
|
1218 float: right; |
|
1219 height: 31px; |
|
1220 overflow: hidden; |
|
1221 margin: 10px 0 0 5px; |
|
1222 padding: 0 25px; |
|
1223 outline: 0; |
|
1224 border: 0; |
|
1225 font: 300 15px/31px Ubuntu, Helvetica, Arial, sans-serif; |
|
1226 text-decoration: none; |
|
1227 color: #fff; |
|
1228 cursor: pointer; |
|
1229 background-color: #3276B1; |
|
1230 opacity: .8; |
|
1231 transition: opacity .2s; |
|
1232 -webkit-transition: opacity .2s; |
|
1233 |
|
1234 &:hover { |
|
1235 opacity: 1; |
|
1236 } |
|
1237 &.button-secondary { |
|
1238 background-color: #b3b3b3; |
|
1239 } |
|
1240 } |
|
1241 .button, |
|
1242 .checkbox, |
|
1243 .input, |
|
1244 .radio, |
|
1245 .select, |
|
1246 .textarea, |
|
1247 .toggle { |
|
1248 display: block; |
|
1249 position: relative; |
|
1250 font-weight: 400; |
|
1251 } |
|
1252 .input input, |
|
1253 .select select, |
|
1254 .textarea textarea { |
|
1255 display: block; |
|
1256 -webkit-box-sizing: border-box; |
|
1257 -moz-box-sizing: border-box; |
|
1258 box-sizing: border-box; |
|
1259 width: 100%; |
|
1260 height: 28px; |
|
1261 padding: 6px 8px; |
|
1262 outline: 0; |
|
1263 border-width: 1px; |
|
1264 border-style: solid; |
|
1265 border-radius: 0; |
|
1266 background: #fff; |
|
1267 font: 13px/16px Ubuntu, Helvetica, Arial, sans-serif; |
|
1268 color: #404040; |
|
1269 appearance: normal; |
|
1270 -moz-appearance: none; |
|
1271 -webkit-appearance: none; |
|
1272 |
|
1273 &.display-mode { |
|
1274 border: none; |
|
1275 padding: 0; |
|
1276 margin-top: 2px; |
|
1277 margin-bottom: 3px; |
|
1278 height: 14px; |
|
1279 line-height: 1em; |
|
1280 } |
|
1281 } |
|
1282 .input input:focus + .tooltip, |
|
1283 .textarea textarea:focus + .tooltip { |
|
1284 opacity: 1; |
|
1285 } |
|
1286 .input .icon-prepend + input, |
|
1287 .textarea .icon-prepend + textarea { |
|
1288 padding-left: 37px; |
|
1289 } |
|
1290 .input .icon-append + input, |
|
1291 .textarea .icon-append + textarea { |
|
1292 padding-right: 37px; |
|
1293 } |
|
1294 .input .icon-prepend + .icon-append + input, |
|
1295 .textarea .icon-prepend + .icon-append + textarea { |
|
1296 padding-left: 37px; |
|
1297 } |
|
1298 .input.with-icons { |
|
1299 .icon-append-2 + input { |
|
1300 padding-right: 60px; |
|
1301 } |
|
1302 } |
|
1303 .input-file { |
|
1304 .button { |
|
1305 position: absolute; |
|
1306 top: 3px; |
|
1307 right: 3px; |
|
1308 float: none; |
|
1309 height: 22px; |
|
1310 margin: 0; |
|
1311 padding: 0 14px; |
|
1312 font-size: 13px; |
|
1313 line-height: 22px; |
|
1314 |
|
1315 &:hover { |
|
1316 -webkit-box-shadow: none; |
|
1317 box-shadow: none; |
|
1318 } |
|
1319 input { |
|
1320 position: absolute; |
|
1321 top: 0; |
|
1322 right: 0; |
|
1323 padding: 0; |
|
1324 font-size: 30px; |
|
1325 cursor: pointer; |
|
1326 opacity: 0; |
|
1327 } |
|
1328 } |
|
1329 } |
|
1330 .select { |
|
1331 select { |
|
1332 padding: 5px; |
|
1333 } |
|
1334 i { |
|
1335 position: absolute; |
|
1336 top: 9px; |
|
1337 right: 11px; |
|
1338 width: 5px; |
|
1339 height: 11px; |
|
1340 background: #fff; |
|
1341 |
|
1342 &:before, |
|
1343 &:after { |
|
1344 content: ''; |
|
1345 position: absolute; |
|
1346 right: 0; |
|
1347 border-right: 4px solid transparent; |
|
1348 border-left: 4px solid transparent; |
|
1349 } |
|
1350 &:before { |
|
1351 top: 0; |
|
1352 border-bottom: 4px solid #404040; |
|
1353 } |
|
1354 &:after { |
|
1355 bottom: 0; |
|
1356 border-top: 4px solid #404040; |
|
1357 } |
|
1358 } |
|
1359 } |
|
1360 .select-multiple select { |
|
1361 height: auto; |
|
1362 } |
|
1363 .textarea textarea { |
|
1364 height: auto; |
|
1365 resize: none; |
|
1366 } |
|
1367 .textarea-resizable textarea { |
|
1368 resize: vertical; |
|
1369 } |
|
1370 .textarea-expandable textarea { |
|
1371 height: 31px; |
|
1372 |
|
1373 &:focus { |
|
1374 height: auto; |
|
1375 } |
|
1376 } |
|
1377 .checkbox, |
|
1378 .radio { |
|
1379 margin-bottom: 4px; |
|
1380 padding-left: 25px; |
|
1381 line-height: 25px; |
|
1382 color: #404040; |
|
1383 cursor: pointer; |
|
1384 font-size: 13px; |
|
1385 |
|
1386 &:last-child { |
|
1387 margin-bottom: 0; |
|
1388 } |
|
1389 i { |
|
1390 display: block; |
|
1391 position: absolute; |
|
1392 top: 3px; |
|
1393 left: 0; |
|
1394 width: 17px; |
|
1395 height: 17px; |
|
1396 outline: 0; |
|
1397 border-width: 1px; |
|
1398 border-style: solid; |
|
1399 background: #FFF; |
|
1400 } |
|
1401 input { |
|
1402 position: absolute; |
|
1403 left: -9999px; |
|
1404 |
|
1405 &+i:after { |
|
1406 position: absolute; |
|
1407 opacity: 0; |
|
1408 transition: opacity .1s; |
|
1409 -webkit-transition: opacity .1s; |
|
1410 } |
|
1411 &:checked+i:after { |
|
1412 opacity: 1; |
|
1413 } |
|
1414 } |
|
1415 } |
|
1416 .radio input+i:after { |
|
1417 background-color: #3276B1; |
|
1418 } |
|
1419 .checkbox input { |
|
1420 &+i:after { |
|
1421 content: '\f00c'; |
|
1422 top: -1px; |
|
1423 left: 1px; |
|
1424 width: 15px; |
|
1425 height: 15px; |
|
1426 font: 400 16px/19px FontAwesome; |
|
1427 text-align: center; |
|
1428 } |
|
1429 &+i:after { |
|
1430 color: #3276B1; |
|
1431 } |
|
1432 &:checked:hover+i:after { |
|
1433 content: '\f00d'; |
|
1434 } |
|
1435 &:checked:disabled:hover+i:after { |
|
1436 content: '\f00c'; |
|
1437 } |
|
1438 } |
|
1439 .radio input + i:after { |
|
1440 content: ''; |
|
1441 top: 4px; |
|
1442 left: 4px; |
|
1443 width: 9px; |
|
1444 height: 9px; |
|
1445 border-radius: 50%; |
|
1446 } |
|
1447 .checkbox + .checkbox, |
|
1448 .radio + .radio { |
|
1449 margin-top: 0; |
|
1450 } |
|
1451 &.table td .checkbox i, |
|
1452 &.table td .radio i, |
|
1453 &.table th .checkbox i, |
|
1454 &.table th .radio i { |
|
1455 top: 0!important; |
|
1456 } |
|
1457 .inner { |
|
1458 .checkbox { |
|
1459 min-height: 13px; |
|
1460 |
|
1461 i { |
|
1462 width: 13px; |
|
1463 height: 13px; |
|
1464 } |
|
1465 input +i:after { |
|
1466 width: 11px; |
|
1467 height: 11px; |
|
1468 font: 300 12px/16px FontAwesome; |
|
1469 } |
|
1470 } |
|
1471 } |
|
1472 .toggle { |
|
1473 margin-bottom: 4px; |
|
1474 padding-right: 61px; |
|
1475 font-size: 15px; |
|
1476 line-height: 25px; |
|
1477 color: #404040; |
|
1478 cursor: pointer; |
|
1479 |
|
1480 &:last-child { |
|
1481 margin-bottom: 0; |
|
1482 } |
|
1483 &.state-error input:checked+i { |
|
1484 background: #fff0f0; |
|
1485 } |
|
1486 &.state-success input:checked+i { |
|
1487 background: #f0fff0; |
|
1488 } |
|
1489 input { |
|
1490 position: absolute; |
|
1491 left: -9999px; |
|
1492 |
|
1493 &:checked+i:before { |
|
1494 right: 36px; |
|
1495 } |
|
1496 &:checked+i:after { |
|
1497 content: attr(data-swchon-text); |
|
1498 text-align: right; |
|
1499 } |
|
1500 } |
|
1501 i { |
|
1502 display: block; |
|
1503 position: absolute; |
|
1504 content: ''; |
|
1505 top: 4px; |
|
1506 right: 0; |
|
1507 width: 49px; |
|
1508 height: 17px; |
|
1509 border-width: 1px; |
|
1510 border-style: solid; |
|
1511 border-radius: 12px; |
|
1512 background: #fff; |
|
1513 |
|
1514 &:before { |
|
1515 display: block; |
|
1516 position: absolute; |
|
1517 content: ''; |
|
1518 z-index: 1; |
|
1519 top: 4px; |
|
1520 right: 4px; |
|
1521 width: 9px; |
|
1522 height: 9px; |
|
1523 border-radius: 50%; |
|
1524 opacity: 1; |
|
1525 transition: right .2s; |
|
1526 -webkit-transition: right .2s; |
|
1527 background-color: #3276B1; |
|
1528 } |
|
1529 &:after { |
|
1530 position: absolute; |
|
1531 content: attr(data-swchoff-text); |
|
1532 top: 2px; |
|
1533 right: 8px; |
|
1534 left: 8px; |
|
1535 font-style: normal; |
|
1536 font-size: 9px; |
|
1537 line-height: 17px; |
|
1538 font-weight: 700; |
|
1539 text-align: left; |
|
1540 color: #5f5f5f; |
|
1541 } |
|
1542 } |
|
1543 } |
|
1544 .checkbox:hover i, |
|
1545 .radio:hover i, |
|
1546 .toggle:hover i { |
|
1547 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .1); |
|
1548 box-shadow: inset 0 1px 1px rgba(0, 0, 0, .1); |
|
1549 } |
|
1550 .checkbox:active i, |
|
1551 .radio:active i, |
|
1552 .toggle:active i { |
|
1553 background: #F0F0F0; |
|
1554 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .1); |
|
1555 box-shadow: inset 0 1px 1px rgba(0, 0, 0, .1); |
|
1556 } |
|
1557 .checkbox input:checked+i, |
|
1558 .radio input:checked+i, |
|
1559 .toggle input:checked+i { |
|
1560 border-color: #3276B1; |
|
1561 } |
|
1562 .rating { |
|
1563 margin-bottom: 4px; |
|
1564 font-size: 13px; |
|
1565 line-height: 25px; |
|
1566 color: #404040; |
|
1567 |
|
1568 &:last-child { |
|
1569 margin-bottom: 0; |
|
1570 } |
|
1571 &.state-error+em { |
|
1572 margin-top: -4px; |
|
1573 margin-bottom: 4px; |
|
1574 } |
|
1575 input { |
|
1576 position: absolute; |
|
1577 left: -9999px; |
|
1578 |
|
1579 &+label:hover, |
|
1580 &+label:hover~label { |
|
1581 color: #3276B1; |
|
1582 } |
|
1583 &:checked~label { |
|
1584 color: #3276B1; |
|
1585 } |
|
1586 } |
|
1587 label { |
|
1588 display: block; |
|
1589 float: right; |
|
1590 height: 17px; |
|
1591 margin-top: 5px; |
|
1592 padding: 0 2px; |
|
1593 font-size: 17px; |
|
1594 line-height: 17px; |
|
1595 cursor: pointer; |
|
1596 color: #ccc; |
|
1597 transition: color .3s; |
|
1598 -webkit-transition: color .3s; |
|
1599 } |
|
1600 } |
|
1601 .icon-append, |
|
1602 .icon-prepend { |
|
1603 position: absolute; |
|
1604 top: 4px; |
|
1605 width: 20px; |
|
1606 height: 20px; |
|
1607 font-size: 14px; |
|
1608 line-height: 20px; |
|
1609 text-align: center; |
|
1610 color: #A2A2A2; |
|
1611 |
|
1612 &.fa-stack { |
|
1613 .fa-stack-2x { |
|
1614 font-size: 1.6em; |
|
1615 left: 1px; |
|
1616 } |
|
1617 .fa-stack-1x { |
|
1618 left: 1px; |
|
1619 top: 1px; |
|
1620 } |
|
1621 } |
|
1622 } |
|
1623 .icon-append { |
|
1624 right: 4px; |
|
1625 padding-left: 2px; |
|
1626 border-left-width: 1px; |
|
1627 border-left-style: solid; |
|
1628 } |
|
1629 .icon-append-2 { |
|
1630 right: 31px; |
|
1631 } |
|
1632 .icon-prepend { |
|
1633 left: 4px; |
|
1634 padding-right: 2px; |
|
1635 border-right-width: 1px; |
|
1636 border-right-style: solid; |
|
1637 } |
|
1638 .icon-prepend-2 { |
|
1639 left: 31px; |
|
1640 } |
|
1641 .checkbox i, |
|
1642 .icon-append, |
|
1643 .icon-prepend, |
|
1644 .input input, |
|
1645 .radio i, |
|
1646 .select select, |
|
1647 .textarea textarea, |
|
1648 .toggle i { |
|
1649 border-color: #BDBDBD; |
|
1650 transition: border-color .3s; |
|
1651 -webkit-transition: border-color .3s; |
|
1652 } |
|
1653 .input.bordered:hover, |
|
1654 .checkbox:hover i, |
|
1655 .input:hover input, |
|
1656 .radio:hover i, |
|
1657 .select:hover select, |
|
1658 .textarea:hover textarea, |
|
1659 .toggle:hover i { |
|
1660 border-color: rgba(82, 168, 236, 0.7); |
|
1661 } |
|
1662 .checkbox input:focus+i, |
|
1663 .input input:focus, |
|
1664 .radio input:focus+i, |
|
1665 .select select:focus, |
|
1666 .textarea textarea:focus, |
|
1667 .toggle input:focus+i { |
|
1668 border-color: rgba(82, 168, 236, 0.7); |
|
1669 outline: 0; |
|
1670 outline: thin dotted 9; |
|
1671 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.7); |
|
1672 -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.7); |
|
1673 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.7); |
|
1674 } |
|
1675 .checkbox.state-error i, |
|
1676 .radio.state-error i, |
|
1677 .state-error input, |
|
1678 .state-error select, |
|
1679 .state-error textarea, |
|
1680 .toggle.state-error i { |
|
1681 background: #fff0f0; |
|
1682 border-color: rgba(255, 60, 60, 0.8) !important; |
|
1683 |
|
1684 &:focus { |
|
1685 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(255, 60, 60, 0.6) !important; |
|
1686 -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(255, 60, 60, 0.6) !important; |
|
1687 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(255, 60, 60, 0.6) !important; |
|
1688 } |
|
1689 } |
|
1690 .state-error .select2-container .select2-choice, |
|
1691 .state-error .select2-container .select2-choices { |
|
1692 border-color: rgba(255, 60, 60, 0.8) !important; |
|
1693 |
|
1694 &:focus { |
|
1695 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(255, 60, 60, 0.6) !important; |
|
1696 -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(255, 60, 60, 0.6) !important; |
|
1697 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(255, 60, 60, 0.6) !important; |
|
1698 } |
|
1699 } |
|
1700 .checkbox.state-success i, |
|
1701 .radio.state-success i, |
|
1702 .state-success input, |
|
1703 .state-success select, |
|
1704 .state-success textarea, |
|
1705 .toggle.state-success i { |
|
1706 background: #f0fff0; |
|
1707 border-color: #7DC27D; |
|
1708 } |
|
1709 .button.state-disabled, |
|
1710 .checkbox.state-disabled, |
|
1711 .input.state-disabled input, |
|
1712 .radio.state-disabled, |
|
1713 .select.state-disabled, |
|
1714 .textarea.state-disabled, |
|
1715 .toggle.state-disabled { |
|
1716 cursor: default!important; |
|
1717 opacity: .6!important; |
|
1718 } |
|
1719 .checkbox.state-disabled:hover i, |
|
1720 .input.state-disabled:hover input, |
|
1721 .radio.state-disabled:hover i, |
|
1722 .select.state-disabled:hover select, |
|
1723 .textarea.state-disabled:hover textarea, |
|
1724 .toggle.state-disabled:hover i { |
|
1725 border-color: #e5e5e5!important; |
|
1726 } |
|
1727 .state-disabled.checkbox input+i:after, |
|
1728 .state-disabled.checkbox input:checked+i, |
|
1729 .state-disabled.radio input+i:after, |
|
1730 .state-disabled.radio input:checked+i, |
|
1731 .state-disabled.toggle input:checked+i { |
|
1732 border-color: #e5e5e5!important; |
|
1733 color: #333!important; |
|
1734 } |
|
1735 .ui-widget-content .ui-spinner-input { |
|
1736 margin: 0; |
|
1737 border: 0; |
|
1738 -webkit-box-shadow: none!important; |
|
1739 box-shadow: none!important; |
|
1740 height: 29px; |
|
1741 } |
|
1742 .state-error { |
|
1743 color: #D56161; |
|
1744 |
|
1745 select+i { |
|
1746 background: #FFF0F0; |
|
1747 -webkit-box-shadow: 0 0 0 9px #FFF0F0; |
|
1748 box-shadow: 0 0 0 9px #FFF0F0; |
|
1749 } |
|
1750 &+em { |
|
1751 display: block; |
|
1752 margin-top: 6px; |
|
1753 padding: 0 1px; |
|
1754 font-style: normal; |
|
1755 font-size: 11px; |
|
1756 line-height: 15px; |
|
1757 color: #D56161; |
|
1758 } |
|
1759 } |
|
1760 .state-success { |
|
1761 select+i { |
|
1762 background: #f0fff0; |
|
1763 -webkit-box-shadow: 0 0 0 9px #f0fff0; |
|
1764 box-shadow: 0 0 0 9px #f0fff0; |
|
1765 } |
|
1766 } |
|
1767 .state-disabled { |
|
1768 &.radio input+i:after { |
|
1769 background-color: #333; |
|
1770 } |
|
1771 } |
|
1772 .form-tiny { |
|
1773 .form-group { |
|
1774 padding: 0px 10px; |
|
1775 } |
|
1776 .control-label { |
|
1777 margin-top: 2px; |
|
1778 margin-bottom: 3px; |
|
1779 line-height: 14px; |
|
1780 } |
|
1781 label.input { |
|
1782 span.textline-field { |
|
1783 margin-top: 2px; |
|
1784 margin-bottom: 3px; |
|
1785 line-height: 14px; |
|
1786 } |
|
1787 } |
|
1788 } |
|
1789 .form-nomargin, |
|
1790 &.form-nomargin{ |
|
1791 .control-label { |
|
1792 margin-top: 0; |
|
1793 margin-bottom: 0; |
|
1794 } |
|
1795 label.input { |
|
1796 span.textline-field { |
|
1797 margin-top: 0; |
|
1798 margin-bottom: 0; |
|
1799 } |
|
1800 } |
|
1801 } |
|
1802 .form-nopadding, |
|
1803 &.form-nopadding { |
|
1804 .form-group { |
|
1805 padding: 0 10px 1px; |
|
1806 } |
|
1807 } |
|
1808 } |
|
1809 |
|
1810 .ams-form-modal { |
|
1811 position: fixed; |
|
1812 z-index: 1; |
|
1813 display: none; |
|
1814 width: 400px; |
|
1815 } |
|
1816 |
|
1817 .ams-form-modal-overlay { |
|
1818 position: fixed; |
|
1819 top: 0; |
|
1820 left: 0; |
|
1821 display: none; |
|
1822 width: 100%; |
|
1823 height: 100%; |
|
1824 background: rgba(0, 0, 0, .7); |
|
1825 } |
|
1826 |
|
1827 .state-error .icon-append, |
|
1828 .state-error .icon-prepend { |
|
1829 color: #ed1c24; |
|
1830 } |
|
1831 |
|
1832 |
|
1833 /* |
|
1834 * X-editable - v1.5.0 |
|
1835 */ |
|
1836 |
|
1837 .editableform { |
|
1838 margin-bottom: 0; |
|
1839 |
|
1840 .control-group { |
|
1841 margin-bottom: 0; |
|
1842 white-space: nowrap; |
|
1843 } |
|
1844 .editable-date { |
|
1845 padding: 0; |
|
1846 margin: 0; |
|
1847 float: left; |
|
1848 } |
|
1849 } |
|
1850 |
|
1851 .editableform-loading { |
|
1852 background: url(../img/loading.gif) center center no-repeat; |
|
1853 height: 25px; |
|
1854 width: auto; |
|
1855 min-width: 25px; |
|
1856 } |
|
1857 |
|
1858 .editable-buttons { |
|
1859 display: inline-block; |
|
1860 vertical-align: top; |
|
1861 margin-left: 7px; |
|
1862 zoom: 1; |
|
1863 *display: inline; |
|
1864 |
|
1865 &.editable-buttons-bottom { |
|
1866 display: block; |
|
1867 margin-top: 7px; |
|
1868 margin-left: 0; |
|
1869 } |
|
1870 .editable-cancel { |
|
1871 margin-left: 7px; |
|
1872 } |
|
1873 button.ui-button-icon-only { |
|
1874 height: 24px; |
|
1875 width: 30px; |
|
1876 } |
|
1877 } |
|
1878 |
|
1879 .editable-inline { |
|
1880 .add-on .icon-th { |
|
1881 margin-top: 3px; |
|
1882 margin-left: 1px; |
|
1883 } |
|
1884 .editableform-loading { |
|
1885 background-position: left 5px; |
|
1886 } |
|
1887 } |
|
1888 |
|
1889 .editable-input { |
|
1890 vertical-align: top; |
|
1891 display: inline-block; |
|
1892 width: auto; |
|
1893 white-space: normal; |
|
1894 zoom: 1; |
|
1895 *display: inline; |
|
1896 |
|
1897 .datepicker { |
|
1898 top: 0; |
|
1899 left: 0; |
|
1900 padding: 4px; |
|
1901 |
|
1902 &:before { |
|
1903 content: ''; |
|
1904 display: inline-block; |
|
1905 border-left: 7px solid transparent; |
|
1906 border-right: 7px solid transparent; |
|
1907 border-bottom: 7px solid #ccc; |
|
1908 border-bottom-color: rgba(0, 0, 0, .2); |
|
1909 position: absolute; |
|
1910 top: -7px; |
|
1911 left: 6px; |
|
1912 } |
|
1913 &:after { |
|
1914 content: ''; |
|
1915 display: inline-block; |
|
1916 border-left: 6px solid transparent; |
|
1917 border-right: 6px solid transparent; |
|
1918 border-bottom: 6px solid #fff; |
|
1919 position: absolute; |
|
1920 top: -6px; |
|
1921 left: 7px; |
|
1922 } |
|
1923 >div { |
|
1924 display: none; |
|
1925 } |
|
1926 table { |
|
1927 width: 100%; |
|
1928 min-width: 214px; |
|
1929 margin: 0; |
|
1930 } |
|
1931 thead tr:first-child th { |
|
1932 cursor: pointer; |
|
1933 |
|
1934 &:hover { |
|
1935 background: #eee; |
|
1936 } |
|
1937 } |
|
1938 td, |
|
1939 th { |
|
1940 text-align: center; |
|
1941 width: 24px; |
|
1942 height: 20px; |
|
1943 } |
|
1944 th { |
|
1945 &.switch { |
|
1946 width: 145px; |
|
1947 } |
|
1948 &.next, |
|
1949 &.prev { |
|
1950 font-size: 19.5px; |
|
1951 } |
|
1952 } |
|
1953 td { |
|
1954 span { |
|
1955 display: block; |
|
1956 width: 47px; |
|
1957 height: 54px; |
|
1958 line-height: 54px; |
|
1959 float: left; |
|
1960 margin: 2px; |
|
1961 cursor: pointer; |
|
1962 |
|
1963 &:hover { |
|
1964 background: #eee; |
|
1965 } |
|
1966 &.active { |
|
1967 background: #3276b1; |
|
1968 color: #fff; |
|
1969 text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); |
|
1970 border-radius: 3px; |
|
1971 } |
|
1972 &.old { |
|
1973 color: #555; |
|
1974 } |
|
1975 } |
|
1976 } |
|
1977 td.day:hover { |
|
1978 background: #eee; |
|
1979 cursor: pointer; |
|
1980 } |
|
1981 td.day.disabled, |
|
1982 td.new, |
|
1983 td.old { |
|
1984 color: #555; |
|
1985 } |
|
1986 td.active, |
|
1987 td.active:hover { |
|
1988 background: #3276b1; |
|
1989 color: #fff; |
|
1990 text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); |
|
1991 border-radius: 3px; |
|
1992 } |
|
1993 &.prev i, |
|
1994 &.next i { |
|
1995 display: inline-block; |
|
1996 font-family: FontAwesome; |
|
1997 font-style: normal; |
|
1998 font-weight: 400; |
|
1999 line-height: 1; |
|
2000 -webkit-font-smoothing: antialiased; |
|
2001 -moz-osx-font-smoothing: grayscale; |
|
2002 font-size: 14px; |
|
2003 } |
|
2004 &.prev i:before { |
|
2005 content: "\f060"; |
|
2006 } |
|
2007 &.next i:before { |
|
2008 content: "\f061"; |
|
2009 } |
|
2010 } |
|
2011 } |
|
2012 |
|
2013 .editable-checklist label { |
|
2014 white-space: nowrap; |
|
2015 |
|
2016 input[type=checkbox], |
|
2017 span { |
|
2018 vertical-align: middle; |
|
2019 margin: 0; |
|
2020 } |
|
2021 } |
|
2022 |
|
2023 .editable-wysihtml5 { |
|
2024 width: 566px; |
|
2025 height: 250px; |
|
2026 } |
|
2027 |
|
2028 .editable-pre-wrapped { |
|
2029 white-space: pre-wrap; |
|
2030 } |
|
2031 |
|
2032 .editable-container { |
|
2033 &.editable-popup { |
|
2034 max-width: none!important; |
|
2035 } |
|
2036 &.popover { |
|
2037 width: auto; |
|
2038 } |
|
2039 &.editable-inline { |
|
2040 display: inline-block; |
|
2041 vertical-align: middle; |
|
2042 width: auto; |
|
2043 zoom: 1; |
|
2044 *display: inline; |
|
2045 } |
|
2046 &.ui-widget { |
|
2047 font-size: inherit; |
|
2048 z-index: 9990; |
|
2049 } |
|
2050 } |
|
2051 |
|
2052 .editable-click, |
|
2053 a.editable-click, |
|
2054 a.editable-click:hover { |
|
2055 text-decoration: none; |
|
2056 border-bottom: dashed 1px #08c; |
|
2057 } |
|
2058 |
|
2059 .editable-click.editable-disabled, |
|
2060 a.editable-click.editable-disabled, |
|
2061 a.editable-click.editable-disabled:hover { |
|
2062 color: #585858; |
|
2063 cursor: default; |
|
2064 border-bottom: 0; |
|
2065 } |
|
2066 |
|
2067 .editable-empty, |
|
2068 .editable-empty:focus, |
|
2069 .editable-empty:hover { |
|
2070 font-style: italic; |
|
2071 color: #D14; |
|
2072 text-decoration: none; |
|
2073 } |
|
2074 |
|
2075 .editable-unsaved { |
|
2076 font-weight: 700; |
|
2077 } |
|
2078 |
|
2079 .editable-bg-transition { |
|
2080 -webkit-transition: background-color 1400ms ease-out; |
|
2081 transition: background-color 1400ms ease-out; |
|
2082 } |
|
2083 |
|
2084 .form-horizontal .editable { |
|
2085 padding-top: 5px; |
|
2086 display: inline-block; |
|
2087 } |
|
2088 |
|
2089 .editable-address { |
|
2090 display: block; |
|
2091 margin-bottom: 5px; |
|
2092 } |
|
2093 |
|
2094 .editable-address span { |
|
2095 width: 70px; |
|
2096 display: inline-block; |
|
2097 } |
|
2098 |
|
2099 .editable-clear { |
|
2100 clear: both; |
|
2101 font-size: .9em; |
|
2102 text-decoration: none; |
|
2103 text-align: right; |
|
2104 } |
|
2105 |
|
2106 .editable-clear-x { |
|
2107 background: url(../img/clear.png) center center no-repeat; |
|
2108 display: block; |
|
2109 width: 13px; |
|
2110 height: 13px; |
|
2111 position: absolute; |
|
2112 opacity: .6; |
|
2113 z-index: 100; |
|
2114 top: 50%; |
|
2115 right: 6px; |
|
2116 margin-top: -6px; |
|
2117 |
|
2118 &:hover { |
|
2119 opacity: 1; |
|
2120 } |
|
2121 } |
|
2122 |
|
2123 .editable-error-block { |
|
2124 max-width: 300px; |
|
2125 margin: 5px 0 0; |
|
2126 width: auto; |
|
2127 white-space: normal; |
|
2128 |
|
2129 &.ui-state-error { |
|
2130 padding: 3px; |
|
2131 } |
|
2132 } |
|
2133 |
|
2134 .editable-error { |
|
2135 color: red; |
|
2136 } |
|
2137 |
|
2138 .input-append.date .add-on i, |
|
2139 .input-prepend.date .add-on i { |
|
2140 display: block; |
|
2141 cursor: pointer; |
|
2142 width: 16px; |
|
2143 height: 16px; |
|
2144 } |
|
2145 |
|
2146 |
|
2147 /* |
|
2148 * JQuery-UI widgets |
|
2149 */ |
|
2150 |
|
2151 .ui-timepicker-div { |
|
2152 .ui-widget-header { |
|
2153 margin-bottom: 8px; |
|
2154 } |
|
2155 dl { |
|
2156 text-align: left; |
|
2157 |
|
2158 dt { |
|
2159 float: left; |
|
2160 clear: left; |
|
2161 padding: 0 0 0 5px; |
|
2162 } |
|
2163 dd { |
|
2164 margin: 17px 10px 12px 40%; |
|
2165 } |
|
2166 } |
|
2167 td { |
|
2168 font-size: 90%; |
|
2169 } |
|
2170 } |
|
2171 |
|
2172 |
|
2173 .ui-tpicker-grid-label { |
|
2174 background: 0 0; |
|
2175 border: 0; |
|
2176 margin: 0; |
|
2177 padding: 0; |
|
2178 } |
|
2179 |
|
2180 |
|
2181 .ui-timepicker-rtl { |
|
2182 direction: rtl; |
|
2183 |
|
2184 dl { |
|
2185 text-align: right; |
|
2186 padding: 0 5px 0 0; |
|
2187 |
|
2188 dt { |
|
2189 float: right; |
|
2190 clear: right; |
|
2191 } |
|
2192 dd { |
|
2193 margin: 0 40% 10px 10px; |
|
2194 } |
|
2195 } |
|
2196 } |
|
2197 |
|
2198 |
|
2199 #login { |
|
2200 background: #fff; |
|
2201 overflow: visible; |
|
2202 |
|
2203 .container { |
|
2204 border: 0; |
|
2205 } |
|
2206 #header { |
|
2207 margin: 0; |
|
2208 height: 71px; |
|
2209 border-bottom: 1px solid #eee!important; |
|
2210 overflow: hidden; |
|
2211 padding: 0 30px; |
|
2212 -webkit-background-clip: padding-box; |
|
2213 border-width: 0; |
|
2214 min-height: 28px; |
|
2215 background: #f4f4f4!important; |
|
2216 margin-bottom: 20px; |
|
2217 |
|
2218 @media (min-width:768px) and (max-width:880px) { |
|
2219 padding: 0 5px!important; |
|
2220 } |
|
2221 @media only screen and (min-width:0) and (max-width:679px) { |
|
2222 padding: 0 5px!important; |
|
2223 } |
|
2224 #logo { |
|
2225 margin-top: 22px; |
|
2226 margin-left: 0; |
|
2227 |
|
2228 @media only screen and (min-width:0) and (max-width:679px) { |
|
2229 margin-top: 22px; |
|
2230 } |
|
2231 img { |
|
2232 width: 137px; |
|
2233 |
|
2234 @media only screen and (min-width:0) and (max-width:679px) { |
|
2235 width: 135px; |
|
2236 } |
|
2237 } |
|
2238 } |
|
2239 } |
|
2240 &-header-space { |
|
2241 float: right; |
|
2242 text-align: right; |
|
2243 display: block; |
|
2244 vertical-align: middle; |
|
2245 line-height: 71px; |
|
2246 |
|
2247 >:first-child { |
|
2248 font-size: 13px; |
|
2249 margin-right: 14px; |
|
2250 vertical-align: -3px; |
|
2251 font-weight: 400; |
|
2252 } |
|
2253 >* { |
|
2254 display: inline-block; |
|
2255 } |
|
2256 .btn { |
|
2257 font-weight: 700; |
|
2258 text-transform: uppercase; |
|
2259 } |
|
2260 } |
|
2261 #main { |
|
2262 background: #fff; |
|
2263 margin: 0; |
|
2264 } |
|
2265 .hero { |
|
2266 background-image: url(../img/gradient/login.png); |
|
2267 background-repeat: no-repeat; |
|
2268 background-position: 0 137px; |
|
2269 height: 360px; |
|
2270 width: 100%; |
|
2271 float: left; |
|
2272 } |
|
2273 h4.paragraph-header { |
|
2274 color: #565656; |
|
2275 font-size: 15px; |
|
2276 font-weight: 400; |
|
2277 line-height: 22px; |
|
2278 margin-top: 15px; |
|
2279 width: 270px; |
|
2280 } |
|
2281 h5.about-heading { |
|
2282 color: #565656; |
|
2283 font-size: 15px; |
|
2284 font-weight: 700; |
|
2285 line-height: 24px; |
|
2286 margin: 0 0 5px; |
|
2287 } |
|
2288 .login-header-big { |
|
2289 font-weight: 400; |
|
2290 } |
|
2291 .login-desc-box-l { |
|
2292 min-height: 350px; |
|
2293 width: 50%; |
|
2294 } |
|
2295 .login-app-icons { |
|
2296 vertical-align: top; |
|
2297 margin-top: 90px; |
|
2298 width: 300px; |
|
2299 } |
|
2300 } |
|
2301 |
|
2302 .bootstrapWizard { |
|
2303 display: block; |
|
2304 list-style: none; |
|
2305 padding: 0; |
|
2306 position: relative; |
|
2307 width: 100%; |
|
2308 |
|
2309 a:active, |
|
2310 a:focus, |
|
2311 a:hover { |
|
2312 text-decoration: none; |
|
2313 } |
|
2314 li { |
|
2315 display: block; |
|
2316 float: left; |
|
2317 width: 25%; |
|
2318 text-align: center; |
|
2319 padding-left: 0; |
|
2320 |
|
2321 &:before { |
|
2322 border-top: 3px solid #55606E; |
|
2323 content: ""; |
|
2324 display: block; |
|
2325 font-size: 0; |
|
2326 overflow: hidden; |
|
2327 position: relative; |
|
2328 top: 11px; |
|
2329 right: 1px; |
|
2330 width: 100%; |
|
2331 z-index: 1; |
|
2332 } |
|
2333 &:first-child:before { |
|
2334 left: 50%; |
|
2335 max-width: 50%; |
|
2336 } |
|
2337 &:last-child:before { |
|
2338 max-width: 50%; |
|
2339 width: 50%; |
|
2340 } |
|
2341 .step { |
|
2342 background: #B2B5B9; |
|
2343 color: #fff; |
|
2344 display: inline; |
|
2345 font-size: 15px; |
|
2346 font-weight: 700; |
|
2347 padding: 7px 13px; |
|
2348 border: 3px solid transparent; |
|
2349 border-radius: 50%; |
|
2350 line-height: normal; |
|
2351 position: relative; |
|
2352 text-align: center; |
|
2353 z-index: 2; |
|
2354 -webkit-transition: all .1s linear 0s; |
|
2355 transition: all .1s linear 0s; |
|
2356 |
|
2357 i { |
|
2358 font-size: 10px; |
|
2359 font-weight: 400; |
|
2360 position: relative; |
|
2361 top: -1.5px; |
|
2362 } |
|
2363 } |
|
2364 &.complete .step { |
|
2365 background: #0aa66e; |
|
2366 padding: 1px 6px; |
|
2367 border: 3px solid #55606E; |
|
2368 } |
|
2369 &.active .step, |
|
2370 &.active.complete .step { |
|
2371 background: #0091d9; |
|
2372 color: #fff; |
|
2373 font-weight: 700; |
|
2374 padding: 7px 13px; |
|
2375 font-size: 15px; |
|
2376 border-radius: 50%; |
|
2377 border: 3px solid #55606E; |
|
2378 } |
|
2379 .title { |
|
2380 color: #bfbfbf; |
|
2381 display: block; |
|
2382 font-size: 13px; |
|
2383 line-height: 15px; |
|
2384 max-width: 100%; |
|
2385 position: relative; |
|
2386 table-layout: fixed; |
|
2387 text-align: center; |
|
2388 top: 20px; |
|
2389 word-wrap: break-word; |
|
2390 z-index: 104; |
|
2391 } |
|
2392 &.active .title, |
|
2393 &.complete .title { |
|
2394 color: #2B3D53; |
|
2395 } |
|
2396 } |
|
2397 } |
|
2398 .wizard-actions { |
|
2399 display: block; |
|
2400 list-style: none; |
|
2401 padding: 0; |
|
2402 position: relative; |
|
2403 width: 100%; |
|
2404 |
|
2405 li { |
|
2406 display: inline; |
|
2407 } |
|
2408 } |
|
2409 |
|
2410 .fuelux { |
|
2411 .wizard { |
|
2412 position: relative; |
|
2413 overflow: hidden; |
|
2414 background-color: #f9f9f9; |
|
2415 border: 1px solid #d4d4d4; |
|
2416 border-radius: 4px; |
|
2417 *zoom: 1; |
|
2418 -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .065); |
|
2419 box-shadow: 0 1px 4px rgba(0, 0, 0, .065); |
|
2420 |
|
2421 &:after, |
|
2422 &:before { |
|
2423 display: table; |
|
2424 line-height: 0; |
|
2425 content: ""; |
|
2426 } |
|
2427 &:after { |
|
2428 clear: both; |
|
2429 } |
|
2430 ul { |
|
2431 width: 4000px; |
|
2432 padding: 0; |
|
2433 margin: 0; |
|
2434 list-style: none outside none; |
|
2435 |
|
2436 &.previous-disabled li.complete { |
|
2437 cursor: default; |
|
2438 |
|
2439 &:hover { |
|
2440 color: #356e35; |
|
2441 cursor: default; |
|
2442 background: #f3f4f5; |
|
2443 |
|
2444 .chevron:before { |
|
2445 border-left-color: #f3f4f5; |
|
2446 } |
|
2447 } |
|
2448 } |
|
2449 li { |
|
2450 position: relative; |
|
2451 float: left; |
|
2452 height: 46px; |
|
2453 padding: 0 20px 0 30px; |
|
2454 margin: 0; |
|
2455 font-size: 16px; |
|
2456 line-height: 46px; |
|
2457 color: #999; |
|
2458 cursor: default; |
|
2459 background: #ededed; |
|
2460 |
|
2461 &:first-child { |
|
2462 padding-left: 20px; |
|
2463 border-radius: 4px 0 0 4px; |
|
2464 } |
|
2465 &.complete { |
|
2466 color: #296829; |
|
2467 background: #f3f4f5; |
|
2468 |
|
2469 &:hover { |
|
2470 cursor: pointer; |
|
2471 background: #e7eff8; |
|
2472 |
|
2473 .chevron:before { |
|
2474 border-left: 14px solid #e7eff8; |
|
2475 } |
|
2476 } |
|
2477 .chevron:before { |
|
2478 border-left: 14px solid #f3f4f5; |
|
2479 } |
|
2480 } |
|
2481 &.active { |
|
2482 color: #3a87ad; |
|
2483 background: #f1f6fc; |
|
2484 |
|
2485 .chevron:before { |
|
2486 border-left: 14px solid #f1f6fc; |
|
2487 } |
|
2488 } |
|
2489 .chevron { |
|
2490 position: absolute; |
|
2491 top: 0; |
|
2492 right: -14px; |
|
2493 z-index: 1; |
|
2494 display: block; |
|
2495 border: 24px solid transparent; |
|
2496 border-right: 0; |
|
2497 border-left: 14px solid #d4d4d4; |
|
2498 |
|
2499 &:before { |
|
2500 position: absolute; |
|
2501 top: -24px; |
|
2502 right: 1px; |
|
2503 display: block; |
|
2504 border: 24px solid transparent; |
|
2505 border-right: 0; |
|
2506 border-left: 14px solid #ededed; |
|
2507 content: ""; |
|
2508 } |
|
2509 } |
|
2510 .badge { |
|
2511 margin-right: 8px; |
|
2512 } |
|
2513 } |
|
2514 } |
|
2515 .actions { |
|
2516 position: absolute; |
|
2517 right: 0; |
|
2518 z-index: 2; |
|
2519 float: right; |
|
2520 padding-right: 15px; |
|
2521 padding-left: 15px; |
|
2522 line-height: 46px; |
|
2523 vertical-align: middle; |
|
2524 background-color: #eee; |
|
2525 border-left: 1px solid #d4d4d4; |
|
2526 |
|
2527 a { |
|
2528 margin-right: 8px; |
|
2529 font-size: 12px; |
|
2530 line-height: 45px; |
|
2531 } |
|
2532 .btn-prev i { |
|
2533 margin-right: 5px; |
|
2534 } |
|
2535 .btn-next i { |
|
2536 margin-left: 5px; |
|
2537 } |
|
2538 } |
|
2539 } |
|
2540 .fuelux .step-content { |
|
2541 .step-pane { |
|
2542 display: none; |
|
2543 } |
|
2544 .active { |
|
2545 display: block; |
|
2546 |
|
2547 .btn-group .active { |
|
2548 display: inline-block; |
|
2549 } |
|
2550 } |
|
2551 } |
|
2552 } |
|
2553 |
|
2554 .ams-metro-tile { |
|
2555 float: left; |
|
2556 display: block; |
|
2557 background-color: #fff; |
|
2558 width: 100px; |
|
2559 height: 70px; |
|
2560 cursor: pointer; |
|
2561 -webkit-box-shadow: inset 0 0 1px #FFC; |
|
2562 box-shadow: inset 0 0 1px #FFC; |
|
2563 border: 1px dotted #C5C5C5; |
|
2564 text-decoration: none; |
|
2565 color: #fff; |
|
2566 font-weight: 300; |
|
2567 font-smooth: always; |
|
2568 margin: 0 10px 20px 0; |
|
2569 padding: 5px; |
|
2570 position: relative; |
|
2571 |
|
2572 &:hover { |
|
2573 z-index: 10; |
|
2574 -webkit-transform: scale(1.07); |
|
2575 -moz-transform: scale(1.07); |
|
2576 } |
|
2577 &.big-cubes { |
|
2578 width: 120px; |
|
2579 height: 120px; |
|
2580 } |
|
2581 &.double { |
|
2582 width: 249px; |
|
2583 } |
|
2584 &:active { |
|
2585 top: 1px; |
|
2586 left: 1px; |
|
2587 } |
|
2588 .iconbox { |
|
2589 text-align: center; |
|
2590 |
|
2591 i { |
|
2592 display: block; |
|
2593 margin: 15px auto 0; |
|
2594 height: 75px; |
|
2595 } |
|
2596 span { |
|
2597 display: block; |
|
2598 text-align: left; |
|
2599 line-height: 1em; |
|
2600 |
|
2601 >span { |
|
2602 position: absolute; |
|
2603 right: -5px; |
|
2604 bottom: -10px; |
|
2605 border-radius: 50%; |
|
2606 padding: 6px 4px 3px; |
|
2607 border: 1px solid #fff; |
|
2608 } |
|
2609 } |
|
2610 } |
|
2611 } |
|
2612 |
|
2613 .client-form header { |
|
2614 padding: 15px 13px; |
|
2615 margin: 0; |
|
2616 border-bottom-style: solid; |
|
2617 border-bottom-color: rgba(0, 0, 0, .1); |
|
2618 background: rgba(248, 248, 248, .9); |
|
2619 } |