|
1 |
|
2 /* |
|
3 * Contents styles |
|
4 */ |
|
5 |
|
6 h1, |
|
7 h2, |
|
8 h3, |
|
9 h4 { |
|
10 margin: 0; |
|
11 font-family: "Ubuntu-Bold", Arial, Helvetica, Sans-Serif; |
|
12 font-weight: 300; |
|
13 } |
|
14 |
|
15 h1 { |
|
16 letter-spacing: -1px; |
|
17 font-size: 24px; |
|
18 margin: 10px 0; |
|
19 } |
|
20 |
|
21 h1 small { |
|
22 font-size: 18px; |
|
23 font-weight: 300; |
|
24 letter-spacing: -1px; |
|
25 } |
|
26 |
|
27 h2 { |
|
28 letter-spacing: -1px; |
|
29 font-size: 22px; |
|
30 margin: 20px 0 15px; |
|
31 line-height: normal; |
|
32 } |
|
33 |
|
34 h3 { |
|
35 display: block; |
|
36 font-size: 19px; |
|
37 font-weight: 400; |
|
38 margin: 16px 0 10px; |
|
39 line-height: normal; |
|
40 } |
|
41 |
|
42 h4 { |
|
43 line-height: normal; |
|
44 font-size: 17px; |
|
45 font-weight: 300; |
|
46 margin: 12px 0 8px; |
|
47 } |
|
48 |
|
49 h5 { |
|
50 font-size: 15px; |
|
51 font-weight: 300; |
|
52 margin: 10px 0 6px; |
|
53 line-height: normal; |
|
54 } |
|
55 |
|
56 h6 { |
|
57 font-size: 14px; |
|
58 margin: 10px 0 4px; |
|
59 font-weight: 300; |
|
60 line-height: normal; |
|
61 } |
|
62 |
|
63 hr { |
|
64 .simple { |
|
65 margin-top: 10px; |
|
66 margin-bottom: 10px; |
|
67 border-style: dashed; |
|
68 } |
|
69 } |
|
70 |
|
71 img { |
|
72 &.online { |
|
73 border-left-color: #40ac2b!important; |
|
74 } |
|
75 &.busy { |
|
76 border-left-color: #ed1c24!important; |
|
77 } |
|
78 &.offline { |
|
79 border-left-color: #ddd!important; |
|
80 } |
|
81 &.away { |
|
82 border-left-color: #ffc40d!important; |
|
83 } |
|
84 } |
|
85 |
|
86 [data-ams-url], |
|
87 [data-ams-click-handler] { |
|
88 cursor: pointer; |
|
89 } |
|
90 |
|
91 label { |
|
92 font-weight: 400; |
|
93 } |
|
94 |
|
95 article { |
|
96 &.sortable-grid { |
|
97 min-height: 30px; |
|
98 } |
|
99 } |
|
100 |
|
101 .caret { |
|
102 border-top: 5px solid; |
|
103 border-right: 5px solid transparent; |
|
104 border-left: 5px solid transparent; |
|
105 } |
|
106 |
|
107 .outside { |
|
108 position: absolute; |
|
109 left: -9999px; |
|
110 } |
|
111 |
|
112 .visible-tablet { |
|
113 @media (max-width:979px) { |
|
114 display: inline-block!important; |
|
115 } |
|
116 } |
|
117 |
|
118 .hidden-tablet { |
|
119 &, |
|
120 .display-inline& { |
|
121 @media (max-width:979px) { |
|
122 display: none!important; |
|
123 } |
|
124 } |
|
125 @media only screen and (min-width:0) and (max-width:679px) { |
|
126 display: none!important; |
|
127 } |
|
128 } |
|
129 |
|
130 .visible-mobile { |
|
131 @media only screen and (min-width:320px) and (max-width:479px) { |
|
132 display: inline-block!important; |
|
133 } |
|
134 } |
|
135 |
|
136 .hidden-mobile { |
|
137 @media only screen and (min-width:320px) and (max-width:479px) { |
|
138 display: none!important; |
|
139 } |
|
140 } |
|
141 |
|
142 .viewport { |
|
143 &-y { |
|
144 overflow-y: auto; |
|
145 |
|
146 &.viewport-100 { |
|
147 max-height: 100px; |
|
148 } |
|
149 &.viewport-200 { |
|
150 max-height: 200px; |
|
151 } |
|
152 &.viewport-300 { |
|
153 max-height: 300px; |
|
154 } |
|
155 } |
|
156 &-x { |
|
157 overflow-x: auto; |
|
158 |
|
159 &.viewport-100 { |
|
160 max-width: 100px; |
|
161 } |
|
162 &.viewport-200 { |
|
163 max-width: 200px; |
|
164 } |
|
165 &.viewport-300 { |
|
166 max-width: 300px; |
|
167 } |
|
168 } |
|
169 } |
|
170 |
|
171 .lead { |
|
172 font-size: 19px; |
|
173 } |
|
174 |
|
175 .alert { |
|
176 margin-bottom: 20px; |
|
177 margin-top: 0; |
|
178 color: #675100; |
|
179 border-width: 0; |
|
180 border-left-width: 5px; |
|
181 padding: 10px; |
|
182 border-radius: 0; |
|
183 |
|
184 .close { |
|
185 top: 0; |
|
186 right: -5px; |
|
187 line-height: 20px; |
|
188 } |
|
189 &-heading { |
|
190 font-weight: 600; |
|
191 } |
|
192 &-danger { |
|
193 border-color: #963b49; |
|
194 color: #fff; |
|
195 background: #c46a69; |
|
196 text-shadow: none; |
|
197 } |
|
198 &-warning { |
|
199 border-color: #e5c693; |
|
200 color: #6b6d31; |
|
201 background: #ecdfb0; |
|
202 } |
|
203 &-success { |
|
204 border-color: #8eb589; |
|
205 color: #296829; |
|
206 background: #cee0cf; |
|
207 } |
|
208 &-info { |
|
209 border-color: #9cb4c5; |
|
210 color: #346597; |
|
211 background: #d6dde7; |
|
212 } |
|
213 ul { |
|
214 margin-left: 25px; |
|
215 list-style-position: outside; |
|
216 list-style-type: square; |
|
217 } |
|
218 .ams-form >& { |
|
219 margin: 5px; |
|
220 padding: 5px; |
|
221 box-shadow: none!important; |
|
222 -webkit-box-shadow: none!important; |
|
223 border-radius: 0!important; |
|
224 } |
|
225 } |
|
226 |
|
227 .help { |
|
228 font-size: 90%; |
|
229 padding: 5px!important; |
|
230 |
|
231 p { |
|
232 margin: 0 0 1px; |
|
233 line-height: 1; |
|
234 } |
|
235 .modal-dialog & { |
|
236 margin-bottom: 5px!important; |
|
237 } |
|
238 } |
|
239 |
|
240 .well { |
|
241 background: #fbfbfb; |
|
242 border: 1px solid #ddd; |
|
243 box-shadow: 0 1px 1px #ececec; |
|
244 -webkit-box-shadow: 0 1px 1px #ececec; |
|
245 position: relative; |
|
246 |
|
247 &.well-clean { |
|
248 -webkit-box-shadow: none; |
|
249 box-shadow: none; |
|
250 border-color: transparent; |
|
251 } |
|
252 &.well-glass { |
|
253 -webkit-box-shadow: none; |
|
254 box-shadow: none; |
|
255 border-color: transparent; |
|
256 background-color: rgba(255, 255, 255, .25); |
|
257 color: #fff; |
|
258 } |
|
259 &.well-light { |
|
260 background: #fff; |
|
261 border: 1px solid #e2e2e2; |
|
262 } |
|
263 .widget-body & { |
|
264 margin-bottom: 0; |
|
265 } |
|
266 &.transparent { |
|
267 border: 0!important; |
|
268 background: none!important; |
|
269 } |
|
270 .ams-widget&.transparent >div, |
|
271 .ams-widget&.transparent >div .widget-body { |
|
272 padding: 0!important; |
|
273 } |
|
274 &[class*=" bg-"], |
|
275 &[class^=bg-] { |
|
276 border: 1px solid #555!important; |
|
277 } |
|
278 } |
|
279 |
|
280 .note { |
|
281 margin-top: 6px; |
|
282 padding: 0 1px; |
|
283 font-size: 11px; |
|
284 line-height: 15px; |
|
285 color: #999; |
|
286 } |
|
287 |
|
288 .subscript { |
|
289 font-size: 21px; |
|
290 color: #999; |
|
291 } |
|
292 |
|
293 .display-image { |
|
294 margin-top: -60px; |
|
295 margin-right: 20px; |
|
296 } |
|
297 |
|
298 .terms-body { |
|
299 max-height: 400px; |
|
300 overflow: auto; |
|
301 } |
|
302 |
|
303 .timeline-seperator { |
|
304 display: block; |
|
305 text-align: center; |
|
306 color: #999; |
|
307 margin: 20px 0 0; |
|
308 |
|
309 >:first-child { |
|
310 padding: 4px 5px; |
|
311 border: 1px dashed rgba(0, 0, 0, .1); |
|
312 background: #fff; |
|
313 font-size: 11px; |
|
314 border-radius: 4px; |
|
315 } |
|
316 .btn, |
|
317 .btn+.dropdown-menu { |
|
318 margin-right: 15px; |
|
319 } |
|
320 &:after { |
|
321 display: block; |
|
322 content: " "; |
|
323 margin: 0 20px; |
|
324 border-bottom: 1px dashed rgba(0, 0, 0, .1); |
|
325 margin-top: -8px; |
|
326 } |
|
327 } |
|
328 |
|
329 .progress { |
|
330 position: relative; |
|
331 margin-bottom: 20px; |
|
332 overflow: hidden; |
|
333 height: 22px; |
|
334 background: #eee; |
|
335 box-shadow: 0 1px 0 transparent, 0 0 0 1px #e3e3e3 inset; |
|
336 -webkit-box-shadow: 0 1px 0 transparent, 0 0 0 1px #e3e3e3 inset; |
|
337 border-radius: 0; |
|
338 |
|
339 &-bar { |
|
340 float: left; |
|
341 width: 0; |
|
342 height: 100%; |
|
343 font-size: 11px; |
|
344 color: #fff; |
|
345 text-align: center; |
|
346 background-color: #57889c; |
|
347 -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15); |
|
348 box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15); |
|
349 font-weight: 700; |
|
350 text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); |
|
351 background-image: url(../img/pattern/overlay-pattern.png); |
|
352 |
|
353 .progress-striped & { |
|
354 background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent)); |
|
355 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
356 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
357 background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
358 -webkit-background-size: 40px 40px; |
|
359 background-size: 40px 40px; |
|
360 } |
|
361 } |
|
362 &.active &-bar { |
|
363 -webkit-animation: progress-bar-stripes 2s linear infinite; |
|
364 -ms-animation: progress-bar-stripes 2s linear infinite; |
|
365 animation: progress-bar-stripes 2s linear infinite; |
|
366 } |
|
367 &-bar-danger { |
|
368 background-color: #a90329; |
|
369 } |
|
370 &-striped &-bar-danger { |
|
371 background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent)); |
|
372 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
373 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
374 background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
375 } |
|
376 &-bar-success { |
|
377 background-color: #739e73; |
|
378 } |
|
379 &-striped &-bar-success { |
|
380 background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent)); |
|
381 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
382 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
383 background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
384 } |
|
385 &-bar-warning { |
|
386 background-color: #c79121; |
|
387 } |
|
388 &-striped &-bar-warning { |
|
389 background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent)); |
|
390 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
391 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
392 background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
393 } |
|
394 &-bar-info { |
|
395 background-color: #57889c; |
|
396 } |
|
397 &-striped &-bar-info { |
|
398 background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent)); |
|
399 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
400 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
401 background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); |
|
402 } |
|
403 .bar-info, |
|
404 &-info .bar { |
|
405 background: #57889c; |
|
406 } |
|
407 &-micro { |
|
408 height: 3px!important; |
|
409 line-height: 3px!important; |
|
410 } |
|
411 &-xs { |
|
412 height: 7px!important; |
|
413 line-height: 7px!important; |
|
414 } |
|
415 &-sm { |
|
416 height: 14px!important; |
|
417 line-height: 14px!important; |
|
418 } |
|
419 &-lg { |
|
420 height: 30px!important; |
|
421 line-height: 30px!important; |
|
422 } |
|
423 .progress-bar { |
|
424 position: absolute; |
|
425 overflow: hidden; |
|
426 line-height: 20px; |
|
427 } |
|
428 .progressbar-back-text { |
|
429 position: absolute; |
|
430 width: 100%; |
|
431 height: 100%; |
|
432 font-size: 12px; |
|
433 line-height: 20px; |
|
434 text-align: center; |
|
435 } |
|
436 .progressbar-front-text { |
|
437 display: block; |
|
438 width: 100%; |
|
439 font-size: 12px; |
|
440 line-height: 20px; |
|
441 text-align: center; |
|
442 } |
|
443 &.right { |
|
444 .progress-bar { |
|
445 right: 0; |
|
446 } |
|
447 .progressbar-front-text { |
|
448 position: absolute; |
|
449 right: 0; |
|
450 } |
|
451 } |
|
452 &.vertical { |
|
453 width: 25px; |
|
454 height: 100%; |
|
455 min-height: 150px; |
|
456 margin-right: 20px; |
|
457 display: inline-block; |
|
458 margin-bottom: 0; |
|
459 |
|
460 &.bottom { |
|
461 position: relative; |
|
462 |
|
463 .progress-bar { |
|
464 position: absolute; |
|
465 bottom: 0; |
|
466 } |
|
467 .progressbar-front-text { |
|
468 position: absolute; |
|
469 bottom: 0; |
|
470 } |
|
471 } |
|
472 .progress-bar { |
|
473 width: 100%; |
|
474 height: 0; |
|
475 -webkit-transition: height .6s ease; |
|
476 transition: height .6s ease; |
|
477 } |
|
478 } |
|
479 &.wide-bar { |
|
480 width: 40px; |
|
481 } |
|
482 } |
|
483 |
|
484 .dd { |
|
485 position: relative; |
|
486 display: block; |
|
487 margin: 0; |
|
488 padding: 0; |
|
489 max-width: 600px; |
|
490 list-style: none; |
|
491 font-size: 13px; |
|
492 line-height: 20px; |
|
493 |
|
494 @media only screen and (min-width:700px) { |
|
495 float: left; |
|
496 width: 100%; |
|
497 |
|
498 +.dd { |
|
499 margin-left: 2%; |
|
500 } |
|
501 } |
|
502 &-header.calender-spacer { |
|
503 height: 46px; |
|
504 display: block; |
|
505 } |
|
506 &-list { |
|
507 display: block; |
|
508 position: relative; |
|
509 margin: 0; |
|
510 padding: 0; |
|
511 list-style: none; |
|
512 |
|
513 .dd-list { |
|
514 padding-left: 30px; |
|
515 } |
|
516 .dd-collapsed & { |
|
517 display: none; |
|
518 } |
|
519 } |
|
520 &-empty { |
|
521 border: 1px dashed #bbb; |
|
522 min-height: 100px; |
|
523 background-color: #eee; |
|
524 background-image: -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff), -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff); |
|
525 background-image: -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff), -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff); |
|
526 background-image: linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff), linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff); |
|
527 -webkit-background-size: 60px 60px; |
|
528 background-size: 60px 60px; |
|
529 background-position: 0 0, 30px 30px; |
|
530 } |
|
531 &-empty, |
|
532 &-placeholder { |
|
533 margin: 5px 0; |
|
534 padding: 0; |
|
535 min-height: 30px; |
|
536 background: #f2fbff; |
|
537 border: 1px dashed #b6bcbf; |
|
538 -webkit-box-sizing: border-box; |
|
539 box-sizing: border-box; |
|
540 -moz-box-sizing: border-box; |
|
541 } |
|
542 &-empty, |
|
543 &-item, |
|
544 &-placeholder { |
|
545 display: block; |
|
546 position: relative; |
|
547 margin: 0; |
|
548 padding: 0; |
|
549 min-height: 20px; |
|
550 font-size: 13px; |
|
551 line-height: 20px; |
|
552 } |
|
553 &-handle { |
|
554 display: block; |
|
555 font-size: 15px; |
|
556 margin: 5px 0; |
|
557 padding: 7px 15px; |
|
558 color: #333; |
|
559 text-decoration: none; |
|
560 border: 1px solid #cfcfcf; |
|
561 background: #fbfbfb; |
|
562 |
|
563 &:hover, |
|
564 &:hover+.dd-list .dd-handle { |
|
565 background: #FDDFB3!important; |
|
566 border: 1px solid #FAA937; |
|
567 color: #333!important; |
|
568 } |
|
569 & >span { |
|
570 font-size: 13px; |
|
571 color: #777; |
|
572 } |
|
573 .dd-hover >& { |
|
574 background: #2ea8e5!important; |
|
575 } |
|
576 } |
|
577 &-item { |
|
578 >button { |
|
579 position: relative; |
|
580 cursor: pointer; |
|
581 float: left; |
|
582 width: 25px; |
|
583 height: 20px; |
|
584 margin: 7px 10px; |
|
585 line-height: 22px!important; |
|
586 padding: 0; |
|
587 text-indent: 100%; |
|
588 white-space: nowrap; |
|
589 overflow: hidden; |
|
590 border: 0; |
|
591 background: rgba(0, 0, 0, 0); |
|
592 text-align: center; |
|
593 display: inline-block; |
|
594 font-family: FontAwesome; |
|
595 font-style: normal; |
|
596 font-weight: 400; |
|
597 -webkit-font-smoothing: antialiased; |
|
598 -moz-osx-font-smoothing: grayscale; |
|
599 font-size: 18px; |
|
600 |
|
601 &:before { |
|
602 content: '\f055'; |
|
603 display: block; |
|
604 position: absolute; |
|
605 width: 100%; |
|
606 text-align: center; |
|
607 text-indent: 0; |
|
608 color: #0091d9; |
|
609 } |
|
610 &[data-action=collapse]:before { |
|
611 content: '\f056'; |
|
612 color: #a90329; |
|
613 } |
|
614 } |
|
615 } |
|
616 &-dragel { |
|
617 position: absolute; |
|
618 pointer-events: none; |
|
619 z-index: 9999; |
|
620 |
|
621 >.dd-item .dd-handle { |
|
622 margin-top: 0; |
|
623 } |
|
624 >.dd-item >.dd-handle { |
|
625 border-left-width: 4px; |
|
626 } |
|
627 .dd-handle { |
|
628 -webkit-box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, .1); |
|
629 box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, .1); |
|
630 } |
|
631 >li.dd-item.dd3-item { |
|
632 position: relative; |
|
633 top: 10px; |
|
634 left: 10px; |
|
635 z-index: 999; |
|
636 } |
|
637 } |
|
638 } |
|
639 |
|
640 .vertical-bars { |
|
641 padding: 0; |
|
642 margin: 0; |
|
643 |
|
644 &:after { |
|
645 content: ""; |
|
646 display: block; |
|
647 height: 0; |
|
648 clear: both; |
|
649 } |
|
650 li { |
|
651 padding: 14px 0; |
|
652 width: 25%; |
|
653 display: block; |
|
654 float: left; |
|
655 text-align: center; |
|
656 |
|
657 &:first-child { |
|
658 border-left: 0; |
|
659 } |
|
660 } |
|
661 >li>.progress.vertical { |
|
662 margin: 0 auto; |
|
663 float: none; |
|
664 |
|
665 &:first-child { |
|
666 margin-left: auto; |
|
667 } |
|
668 } |
|
669 } |
|
670 |
|
671 .bar-holder { |
|
672 padding: 18px 15px; |
|
673 |
|
674 &:first-child { |
|
675 border-top: 0; |
|
676 } |
|
677 .progress { |
|
678 margin: 0; |
|
679 } |
|
680 } |
|
681 |
|
682 .pagination { |
|
683 &.pagination-alt >li >a { |
|
684 box-shadow: none; |
|
685 -webkit-box-shadow: none; |
|
686 border: 0; |
|
687 margin-left: -1px; |
|
688 } |
|
689 &.pagination-alt >li:first-child >a { |
|
690 padding-left: 0; |
|
691 } |
|
692 >li >a, |
|
693 >li >span { |
|
694 padding: 7px 12px 5px; |
|
695 box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .05); |
|
696 -webkit-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .05); |
|
697 } |
|
698 &-xs>li>a, |
|
699 &-xs>li>span { |
|
700 padding: 5px 9px 3px; |
|
701 font-size: 12px; |
|
702 } |
|
703 } |
|
704 |
|
705 .panel { |
|
706 &-purple { |
|
707 border-color: #6e587a; |
|
708 |
|
709 >.panel-heading { |
|
710 color: #fff; |
|
711 background-color: #6e587a; |
|
712 border-color: #6e587a; |
|
713 } |
|
714 } |
|
715 &-greenLight { |
|
716 border-color: #71843f; |
|
717 |
|
718 >.panel-heading { |
|
719 color: #fff; |
|
720 background-color: #71843f; |
|
721 border-color: #71843f; |
|
722 } |
|
723 } |
|
724 &-greenDark { |
|
725 border-color: #496949; |
|
726 |
|
727 >.panel-heading { |
|
728 color: #fff; |
|
729 background-color: #496949; |
|
730 border-color: #496949; |
|
731 } |
|
732 } |
|
733 &-darken { |
|
734 border-color: #333; |
|
735 |
|
736 >.panel-heading { |
|
737 color: #fff; |
|
738 background-color: #404040; |
|
739 border-color: #404040; |
|
740 } |
|
741 } |
|
742 &-pink { |
|
743 border-color: #ac5287; |
|
744 |
|
745 >.panel-heading { |
|
746 color: #fff; |
|
747 background-color: #ac5287; |
|
748 border-color: #ac5287; |
|
749 } |
|
750 } |
|
751 &-green { |
|
752 border-color: #356e35; |
|
753 |
|
754 >.panel-heading { |
|
755 color: #fff; |
|
756 background-color: #356e35; |
|
757 border-color: #356e35; |
|
758 } |
|
759 } |
|
760 &-blueLight { |
|
761 border-color: #92a2a8; |
|
762 |
|
763 >.panel-heading { |
|
764 color: #fff; |
|
765 background-color: #92a2a8; |
|
766 border-color: #92a2a8; |
|
767 } |
|
768 } |
|
769 &-pinkDark { |
|
770 border-color: #a8829f; |
|
771 |
|
772 >.panel-heading { |
|
773 color: #fff; |
|
774 background-color: #a8829f; |
|
775 border-color: #a8829f; |
|
776 } |
|
777 } |
|
778 &-redLight { |
|
779 border-color: #a65858; |
|
780 |
|
781 >.panel-heading { |
|
782 color: #fff; |
|
783 background-color: #a65858; |
|
784 border-color: #a65858; |
|
785 } |
|
786 } |
|
787 &-red { |
|
788 border-color: #a90329; |
|
789 |
|
790 >.panel-heading { |
|
791 color: #fff; |
|
792 background-color: #a90329; |
|
793 border-color: #a90329; |
|
794 } |
|
795 } |
|
796 &-teal { |
|
797 border-color: #568a89; |
|
798 |
|
799 >.panel-heading { |
|
800 color: #fff; |
|
801 background-color: #568a89; |
|
802 border-color: #568a89; |
|
803 } |
|
804 } |
|
805 &-orange { |
|
806 border-color: #c79121; |
|
807 |
|
808 >.panel-heading { |
|
809 color: #fff; |
|
810 background-color: #c79121; |
|
811 border-color: #c79121; |
|
812 } |
|
813 } |
|
814 &-blueDark { |
|
815 border-color: #4c4f53; |
|
816 |
|
817 >.panel-heading { |
|
818 color: #fff; |
|
819 background-color: #4c4f53; |
|
820 border-color: #4c4f53; |
|
821 } |
|
822 } |
|
823 &-magenta { |
|
824 border-color: #6e3671; |
|
825 |
|
826 >.panel-heading { |
|
827 color: #fff; |
|
828 background-color: #6e3671; |
|
829 border-color: #6e3671; |
|
830 } |
|
831 } |
|
832 &-blue { |
|
833 border-color: #57889c; |
|
834 |
|
835 >.panel-heading { |
|
836 color: #fff; |
|
837 background-color: #57889c; |
|
838 border-color: #57889c; |
|
839 } |
|
840 } |
|
841 &-footer >.btn-block { |
|
842 border-radius: 0; |
|
843 border-bottom: 0; |
|
844 border-left: 0; |
|
845 border-right: 0; |
|
846 } |
|
847 } |
|
848 |
|
849 .notification-body { |
|
850 padding: 0 0 0 3px; |
|
851 margin: 0; |
|
852 list-style: none; |
|
853 |
|
854 *, |
|
855 &:after *, |
|
856 &:before * { |
|
857 box-sizing: border-box!important; |
|
858 -webkit-box-sizing: border-box!important; |
|
859 -moz-box-sizing: border-box!important; |
|
860 } |
|
861 >li { |
|
862 border-bottom: 1px solid #E9E9E9; |
|
863 position: relative; |
|
864 |
|
865 >span { |
|
866 background: #fff; |
|
867 display: block; |
|
868 min-height: 25px; |
|
869 overflow: hidden; |
|
870 padding: 8px 10px 13px; |
|
871 white-space: normal; |
|
872 |
|
873 &:hover { |
|
874 background: #F0F4F7; |
|
875 color: #667F8F; |
|
876 } |
|
877 } |
|
878 a.msg { |
|
879 padding-left: 50px!important; |
|
880 } |
|
881 a, |
|
882 a span { |
|
883 display: block; |
|
884 position: relative; |
|
885 overflow: hidden; |
|
886 } |
|
887 a, |
|
888 a:hover { |
|
889 text-decoration: none; |
|
890 } |
|
891 &:hover .progress { |
|
892 background: #fff; |
|
893 box-shadow: 0 1px 0 rgba(0, 0, 0, 0), 0 0 0 1px #a7a7a7 inset; |
|
894 -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0), 0 0 0 1px #ccc inset; |
|
895 } |
|
896 &:hover .text-muted { |
|
897 color: #333; |
|
898 } |
|
899 } |
|
900 .from { |
|
901 font-size: 14px; |
|
902 line-height: normal; |
|
903 color: #333; |
|
904 font-weight: 400; |
|
905 margin-right: 60px; |
|
906 margin-bottom: 6px; |
|
907 height: 20px; |
|
908 text-overflow: ellipsis; |
|
909 white-space: nowrap; |
|
910 overflow: hidden; |
|
911 } |
|
912 .unread { |
|
913 background: #FFFFE0; |
|
914 |
|
915 .unread .from { |
|
916 font-weight: 700; |
|
917 } |
|
918 } |
|
919 time { |
|
920 position: absolute; |
|
921 top: 3px; |
|
922 right: 0; |
|
923 font-size: 11px; |
|
924 font-weight: 400; |
|
925 color: #058dc7; |
|
926 } |
|
927 .msg-body, |
|
928 .subject { |
|
929 font-size: 13px; |
|
930 color: #A0A0A0; |
|
931 max-height: 35px; |
|
932 width: 100%; |
|
933 text-overflow: ellipsis; |
|
934 white-space: nowrap; |
|
935 overflow: hidden; |
|
936 } |
|
937 .subject { |
|
938 font-size: 13px; |
|
939 color: #333; |
|
940 max-height: 22px; |
|
941 } |
|
942 } |
|
943 |
|
944 .ajax-notifications { |
|
945 height: 365px; |
|
946 display: block; |
|
947 overflow: auto; |
|
948 margin-right: -10px; |
|
949 margin-left: -10px; |
|
950 border-bottom: 1px solid #CECECE; |
|
951 border-top: 1px solid #CECECE; |
|
952 background: #E9E9E9; |
|
953 |
|
954 @media only screen and (min-width:320px) and (max-width:479px) { |
|
955 height: 250px; |
|
956 } |
|
957 >.alert.alert-transparent { |
|
958 background-color: transparent; |
|
959 border-color: transparent; |
|
960 color: #757575; |
|
961 margin: 13px 10px; |
|
962 } |
|
963 >.alert >:first-child { |
|
964 margin-bottom: 10px; |
|
965 font-weight: 400; |
|
966 } |
|
967 } |
|
968 |
|
969 .arrow-box-up { |
|
970 &:before, |
|
971 &:after { |
|
972 bottom: 100%; |
|
973 border: solid transparent; |
|
974 content: " "; |
|
975 height: 0; |
|
976 width: 0; |
|
977 position: absolute; |
|
978 pointer-events: none; |
|
979 } |
|
980 &:before { |
|
981 border-color: rgba(131, 131, 131, 0); |
|
982 border-bottom-color: #838383; |
|
983 border-width: 8px; |
|
984 left: 50%; |
|
985 margin-left: -8px; |
|
986 } |
|
987 &:after { |
|
988 border-color: rgba(255, 255, 255, 0); |
|
989 border-bottom-color: #fff; |
|
990 border-width: 7px; |
|
991 left: 50%; |
|
992 margin-left: -7px; |
|
993 } |
|
994 &-right:before, |
|
995 &-right:after { |
|
996 bottom: 100%; |
|
997 border: solid transparent; |
|
998 content: " "; |
|
999 height: 0; |
|
1000 width: 0; |
|
1001 position: absolute; |
|
1002 pointer-events: none; |
|
1003 } |
|
1004 &-right:before { |
|
1005 border-color: rgba(131, 131, 131, 0); |
|
1006 border-bottom-color: #838383; |
|
1007 border-width: 8px; |
|
1008 right: 9px; |
|
1009 margin-left: -8px; |
|
1010 } |
|
1011 &-right:after { |
|
1012 border-color: rgba(255, 255, 255, 0); |
|
1013 border-bottom-color: #fff; |
|
1014 border-width: 7px; |
|
1015 right: 10px; |
|
1016 margin-left: -7px; |
|
1017 } |
|
1018 } |
|
1019 |
|
1020 .tooltip-inner { |
|
1021 padding: 5px 10px; |
|
1022 font-size: 11px; |
|
1023 font-family: Ubuntu, Arial, Helvetica, sans-serif; |
|
1024 font-weight: 700; |
|
1025 border-radius: 0; |
|
1026 } |
|
1027 .jqstooltip { |
|
1028 padding: 7px!important; |
|
1029 border-radius: 3px!important; |
|
1030 border: 0!important; |
|
1031 background-color: #000!important; |
|
1032 box-sizing: content-box; |
|
1033 -moz-box-sizing: content-box; |
|
1034 -webkit-box-sizing: content-box; |
|
1035 |
|
1036 .jqsfield { |
|
1037 font-family: Ubuntu, Arial, sans-serif; |
|
1038 font-size: 11px; |
|
1039 } |
|
1040 } |
|
1041 |
|
1042 .dd3 { |
|
1043 &-content { |
|
1044 display: block; |
|
1045 margin: 5px 0; |
|
1046 padding: 6px 10px 8px 40px; |
|
1047 font-size: 15px; |
|
1048 color: #333; |
|
1049 text-decoration: none; |
|
1050 border: 1px solid #cfcfcf; |
|
1051 background: #fbfbfb; |
|
1052 |
|
1053 &:hover { |
|
1054 color: #2ea8e5; |
|
1055 background: #fff; |
|
1056 } |
|
1057 .dd-dragel >.dd3-item >& { |
|
1058 margin: 0; |
|
1059 } |
|
1060 } |
|
1061 &-item >button { |
|
1062 margin-left: 38px; |
|
1063 } |
|
1064 &-handle { |
|
1065 position: absolute; |
|
1066 margin: 0; |
|
1067 left: 0; |
|
1068 top: 0; |
|
1069 cursor: move; |
|
1070 width: 30px; |
|
1071 text-indent: 100%; |
|
1072 white-space: nowrap; |
|
1073 overflow: hidden; |
|
1074 border: 1px solid #aaa; |
|
1075 background: #bfbfbf; |
|
1076 background: -webkit-linear-gradient(top, #ddd 0, #bbb 100%); |
|
1077 background: -webkit-gradient(linear, top left, bottom left, from(#ddd), to(#bbb)); |
|
1078 background: -webkit-linear-gradient(top, #ddd 0, #bbb 100%); |
|
1079 background: linear-gradient(top, #ddd 0, #bbb 100%); |
|
1080 display: inline-block; |
|
1081 font-family: FontAwesome; |
|
1082 font-style: normal; |
|
1083 font-weight: 400; |
|
1084 line-height: 1; |
|
1085 -webkit-font-smoothing: antialiased; |
|
1086 -moz-osx-font-smoothing: grayscale; |
|
1087 font-size: 18px; |
|
1088 padding: 8px 15px; |
|
1089 |
|
1090 &:before { |
|
1091 content: '\f0c9'; |
|
1092 display: block; |
|
1093 position: absolute; |
|
1094 left: 0; |
|
1095 top: 3px; |
|
1096 width: 100%; |
|
1097 text-align: center; |
|
1098 text-indent: 0; |
|
1099 color: #818181; |
|
1100 font-weight: 400; |
|
1101 line-height: 28px; |
|
1102 } |
|
1103 &:hover:before { |
|
1104 color: #C27616; |
|
1105 } |
|
1106 } |
|
1107 } |
|
1108 |
|
1109 |
|
1110 /* |
|
1111 * Nestable lists |
|
1112 */ |
|
1113 |
|
1114 .nestable-lists { |
|
1115 display: block; |
|
1116 clear: both; |
|
1117 padding: 30px 0; |
|
1118 width: 100%; |
|
1119 border: 0; |
|
1120 border-top: 2px solid #bfbfbf; |
|
1121 border-bottom: 2px solid #bfbfbf; |
|
1122 } |
|
1123 #nestable-menu { |
|
1124 padding: 0; |
|
1125 margin: 10px 0 20px; |
|
1126 } |
|
1127 |
|
1128 #nestable-output, |
|
1129 #nestable2-output { |
|
1130 width: 100%; |
|
1131 padding: 5px; |
|
1132 } |
|
1133 |
|
1134 |
|
1135 /* |
|
1136 * Custom items |
|
1137 */ |
|
1138 |
|
1139 .custom-scroll { |
|
1140 |
|
1141 &::-webkit-scrollbar { |
|
1142 -webkit-overflow-scrolling: touch; |
|
1143 height: 10px; |
|
1144 width: 10px; |
|
1145 |
|
1146 &:hover { |
|
1147 background-color: #E9E9E9; |
|
1148 border: 1px solid #dbdbdb; |
|
1149 } |
|
1150 &-button:start:decrement, |
|
1151 &-button:end:increment { |
|
1152 background: 0 0; |
|
1153 display: block; |
|
1154 height: 0; |
|
1155 } |
|
1156 &-track { |
|
1157 -webkit-background-clip: padding-box; |
|
1158 background-clip: padding-box; |
|
1159 border: solid transparent; |
|
1160 |
|
1161 &-piece { |
|
1162 -o-border-radius: 0; |
|
1163 background-color: transparent; |
|
1164 border-radius: 0; |
|
1165 } |
|
1166 } |
|
1167 &-thumb { |
|
1168 -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset 0 -1px 0 rgba(0, 0, 0, .07); |
|
1169 -webkit-background-clip: padding-box; |
|
1170 background-clip: padding-box; |
|
1171 background-color: rgba(0, 0, 0, .2); |
|
1172 border: 0; |
|
1173 box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset 0 -1px 0 rgba(0, 0, 0, .07); |
|
1174 |
|
1175 &:vertical, |
|
1176 &:horizontal { |
|
1177 -o-border-radius: 0; |
|
1178 background-color: #bfbfbf; |
|
1179 border-radius: 0; |
|
1180 } |
|
1181 &:active { |
|
1182 -webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, .33); |
|
1183 background-color: rgba(0, 0, 0, .44); |
|
1184 box-shadow: inset 1px 1px 3px rgba(0, 0, 0, .33); |
|
1185 } |
|
1186 &:hover { |
|
1187 background-color: #959595; |
|
1188 } |
|
1189 } |
|
1190 } |
|
1191 } |
|
1192 |
|
1193 .air { |
|
1194 position: absolute; |
|
1195 z-index: 5; |
|
1196 |
|
1197 &-bottom { |
|
1198 bottom: 0; |
|
1199 } |
|
1200 &-top { |
|
1201 top: 0; |
|
1202 |
|
1203 &-right { |
|
1204 top: 0; |
|
1205 right: 0; |
|
1206 } |
|
1207 &-left { |
|
1208 top: 0; |
|
1209 left: 0; |
|
1210 } |
|
1211 } |
|
1212 &-bottom { |
|
1213 &-left { |
|
1214 bottom: 0; |
|
1215 left: 0; |
|
1216 } |
|
1217 &-right { |
|
1218 bottom: 0; |
|
1219 right: 0; |
|
1220 } |
|
1221 } |
|
1222 } |
|
1223 |
|
1224 .tree { |
|
1225 min-height: 20px; |
|
1226 border-radius: 4px; |
|
1227 |
|
1228 li { |
|
1229 list-style-type: none; |
|
1230 margin: 0; |
|
1231 padding: 5px; |
|
1232 position: relative; |
|
1233 |
|
1234 &:after, |
|
1235 &:before { |
|
1236 content: ''; |
|
1237 left: -20px; |
|
1238 position: absolute; |
|
1239 right: auto; |
|
1240 } |
|
1241 &:before { |
|
1242 border-left: 1px solid #999; |
|
1243 bottom: 50px; |
|
1244 height: 100%; |
|
1245 top: -11px; |
|
1246 width: 1px; |
|
1247 -webkit-transition: "border-color 0.1s ease 0.1s"; |
|
1248 transition: "border-color 0.1s ease 0.1s"; |
|
1249 } |
|
1250 &:last-child::before { |
|
1251 height: 30px; |
|
1252 } |
|
1253 &:after { |
|
1254 border-top: 1px solid #999; |
|
1255 height: 20px; |
|
1256 top: 18px; |
|
1257 width: 25px; |
|
1258 } |
|
1259 span { |
|
1260 border: 1px dotted #999; |
|
1261 border-radius: 5px; |
|
1262 display: inline-block; |
|
1263 padding: 3px 8px; |
|
1264 text-decoration: none; |
|
1265 -webkit-transition: color .2s ease .1s, background-color .2s ease .1s, border-color .3s ease .2s; |
|
1266 transition: color .2s ease .1s, background-color .2s ease .1s, border-color .3s ease .2s; |
|
1267 } |
|
1268 &.parent_li >span { |
|
1269 cursor: pointer; |
|
1270 padding: 7px; |
|
1271 |
|
1272 &:hover { |
|
1273 background-color: #DF8505; |
|
1274 border: 1px solid #C67605; |
|
1275 color: #fff; |
|
1276 |
|
1277 + ul li { |
|
1278 &::before { |
|
1279 border-left-color: #F89406; |
|
1280 } |
|
1281 &::after { |
|
1282 border-top-color: #F89406; |
|
1283 } |
|
1284 span { |
|
1285 background: #FDDFB3!important; |
|
1286 border: 1px solid #FAA937; |
|
1287 color: #000; |
|
1288 } |
|
1289 } |
|
1290 } |
|
1291 &:hover, |
|
1292 &:hover + ul li span { |
|
1293 background: #eee; |
|
1294 border: 1px solid #94a0b4; |
|
1295 color: #000; |
|
1296 } |
|
1297 } |
|
1298 } |
|
1299 ul { |
|
1300 ul { |
|
1301 padding-left: 34px; |
|
1302 padding-top: 10px; |
|
1303 |
|
1304 li:hover { |
|
1305 background: rgba(0, 0, 0, .015); |
|
1306 } |
|
1307 } |
|
1308 } |
|
1309 >ul { |
|
1310 padding-left: 0; |
|
1311 |
|
1312 >li { |
|
1313 :after, |
|
1314 :before { |
|
1315 border: 0; |
|
1316 } |
|
1317 } |
|
1318 } |
|
1319 } |
|
1320 |
|
1321 .pace { |
|
1322 -webkit-pointer-events: none; |
|
1323 pointer-events: none; |
|
1324 -webkit-user-select: none; |
|
1325 -moz-user-select: none; |
|
1326 -ms-user-select: none; |
|
1327 user-select: none; |
|
1328 |
|
1329 &-inactive { |
|
1330 display: none; |
|
1331 } |
|
1332 .pace-progress { |
|
1333 background: #3276b1; |
|
1334 position: fixed; |
|
1335 z-index: 2000; |
|
1336 top: 0; |
|
1337 left: 0; |
|
1338 height: 2px; |
|
1339 -webkit-transition: width 1s; |
|
1340 transition: width 1s; |
|
1341 |
|
1342 &-inner { |
|
1343 display: block; |
|
1344 position: absolute; |
|
1345 right: 0; |
|
1346 width: 100px; |
|
1347 height: 100%; |
|
1348 -webkit-box-shadow: 0 0 10px #29d, 0 0 5px #29d; |
|
1349 box-shadow: 0 0 10px #29d, 0 0 5px #29d; |
|
1350 opacity: 1; |
|
1351 -webkit-transform: rotate(3deg) translate(0, -4px); |
|
1352 -ms-transform: rotate(3deg) translate(0, -4px); |
|
1353 transform: rotate(3deg) translate(0, -4px); |
|
1354 } |
|
1355 } |
|
1356 .pace-activity { |
|
1357 display: block; |
|
1358 position: fixed; |
|
1359 z-index: 2000; |
|
1360 top: 63px; |
|
1361 right: 40px; |
|
1362 width: 14px; |
|
1363 height: 14px; |
|
1364 border: solid 2px transparent; |
|
1365 border-top-color: #29d; |
|
1366 border-left-color: #29d; |
|
1367 border-radius: 10px; |
|
1368 -webkit-animation: pace-spinner 400ms linear infinite; |
|
1369 -ms-animation: pace-spinner 400ms linear infinite; |
|
1370 animation: pace-spinner 400ms linear infinite; |
|
1371 } |
|
1372 } |
|
1373 |