Issues:
1/* Widgets layout =========================================================== */
2
3.widget {
4 background:#FFF;
5 margin-bottom:10px;
6}
7
8.widget_ajax_wrap:last-child .widget:last-child {
9 margin-bottom: 0;
10}
11.widget_ajax_wrap {
12 position: relative;
13 box-sizing: border-box;
14}
15.widget > .title{
16 padding:0 15px;
17 height:47px;
18 line-height:47px;
19 background: #34495E;
20 font-weight: bold;
21 font-size:18px;
22 color:#FFF;
23 margin: 0;
24}
25
26.widget > .title .links {
27 float:right;
28
font-size:13px;
29}
30
31.widget > .title .links a{
32 padding: 2px 8px;
33 background: #27ae60;
34 color:#fff;
35
font-size: 12px;
36 font-weight: normal;
37 text-decoration: none;
38 margin-top:-2px;
39}
40
41.widget > .title .links a:hover{
42 background:#2ecc71;
43}
44
45.widget > .body{
46 padding:15px;
47 line-height: 20px;
48}
49
50.widget_text_block{
51 overflow: hidden;
52}
53
54aside .widget {
55 background: #FFF;
56}
57
58aside .widget > .title {
59
font-size:12px;
60 color:#FFF;
61 background: #34495E;
62 height:38px;
63 line-height:38px;
64 padding-right:5px;
65}
66
67
68/* Tabbed Widgets layout ==================================================== */
69
70.widget_tabbed {
71 margin-bottom:10px;
72 background:#FFF;
73}
74
75.widget_tabbed .tabs ul,
76.widget_tabbed .tabs ul li{
77 margin: 0; padding: 0; list-style: none;
78}
79
80.widget_tabbed .tabs ul {
81 overflow:hidden;
82 height:47px;
83 line-height:47px;
84 background: #34495E;
85}
86
87.widget_tabbed .tabs ul li {
88 float:left;
89 height:45px;
90 line-height:45px;
91}
92
93.widget_tabbed .tabs ul li a {
94 display:block;
95 height:47px;
96 line-height:47px;
97
font-size:14px;
98 padding:0 15px;
99 cursor: pointer;
100 color:#FFF;
101}
102
103.widget_tabbed .tabs ul li a.active {
104 background-color:#FFF;
105 color:#34495E;
106}
107
108.widget_tabbed .body {
109 padding:15px;
110 line-height: 20px;
111}
112
113.widget_tabbed > .tabs .links {
114 float:right;
115
font-size:13px;
116 padding-right:15px;
117}
118
119.widget_tabbed > .tabs .links a {
120 display:inline;
121 padding: 3px 8px;
122 background: #27ae60;
123 color:#fff;
124
font-size: 12px;
125 font-weight: normal;
126 text-decoration: none;
127 margin: 0 5px 0 0;
128}
129.widget_tabbed > .tabs .links a:last-child {
130 margin-right: 0;
131}
132
133.widget_tabbed > .tabs .links a:hover {
134 background:#2ecc71;
135}
136
137aside .widget_tabbed .tabs ul {
138 height:38px;
139 line-height:38px;
140}
141
142aside .widget_tabbed .tabs ul li.links{
143 height:25px;
144 line-height:25px;
145 padding-right:5px;
146}
147
148aside .widget_tabbed .tabs ul li a {
149
font-size:12px;
150 height:38px;
151 line-height:38px;
152 font-weight: bold;
153}
154
155aside .widget_tabbed .tabs ul li a.active {}
156
157aside .widget_tabbed .body {
158}
159
160aside .widget_tabbed > .tabs .links a {
161 background: #27ae60;
162 color:#fff;
163
font-size: 10px;
164}
165
166/* Widgets styles =========================================================== */
167
168.widget_content_list { overflow: hidden; }
169
170.columns-2 .widget_content_list .item { float:left; width:47%; }
171.columns-2 .widget_content_list .item:nth-child(3) { clear:left; }
172.columns-3 .widget_content_list .item { float:left; width:31%; }
173.columns-3 .widget_content_list .item:nth-child(4) { clear:left; }
174.columns-4 .widget_content_list .item { float:left; width:22%; }
175.columns-4 .widget_content_list .item:nth-child(5) { clear:left; }
176
177.widget_content_list .item { margin-bottom: 10px; overflow: hidden; }
178.widget_content_list .item:last-child { margin-bottom: 0; }
179
180.widget_content_list .item .image { float:left; margin-right: 10px; }
181.widget_content_list .item .image img { display: block; }
182.widget_content_list .item .info { }
183
184.widget_content_list .item .title{ font-size:16px; margin-bottom: 3px; }
185.widget_content_list .details {
font-size:11px; color:#999; }
186.widget_content_list .details a{ color:#BDC3C7; }
187.widget_content_list .details a:hover{ color:#d35400; }
188
189.widget_content_list .details span {padding-right: 5px;}
190.widget_content_list .details span.comments {
191 padding-left:20px;
192 background: url("../images/icons/comment-small.png") no-repeat left center;
193}
194
195.widget_content_list.featured .item .title {
font-size:14px; }
196.widget_content_list.featured .item-first { float:left; margin-right:15px; width:33%; }
197.widget_content_list.featured .item-first .image { margin-bottom: 5px; clear:both; width:100%; height:150px; }
198.widget_content_list.featured .item-first .image a, .widget_content_list.featured .item-first .image > div { display:block; width:100%; height:100%; background-position: center; background-repeat: no-repeat; background-color:#bdc3c7; background-size: cover; }
199.widget_content_list.featured .item-first .title { font-size:21px; margin-top:5px; line-height: 24px;}
200.widget_content_list.featured .item-first .title a { color:#000; text-decoration: none; }
201.widget_content_list.featured .item-first .read-more a {
202 display:inline-block;
203 clear:both;
204 background: #2980b9;
205 color:#FFF;
206 text-decoration: none;
207 padding:5px 10px;
208 margin-top: 10px;
209}
210
211.widget_content_list.featured .item-first .read-more a:hover { background:#3498db; }
212.widget_content_list.tiles-big { margin-right: -15px; }
213.widget_content_list.tiles-big .item .title {
font-size:14px; }
214.widget_content_list.tiles-big .item { float: left; margin-bottom: 15px; width: calc(25% - 15px); margin-right: 15px; box-sizing: border-box; }
215.widget_content_list.tiles-big .item:nth-child(5),
216.widget_content_list.tiles-big .item:nth-child(9),
217.widget_content_list.tiles-big .item:nth-child(13),
218.widget_content_list.tiles-big .item:nth-child(17),
219.widget_content_list.tiles-big .item:nth-child(21),
220.widget_content_list.tiles-big .item:nth-child(25) { clear:left; }
221.widget_content_list.tiles-big .item .image { margin-bottom: 5px; clear:both; width:100%; height:100px; }
222.widget_content_list.tiles-big .item .image a, .widget_content_list.tiles-big .item .image > div { display:block; width:100%; height:100%; background-position: center; background-repeat: no-repeat; background-color:#bdc3c7; background-size: cover; }
223.widget_content_list.tiles-big .item .title {
font-size:14px; margin-top:5px; }
224.widget_content_list.tiles-big .item .title a { color:#000; text-decoration: none; }
225.widget_content_list.tiles-big .item .title a:hover { color:#34495e; text-decoration: underline; }
226
227.widget_content_list.tiles-small .item { margin:0; margin-right: 4px; margin-bottom: 4px; float:left; }
228.widget_content_list.tiles-small .item .image { margin:0; }
229
230.widget_content_list.compact .item { margin-bottom: 5px; }
231.widget_content_list.compact .item:last-child { margin-bottom: 0; }
232.widget_content_list.compact .item .title {
font-size:13px; margin-bottom: 0; line-height: 15px; }
233
234@media screen and (max-width: 480px) {
235 .widget_content_list .item, .widget_content_list.featured .item-first {
236 width: 100% !important;
237 }
238}
239
240/* ========================================================================== */
241
242.widget_content_slider { overflow: hidden; position: relative;}
243.widget_content_slider .slide {
244 overflow: hidden;
245 position: relative;
246 width: 100%;
247}
248.widget_content_slider > table {
249 width: 100%;
250 border-collapse: collapse;
251 border-spacing: 0;
252}
253.widget_content_slider > table td,
254.widget_content_slider > table th {
255 padding: 0;
256}
257.widget_content_slider .slide img {
258 display: none;
259 left: 0;
260 position: absolute;
261 top: 0;
262 width: 100%;
263 z-index: 1;
264}
265.widget_content_slider .slide img:first-child, .widget_content_slider img {
266 display:block;
267}
268.widget_content_slider .slide .heading {
269 background: rgba(0, 0, 0, 0.85);
270 display: block;
271 padding: 10px;
272 right: 0;
273 position:absolute;
274 left:0;
275 bottom:0;
276 z-index:2
277}
278
279.widget_content_slider .slide .heading h2,
280.widget_content_slider .slide .heading .teaser{
281 display: inline-block;
282 margin:0;
283 color:#ecf0f1;
284}
285
286.widget_content_slider .slide .heading h2 {
287
font-size:14px;
288 font-weight: bold;
289 color:#f1c40f;
290}
291
292.widget_content_slider .slide .heading .teaser{
293
font-size:12px;
294}
295
296.widget_content_slider .slide .heading .teaser .date{
297 color: #7f8c8d;
298 padding-left: 10px;
299}
300
301.widget_content_slider .items {
302 background:#ecf0f1;
303 position: relative;
304 z-index: 2;
305}
306
307.widget_content_slider .items .item {
308 overflow: hidden;
309 padding:10px;
310
font-size:12px;
311 line-height:15px;
312 cursor:pointer;
313 position:relative;
314}
315
316.widget_content_slider .items .item:hover {
317 background:#bdc3c7;
318}
319
320.widget_content_slider .items .item .title {
321 display:block;
322 vertical-align:middle;
323 color:#000;
324}
325
326.widget_content_slider .items .item.active {
327 background:#27ae60;
328}
329
330.widget_content_slider .items .item.active .title {
331 color:#FFF;
332}
333@media (max-width: 767px) {
334 .widget_content_slider .items .item .title {
335 display:none;
336 }
337}
338@media (min-width: 768px) {
339 .widget_content_slider .slide {
340 width: 70%;
341 }
342 .widget_content_slider .items {
343 width: 30%;
344 }
345 .widget_content_slider .items .item .image {
346 float:left; margin-right: 10px;
347 }
348}
349
350@media (min-width: 992px) and (max-width: 1199px) {
351 .widget_content_slider .items .item {
352 padding: 8px;
353 }
354}
355
356/* ========================================================================== */
357
358.widget_activity_list { overflow: hidden; }
359
360.widget_activity_list h4 { margin:0; margin-bottom: 5px; }
361
362.widget_activity_list .item { margin-bottom: 10px; overflow: hidden; }
363.widget_activity_list .item:last-child { margin-bottom: 0; }
364
365.widget_activity_list .item > .image { float:left; margin-right: 10px; padding:2px; border:solid 1px #B3C2C9; }
366.widget_activity_list .item > .image img { display: block; }
367.widget_activity_list .item .info { line-height:17px; padding-top:2px; }
368
369.widget_activity_list .item .title{ }
370.widget_activity_list .item .title a.author{ color:#376499; }
371.widget_activity_list .item .title a.author:hover{ color:#d35400; }
372
373.widget_activity_list .item .details {
font-size:11px; }
374.widget_activity_list .item .details .date { color:#999; }
375.widget_activity_list .item .details .reply {
376 padding-left: 5px;
377}
378.widget_activity_list .item .details .reply a {
379 padding-left: 20px;
380 background:url("../images/icons/comment-small.png") no-repeat left center;
381 color:#BDC3C7;
382}
383
384.widget_activity_list .item .details .reply a:hover {
385 color:#d35400;
386}
387
388.widget_activity_list .item .images { overflow: hidden; margin:10px 0; padding-left:48px; }
389.widget_activity_list .item .images .image {
390 float:left; margin-right:2px;
391 display:block; overflow: hidden;
392}
393.widget_activity_list .item .images .image.more {
394 background: #ecf0f1;
395 text-align: center;
396 line-height: 64px;
397 font-size:18px;
398}
399.widget_activity_list .item .images .image.more a {
400 display:block; width: 64px; height:64px; overflow: hidden;
401 color:#7f8c8d;
402 text-decoration: none;
403}
404.widget_activity_list .item .images .image.more a:hover {
405 color:#2c3e50;
406}
407.widget_activity_list .item .images .image.more a span{
408}
409
410.widget_activity_list .item .actions {
411 float:right;
412 visibility: hidden;
413}
414
415.widget_activity_list .item:hover .actions {
416 visibility: visible;
417}
418
419.widget_activity_list .actions .delete{
420 display:inline-block;
421 width:16px;
422 height:16px;
423 background:url("../images/icons/delete.png") no-repeat center;
424}
425/* ========================================================================== */
426
427.widget_comments_list { overflow: hidden; line-height: 20px; }
428
429.widget_comments_list .item { margin-bottom: 15px; overflow: hidden; }
430.widget_comments_list .item:last-child { margin-bottom: 0; }
431
432.widget_comments_list .item .image { float:left; margin-right: 10px; padding:2px; border:solid 1px #B3C2C9; }
433.widget_comments_list .item .image img { display: block; }
434.widget_comments_list .item .info { line-height:17px; padding-top:2px; }
435
436.widget_comments_list .item .title{ }
437.widget_comments_list .item .title a.author{ color:#376499; }
438.widget_comments_list .item .title a.author:hover{ color:#d35400; }
439
440.widget_comments_list .item .title a.subject{ padding-right: 5px; }
441
442.widget_comments_list .item .date {
font-size:11px; color:#999; padding-right: 5px; }
443.widget_comments_list .item .text { color:#666; }
444
445/* ========================================================================== */
446
447.widget_profiles_list { overflow: hidden; }
448
449.columns-2 .widget_profiles_list .item { float:left; width:50%; }
450.columns-2 .widget_profiles_list .item:nth-child(3) { clear:left; }
451.columns-3 .widget_profiles_list .item { float:left; width:33%; }
452.columns-3 .widget_profiles_list .item:nth-child(4) { clear:left; }
453.columns-4 .widget_profiles_list .item { float:left; width:25%; }
454.columns-4 .widget_profiles_list .item:nth-child(5) { clear:left; }
455
456.columns-2 .widget_profiles_list.list .item,
457.columns-3 .widget_profiles_list.list .item,
458.columns-4 .widget_profiles_list.list .item{
459 padding-right:10px;
460}
461
462.widget_profiles_list.list .item {
463 line-height:32px;
464 margin-bottom: 5px;
465 padding: 0 0 10px 0;
466 clear: both;
467 width: 100%;
468 box-sizing: border-box;
469 overflow: hidden;
470}
471
472.widget_profiles_list.list .item:last-child { margin-bottom: 0; }
473
474.widget_profiles_list.list .item .image { float:left; margin-right: 10px; }
475.widget_profiles_list .item .image img, .item-avatar > img { display: block; }
476.widget_profiles_list.list .item .info { float:left; }
477
478.widget_profiles_list.tiles .item, .widget_online_list .item, .widget_user_avatar .default_avatar { display:inline-block; }
479
480.widget_profiles_list.list .item:last-child {
481 padding: 0;
482}
483.widget_profiles_list.list .item .field {
484 line-height: 18px;
485}
486
487/* ========================================================================== */
488
489.widget_online_list { overflow: hidden; }
490
491.widget_online_list .item-name {
492 padding-left:18px;
493 padding-right:2px;
494 background:url("../images/icons/user.png") no-repeat left center;
495
496}
497
498/* ========================================================================== */
499
500.widget_content_tree ul{
501 margin:0;
502 padding:0;
503}
504
505.widget_content_tree li{
506 margin-left: 0px;
507 list-style: none;
508 padding-left:20px;
509 background: url("../images/icons/folder.png") no-repeat left 1px;
510}
511.folder_hidden { display: none; }
512.widget_content_tree ul li.active > a:hover,
513.widget_content_tree ul li.active > a { color:#000; text-decoration: none; }
514
515/* ========================================================================== */
516
517.widget_user_avatar .user_info {
518 overflow: hidden;
519 clear:both;
520 margin:-15px;
521 padding:6px;
522 margin-bottom: 10px;
523 background:#34495E;
524}
525
526.widget_user_avatar .user_info .avatar{
527 float:right;
528}
529
530.widget_user_avatar .user_info .name {
531 height:32px;
532 line-height: 32px;
533 padding-left:10px;
534}
535
536.widget_user_avatar .user_info .name a {
537 color:#FFF;
538 text-decoration: none;
539
font-size:12px;
540 font-weight: bold;
541}
542.widget_user_avatar {
543 position: relative;
544}
545header .widget_user_avatar {
546 margin-right: -14px;
547}
548header .widget_user_avatar .user_info {
549 float: right;
550 clear: none;
551 margin: 0;
552 background: none;
553 line-height: 50px;
554 height: 50px;
555 padding: 9px 34px 9px 5px;
556 box-sizing: border-box;
557 transition: background 0.5s;
558 position: relative;
559}
560header .widget_user_avatar .user_info:after {
561 content: '';
562 background: url(../images/nav-arrow-down-white.png) no-repeat center center;
563 width: 16px;
564 height: 32px;
565 position: absolute;
566 right: 10px;
567 opacity: 0.5;
568 transition: opacity 0.5s;
569}
570header .widget_user_avatar:hover .user_info:after{ opacity: 1; }
571header .widget_user_avatar:hover .user_info {
572 background: #224674;
573}
574header .widget_user_avatar .user_info .avatar{
575 border-radius: 50%;
576 overflow: hidden;
577 height: 32px;
578}
579header .widget_user_avatar .user_info .name {
580 float: left;
581 margin-right: 10px;
582}
583header .widget_user_avatar .menu {
584 visibility: hidden;
585 float: none;
586 position: absolute;
587 top: 50px;
588 right: 0;
589 height: auto;
590 background: #224674;
591 width: 180px;
592 padding: 0;
593 box-shadow: -2px 2px 10px #224674;
594 opacity: 0.99;
595 transition: visibility 0.2s;
596 z-index: 102;
597}
598header .widget_user_avatar:hover .user_info + .menu {
599 visibility: visible;
600}
601header .widget_user_avatar .menu > li {
602 float: none;
603}
604header .widget_user_avatar .menu > li:hover, header .widget_user_avatar .menu ul li a:hover {
605 background-color: #1c549c;
606}
607header .widget_user_avatar .menu ul {
608 left: auto;
609 right: 160px;
610 top: 0;
611 box-shadow: none;
612 border-radius: 0;
613 box-shadow: -2px 2px 10px #224674;
614}
615header .widget_user_avatar .menu ul li, header .widget_user_avatar .menu ul li a {
616 border-radius: 0;
617}
618/* ========================================================================== */
619
620.widget_tags_cloud .tags_as_list,
621.widget_tags_cloud .tags_as_list li,
622.widget_tags_cloud .tags_as_cloud,
623.widget_tags_cloud .tags_as_cloud li {
624 margin:0; padding:0;
625 list-style:none;
626}
627
628.widget_tags_cloud .tags_as_cloud {
629 overflow: hidden;
630}
631
632.widget_tags_cloud .tags_as_cloud li {
633 float:left;
634 margin:0 8px 8px 0;
635}
636
637.widget_tags_cloud .tags_as_list li {
638 margin:0 0 6px 0;
639 padding-left:20px;
640 background: url("../images/icons/tag.png") no-repeat left center;
641}
642
643.widget_tags_cloud .tags_as_list li .counter {
644
font-size:11px;
645}
646.widget_tags_cloud li.colored > a {
647 color: inherit;
648}
649/* ========================================================================== */
650
651.widget_auth .field { overflow: hidden; }
652.widget_auth .field a { float:right;
font-size:12px; margin-top:4px; }
653.widget_auth .field label { float:left; }
654.widget_auth .buttons { margin-top:15px; }
655
656@media screen and (max-width: 640px) {
657 .widget_content_slider .items .item .title { display:none !important; }
658 .widget_content_slider .items { width:60px !important; }
659 .widget_content_list.featured .item-first { float:none; margin-right:0; width:100%; }
660}
661
662/* ========================================================================== */
663
664.widget_search { background-color:#34495E; margin:-15px; padding:10px; }
665
666.widget_search .input {
667 border:none; box-shadow: none;
668 padding-left:24px;
669 background:url("../images/icons/search-glyph.png") no-repeat 4px center #FFF;
670
font-size:12px;
671}
672
673/* ========================================================================== */
674
675.widget_content_filter .title{
676 font-weight: bold;
677 color:#34495e;
678 margin-bottom:4px;
679}
680
681.widget_content_filter .field {
682 margin-bottom: 10px;
683}
684
685.widget_content_filter .input {
686 width:95%;
687}
688
689.widget_content_filter .ft_date .value,
690.widget_content_filter .ft_number .value {
691
font-size:12px;
692}
693
694.widget_content_filter .ft_date button{
695 display:none;
696}
697
698.widget_content_filter .date-input,
699.widget_content_filter .input-small{
700 width:60px !important;
701}
702
703.widget_content_filter .buttons {
704 margin-top:20px;
705
font-size:12px;
706}
707
708.widget_content_filter .buttons input {
709 margin-right: 10px;
710}
711section .widget.fixed_actions_menu {
712 position: absolute;
713 right: 0;
714 z-index: 1;
715 top: 0;
716 box-shadow: -4px 4px 5px #CCC;
717 background: #a7b4b7;
718}
719section .widget.fixed_actions_menu:before {
720 content: '';
721 width: 32px;
722 background:url("../images/icons/menu.png") no-repeat center center;
723 height: 32px;
724 position: absolute;
725 top: 0;
726 right: 0;
727 cursor: pointer;
728}
729section .widget.fixed_actions_menu:hover .body, section .widget.fixed_actions_menu.clicked .body {
730 display: block;
731}
732section .widget.fixed_actions_menu .body {
733 display: none;
734 margin: 32px 0 0 0;
735 padding: 0;
736}