Issues:
1/* Global =================================================================== */
2
3html, body{
4 width: 100%;
5 height: 100%;
6}
7
8body {
9 background:
url("../images/bg.png");
10 margin:0;
11 padding:0;
12}
13
14/* Wrapper ================================================================== */
15
16#layout{
17 width: 980px;
18 margin: 0 auto;
19 will-change: blur;
20}
21#popup-manager.popup-show + #layout, .wrap_blur {
22
-webkit-filter:blur(2px);
23
-moz-filter:blur(2px);
24
-ms-filter:blur(2px);
25
-o-filter:blur(2px);
26
filter:blur(2px);
27}
28/* Header =================================================================== */
29
30#layout header{
31 height: 50px;
32 line-height: 50px;
33 padding: 0 14px;
34 background:url("../images/bg_top.png") no-repeat center;
35}
36
37#layout header #logo a, #layout header #logo > span{
38 display: block;
39 float: left;
40 width: 180px;
41 height: 50px;
42 background: url("../images/logo.png") no-repeat left center;
43}
44
45/* Header Navigation ======================================================== */
46
47header .menu,
48header .menu li { margin:0; padding:0; list-style: none; background:none; }
49
50header .menu {
51 float:right;
52 position: relative;
53 z-index: 15;
54 height: 30px;
55 line-height: 30px;
56 padding-top:10px;
57}
58
59header .menu .item{
60 background-image: url("../images/icons/bullet_arrow_down.png");
61 background-repeat: no-repeat;
62 background-position: 5px center;
63 padding-left:28px;
64}
65
66header .menu > li {
67 float: left;
68 padding-left:5px;
69}
70
71header .menu > li > a {
72 display: block;
73 padding: 0 5px;
74 color:#ecf0f1;
75 text-decoration: none;
76
font-size: 12px;
77}
78header .menu > li > a span.wrap > span.counter {
79 margin: 0 0 0 5px;
80}
81header .menu > li > a span.wrap > span.counter:before {
82 content: '(';
83}
84header .menu > li > a span.wrap > span.counter:after {
85 content: ')';
86}
87header .menu > li > a:hover {
88 color:#FFF;
89}
90
91header .menu > li.active > a { color:#F5CF53; }
92header .menu > li.active > a:hover { color:#F5CF53; }
93header .menu > li.active > ul a:hover { color:#EEE; }
94
95header .menu ul li a,
96header .menu li.active ul li a {
97 text-shadow: none;
98 text-decoration: none;
99 padding-right: 10px;
100
font-size: 12px;
101}
102
103header .menu li ul li.active a{ color:#F5CF53; }
104header .menu li ul li.active a:hover { color:#F5CF53; }
105
106header .menu li:hover {
107 position: relative;
108 z-index: 599;
109 cursor: default;
110}
111
112header .menu ul {
113 visibility: hidden;
114 position: absolute;
115 top: 99%;
116 left: -15px;
117 z-index: 598;
118 width: 100%;
119 box-shadow: 0 1px 1px #000;
120 border-bottom-left-radius: 6px;
121 border-bottom-right-radius: 6px;
122}
123
124header .menu ul li {
125 float: none;
126 border-bottom: solid 1px #224674;
127 background-color: #224674;
128 color: #FFF;
129}
130
131header .menu ul li:last-child {
132 border-bottom: none;
133}
134
135header .menu ul li a {
136 display: block;
137 height:30px;
138 line-height:30px;
139 color:#A3CAE0;
140}
141
142header .menu ul li:hover > a { background-color: #224674; color: #FFF; }
143
144header .menu ul ul {
145 top: 0px;
146 left: 90%;
147}
148
149header .menu li:hover > ul {
150 visibility: visible;
151}
152
153header .menu ul { width:250px; }
154
155header .menu ul li:last-child,
156header .menu ul li:last-child a {
157 border-bottom-left-radius: 6px;
158 border-bottom-right-radius: 6px;
159}
160
161header .menu ul li:first-child,
162header .menu ul li:first-child a {
163 border-top-left-radius: 6px;
164 border-top-right-radius: 6px;
165}
166
167header .menu > .folder a {
168 padding-right: 8px;
169}
170
171/* Main Navigation =========================================================== */
172
173nav {
174 height:50px;
175 background: #34495e;
176 padding: 0;
177 margin-bottom: 10px;
178
font-size:12px;
179}
180
181nav .menu,
182nav .menu li,
183nav .menu ul {
184 list-style: none;
185 margin: 0;
186 padding: 0;
187}
188
189nav .menu {
190 position: relative; z-index: 5; float: left;
191 height: 50px;
192 line-height: 50px;
193}
194
195nav .menu .item{
196 background-image:none !important;
197}
198
199nav .menu > li {
200 float: left;
201}
202
203nav .menu > li:first-child {
204 background:none;
205}
206
207nav .menu > li > a {
208 display: block;
209 padding: 0 15px;
210 color:#FFF;
211 text-decoration: none;
212 text-transform: uppercase;
213 font-weight: bold;
214}
215
216nav .menu > li > a:hover {
217 background: #27ae60 !important;
218}
219
220nav .menu > li.active > a { background: #2980b9 !important; }
221nav .menu > li.active > a:hover { }
222nav .menu > li.active > ul a:hover { color:#000; }
223
224nav .menu ul li a,
225nav .menu li.active ul li a {
226 color: #000;
227 text-shadow: none;
228 text-decoration: none;
229 padding: 0 10px;
230}
231
232nav .menu li ul li.active > a{ color:#2980B9; }
233nav .menu li ul li.active > a:hover { color:#2980B9; }
234
235nav .menu ul li:hover > a { background-color: #DAE9FA; }
236
237nav .menu li:hover {
238 position: relative;
239 z-index: 599;
240 cursor: default;
241}
242
243nav .menu ul {
244 visibility: hidden;
245 position: absolute;
246 top: 98%;
247 left: 0;
248 z-index: 598;
249 width: 100%;
250 box-shadow: 0 1px 1px #000;
251}
252
253nav .menu ul li {
254 float: none;
255 border-bottom: solid 1px #DAE9FA;
256 background-color: #f9f9f9;
257 color: #000;
258}
259
260nav .menu ul li:last-child {
261 border-bottom: none;
262}
263
264nav .menu ul li a {
265 display: block;
266 height:30px;
267 line-height:30px;
268 overflow: hidden;
269}
270
271nav .menu ul ul {
272 top: 0px;
273 left: 99%;
274}
275
276nav .menu li:hover > ul {
277 visibility: visible;
278}
279
280nav .menu ul { width: 200px; margin-top: 1px; }
281
282nav .menu ul li:last-child,
283nav .menu ul li:last-child a {
284}
285
286nav .menu ul li:first-child,
287nav .menu ul li:first-child a {
288}
289
290nav .menu > .folder > a {
291 padding-right: 8px;
292}
293
294nav .menu > .folder > a > .wrap {
295 padding-right: 20px;
296 background: url("../images/nav-arrow-down-white.png") no-repeat right center !important;
297}
298
299nav .menu ul *.folder > a {
300 padding-right: 15px;
301 background-image: url("../images/nav-arrow-right.png") !important;
302 background-position: 100% 50%;
303 background-repeat: no-repeat;
304}
305
306nav select { display: none; }
307
308/* Body ===================================================================== */
309
310#body{
311}
312
313/* Breadcrumbs ============================================================== */
314
315#breadcrumbs { margin:-20px; margin-bottom: 20px; background:#ecf0f1; padding:0 10px; position: relative; }
316
317#breadcrumbs ul, #breadcrumbs li { margin:0; padding:0; list-style: none; }
318
319#breadcrumbs ul{
320 overflow: hidden;
321 position: relative;
322}
323#breadcrumbs > ul:after {
324 content: '';
325 position: absolute;
326 top: 0;
327 right: 0;
328 background: -moz-linear-gradient(left, rgba(236,240,241,0.1) 0%, rgba(236,240,241,1) 100%);
329 background: -webkit-linear-gradient(left, rgba(236,240,241,0.1) 0%,rgba(236,240,241,1) 100%);
330 background: linear-gradient(to right, rgba(236,240,241,0.1) 0%,rgba(236,240,241,1) 100%);
331
filter:
progid:DXImageTransform.Microsoft.gradient( startColorstr='#1aecf0f1', endColorstr='#ecf0f1',GradientType=1 );
332 width: 50px;
333 height: 100%;
334}
335#breadcrumbs ul li {
336
font-size: 12px;
337 color: #2c3e50;
338 display: table-cell;
339 white-space: nowrap;
340 text-overflow: ellipsis;
341 overflow: hidden;
342 margin: 0;
343 padding: 0;
344 border-spacing: 0;
345 vertical-align: middle;
346}
347
348#breadcrumbs ul li a {
349 color:#2c3e50;
350}
351
352#breadcrumbs ul li a:hover {
353 color:#34495e;
354 text-decoration: none;
355}
356
357#breadcrumbs ul li.sep {
358 padding:0 10px;
359 width: 4px;
360 background: url("../images/nav-arrow-right-light.png") no-repeat center center;
361}
362
363#breadcrumbs ul li.home {
364 width: 16px;
365}
366
367#breadcrumbs ul li.home a {
368 display:block;
369 width:16px;
370 height:32px;
371 background: url("../images/nav-home.png") no-repeat left center;
372}
373
374/* Section ================================================================== */
375
376#body section{
377 float:left;
378 width:730px;
379}
380
381#body section article {
382 padding: 20px;
383 background:#FFF;
384 margin-bottom: 10px;
385 position: relative;
386 z-index: 0;
387}
388
389#body section h1{
390 margin-bottom: 20px;
391 color:#34495e;
392}
393
394#body section h1 + .parent_title{
395 font-size:16px;
396 margin: -10px 0 20px 0;
397}
398.item_group_title {
399 background: url("../images/icons/group.png") no-repeat left center;
400 padding: 0 0 0 25px;
401}
402/* Sidebar ================================================================== */
403
404#body aside{
405 float:right;
406 width:240px;
407 margin-bottom: 10px;
408}
409
410/* Sidebar Navigation ======================================================= */
411
412#body aside .menu, #body aside .menu li,
413#body section .menu, #body section .menu li
414{ margin:0; padding:0; list-style: none; background:#FFF; display: block; }
415
416#body aside .menu ul,
417#body section .menu ul{
418 border: solid 1px #EDEDED;
419 border-bottom: none;
420}
421
422#body aside .menu {
423 margin:-15px;
424}
425
426#body aside .menu li ul {
427 visibility: hidden;
428 position:absolute;
429 top:-1px;
430 left: auto;
431 right: 91%;
432 width:220px;
433 box-shadow: 0 1px 2px #666;
434 z-index: 999;
435}
436
437#body aside .menu li {
438 border-bottom: solid 1px #ecf0f1;
439}
440
441#body aside .menu li:hover,
442#body aside .menu li.active,
443#body section .menu li:hover,
444#body section .menu li.active {
445 position: relative;
446 z-index: 2;
447 cursor: default;
448 background: #ecf0f1;
449}
450#body aside .menu li:last-child {
451 border-bottom: none;
452}
453#body aside .menu li:hover > ul {
454 visibility: visible;
455}
456aside .menu .item, section .menu .item {
457 background: url("../images/icons/item.png") no-repeat 10px center;
458}
459#body aside .menu li.active .item,
460#body section .menu li.active .item {
461 color:#000;
462}
463#body aside .menu a,
464#body aside .menu span.item,
465#body section .menu a,
466#body section .menu span.item {
467 overflow: hidden;
468 display:block;
469 color:#666;
470 text-decoration: none;
471 padding:4px 10px;
472 padding-left:36px;
473}
474
475#body aside .menu a:hover {
476 color:#000;
477}
478
479#body aside .menu .counter,
480#body section .menu .counter{
481 float:right;
482 padding: 0px 7px;
483 background: #376499;
484 border-radius: 50px;
485
font-size: 11px;
486 color: white;
487}
488
489#body aside .menu li:hover .counter,
490#body section .menu li:hover .counter{
491 background:#BDC3C7;
492}
493
494/* Footer =================================================================== */
495
496#layout footer{
497 background: #34495E;
498 height: 60px;
499 color: #7f8c8d;
500 padding: 0 15px;
501 clear:both;
502
font-size:12px;
503}
504
505#layout footer ul, #layout footer li {
506 margin: 0; padding: 0; list-style: none;
507}
508
509#layout footer ul {
510 overflow: hidden;
511}
512
513#layout footer ul li {
514 height: 60px;
515 line-height: 60px;
516 float:left;
517 margin-right: 15px;
518}
519
520#layout footer ul li:last-child { margin:0; }
521
522
523#layout footer a { color:#95a5a6; }
524#layout footer a:hover { color:#ecf0f1; }
525
526#layout footer span.item { padding:0 10px; border-left: solid 1px #7f8c8d; }
527
528/* Footer SQL Debug ======================================================== */
529
530#debug_block{
531 display:none;
532}
533
534.queries_wrap .query{
535 padding:10px;
536 margin:10px;
537 background:#FFF;
538 border:solid 1px #DDD;
539}
540
541.queries_wrap .query .src{
542
font-size:12px;
543 color:#999;
544}
545.queries_wrap .query .debug_data{
546 margin-top:4px;
547}
548.queries_wrap .query_time {
549 color: #999;
550
font-size: 12px;
551 margin: 4px 0 0;
552}
553.queries_wrap .red_query {
554 color: #c0392b;
555}
556.queries_wrap .green_query {
557 color: #27ae60;
558}
559#debug_widget.tabs-menu > ul {
560 border-bottom: none;
561 height: 32px;
562 background: #B3C2C9;
563 min-width: 600px;
564}
565#debug_widget.tabs-menu .tabbed li {
566 background: none;
567}
568#debug_widget.tabs-menu .tabbed li a {
569 border: none;
570}
571#debug_widget.tabs-menu .tabbed li a:not(:hover) {
572 color: #EFEFEF;
573}
574#debug_widget.tabs-menu .tabbed li.active a, #debug_widget.tabs-menu .tabbed li.active a:hover {
575 border: none;
576 margin: 0;
577 color: #495358;
578}
579#debug_widget ol {
580 padding: 0;
581 margin: 0;
582}
583
584/* Footer Navigation ======================================================== */
585
586#layout footer #nav {
587 float:right;
588 margin-right: 0;
589}
590
591/* Site offline notice ====================================================== */
592
593#site_off_notice{
594 position: fixed;
595 left:15px; top:15px;
596 padding:5px 10px;
597 padding-left:28px;
598 background: url("../images/icons/error.png") no-repeat 8px center #FFF;
599 border:solid 1px red;
600 color:red;
601}
602.modal_padding {
603 padding: 10px;
604 box-sizing: border-box;
605 min-width: 460px;
606}
607.modal_padding h3, .modal_padding h2 {
608 margin-top: 5px;
609 white-space: nowrap;
610}
611
612.width_480 {
613 width: 480px;
614}
615/* Media Queries ============================================================ */
616
617@media screen and (max-width: 980px) {
618 #body section { width:100% !important; }
619 #body aside {
620 float: none !important;
621 overflow: hidden;
622 width: 100%;
623 clear: both;
624 }
625}
626
627@media screen and (max-width: 800px) {
628 #body section { width:100% !important; }
629 nav { padding:5px; height:auto; }
630 nav .menu { display:none; }
631 nav select {
632 position: relative;
633 display: inline-block;
634 background: transparent;
635 border: 0;
636 box-shadow: none;
637 color: #FFF;
638
font-size: 14px;
639
-webkit-appearance: none;
640
-moz-appearance: none;
641 appearance: none;
642 height: 28px;
643 line-height: 20px;
644 background:
url(../images/icons32/menu-icon.svg) no-repeat center right;
645 }
646 nav select option {
647 color: #333;
648 background: #FFF;
649 transition: all 0.3s ease;
650 }
651 #layout footer #info { display: none !important; }
652}
653
654@media screen and (max-width: 640px) {
655 .content_item .ft_images .first_type_images:first-child {
656 float: none;
657 clear: both;
658 margin-bottom: 10px;
659 display: block;
660 width: 100%;
661 max-width: 100%;
662 }
663 .filter-panel .fields .field:nth-child(odd), .filter-panel .fields .field:nth-child(even){
664 float: none !important;
665 width: 100%;
666 margin-bottom: 10px;
667 }
668 .content_item .ft_images .first_type_images:first-child > img {
669 width: 100%;
670 }
671 #layout header #logo { width:200px; }
672 .tabs-menu > ul { display:none; }
673 .tabs-menu select { display:block !important; }
674 .widget > .title {
font-size:14px !important; }
675 .widget > .title .links { display:none; }
676 .content_item .ft_image { float:none !important; }
677 .modal_padding {
678 padding: 10px;
679 box-sizing: border-box;
680 min-width: 320px;
681 }
682}
683
684@media screen and (max-width: 480px) {
685 #layout footer #nav { display: none !important; }
686 #breadcrumbs ul li:last-child {
687 display: none;
688 }
689 h1 {
690 font-size: 22px;
691 }
692 .content_list.featured .first .photo, .content_list.featured .first .fields, .content_list.tiled.albums_list .tile {
693 width: 100% !important;
694 }
695 .content_list_item.second .photo, .content_list_item.second .first {
696 float: none !important;
697 margin-right: 0 !important;
698 }
699 .content_list.featured .first .ft_caption a {
700 font-size: 21px !important;
701 }
702 .content_list_item .ft_caption .value {
703 font-size: 18px !important;
704 }
705}