]> git.mxchange.org Git - friendica.git/blob - view/theme/smoothly/style.css
Merge pull request #8156 from MrPetovan/task/7817-custom-fields-part-2
[friendica.git] / view / theme / smoothly / style.css
1 /*
2         style.css
3         Theme: Smoothly
4         Maintainer: Nomen Nominandum
5         last change: 2013-05-08
6
7 ** Colors **
8 Blue links - #1873a2
9 Blue link hover - #6da6c4
10 Blue Gradients (buttons and other gradients) - #1873a2 and #6da6c4
11 Grey/body text - #626262
12 Grey Gradients (buttons and other gradients) - #bdbdbd and #a2a2a2
13 Dark Grey Gradients - #7c7d7b and #555753
14 Orange - #fec01d
15 */
16
17 @import url('css/typography.css');
18
19 @media only screen and (device-width: 768px) {
20 /* For general iPad layouts */
21 #body {
22         -moz-background-clip: border;
23         -moz-background-origin: padding;
24         -moz-background-size: auto auto;
25         background-attachment: scroll;
26         background-color: transparent;
27         background-image: url( );
28         background-position: center top;
29         background-repeat: no-repeat;
30         }
31 }
32
33 @media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
34 /* For portrait layouts only */
35 }
36
37 @media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
38 /* For landscape layouts only */
39 }
40
41 .lockview {
42         cursor: pointer;
43 }
44
45 .heart {
46         color: #FF0000;
47         font-size: 100%;
48 }
49
50 input[type=text] {
51         float: left;
52         border: 1px solid #b0b0b0;
53         padding: 2px;
54         width: 550px;
55         border-radius: 3px;
56                 -moz-border-radius: 3px;
57                 -webkit-border-radius: 3px;
58 }
59
60 input[type=text-sidebar] {
61         border: 1px solid #b0b0b0;
62         padding: 2px;
63         width: 172px;
64         margin-left: 10px;
65         margin-top: 10px;
66         border-radius: 3px;
67                 -moz-border-radius: 3px;
68                 -webkit-border-radius: 3px;
69 }
70
71 input[type=submit] {
72         margin:10px 10px 0 0;
73         font-size: 0.9em;
74         padding: 5px;
75         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
76         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
77         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
78         background-color: #bdbdbd;
79         color: #efefef;
80         text-align: center;
81         border: 1px solid #7C7D7B;
82         border-radius: 5px;
83                 -moz-border-radius: 5px;
84                 -webkit-border-radius: 5px;
85 }
86
87 input[type=submit]:hover {
88         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
89         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
90         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
91         background-color: #1873a2;
92         color: #efefef;
93         border: 1px solid #7C7D7B;
94         box-shadow: 0 0 8px #BDBDBD;
95                 -moz-box-shadow: 0 0 8px #BDBDBD;
96                 -webkit-box-shadow: 0 0 8px #BDBDBD;
97         border-radius: 5px;
98                 -moz-border-radius: 5px;
99                 -webkit-border-radius: 5px;
100 }
101
102 input[type=submit]:active {
103         position: relative;
104         top: 1px;
105 }
106
107 .btn {
108         background-color: transparent;
109         box-shadow: none;
110         border: none;
111         padding: 0;
112         text-align: inherit;
113 }
114
115 #search-text,
116 #search-submit,
117 #search-save {
118         margin: 10px 10px 0 0;
119 }
120
121 #directory-search,
122 #directory-search-submit,
123 #search-save {
124 }
125
126 #directory-search-end {
127         clear: both;
128 }
129
130 .dirsearch-desc {
131 }
132
133 .smalltext {
134         font-size: 0.7em
135 }
136
137 ::selection {
138         background: #fec01d;
139         color: #000; /* Safari and Opera */
140 }
141
142 ::-moz-selection {
143         background: #fec01d;
144         color: #000; /* Firefox */
145 }
146
147 section {
148         position: relative;
149         float: left;
150         margin: 50px auto -2em; /* the bottom margin is the negative value of the footer's height */
151         width: 730px;
152         min-height: 100%;
153         height: auto !important;
154         height: 100%;
155         font-size: 0.9em;
156         line-height: 1.2em;
157         padding-bottom: 2em;
158 }
159
160 /* Contact-Header for the Network Stream */
161 #viewcontact_wrapper-network {
162         width: 100%;
163         min-height: 110px;
164         background-color: #FAFAFA;
165         box-shadow: 0 0 8px #BDBDBD;
166         border-bottom: 1px solid #dedede;
167         border: 1px solid #7C7D7B;
168         border-radius: 5px;
169 }
170 #contact-entry-wrapper-network {
171         float: none;
172         width: auto;
173         height: auto;
174         padding: 10px;
175         margin: 0;
176 }
177 #contact-entry-accounttype-network {
178         font-size: 20px;
179 }
180 #contact-entry-name-network {
181         font-size: 24.5px;
182 }
183
184 .lframe {
185         border: 1px solid #7C7D7B;
186         box-shadow: 3px 3px 6px #959494;
187                 -moz-box-shadow: 3px 3px 6px #959494;
188                 -webkit-box-shadow: 3px 3px 6px #959494;
189         background-color: #efefef;
190         padding: 10px;
191 }
192
193 .mframe {
194         padding: 1px;
195         background: none repeat scroll 0 0 #FFFFFF;
196         border: 1px solid #7C7D7B;
197         border-radius: 3px;
198                 -moz-border-radius: 3px;
199                 -webkit-border-radius: 3px;
200         box-shadow: 0 0 8px #BDBDBD;
201                 -moz-box-shadow: 0 0 8px #BDBDBD;
202                 -webkit-box-shadow: 0 0 8px #BDBDBD;
203 }
204
205 #wall-item-lock {
206         margin-left: 10px;
207 }
208
209 .button {
210         border: 1px solid #7C7D7B;
211         border-radius: 5px;
212                 -moz-border-radius: 5px;
213                 -webkit-border-radius: 5px;
214         font-size: 1em;
215         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
216         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
217         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
218         background-color: #bdbdbd;
219         color: #efefef;
220         text-align: center;
221 }
222
223 .button:hover {
224         border: 1px solid #7C7D7B;
225         box-shadow: 0 0 8px #BDBDBD;
226                 -moz-box-shadow: 0 0 8px #BDBDBD;
227                 -webkit-box-shadow: 0 0 8px #BDBDBD;
228         border-radius: 5px;
229                 -moz-border-radius: 5px;
230                 -webkit-border-radius: 5px;
231         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
232         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
233         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
234         background-color: #1873a2;
235         color: #efefef;
236 }
237
238 .button:active {
239         position: relative;
240         top: 1px;
241 }
242
243 .button a {
244         color: #efefef;
245 }
246
247 ul.menu-popup {
248         position: absolute;
249         display: none;
250         width: auto;
251         margin: 2px 0 0;
252         padding: 0px;
253         list-style: none;
254         z-index: 100000;
255         color: #2e3436;
256         border-top: 1px;
257         background: #eeeeee;
258         border: 1px solid #7C7D7B;
259         border-radius: 0px 0px 5px 5px;
260         -webkit-border-radius: 0px 0px 5px 5px;
261         -moz-border-radius: 0px 0px 5px 5px;
262         box-shadow: 5px 5px 10px #242424;
263         -moz-box-shadow: 5px 5px 10px #242424;
264         -webkit-box-shadow: 5px 5px 10px #242424;
265 }
266 ul.menu-popup li a {
267         white-space: nowrap;
268         display: block;
269         padding: 5px 2px;
270         color: #2e3436;
271 }
272 ul.menu-popup li a:hover {
273         color: #efefef;
274         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
275         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
276         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
277         background-color: #1873a2;
278 }
279
280 /* ========= */
281 /* = Login = */
282 /* ========= */
283
284 #login-name-wrapper,
285 #login-password-wrapper {
286         vertical-align: middle;
287         margin: auto;
288 }
289
290 #login-name-wrapper input {
291         width: 120px;
292         margin-left: 20px;
293 }
294
295 #login-extra-links {
296         width: auto;
297         margin-top: 20px;
298         clear: both;
299 }
300
301 .login-extra-links {
302         width: 100%;
303         margin-left: 0px;
304         clear: both;
305 }
306
307 #login-extra-filler {
308         display: none;
309 }
310
311 #login_standard {
312         width: 260px;
313         float: left;
314         border: 1px solid #7C7D7B;
315         border-radius: 5px;
316                 -moz-border-radius: 5px;
317                 -webkit-border-radius: 5px;
318         padding: 15px 10px 10px 20px;
319         margin: 20px 0 0 210px;
320 }
321
322 #login_openid,
323 #login-extra-links a {
324         width: 460px;
325         float: left;
326         margin: 5px 0 0 230px;
327 }
328
329 #div_id_remember {
330         width: 258px;
331         float: left;
332         margin: 5px 0 0 230px;
333 }
334
335 #login_standard input,
336 #login_openid input {
337         height: 20px;
338         width: 240px;
339 }
340
341 #register-link,
342 #lost-password-link {
343         width: 260px;
344
345 }
346
347 #login-name-end,
348 #login-password-end,
349 #login-extra-end,
350 #login-submit-end {
351         height: 50px;
352 }
353
354 #login-submit-button,
355 #login-submit-wrapper {
356 }
357
358 #login-submit-button {
359         width: 250px;
360         margin: 10px 0 0 230px;
361 }
362
363 .login-form {
364         margin-top: 10px;
365 }
366
367 /* ========= */
368 /* = Panel = */
369 /* ========= */
370
371 #panel {
372         position: absolute;
373         font-size: 0.8em;
374         border-radius: 5px;
375                 -webkit-border-radius: 5px;
376                 -moz-border-radius: 5px;
377         border: 1px solid #494948;
378         background-color: #2e3436;
379         opacity: 50%;
380         color: #eeeeec;
381         padding:1em;
382         z-index: 200;
383         box-shadow: 7px 7px 10px #434343;
384                 -moz-box-shadow: 7px 7px 12px #434343;
385                 -webkit-box-shadow: 7px75px 12px #434343;
386 }
387
388 /* ========= */
389 /* = Pager = */
390 /* ========= */
391
392 .pager {
393         display: block;
394         /*clear: both;*/
395         text-align: left;
396 }
397
398 .pager a {
399         color: #626262;
400 }
401
402 .pager span {
403         padding: 4px;
404         margin: 4px;
405 }
406
407 .pager .disabled {
408         display: none;
409 }
410
411 .pager_current {
412         background-color: #1873a2;
413         color: #ffffff;
414 }
415
416 /* ======= */
417 /* = Nav = */
418 /* ======= */
419
420 nav {
421         display: block;
422         float: left;
423         list-style: none outside none;
424         margin: 0;
425         padding: 0;
426         width: 958px;
427         z-index: 10000;
428         height: 40px;
429         position: fixed;
430         color: #efefef;
431         margin-bottom: 16px;
432         font-size: 15px;
433         background-color: #BDBDBD;
434         background: -moz-linear-gradient(center top , #BDBDBD 5%, #A2A2A2 100%) repeat scroll 0 0 #BDBDBD;
435         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
436         border: 1px solid #7C7D7B;
437         box-shadow: 0 0 8px #BDBDBD;
438                 -moz-box-shadow: 0 0 8px #BDBDBD;
439                 -webkit-box-shadow: 0 0 8px #BDBDBD;
440         border-radius: 0px 0px 5px 5px;
441                 -moz-border-radius: 0px 0px 5px 5px;
442                 -webkit-border-radius: 0px 0px 5px 5px;
443 }
444
445 nav a {
446         text-decoration: none;
447         color: #eeeeec;
448         border: 0px;
449 }
450
451 nav a:hover {
452         text-decoration: none;
453         color: #eeeeec;
454         border: 0px;
455 }
456
457 nav #site-location {
458         color: #888a85;
459         font-size: 0.8em;
460         position: absolute;
461 }
462
463 nav #banner {
464         display: block;
465         position: absolute;
466         margin-left: 3px;
467         /*margin-top: 2px;*/
468         padding-bottom: 5px;
469 }
470
471 nav #banner #logo-text a {
472         display: hidden;
473         font-size: 40px;
474         font-weight: bold;
475         margin-left: 3px;
476         text-shadow: #7C7D7B 3px 3px 5px;
477 }
478
479 nav #user-menu {
480         display: block;
481         width: auto;
482         min-width: 190px;
483         float: right;
484         margin-right: 5px;
485         margin-top: 4px;
486         padding: 5px;
487         position: relative;
488         vertical-align: middle;
489         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #797979), color-stop(1, #898988) );
490         background: -moz-linear-gradient( center top, #797979 5%, #898988 100% );
491         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#797979', endColorstr='#898988');
492         background-color: #a2a2a2;
493         border: 1px solid #7C7D7B;
494         box-shadow: 0 0 8px #BDBDBD;
495                 -moz-box-shadow: 0 0 8px #BDBDBD;
496                 -webkit-box-shadow: 0 0 8px #BDBDBD;
497         border-radius: 5px;
498                 -moz-border-radius: 5px;
499                 -webkit-border-radius: 5px;
500         color: #efefef;
501         text-decoration: none;
502         text-align: center;
503 }
504
505 nav #user-menu:hover {
506         border: 1px solid #7C7D7B;
507         box-shadow: 0 0 8px #BDBDBD;
508                 -moz-box-shadow: 0 0 8px #BDBDBD;
509                 -webkit-box-shadow: 0 0 8px #BDBDBD;
510         border-radius: 5px;
511                 -moz-border-radius: 5px;
512                 -webkit-border-radius: 5px;
513         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
514         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
515         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
516         background-color: #1873a2;
517         color: #efefef;
518 }
519
520 nav #user-menu-label::after {
521         content: url("images/menu-user-pin.png") no-repeat;
522         padding-left: 15px;
523 }
524
525 nav #user-menu-label {
526         vertical-align: middle;
527         font-size: 12px;
528         padding: 5px;
529         text-align: center;
530 }
531
532 .nav-ajax-left {
533         font-size: 0.8em;
534         float: left;
535         margin-top: 62px;
536 }
537
538 nav #nav-link-wrapper .nav-link {
539         border-right: 1px solid #babdb6;
540 }
541
542 .error-message {
543         color: #FF0000;
544         font-size: 1.1em;
545         border: 1px solid #FF8888;
546         background-color: #FFEEEE;
547         padding: 10px;
548 }
549
550 .info-message {
551         color: #204a87;
552         font-size: 1.1em;
553         border: 1px solid #3465a4;
554         background-color: #d7e3f1;
555         padding: 10px;
556 }
557
558 ul#user-menu-popup {
559         display: none;
560         position: absolute;
561         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #797979), color-stop(1, #898988) );
562         background: -moz-linear-gradient( center top, #a2a2a2 5%, #898988 100% );
563         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#797979', endColorstr='#898988');
564         background-color: #898988;
565         width: 100%;
566         padding: 0;
567         margin: 0px;
568         margin-top: 10px;
569         top: 20px;
570         left: 0px;
571         border: 1px solid #9a9a9a;
572         border-top: none;
573         border-radius: 0px 0px 5px 5px;
574                 -webkit-border-radius: 0px 0px 5px 5px;
575                 -moz-border-radius: 0px 0px 5px 5px;
576         box-shadow: 5px 5px 10px #242424;
577                 -moz-box-shadow: 5px 5px 10px #242424;
578                 -webkit-box-shadow: 5px 5px 10px #242424;
579         z-index: 10000;
580 }
581
582 ul#user-menu-popup li {
583         display: block;
584 }
585
586 ul#user-menu-popup li a {
587         display: block;
588         padding: 5px;
589 }
590
591 ul#user-menu-popup li a:hover {
592         color: #efefef;
593         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6da6c4), color-stop(1, #1873a2) );
594         background: -moz-linear-gradient( center top, #6da6c4 5%, #1873a2 100% );
595         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da6c4', endColorstr='#1873a2');
596         background-color: #1873a2;
597 }
598
599 ul#user-menu-popup li a.nav-sep {
600         border-top: 1px solid #989898;
601         border-style:inset;
602 }
603
604 /* ============= */
605 /* = Notifiers = */
606 /* ============= */
607
608 #notifications {
609         height: 32px;
610         position: absolute;
611         top: 3px;
612         left: 35%;
613 }
614
615 .nav-ajax-update {
616         width: 44px;
617         height: 32px;
618         background: transparent url('images/notifications.png') 0px 0px no-repeat;
619         color: #333333;
620         font-weight: bold;
621         font-size: 0.8em;
622         padding-top: 0.5em;
623         float: left;
624         padding-left: 11px;
625 }
626
627 #notification-update {
628         background-position: 0px -168px;
629 }
630
631 #net-update {
632         background-position: 0px -126px;
633 }
634
635 #mail-update {
636         background-position: 0px -40px;
637 }
638
639 #intro-update {
640         background-position: 0px -84px;
641 }
642
643 #home-update {
644         background-position: 0px 0px;
645 }
646
647
648
649 /* =================== */
650 /* = System Messages = */
651 /* =================== */
652
653 #sysmsg_info,
654 #sysmsg {
655         position: fixed;
656         bottom: 0px; right:20%;
657         box-shadow: 7px 7px 10px #434343;
658                 -moz-box-shadow: 7px 7px 12px #434343;
659                 -webkit-box-shadow: 7px75px 12px #434343;
660         padding: 10px;
661         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
662         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
663         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
664         background-color: #1873a2;
665         border-radius: 5px 5px 0px 0px;
666                 -webkit-border-radius: 5px 5px 0px 0px;
667                 -moz-border-radius: 5px 5px 0px 0px;
668         border: 1px solid #da2c2c;
669         border-bottom: 0px;
670         padding-bottom: 50px;
671         z-index: 1000;
672         color: #efefef;
673         font-style: bold;
674 }
675
676 #sysmsg_info br,
677 #sysmsg br {
678         display:block;
679         margin:2px 0px;
680         border-top: 1px solid #7C7D7B;
681 }
682
683 /* ================= */
684 /* = Aside/Sidebar = */
685 /* ================= */
686
687 aside {
688         float: right;
689         width: 205px;
690         margin-top: 45px;
691         /*font-size: 0.9em;*/
692         font-style: bold;
693 }
694
695 aside a {
696         /*padding-bottom: 5px;*/
697 }
698
699 aside h4 {
700         font-size: 1.3em;
701 }
702
703 .vcard  {
704         width: 205px;
705         padding-bottom: 10px;
706         /*border-bottom-style: dotted;*/
707 }
708
709 .vcard .title {
710         font-size: 1em;
711 }
712
713 .vcard .account-type {
714         font-size: 1.2em;
715 }
716
717 .vcard dd {
718         font-size: 12px;
719         font-variant: normal;
720         -webkit-margin-start: 10px;
721 }
722
723 .fn {
724 }
725
726 .vcard .fn {
727         font-size: 1.4em;
728         font-weight: bold;
729         border-bottom: none;
730         margin-top:10px;
731 }
732
733 .vcard #profile-photo-wrapper {
734         margin: 10px 0px;
735         padding: 0;
736         width: auto;
737         /*background: none repeat scroll 0 0 #FFFFFF;
738         border: 1px solid #7C7D7B;
739         box-shadow: 0 0 8px #BDBDBD;
740                 -moz-box-shadow: 0 0 8px #BDBDBD;
741                 -webkit-box-shadow: 0 0 8px #BDBDBD;
742                 -moz-box-shadow: 0 0 8px #BDBDBD;
743                 -webkit-box-shadow: 0 0 8px #BDBDBD;
744         border-radius: 5px;
745                 -moz-border-radius: 5px;
746                 -webkit-border-radius: 5px;*/
747 }
748
749
750 .allcontact-link {
751         color: #626262;
752         text-align: center;
753         font-weight: bold;
754         font-size: 1em;
755 }
756 .allcontact-link a {
757         padding-bottom: 10px;
758 }
759
760 #profile-extra-links ul {
761         margin-left: 0px;
762         padding-left: 0px;
763         list-style: none;
764 }
765
766 #subscribe-feed-link,
767 #dfrn-request-link {
768         box-shadow: inset 0px 1px 0px 0px #a65151;
769                 -moz-box-shadow: inset 0px 1px 0px 0px #a65151;
770                 -webkit-box-shadow: inset 0px 1px 0px 0px #a65151;
771         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6da6c4), color-stop(1, #1873a2) );
772         background: -moz-linear-gradient( center top, #6da6c4 5%, #1873a2 100% );
773         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da6c4', endColorstr='#1873a2');
774         background-color: #6da6c4;
775         border-radius: 5px;
776                 -moz-border-radius: 5px;
777                 -webkit-border-radius: 5px;
778         border: 1px solid #fc5656;
779         display: inline-block;
780         color: #f0e7e7;
781         font-family: Trebuchet MS;
782         font-size: 19px;
783         font-weight: bold;
784         text-align: center;
785         padding: 10px;
786         width: 185px;
787         text-decoration: none;
788         text-shadow: 1px 1px 0px #b36f6f;
789 }
790
791 #wallmessage-link {
792         display: block;
793         color: #FFFFFF;
794         border-radius: 5px;
795                 -webkit-border-radius: 5px ;
796                 -moz-border-radius: 5px;
797         padding: 5px;
798         font-weight: bold;
799         background-color: #3465a4;
800 }
801
802 #subscribe-feed-link:hover,
803 #dfrn-request-link:hover {
804         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
805         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
806         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
807         background-color: #1873a2;
808 }
809
810 #subscribe-feed-link:active,
811 #dfrn-request-link:active {
812         position: relative;
813         top: 1px;
814 }
815
816 #dfrn-request-intro {
817         width: 600px;
818 }
819
820 #netsearch-box {
821         background-color: #f6f6f6;
822         padding: 5px 5px 0px 15px;
823 }
824 #netsearch-box input[type="text"] {
825         width: 90%;
826 }
827 #netsearch-box input[type="submit"] {
828         width: auto;
829 }
830
831 h3 #search:before {
832         content: url("images/search.png");
833         padding-right: 10px;
834         vertical-align: middle;
835 }
836
837 #network-new-link {
838         background-color: #f3f3f3;
839         border: 1px solid #7C7D7B;
840         margin-bottom: 10px;
841         border-radius: 5px;
842                 -webkit-border-radius: 5px;
843                 -moz-border-radius: 5px;
844 }
845
846 #group-sidebar {
847         vertical-align: middle;
848         margin: auto;
849         margin-top: 20px;
850         padding-bottom: 10px;
851 }
852
853 #message-sidebar {
854         vertical-align: middle;
855         margin-top: 40px;
856 }
857
858 #message-new {
859         padding: 7px;
860         width: 165px;
861         margin: 10px;
862         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
863         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
864         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
865         background-color: #bdbdbd;
866         display: inline-block;
867         color: #efefef;
868         text-decoration: none;
869         text-align: center;
870         border: 1px solid #7C7D7B;
871         border-radius: 5px;
872                 -moz-border-radius: 5px;
873                 -webkit-border-radius: 5px;
874 }
875
876 #peoplefind-desc {
877         margin-left: 10px;
878 }
879
880 #sidebar-group-list {
881         margin-left: 0px;
882         margin-right: 30px;
883 }
884
885 #sidebar-ungrouped {
886         margin: 10px;
887 }
888
889 #sidebar-group-list  a {
890 }
891
892 #sidebar-group-list .icon,
893 #sidebar-group-list .iconspacer {
894         display: inline-block;
895         height: 12px;
896         width: 12px;
897 }
898
899 #side-peoplefind-submit {
900         margin: 10px;
901 }
902
903 #side-peoplefind-url {
904         margin: 10px;
905         width: 175px;
906 }
907
908 #sidebar-page-list {}
909
910 .widget {
911         margin-top: 20px;
912         box-shadow: 1px 2px 6px 0px #959494;
913                 -moz-box-shadow: 1px 2px 6px 0px #959494;
914                 -webkit-box-shadow: 1px 2px 6px 0px #959494;
915         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f8f8f8), color-stop(1, #f6f6f6) );
916         background: -moz-linear-gradient( center top, #f8f8f8 5%, #f6f6f6 100% );
917         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f8f8f8', endColorstr='#f6f6f6');
918         background-color: #f8f8f8;
919         border-radius: 5px;
920                 -moz-border-radius: 5px;
921                 -webkit-border-radius: 5px;
922         color: #7c7d7b;
923         border: 1px solid #7C7D7B;
924 }
925
926 li.widget-list {
927         list-style: none outside none;
928         background: url("images/arrow.png") no-repeat scroll left center transparent;
929         display: block;
930         padding: 3px 24px;
931 }
932
933 #sidebar-new-group,
934 #sidebar-edit-groups {
935         padding: 7px;
936         width: 165px;
937         margin: auto;
938         margin-left: 10px;
939         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
940         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
941         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
942         background-color: #bdbdbd;
943         display: inline-block;
944         color: #efefef;
945         text-decoration: none;
946         text-align: center;
947         border: 1px solid #7C7D7B;
948         border-radius: 5px;
949                 -moz-border-radius: 5px;
950                 -webkit-border-radius: 5px;
951 }
952
953
954 #sidebar-new-group:hover {
955         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
956         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
957         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
958         background-color: #1873a2;
959         border: 1px solid #7C7D7B;
960         box-shadow: 0 0 8px #BDBDBD;
961                 -moz-box-shadow: 0 0 8px #BDBDBD;
962                 -webkit-box-shadow: 0 0 8px #BDBDBD;
963         border-radius: 5px;
964                 -moz-border-radius: 5px;
965                 -webkit-border-radius: 5px;
966 }
967
968 #sidebar-new-group:active {
969         position: relative;
970         top: 1px;
971 }
972
973
974 .widget .selected,
975 .group-selected {
976         padding-bottom: 0px;
977         padding-left: 2px;
978         padding-right: 2px;
979         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
980                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
981                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
982         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
983         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
984         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
985         background-color: #bdbdbd;
986         border-radius: 5px;
987                 -moz-border-radius: 5px;
988                 -webkit-border-radius: 5px;
989         display: inline-block;
990         color: #efefef;
991         text-decoration: none;
992 }
993
994 .settings-widget .selected {
995         font-weight: bold;
996 }
997
998 #sidebar-new-group a {
999         color: #efefef;
1000         font-size: 14px;
1001         text-align: center;
1002         margin: auto;
1003 }
1004
1005 ul .sidebar-group-li {
1006         list-style: disc;
1007         font-size: 1.0em;
1008 }
1009
1010 ul .sidebar-group-li .icon {
1011         display: inline-block;
1012         height: 12px;
1013         width: 12px;
1014 }
1015
1016 .nets-ul, .fileas-ul, .category-ul, .datebrowse-ul  {
1017         list-style-type: none;
1018 }
1019
1020 .nets-ul li,
1021 .fileas-ul li,
1022 .category-ul li,
1023 .datebrowse-link {
1024 }
1025
1026 .nets-link {
1027         color: #1873A2;
1028         text-decoration: none;
1029         margin-left: 2px;
1030         padding-left: 20px;
1031         background: url("images/arrow.png") no-repeat scroll left center transparent;
1032         box-shadow: none;
1033 }
1034 .nets-all {
1035         margin-left: 42px;
1036 }
1037
1038 .fileas-link,
1039 .category-link {
1040         margin-left: 0px;
1041 }
1042
1043 .fileas-all,
1044 .category-all {
1045         margin-left: 0px;
1046 }
1047
1048 .widget h3 {
1049         font-size: 125%;
1050         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f0edf0), color-stop(1, #e2e2e2) );
1051         background: -moz-linear-gradient( center top, #f0edf0 5%, #e2e2e2 100% );
1052         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0edf0', endColorstr='#e2e2e2');
1053         background-color: #f0edf0;
1054         border-radius: 5px 5px 0px 0px;
1055                 -moz-border-radius: 5px 5px 0px 0px;
1056                 -webkit-border-radius: 5px 5px 0px 0px;
1057         border: 1px solid #e2e2e2;
1058         border-bottom: 1px solid #7C7D7B;
1059         padding-top: 5px;
1060         padding-bottom: 5px;
1061         vertical-align: baseline;
1062         text-align: center;
1063         text-shadow: -1px 0px 0px #bdbdbd;
1064 }
1065
1066 #connect-desc {
1067         margin-left: 10px;
1068 }
1069
1070 #group-sidebar h3:before {
1071         content: url("images/groups.png");
1072         padding-right: 10px;
1073         vertical-align: middle;
1074 }
1075
1076 #saved-search-list {
1077         margin-top: 15px;
1078 }
1079
1080 .saved-search-li {
1081         list-style: none;
1082         font-size: 1.2em;
1083 }
1084
1085 .saved-search-li .icon {
1086         margin-right: 5px;
1087 }
1088
1089 .birthday-today,
1090 .event-today {
1091         font-weight: bold;
1092 }
1093
1094 #birthday-wrapper,
1095 #event-wrapper {
1096         margin-left: 15px;
1097 }
1098
1099 #pause {
1100         position: fixed;
1101         bottom: 5px;
1102         right: 5px;
1103 }
1104
1105 /* ================== */
1106 /* = Contacts Block = */
1107 /* ================== */
1108
1109 .contact-block-img {
1110         width: 47px !important;
1111         height: 47px !important;
1112         margin-right: 2px;
1113         border: 1px solid #7C7D7B;
1114         border-radius: 3px;
1115                 -moz-border-radius: 3px;
1116                 -webkit-border-radius: 3px;
1117         box-shadow: 0 0 8px #BDBDBD;
1118                 -moz-box-shadow: 0 0 8px #BDBDBD;
1119                 -webkit-box-shadow: 0 0 8px #BDBDBD;
1120 }
1121
1122 .contact-block-div {
1123         float: left;
1124 }
1125
1126 .contact-block-link {
1127         float: left;
1128 }
1129
1130 .contact-block-textdiv {
1131         width: 150px;
1132         height: 34px;
1133         float: left;
1134 }
1135
1136 .contact-block-h4,
1137 .contact-block-content {
1138         margin: 0;
1139         font-size: 1.2em;
1140 }
1141
1142 #contact-block,
1143 #contact-block-end {
1144         clear: both;
1145         padding-top: 10px;
1146 }
1147
1148 /* ======= */
1149 /* = Jot = */
1150 /* ======= */
1151
1152 .jothidden {
1153   display: none;
1154 }
1155 #jot {
1156   width: 100%;
1157   margin: 0px 2em 20px 0px;
1158 }
1159
1160 #profile-jot-text-loading,
1161 #profile-jot-text {
1162         height: 20px;
1163         color: #cccccc;
1164 }
1165
1166 #profile-jot-text_tbl {
1167         margin-bottom: 10px;
1168         margin-top: 10px;
1169 }
1170
1171 #profile-jot-text_ifr {
1172         width: 99.9% !important;
1173 }
1174
1175 #profile-jot-submit-wrapper {
1176         margin-top: 30px;
1177 }
1178
1179 #jot-title,
1180 #jot-category {
1181         margin: 0px;
1182         height: 20px;
1183         width: 575px;
1184         font-weight: bold;
1185         border: 1px solid #cccccc;
1186 }
1187
1188 #jot-perms-icon {
1189         float: left;
1190 }
1191
1192 #jot-title::-webkit-input-placeholder,
1193 #jot-category::-webkit-input-placeholder {
1194         font-weight: normal;
1195 }
1196
1197 #jot-title:-moz-placeholder,
1198 #jot-category:-moz-placeholder {
1199         font-weight: normal;
1200 }
1201
1202 #jot-title:hover,
1203 #jot-title:focus,
1204 #jot-category:hover,
1205 #jot-category:focus {
1206         border: 1px solid #cccccc;
1207 }
1208
1209 .preview {
1210         background: #FFFFC8;
1211 }
1212
1213 #theme-preview {
1214         margin: 15px 0 15px 0;
1215 }
1216
1217 #profile-jot-perms,
1218 #profile-jot-submit {
1219         width: 60px;
1220         font-size: 12px;
1221         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1222         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1223         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1224         background-color: #bdbdbd;
1225         display: inline-block;
1226         color: #efefef;
1227         text-decoration: none;
1228         text-align: center;
1229         border: 1px solid #7C7D7B;
1230         border-radius: 5px;
1231                 -moz-border-radius: 5px;
1232                 -webkit-border-radius: 5px;
1233 }
1234
1235 #jot-preview-form {}
1236
1237 #jot-preview-link {
1238         float: left;
1239         width: 60px;
1240         font-size: 12px;
1241         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1242         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1243         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1244         background-color: #bdbdbd;
1245         display: inline-block;
1246         color: #efefef;
1247         text-decoration: none;
1248         text-align: center;
1249         padding: 5px 5px;
1250         border: 1px solid #7C7D7B;
1251         border-radius: 5px;
1252                 -moz-border-radius: 5px;
1253                 -webkit-border-radius: 5px;
1254 }
1255
1256 #profile-jot-perms {
1257         width: 27px;
1258         height: 27px;
1259         float: right;
1260         overflow: hidden;
1261         margin-left: 10px;
1262         margin-top: -20px;
1263         border: 1px solid #7C7D7B;
1264         border-radius: 5px;
1265                 -moz-border-radius: 5px;
1266                 -webkit-border-radius: 5px;
1267 }
1268
1269 #jot-perms-perms .icon {
1270         height: 1px;
1271 }
1272
1273 #profile-jot-submit {
1274         width: 80px;
1275         float: right;
1276         margin-right: 145px;
1277         margin-top: -20px;
1278         margin-left: 10px;
1279         padding: 5px 5px;
1280         border: 1px solid #7C7D7B;
1281         border-radius: 5px;
1282                 -moz-border-radius: 5px;
1283                 -webkit-border-radius: 5px;
1284 }
1285
1286 #profile-jot-perms:hover,
1287 #profile-jot-submit:hover,
1288 #jot-preview-link:hover {
1289         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
1290         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
1291         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
1292         background-color: #1873a2;
1293         border: 1px solid #7C7D7B;
1294         box-shadow: 0 0 8px #BDBDBD;
1295                 -moz-box-shadow: 0 0 8px #BDBDBD;
1296                 -webkit-box-shadow: 0 0 8px #BDBDBD;
1297         border-radius: 5px;
1298                 -moz-border-radius: 5px;
1299                 -webkit-border-radius: 5px;
1300 }
1301
1302 #profile-jot-perms:active,
1303 #profile-jot-submit:active,
1304 #jot-preview-link:active {
1305         position: relative;
1306         top: 1px;
1307 }
1308
1309 #character-counter {
1310         position: relative;
1311         float: left;
1312         right: 0px;
1313         top: 0px;
1314 }
1315 #profile-rotator-wrapper {
1316         float: right;
1317 }
1318
1319 .jot-tool {
1320         float: left;
1321         margin-right: 5px;
1322 }
1323
1324 #profile-jot-tools-end,
1325 #profile-jot-banner-end {
1326         clear: both;
1327 }
1328
1329 #profile-jot-email-wrapper {
1330         margin: 10px 10% 0px 10%;
1331         border: 1px solid #eeeeee;
1332         border-bottom: 0px;
1333 }
1334
1335 #profile-jot-email-label {
1336         background-color: #555753;
1337         color: #ccccce;
1338         padding: 5px;
1339 }
1340
1341 #profile-jot-email {
1342         margin: 5px;
1343         width: 95%;
1344 }
1345
1346 #profile-jot-networks {
1347         margin: 0px 10%;
1348         border: 1px solid #eeeeee;
1349         border-top: 0px;
1350         border-bottom: 0px;
1351         padding: 5px;
1352 }
1353
1354 #profile-jot-acl-wrapper {
1355         margin: 0px 10px;
1356         border: 1px solid #eeeeee;
1357         border-top: 0px;
1358         display: block !important;
1359 }
1360
1361 #profile-video-wrapper,
1362 #profile-audio-wrapper,
1363 #profile-location-wrapper,
1364 #profile-nolocation-wrapper {
1365 }
1366
1367 #group_allow_wrapper,
1368 #group_deny_wrapper,
1369 #acl-permit-outer-wrapper {
1370         width: 47%;
1371         float: left;
1372 }
1373
1374 #contact_allow_wrapper,
1375 #contact_deny_wrapper,
1376 #acl-deny-outer-wrapper {
1377         width: 47%;
1378         float: right;
1379 }
1380
1381 #acl-permit-text {
1382         background-color: #555753;
1383         color: #ccccce;
1384         padding: 5px; float: left;
1385 }
1386
1387 #jot-public {
1388         background-color: #555753;
1389         color: #ff0000;
1390         padding: 5px;
1391         float: left;
1392 }
1393
1394 #acl-deny-text {
1395         background-color: #555753;
1396         color: #ccccce;
1397         padding: 5px;
1398         float: left;
1399 }
1400
1401 #acl-permit-text-end,
1402 #acl-deny-text-end {
1403         clear: both;
1404 }
1405
1406 #profile-jot-wrapper {
1407         margin-top: -15px;
1408 }
1409
1410 #profile-jot-desc,
1411 #profile-jot-form,
1412 #jot-location,
1413 #jot-coord,
1414 #jot-preview,
1415 #jot-title-wrap,
1416 #jot-category-wrap,
1417 #jot-text-wrap,
1418 #profile-jot-text-loading,
1419 #profile-attach-wrapper,
1420 #profile-link-wrapper,
1421 #profile-jot-banner-wrapper {}
1422
1423 .contact-h4 {
1424         font-size: 1.2em;
1425 }
1426
1427 /* ======== */
1428 /* = Tabs = */
1429 /* ======== */
1430
1431 .tabs {
1432         min-width: 400px;
1433         list-style: none;
1434         padding: 20px 0px 0px;
1435         font-size: 0.9em;
1436 }
1437
1438 .tabs li {
1439         display: inline;
1440 }
1441
1442 .tab {
1443         padding: 5px 10px 5px 10px;
1444         display: inline-block;
1445         margin-bottom: 5px;
1446         margin-right: 5px;
1447         font-style: bold;
1448 }
1449
1450 .tab:hover {
1451         padding: 5px 10px 5px 10px;
1452 }
1453
1454 /* ========= */
1455 /* = Posts = */
1456 /* ========= */
1457
1458 .wall-item-name {
1459         font-style: bold !important;
1460         border: 0px !important;
1461         border-radius: 0px !important;
1462         box-shadow: none !important;
1463 }
1464
1465 .wall-item-outside-wrapper {
1466         max-width: 100%;
1467         border-bottom: 1px solid #dedede;
1468         margin-top: 10px;
1469         margin-bottom: 20px;
1470         padding-right: 10px;
1471         padding-left: 12px;
1472         background: none repeat scroll 0 0 #FFFFFF;
1473         border: 1px solid #7C7D7B;
1474         border-radius: 5px;
1475                 -moz-border-radius: 5px;
1476                 -webkit-border-radius: 5px;
1477         box-shadow: 0 0 8px #BDBDBD;
1478                 -moz-box-shadow: 0 0 8px #BDBDBD;
1479                 -webkit-box-shadow: 0 0 8px #BDBDBD;
1480 }
1481
1482 .wall-item-outside-wrapper-end {
1483         clear: both;
1484 }
1485
1486 .wall-item-content-wrapper {
1487         position: relative;
1488         max-width: 100%;
1489         padding-top: 10px;
1490 }
1491
1492 .wall-item-comment-wrapper {
1493         margin-left: 10px;
1494 }
1495
1496 .wall-item-photo-menu-button {
1497         display: none;
1498         text-indent: -99999px;
1499         background: #eeeeee url("images/menu-user-pin.png") no-repeat 35px center;
1500         position: absolute;
1501         overflow: hidden;
1502         height: 20px;
1503         width: 100%;
1504         top: 82px;
1505         left: 0;
1506         border-right: 1px solid #7C7D7B;
1507         border-left: 1px solid #7C7D7B;
1508         border-bottom: 1px solid #7C7D7B;
1509         box-shadow: 0 0 8px #BDBDBD;
1510                 -moz-box-shadow: 0 0 8px #BDBDBD;
1511                 -webkit-box-shadow: 0 0 8px #BDBDBD;
1512         border-radius: 0px 0px 5px  5px;
1513                 -webkit-border-radius: 0px 0px 5px  5px;
1514                 -moz-border-radius: 0px 0px 5px  5px;
1515 }
1516
1517 .wall-item-info {
1518         float: left;
1519         width: 100px;
1520 }
1521
1522 .wall-item-photo-wrapper {
1523         width: 80px;
1524         height: 80px;
1525         padding: 0;
1526         position: relative;
1527         /*border: 1px solid #7C7D7B;
1528         border-radius: 5px;
1529                 -webkit-border-radius: 5px;
1530                 -moz-border-radius: 5px;
1531         box-shadow: 0 0 8px #BDBDBD;
1532                 -moz-box-shadow: 0 0 8px #BDBDBD;
1533                 -webkit-box-shadow: 0 0 8px #BDBDBD;*/
1534 }
1535
1536 .wall-item-photo {
1537         border: 0px solid #7C7D7B;
1538         border-radius: 2px;
1539                 -webkit-border-radius: 2px;
1540                 -moz-border-radius: 2px;
1541         /*box-shadow: 0 0 8px #BDBDBD;
1542                 -moz-box-shadow: 0 0 8px #BDBDBD;
1543                 -webkit-box-shadow: 0 0 8px #BDBDBD;*/
1544 }
1545
1546 .wall-item-tools {
1547         filter: alpha(opacity=60);
1548         opacity: 0.7;
1549         transition: all 0.25s ease-in-out;
1550                 -webkit-transition: all 0.25s ease-in-out;
1551                 -moz-transition: all 0.25s ease-in-out;
1552         margin-top: 20px;
1553         padding-bottom: 5px;
1554         float: right;
1555         width: auto;
1556 }
1557
1558 .wall-item-tools:hover {
1559         filter: alpha(opacity=100);
1560         opacity: 1;
1561         transition: all 0.25s ease-in-out;
1562                 -webkit-transition: all 0.25s ease-in-out;
1563                 -moz-transition: all 0.25s ease-in-out;
1564 }
1565
1566 .wall-item-social {
1567         filter: alpha(opacity=60);
1568         opacity: 0.7;
1569         transition: all 0.25s ease-in-out;
1570                 -webkit-transition: all 0.25s ease-in-out;
1571                 -moz-transition: all 0.25s ease-in-out;
1572         margin-top: 20px;
1573         margin-left: 0px;
1574         padding-bottom: 5px;
1575         float: left;
1576         width: auto;
1577 }
1578
1579 .wall-item-social:hover {
1580         filter: alpha(opacity=100);
1581         opacity: 1;
1582         transition: all 0.25s ease-in-out;
1583                 -webkit-transition: all 0.25s ease-in-out;
1584                 -moz-transition: all 0.25s ease-in-out;
1585 }
1586
1587 .wall-item-outside-wrapper.comment .wall-item-tools {
1588         float: right;
1589 }
1590
1591 .wall-item-like-buttons {
1592         float: left;
1593 }
1594
1595 .wall-item-like-buttons a.icon {
1596         float: left;
1597         margin-right: 10px;
1598         display: inline;
1599 }
1600 .wall-item-like-buttons a.self {
1601         background-color: rgba(52, 101, 164, .5);
1602         border-radius: 6px;
1603 }
1604
1605 .wall-item-links-wrapper {
1606         width: 30px;
1607         float: left;
1608 }
1609
1610 .wall-item-delete-wrapper {
1611         float: left;
1612         margin-right: 10px;
1613 }
1614
1615 .wall-item-links-wrapper a.icon {
1616         float: left;
1617         margin-right: 10px;
1618         display: inline;
1619 }
1620
1621 .pencil {
1622         float: left;
1623         margin-right: 20px;
1624 }
1625
1626 .pin-item,
1627 .star-item,
1628 .tag-item {
1629         float: left;
1630 }
1631
1632 .wall-item-title {
1633         font-size: 1.2em;
1634         font-weight: bold;
1635         padding-top: 5px;
1636         margin-left: 100px;
1637 }
1638
1639 .wall-item-body {
1640         margin-left: 100px;
1641         padding-right: 10px;
1642         padding-top: 5px;
1643         max-width: 100%;
1644 }
1645
1646 .wall-item-body img {
1647         max-width: 100%;
1648         height: auto;
1649         border-radius: 0;
1650 }
1651
1652 .wall-item-body p {
1653         font-size: 0.8em;
1654 }
1655
1656 .wall-item-lock-wrapper {
1657         float: right;
1658 }
1659
1660 .wall-item-dislike,
1661 .wall-item-like {
1662         clear: left;
1663         font-size: 0.9em;
1664         margin: 0px 0px 10px 0px;
1665         padding-left: 10px;
1666 }
1667
1668 .wall-item-author {
1669         font-size: 0.9em;
1670         margin: 0px 0px 0px 100px;
1671         padding-left: 0px;
1672 }
1673
1674 .wall-item-author a {
1675         color: #898989;
1676 }
1677
1678 .wall-item-ago {
1679         display: inline;
1680         padding-left: 0px;
1681         color: #898989;
1682 }
1683
1684 .wall-item-wrapper-end {
1685         clear:both;
1686 }
1687
1688 .wall-item-location {
1689         margin-top: 5px;
1690         overflow: hidden;
1691         text-overflow: ellipsis;
1692                 -o-text-overflow: ellipsis;
1693 }
1694
1695 .wall-item-location .icon {
1696         float: left;
1697 }
1698
1699 .wall-item-location > a {
1700         margin-left: 0px;
1701         margin-right: 3px;
1702         font-size: 0.9em;
1703         display: block;
1704         font-variant: small-caps;
1705         color: #898989;
1706 }
1707
1708 .wall-item-location .smalltext {
1709         margin-left: 0px;
1710         font-size: 0.9em;
1711         display: block;
1712 }
1713
1714 .wall-item-location > br {
1715         display: none;
1716 }
1717
1718 .wall-item-conv a{
1719         font-size: 0.9em;
1720         color: #898989;
1721 }
1722
1723 .wallwall .wwto {
1724         left: -10px;
1725         margin: 0;
1726         position: absolute;
1727         top: 65px;
1728         width: 30px;
1729         z-index: 900;
1730         width: 30px;
1731         height: 30px;
1732 }
1733
1734 .wallwall .wwto img {
1735         width: 30px!important;
1736         height: 30px!important;
1737 }
1738
1739 .wallwall .wall-item-photo-end {
1740         clear: both;
1741 }
1742
1743 .wall-item-arrowphoto-wrapper {
1744         position: absolute;
1745         left: 20px;
1746         top: 70px;
1747         z-index: 950;
1748 }
1749
1750 .wall-item-photo-menu {
1751         display: none;
1752         min-width: 88px;
1753         color: #2e3436;
1754         border-top: 1px;
1755         background: #eeeeee;
1756         border-right: 1px solid #7C7D7B;
1757         border-left: 1px solid #7C7D7B;
1758         border-bottom: 1px solid #7C7D7B;
1759         position: absolute;
1760         left: 0px;
1761         top: 101px;
1762         display: none;
1763         z-index: 10000;
1764         border-radius: 0px 5px 5px 5px;
1765                 -webkit-border-radius: 0px 5px 5px 5px;
1766                 -moz-border-radius: 0px 5px 5px 5px;
1767         box-shadow: 0 0 8px #BDBDBD;
1768                 -moz-box-shadow: 0 0 8px #BDBDBD;
1769                 -webkit-box-shadow: 0 0 8px #BDBDBD;
1770
1771 }
1772
1773 .fakelink wall-item-photo-menu-button {
1774         -webkit-border-radius: 0px 5px 5px 5px;
1775         -moz-border-radius: 0px 5px 5px 5px;
1776         border-radius: 0px 5px 5px 5px;
1777         box-shadow: 0 0 8px #BDBDBD;
1778                 -moz-box-shadow: 0 0 8px #BDBDBD;
1779                 -webkit-box-shadow: 0 0 8px #BDBDBD;
1780 }
1781
1782 .wall-item-photo-menu ul {
1783         margin: 0px;
1784         padding: 0px;
1785         list-style: none;
1786 }
1787
1788 .wall-item-photo-menu li a {
1789         white-space: nowrap;
1790         display: block;
1791         padding: 5px 2px;
1792         color: #2e3436;
1793 }
1794
1795 .wall-item-photo-menu li a:hover {
1796         color: #efefef;
1797         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
1798         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
1799         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
1800         background-color: #1873a2;
1801 }
1802
1803 .wall-item-container .wall-item-content .type-link img,
1804 .type-link img {
1805   max-width: 160px;
1806   max-height: 160px;
1807   float: left;
1808   margin-right: 10px;
1809 }
1810 .type-link blockquote {
1811   margin-left: 160px;
1812   max-height: 160px;
1813   overflow: hidden;
1814 }
1815 .type-link .oembed {
1816 }
1817
1818 .shared_header {
1819   height: 32px;
1820   color: #999;
1821   border-top: 1px solid #D2D2D2;
1822   padding-top: 5px;
1823   margin-top: 5px;
1824 }
1825
1826 .shared_header a {
1827   color: black;
1828   -webkit-transition: all 0.2s ease-in-out;
1829   -moz-transition: all 0.2s ease-in-out;
1830   -o-transition: all 0.2s ease-in-out;
1831   -ms-transition: all 0.2s ease-in-out;
1832   transition: all 0.2s ease-in-out;
1833 }
1834
1835 .shared_header a:hover {
1836   color: #36c;
1837 }
1838
1839 .shared_header img {
1840   -webkit-border-radius: 4px;
1841   -moz-border-radius: 4px;
1842   border-radius: 4px;
1843   float: left;
1844 }
1845
1846 .shared_header span {
1847   margin-left: 9px;
1848 }
1849
1850 blockquote.shared_content {
1851   margin-left: 32px;
1852   color: #000;
1853   border: none;
1854 }
1855
1856 .icon.drop,
1857 .icon.drophide {
1858         float: left;
1859 }
1860
1861 #item-delete-selected-end,
1862 #item-delete-selected {
1863         overflow: auto;
1864         margin-top: 0px;
1865         float: right;
1866         width: 250px;
1867 }
1868
1869 #item-delete-selected-icon {}
1870
1871 pre code {
1872         font-family: Courier, monospace;
1873         display: block;
1874         overflow: auto;
1875         border: 1px solid #444;
1876         background: #EEE;
1877         color: #444;
1878         padding: 10px;
1879         margin-top: 10px;
1880 }
1881
1882
1883 /* ============ */
1884 /* = Comments = */
1885 /* ============ */
1886
1887  .ccollapse-wrapper {
1888         font-size: 0.9em;
1889         color: #898989;
1890         margin-left: 60px;
1891 }
1892
1893 #tread-wrapper {}
1894
1895 .tread-wrapper  {
1896         border: 0px solid #CDCDCD;
1897         border-radius: 5px;
1898                 -moz-border-radius: 5px;
1899                 -webkit-border-radius: 5px;
1900         margin-bottom: 20px;
1901         background-color: #E2E2E2;
1902 }
1903
1904 .collapsed-comments,
1905 .hide-comments,
1906 .hide-comments-outer,
1907 .wall-item-outside-wrapper.comment {
1908         margin-left: 30px;
1909         margin-bottom: 20px;
1910 }
1911
1912 .wall-item-outside-wrapper.comment .wall-item-photo {
1913         width: 40px!important;
1914         height: 40px!important;
1915         border-radius: 3px;
1916                 -webkit-border-radius: 3px;
1917                 -moz-border-radius: 3px;
1918 }
1919
1920 .wall-item-outside-wrapper.comment .wall-item-photo-wrapper {
1921         width: 40px;
1922         height: 40px;
1923         border-radius: 3px;
1924                 -webkit-border-radius: 3px;
1925                 -moz-border-radius: 3px;
1926 }
1927
1928 .wall-item-outside-wrapper.comment .wall-item-photo-menu-button {
1929         top: 42px;
1930         background-position: 15px center;
1931 }
1932
1933 .wall-item-outside-wrapper.comment .wall-item-info {
1934         width: 60px;
1935 }
1936
1937 .wall-item-outside-wrapper.comment .wall-item-body {
1938         margin-left: 60px;
1939         max-width: 100%;
1940         padding-right: 10px;
1941         padding-left: 0px;
1942 }
1943
1944 .wall-item-outside-wrapper.comment .wall-item-author {
1945         margin-left: 60px;
1946 }
1947
1948 .wall-item-outside-wrapper.comment .wall-item-photo-menu {
1949         min-width: 50px;
1950         top: 60px;
1951 }
1952 .icollapse-wrapper {
1953         font-size: 0.9em;
1954         color: #898989;
1955 }
1956
1957 .comment-wwedit-wrapper,
1958 .comment-edit-wrapper {
1959         margin: 0px 0px 5px 0px;
1960 }
1961
1962 .comment-wwedit-wrapper img,
1963 .comment-edit-wrapper img {
1964         width: 20px;
1965         height: 20px;
1966         margin-top: 5px;
1967 }
1968
1969 .comment-edit-photo-link {
1970         float: left;
1971         width: 30px;
1972 }
1973
1974 .comment-edit-text-empty {
1975         width: 98%;
1976         max-width: 672px;
1977         height: 20px;
1978         color: #babdb6;
1979         transition: all 0.5s ease-in-out;
1980                 -webkit-transition: all 0.5s ease-in-out;
1981                 -moz-transition: all 0.5s ease-in-out;
1982 }
1983
1984 .comment-edit-text-empty:hover {
1985         color: #999999;
1986 }
1987
1988 .comment-edit-text-full {
1989         width: 98%;
1990         max-width: 672px;
1991         height: 6em;
1992         transition: all 0.5s ease-in-out;
1993                 -webkit-transition: all 0.5s ease-in-out;
1994                 -moz-transition: all 0.5s ease-in-out;
1995 }
1996
1997 .comment-edit-submit-wrapper {
1998         width: 98%;
1999         max-width: 672px;
2000         margin-left: 20px;
2001         text-align: left;
2002 }
2003
2004 .comment-edit-submit {
2005         height: 22px;
2006         padding: 5px 5px;
2007         background-color: #a2a2a2;
2008         color: #eeeeec;
2009         border: 1px solid #7C7D7B;
2010         border-radius: 5px;
2011                 -moz-border-radius: 5px;
2012                 -webkit-border-radius: 5px;
2013 }
2014
2015 .comment-edit-submit:hover {
2016         background-color: #1873a2;
2017         border: 1px solid #7C7D7B;
2018         border-radius: 5px;
2019                 -moz-border-radius: 5px;
2020                 -webkit-border-radius: 5px;
2021         box-shadow: 0 0 8px #BDBDBD;
2022                 -moz-box-shadow: 0 0 8px #BDBDBD;
2023                 -webkit-box-shadow: 0 0 8px #BDBDBD;
2024 }
2025
2026 .comment-edit-submit:active {
2027         background-color: #1873a2;
2028 }
2029
2030 #item-delete-selected-desc {
2031         color: #898989;
2032         float: right;
2033 }
2034
2035 .wall-item-body pre code {
2036         font-family: Courier, monospace;
2037         display: block;
2038         overflow: auto;
2039         border: 1px solid #cccccc;
2040         border-width: 1px 1px 1px 3px;
2041         padding-left: 5px;
2042         margin-top: 10px;
2043 }
2044
2045 /* =========== */
2046 /* = Profile = */
2047 /* =========== */
2048
2049 .advanced-profile-content {
2050         margin-top: 5px;
2051         margin-bottom: 10px;
2052         margin-left: 30px;
2053         width: 60%;
2054 }
2055
2056 .advanced-profile-label {
2057         margin-top: 10px;
2058         margin-bottom: 0px;
2059         padding-bottom: 5px;
2060         font-size: 18px;
2061 }
2062
2063 div[id$="wrapper"] {
2064         height: 100%;
2065 }
2066
2067 div[id$="wrapper"] br {
2068         clear: left;
2069 }
2070
2071 #advanced-profile-with {
2072         margin-left: 20px;
2073 }
2074
2075 #profile-listing-desc,
2076 #profile-listing-new-link-wrapper {
2077         float: left;
2078         display: inline;
2079         padding: 5px 10px 5px 10px;
2080         width: 150px;
2081         margin:20px 10px 0 0;
2082         display: inline-block;
2083         font-style: bold;
2084         text-align: center;
2085 }
2086
2087 .profile-listing-name {
2088         font-size: 1em;
2089 }
2090 .profile-listing-name a {
2091         color: #898989;
2092 }
2093
2094 #profile-edit-links {
2095         margin-left: 0;
2096 }
2097
2098 #profile-edit-links li {
2099         display: inline;
2100         width: 150px;
2101         margin-bottom: 20px;
2102         margin-top: 20px;
2103         background-color: #a2a2a2;
2104         color: #eeeeec;
2105         padding: 5px 10px 5px 10px;
2106         margin-right: 5px;
2107         font-style: bold;
2108         border-radius: 5px;
2109                 -moz-border-radius: 5px;
2110                 -webkit-border-radius: 5px;
2111 }
2112
2113 #profile-edit-links li a {
2114         color: #efefef;
2115 }
2116
2117 #profile-edit-links li:hover {
2118         background-color: #1873a2;
2119 }
2120
2121 #profile-edit-links li:active {
2122         background-color: #1873a2;
2123 }
2124
2125 #profile-edit-links-end {
2126         clear: both;
2127         margin-bottom: 15px;
2128 }
2129
2130 .profile-edit-side-div {
2131         margin-top: 10px;
2132         margin-right: 0px;
2133         margin-left: 180px;
2134         float: left;
2135         position: absolute;
2136 }
2137
2138 #profile-menu {
2139         display: none;
2140 }
2141
2142 #cropimage-wrapper {
2143         float:left;
2144 }
2145
2146 #crop-image-form {
2147         clear:both;
2148 }
2149
2150 .profile-match-name {
2151         float: left;
2152         text-align: left;
2153         overflow: hidden;
2154 }
2155
2156 .profile-match-name a:hover {
2157         color: #999;
2158 }
2159
2160 .profile-match-wrapper {
2161         position: relative;
2162         float:left;
2163         height:80px;
2164         padding:5px;
2165         width:80px;
2166         margin-bottom: 70px;
2167         margin-right: 29px;
2168         background-color: #f6f6f6;
2169         border: 1px solid #7C7D7B;
2170         box-shadow: 0 0 8px #BDBDBD;
2171                 -moz-box-shadow: 0 0 8px #BDBDBD;
2172                 -webkit-box-shadow: 0 0 8px #BDBDBD;
2173 }
2174
2175 .profile-match-break,
2176 .profile-match-end {
2177         clear: both;
2178 }
2179
2180 .profile-match-connect {
2181         text-align: left;
2182         font-weight: bold;
2183 }
2184 .profile-match-ignore {
2185         height: 0!important;
2186 }
2187
2188 #profile-match-wrapper-end {
2189         clear: both;
2190 }
2191 .profile-match-end {
2192         clear: both;
2193 }
2194
2195 .profile-match-photo {
2196         float: left;
2197         margin-right: 10px;
2198         margin-bottom: 5px;
2199 }
2200
2201 /* ========== */
2202 /* = Photos = */
2203 /* ========== */
2204
2205 .photos {
2206         height: auto;
2207         overflow: auto;
2208 }
2209
2210 .photo {
2211         height: 203px !important;
2212         width: 203px !important;
2213         border: 1px solid #7C7D7B;
2214         box-shadow: 0 0 8px #BDBDBD;
2215                 -moz-box-shadow: 0 0 8px #BDBDBD;
2216                 -webkit-box-shadow: 0 0 8px #BDBDBD;
2217                 -moz-box-shadow: 0 0 8px #BDBDBD;
2218                 -webkit-box-shadow: 0 0 8px #BDBDBD;
2219         border-radius: 5px;
2220                 -moz-border-radius: 5px;
2221                 -webkit-border-radius: 5px;
2222 }
2223
2224 #sidebar-photos-albums {
2225 }
2226
2227 #photo-albums-upload-link {
2228         margin: 20px;
2229 }
2230
2231 #sidebar-photos-albums h3:before {
2232         content: url("images/photography.png");
2233         padding-right: 10px;
2234         vertical-align: middle;
2235 }
2236
2237 #sidebar-photos-albums li {
2238         font-size: 14px;
2239         font-variant: none;
2240         text-align: left;
2241         padding-left: 20px;
2242         margin-bottom: 5px;
2243 }
2244
2245 #photo-top-links {
2246         width: 130px;
2247         margin-bottom: 20px;
2248         margin-top: 20px;
2249         background-color: #a2a2a2;
2250         color: #eeeeec;
2251         padding: 5px 10px 5px 10px;
2252         margin-right: 5px;
2253         font-style: bold;
2254         border-radius: 5px;
2255                 -moz-border-radius: 5px;
2256                 -webkit-border-radius: 5px;
2257 }
2258
2259 #photo-top-links a {
2260         color: #efefef;
2261 }
2262
2263 #photo-top-links:hover {
2264         background-color: #1873a2;
2265 }
2266
2267 #photo-top-links:active {
2268         background-color: #1873a2;
2269 }
2270
2271 .photo-album-image-wrapper {
2272         float: left;
2273         margin: 0px 10px 10px 0px;
2274         padding-bottom: 30px;
2275         position: relative;
2276 }
2277
2278 .photo-top-image-wrapper {
2279         float: left;
2280         width: 180px;
2281         height: 180px;
2282         margin: 0px 10px 10px 0px;
2283         padding-bottom: 30px;
2284         position: relative;
2285 }
2286
2287 #photo-album-wrapper-inner {
2288         position: relative;
2289         float: left;
2290         width: 180px;
2291         height: 180px;
2292         overflow: hidden;
2293 }
2294
2295 #photo-photo {
2296         max-width: 85%;
2297         height: auto;
2298 }
2299
2300 #photo-photo img {
2301         max-width: 100%
2302 }
2303
2304 .photo-top-image-wrapper a:hover,
2305 #photo-photo a:hover,
2306 .photo-album-image-wrapper a:hover {
2307         border-bottom: 0px;
2308 }
2309
2310 .photo-top-photo {
2311         width: 180px;
2312 }
2313 .photo-album-photo {}
2314
2315 .photo-top-album-name {
2316         position: absolute;
2317         bottom: 0px;
2318         padding: 0px 5px;
2319         font-weight: bold;
2320         font-stretch: semi-expanded;
2321 }
2322
2323 .photo-top-album-name a {
2324         text-align: center;
2325         color: #6e6e6e;
2326 }
2327 .caption {
2328         position: absolute;
2329         bottom: 0px;
2330         margin: 0px 5px;
2331         text-align: center;
2332         color: #6e6e6e;
2333         font-size: 0.9em;
2334 }
2335
2336 #photo-photo {
2337         position: relative;
2338         float: left;
2339 }
2340
2341 #photo-caption {
2342         margin-top: 10px;
2343         color: #6E6E6E;
2344         font-size: 1.1em;
2345 }
2346
2347 #photo-photo-end {
2348         clear: both;
2349 }
2350
2351 #photo-prev-link,
2352 #photo-next-link {
2353         position: absolute;
2354         width: 10%;
2355         height: 100%;
2356         background-color: rgba(255,255,255,0.2);
2357         opacity: 0;
2358         transition: all 0.2s ease-in-out;
2359                 -webkit-transition: all 0.2s ease-in-out;
2360                 -moz-transition: all 0.2s ease-in-out;
2361         background-position: center center;
2362         background-repeat: no-repeat;
2363 }
2364
2365 #photo-prev-link {
2366         left: 0px;
2367         top: 0px;
2368         background-image: url('images/prev.png');
2369 }
2370
2371 #photo-next-link {
2372         right: 0px;
2373         top: 0px;
2374         background-image: url('images/next.png');
2375 }
2376
2377 #photo-prev-link a,
2378 #photo-next-link a {
2379         display: block;
2380         width: 100%;
2381         height: 100%;
2382         overflow: hidden;
2383         text-indent: -900000px;
2384 }
2385
2386 #photo-prev-link:hover,
2387 #photo-next-link:hover {
2388         opacity: 1;
2389         transition: all 0.2s ease-in-out;
2390                 -webkit-transition: all 0.2s ease-in-out;
2391                 -moz-transition: all 0.2s ease-in-out;
2392 }
2393
2394 #photo-next-link .icon,
2395 #photo-prev-link .icon {
2396         display: none;
2397 }
2398
2399 #photos-upload-spacer,
2400 #photos-upload-new-wrapper,
2401 #photos-upload-exist-wrapper {
2402         margin-bottom: 1em;
2403 }
2404
2405 #photos-upload-existing-album-text,
2406 #photos-upload-newalbum-div {
2407         color: #909090;
2408         padding: 3px 0px;
2409         width: 300px;
2410 }
2411
2412 #photos-upload-album-select,
2413 #photos-upload-newalbum {
2414         width: 400px;
2415         margin-bottom: 10px;
2416 }
2417
2418 #photos-upload-perms-menu {
2419         width: 180px;
2420         padding: 7px;
2421 }
2422
2423 #photos-upload-perms-menu .icon {
2424         display: none;
2425 }
2426
2427 #photos-upload-perms {
2428         margin-top: 10px;
2429 }
2430
2431 .photos-upload-perms {}
2432
2433 select, input {
2434         border: 1px solid #b0b0b0;
2435         padding: 2px;
2436         border-radius: 3px;
2437                 -moz-border-radius: 3px;
2438                 -webkit-border-radius: 3px;
2439 }
2440
2441 select[size],
2442 select[multiple],
2443 select[size][multiple] {
2444         margin: 5px 0px 10px 0px;
2445 }
2446
2447 select {
2448         -webkit-appearance: menulist;
2449         box-sizing: border-box;
2450         -webkit-box-align: center;
2451         cursor: default;
2452 }
2453
2454 textarea, keygen {
2455         margin-top: 3px;
2456         font-size: 0.9em;
2457         letter-spacing: normal;
2458         word-spacing: normal;
2459         line-height: 1.2em;
2460         text-transform: none;
2461         text-indent: 0px;
2462         text-shadow: none;
2463         display: inline-block;
2464         text-align: -webkit-auto;
2465 }
2466
2467 input {
2468         margin-top: 3px;
2469         margin-right: 10px;
2470         text-align: -webkit-auto;
2471 }
2472
2473 .qq-upload-button {
2474         border-radius: 5px;
2475                 -moz-border-radius: 5px;
2476                 -webkit-border-radius: 5px;
2477 }
2478
2479 #album-edit-link {
2480         width: 70px;
2481         margin-bottom: 20px;
2482         margin-top: 20px;
2483         background-color: #a2a2a2;
2484         color: #eeeeec;
2485         padding: 5px 10px 5px 10px;
2486         margin-right: 5px;
2487         font-style: bold;
2488         border-radius: 5px;
2489                 -moz-border-radius: 5px;
2490                 -webkit-border-radius: 5px;
2491 }
2492
2493 #album-edit-link  a {
2494         color: #efefef;
2495 }
2496
2497 #album-edit-link:hover {
2498         background-color: #1873a2;
2499 }
2500
2501 #photo-edit-link-wrap {
2502         margin-bottom: 10px;
2503 }
2504
2505 #photo_edit_form {
2506         width: 500px;
2507         margin-top: 20px;
2508         text-align: left;
2509 }
2510
2511 input #photo_edit_form {
2512         display: block;
2513         width: 100%;
2514 }
2515
2516 #photo-edit-perms-menu {
2517         float: left;
2518         display: inline;
2519         margin-top: 10px;
2520         margin-right: 10px;
2521         padding: 4px;
2522         width: 100px;
2523 }
2524
2525 #photo-edit-perms-menu .icon {
2526         display: none;
2527 }
2528
2529 #photo-edit-delete-button {
2530         float: left;
2531         display: inline;
2532         margin-left: 190px;
2533 }
2534
2535 #photo-album-edit-wrapper {
2536         margin-bottom: 10px;
2537 }
2538
2539 /* ============ */
2540 /* = Messages = */
2541 /* ============ */
2542
2543 #prvmail-wrapper,
2544 .mail-conv-detail,
2545 .mail-list-detail {
2546         position: relative;
2547         width: 550px;
2548         padding: 50px;
2549         margin: 20px 0 0 0;
2550         background-color: #fff;
2551         -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2552         -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2553         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2554         border: 1px solid #7C7D7B;
2555         border-radius: 5px;
2556                 -moz-border-radius: 5px;
2557                 -webkit-border-radius: 5px;
2558 }
2559
2560 #prvmail-wrapper:before,
2561 #prvmail-wrapper:after,
2562 .mail-conv-detail:before,
2563 .mail-conv-detail:after,
2564 .mail-list-detail:before,
2565 .mail-list-detail:after {
2566         position: absolute;
2567         width: 40%;
2568         height: 10px;
2569         content: ' ';
2570         left: 12px;
2571         bottom: 12px;
2572         background: transparent;
2573         transform: skew(-5deg) rotate(-5deg);
2574                 -webkit-transform: skew(-5deg) rotate(-5deg);
2575                 -moz-transform: skew(-5deg) rotate(-5deg);
2576                 -ms-transform: skew(-5deg) rotate(-5deg);
2577                 -o-transform: skew(-5deg) rotate(-5deg);
2578         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2579                 -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2580                 -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2581         z-index: -1;
2582         border: 1px solid #7C7D7B;
2583         border-radius: 5px;
2584                 -moz-border-radius: 5px;
2585                 -webkit-border-radius: 5px;
2586 }
2587
2588 #prvmail-wrapper:after,
2589 .mail-conv-detail:after,
2590 .mail-list-detail:after {
2591         left: auto;
2592         right: 12px;
2593         transform: skew(5deg) rotate(5deg);
2594                 -webkit-transform: skew(5deg) rotate(5deg);
2595                 -moz-transform: skew(5deg) rotate(5deg);
2596                 -ms-transform: skew(5deg) rotate(5deg);
2597                 -o-transform: skew(5deg) rotate(5deg);
2598         border: 1px solid #7C7D7B;
2599         border-radius: 5px;
2600                 -moz-border-radius: 5px;
2601                 -webkit-border-radius: 5px;
2602 }
2603
2604 .prvmail-text {
2605         width: 100%;
2606 }
2607
2608 #prvmail-form input
2609
2610 #prvmail-subject {
2611         width: 490px;
2612         padding-left: 10px;
2613         font-size: 1.1em;
2614         font-style: bold;
2615 }
2616
2617 #prvmail-subject .input {
2618         border: none !important;
2619 }
2620
2621 #prvmail-subject-label {}
2622
2623 #prvmail-to {
2624         padding-left: 10px;
2625 }
2626
2627 #prvmail-to-label {}
2628
2629 #prvmail-message-label {
2630         font-size: 1em;
2631 }
2632
2633 #prvmail-submit-wrapper {
2634         margin-top: 10px;
2635 }
2636
2637 #prvmail-submit {
2638         float: right;
2639         margin-top: 0px;
2640         margin-right: 0px;
2641 }
2642
2643 #prvmail-upload {
2644 margin-left: 0px;
2645 }
2646
2647 #prvmail-submit-wrapper > div {
2648         margin-right: 5px;
2649         float: left;
2650 }
2651
2652 .mail-list-outside-wrapper {
2653         margin-top: 20px;
2654 }
2655
2656 .mail-list-sender {
2657         float: left;
2658         padding: 2px;
2659         background-color: #efefef;
2660         border: 1px solid #7C7D7B;
2661         border-radius: 3px;
2662                 -moz-border-radius: 3px;
2663                 -webkit-border-radius: 3px;
2664         box-shadow: 0 0 8px #BDBDBD;
2665                 -moz-box-shadow: 0 0 8px #BDBDBD;
2666                 -webkit-box-shadow: 0 0 8px #BDBDBD;
2667 }
2668
2669 .mail-list-detail {
2670         margin-left: 100px;
2671         width: 600px;
2672         min-height: 70px;
2673         padding: 20px;
2674         padding-top: 10px;
2675         border: 1px solid #7C7D7B;
2676 }
2677
2678 .mail-list-sender-name {
2679         font-size: 1.1em;
2680         display: inline;
2681 }
2682
2683 .mail-list-date {
2684         float: right;
2685         clear: block;
2686         display: inline;
2687         font-size: 0.9em;
2688         padding-left: 10px;
2689         font-stretch: ultra-condensed;
2690 }
2691
2692 .mail-list-subject {
2693         clear: block;
2694         font-size: 1.2em;
2695         padding-top: 20px;
2696         padding-right: 50px;
2697 }
2698
2699 .mail-list-subject a {
2700         color: #626262;
2701 }
2702
2703 .mail-list-delete-wrapper {
2704         float: right;
2705 }
2706
2707 .mail-list-outside-wrapper-end {
2708         clear: both;
2709 }
2710
2711 .mail-conv-outside-wrapper {
2712         margin-bottom: 10px;
2713         margin-top: 30px;
2714 }
2715
2716 .mail-conv-sender {
2717         float: left;
2718         margin: 0px 5px 5px 0px;
2719 }
2720
2721 .mail-conv-sender-photo {
2722         width: 64px;
2723         height: 64px;
2724         border-radius: 3px 3px 3px 3px;
2725 }
2726
2727 .mail-conv-sender-name {
2728         float: left;
2729         font-style: bold;
2730 }
2731
2732 .mail-conv-date {
2733         float: right;
2734 }
2735
2736 .mail-conv-subject {
2737         clear: right;
2738         font-weight: bold;
2739         font-size: 1.2em;
2740 }
2741
2742 .mail-conv-body {
2743         clear: both;
2744 }
2745
2746 .mail-conv-detail {
2747         width: 500px;
2748         padding: 20px;
2749         padding-bottom: 20px;
2750         margin-left: 20px;
2751         margin-bottom: 0px;
2752         vertical-align: middle;
2753         margin: auto;
2754         border: 1px solid #7C7D7B;
2755 }
2756
2757 .mail-conv-break {
2758         display: none;
2759         border: none;
2760 }
2761
2762 .mail-conv-delete-wrapper {
2763         padding-top: 10px;
2764         width: 510px;
2765         text-align: right;
2766 }
2767
2768 #prvmail-subject {
2769         font-weight: bold;
2770         border: 1px solid #7C7D7B;
2771 }
2772
2773 /* ========== */
2774 /* = Poke = */
2775 /* ========== */
2776 #poke-recip {
2777         float: none;
2778 }
2779
2780 /* ================= */
2781 /* = Notifications = */
2782 /* ================= */
2783
2784 #notification-show-hide-wrapper {
2785         width: 160px;
2786         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2787                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2788                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2789         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2790         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2791         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2792         background-color: #bdbdbd;
2793         border-radius: 5px;
2794                 -moz-border-radius: 5px;
2795                 -webkit-border-radius: 5px;
2796         padding: 5px 10px 5px 10px;
2797         margin-right: 5px;
2798         margin-top: 10px;
2799         font-style: bold;
2800         color: #efefef;
2801         text-align: center;
2802 }
2803
2804 #notification-show-hide-wrapper:hover {
2805         color: #efefef;
2806         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2807         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2808         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2809         background-color: #1873a2;
2810 }
2811
2812 #notification-show-hide-wrapper:active {
2813         background-color: #1873a2;
2814         position: relative;
2815         top: 1px;
2816 }
2817
2818 #notification-show-hide-wrapper a {
2819         color: #efefef;
2820 }
2821
2822 /* ============ */
2823 /* = Contacts = */
2824 /* ============ */
2825
2826 #contacts-main {
2827         margin-bottom: 10px;
2828 }
2829
2830 .contact-wrapper {
2831         float: left;
2832         width: 150px;
2833         height: 150px;
2834         overflow: auto;
2835 }
2836
2837 .view-contact-wrapper,
2838 .contact-entry-wrapper {
2839         float: left;
2840         padding-right: 10px;
2841         width: 345px;
2842         height: 120px;
2843         margin: 0 10px 10px 0px;
2844 }
2845
2846 #view-contact-end {
2847         clear: both;
2848 }
2849
2850 .contact-entry-wrapper .contact-entry-photo-wrapper {
2851         float: left;
2852         margin-right: 10px;
2853 }
2854 .contact-entry-direction-wrapper {
2855         position: absolute;
2856         top: 20px;
2857 }
2858
2859 .contact-entry-edit-links {
2860         position: absolute;
2861         top: 60px;
2862 }
2863
2864 #contacts-show-hide-link {
2865         margin-bottom: 20px;
2866         margin-top: 10px;
2867         font-weight: bold;
2868 }
2869
2870 .contact-entry-desc {
2871         overflow: hidden;
2872 }
2873
2874 .contact-entry-name, .contact-entry-connect {
2875         overflow: hidden;
2876         font: #999;
2877         font-size: 12px;
2878         font-weight: bold;
2879         margin-top: 5px;
2880 }
2881
2882 .contact-entry-details {
2883         font-size: 13px;
2884         color: #999999;
2885         white-space: nowrap;
2886         overflow: hidden;
2887         text-overflow: ellipsis;
2888 }
2889
2890 .contact-entry-photo-wrapper {
2891         position: relative;
2892         /*border: 1px solid #7C7D7B;
2893         border-radius: 3px;
2894                 -moz-border-radius: 3px;
2895                 -webkit-border-radius: 3px;
2896         box-shadow: 0 0 8px #BDBDBD;
2897                 -moz-box-shadow: 0 0 8px #BDBDBD;
2898                 -webkit-box-shadow: 0 0 8px #BDBDBD;*/
2899 }
2900
2901 .contact-entry-photo {
2902         width: 80px;
2903 }
2904
2905 .contact-entry-photo a img {
2906         width: 80px;
2907         height: 80px;
2908 }
2909
2910 .contact-entry-edit-links .icon {
2911         border: 1px solid #babdb6;
2912         border-radius: 3px;
2913                 -webkit-border-radius: 3px;
2914                 -moz-border-radius: 3px;
2915         background-color: #ffffff;
2916 }
2917
2918 #contact-edit-banner-name {
2919         font-size: 1.5em;
2920         margin-left: 30px;
2921 }
2922
2923 #contact-edit-update-now {
2924         padding: 7px;
2925         width: 165px;
2926         margin: auto;
2927         margin-left: 40px;
2928         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2929                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2930                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
2931         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2932         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2933         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2934         background-color: #bdbdbd;
2935         border-radius: 5px;
2936                 -moz-border-radius: 5px;
2937                 -webkit-border-radius: 5px;
2938         display: inline-block;
2939         color: #efefef;
2940         text-decoration: none;
2941         text-align: center;
2942 }
2943
2944 #contact-edit-update-now:hover {
2945         color: #efefef;
2946         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
2947         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
2948         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
2949         background-color: #1873a2;
2950         border: 1px solid #7C7D7B;
2951         box-shadow: 0 0 8px #BDBDBD;
2952                 -moz-box-shadow: 0 0 8px #BDBDBD;
2953                 -webkit-box-shadow: 0 0 8px #BDBDBD;
2954         border-radius: 5px;
2955                 -moz-border-radius: 5px;
2956                 -webkit-border-radius: 5px;
2957 }
2958
2959 #contact-edit-update-now:active {
2960         position: relative;
2961         top: 1px;
2962 }
2963
2964 #contact-edit-update-now a {
2965         color: #efefef;
2966         font-size: 14px;
2967         text-align: center;
2968         margin: auto;
2969 }
2970
2971 #contact-edit-info-wrapper,
2972 #contact-edit-info-end,
2973 #contact-edit-profile-select-text,
2974 #contact-edit-profile-select-end,
2975 #contact-edit-poll-wrapper,
2976 #contact-edit-end {
2977 }
2978
2979 .contact-edit-submit {
2980 }
2981
2982 #contact-profile-selector {
2983 }
2984
2985 .contact-photo-menu-button {
2986         position: absolute;
2987         background-image: url("images/photo-menu.jpg");
2988         background-position: top left;
2989         background-repeat: no-repeat;
2990         margin: 10px 0 0 0;
2991         padding: 0px;
2992         width: 16px;
2993         height: 16px;
2994         top: 64px; left:0px;
2995         overflow: hidden;
2996         text-indent: 40px;
2997         display: none;
2998 }
2999
3000 .contact-photo-menu {
3001         width: auto;
3002         border: 1px solid #ddd;
3003         background: #f1f1f1;
3004         position: absolute;
3005         left: 0px;
3006         top: 90px;
3007         display: none;
3008         z-index: 10000;
3009         box-shadow: 3px 3px 5px #888;
3010                 -moz-box-shadow: 3px 3px 5px #888;
3011                 -webkit-box-shadow: 3px 3px 5px #888;
3012 }
3013
3014 .contact-photo-menu ul {
3015         margin: 0px;
3016         padding: 0px;
3017         list-style: none;
3018 }
3019
3020 .contact-photo-menu li a {
3021         display: block;
3022         padding: 3px;
3023         color: #626262;
3024         font-size: 1em;
3025 }
3026
3027 .contact-photo-menu li a:hover {
3028         color: #FFFFFF;
3029         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3030         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3031         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3032         background-color: #1873a2;
3033         text-decoration: none;
3034 }
3035
3036 .view-contact-name {}
3037
3038 #div.side-link {
3039         background-color: #efefef;
3040         padding: 10px;
3041         margin-top: 20px;
3042 }
3043
3044 #follow-sidebar {
3045         margin-bottom: 10px;
3046 }
3047
3048 #follow-sidebar h3:before {
3049         content: url("images/user.png");
3050         padding-right: 10px;
3051         vertical-align: middle;
3052 }
3053
3054 #follow-sidebar input[type="text"] {
3055         margin-left: 3px;
3056         margin-bottom: 10px;
3057 }
3058
3059 #side-follow-submit {
3060         width: 178px;
3061         margin: 10px;
3062         text-align: center;
3063 }
3064
3065 #side-invite-link,
3066 #side-random-profile-link,
3067 #side-suggest-link,
3068 #side-match-link,
3069 #side-directory-link {
3070         width: 80%;
3071         padding: 10px;
3072         margin: auto;
3073         margin-bottom: 20px;
3074         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3075         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3076         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3077         background-color: #bdbdbd;
3078         padding: 5px 10px 5px 10px;
3079         color: #efefef;
3080         font-size: 1.1em;
3081         text-align: center;
3082         border: 1px solid #7C7D7B;
3083         border-radius: 5px;
3084                 -moz-border-radius: 5px;
3085                 -webkit-border-radius: 5px;
3086 }
3087
3088 #side-invite-link:hover,
3089 #side-random-profile-link:hover,
3090 #side-suggest-link:hover,
3091 #side-match-link:hover,
3092 #side-directory-link:hover {
3093         color: #efefef;
3094         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3095         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3096         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3097         background-color: #1873a2;
3098         border: 1px solid #7C7D7B;
3099         box-shadow: 0 0 8px #BDBDBD;
3100                 -moz-box-shadow: 0 0 8px #BDBDBD;
3101                 -webkit-box-shadow: 0 0 8px #BDBDBD;
3102         border-radius: 5px;
3103                 -moz-border-radius: 5px;
3104                 -webkit-border-radius: 5px;
3105 }
3106
3107
3108 #side-invite-link:active,
3109 #side-random-profile-link:active,
3110 #side-suggest-link:active,
3111 #side-match-link:active,
3112 #side-directory-link:active {
3113         background-color: #1873a2;
3114         position: relative;
3115         top: 1px;
3116 }
3117
3118 #side-invite-link a,
3119 #side-random-profile-link a,
3120 #side-suggest-link a,
3121 #side-match-link a,
3122 #side-directory-link a {
3123         color: #efefef;
3124 }
3125
3126
3127 #invite-message,
3128 #invite-recipients,
3129 #invite-recipient-text {
3130         padding: 10px;
3131 }
3132
3133 #side-follow-wrapper {
3134         font-size: 1em;
3135         font-weight: bold;
3136         font-stretch: semi-expanded;
3137         background-color: #f3f3f3;
3138         border: 1px solid #7C7D7B;
3139         padding: 10px;
3140         margin-top: 20px;
3141         border-radius: 5px;
3142                 -moz-border-radius: 5px;
3143                 -webkit-border-radius: 5px;
3144 }
3145
3146 #side-follow-wrapper label{
3147         font-size: 1.1em;
3148         font-variant: normal;
3149 }
3150
3151 #contact-suggest {
3152         float: left;
3153         margin-left: 10px;
3154         width: 120px;
3155         padding: 10px;
3156         margin-bottom: 20px;
3157         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3158                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3159                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3160         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3161         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3162         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3163         background-color: #bdbdbd;
3164         border-radius: 5px;
3165                 -moz-border-radius: 5px;
3166                 -webkit-border-radius: 5px;
3167         padding: 5px 10px 5px 10px;
3168         color: #efefef;
3169         font-size: 1.2em;
3170         text-align: center;
3171 }
3172
3173 #contact-suggest:hover {
3174         color: #efefef;
3175         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3176         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3177         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3178         background-color: #1873a2;
3179 }
3180
3181 #contact-suggest:active {
3182         background-color: #1873a2;
3183         position: relative;
3184         top: 1px;
3185 }
3186
3187 #contact-suggest a {
3188         color: #efefef;
3189 }
3190
3191 .crepair-label {
3192         margin-top: 10px;
3193         float: left;
3194         width: 250px;
3195 }
3196
3197 .crepair-input {
3198         margin-top: 10px;
3199         float: left;
3200         width: 200px;
3201 }
3202
3203 /* ===================================== */
3204 /* = Register, Settings, Profile Forms = */
3205 /* ===================================== */
3206
3207 #id_openid_url,
3208 .openid input {
3209         background: url(images/login-bg.gif) no-repeat;
3210         background-position: 0 50%;
3211         padding-left: 18px;
3212         width: 250px!important;
3213 }
3214
3215 .openid:hover {
3216 }
3217
3218 #profile-tabs-wrapper {
3219         padding-top: 10px;
3220 }
3221
3222 #profile-tab-status-link {
3223         border: 0px;
3224         padding: 5px 10px 5px 10px;
3225         font-style: bold;
3226 }
3227
3228 #uexport-link a {
3229         color: #efefef;
3230 }
3231
3232 #profile-tab-profile-link {
3233         border: 0px;
3234         padding: 5px 10px 5px 10px;
3235 }
3236
3237 #uexport-link {
3238         width: 140px;
3239         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3240                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3241                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3242         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7c7d7b), color-stop(1, #555753) );
3243         background: -moz-linear-gradient( center top, #7c7d7b 5%, #555753 100% );
3244         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7c7d7b', endColorstr='#555753');
3245         background-color: #7c7d7b;
3246         border-radius: 5px;
3247                 -moz-border-radius: 5px;
3248                 -webkit-border-radius: 5px;
3249         padding: 5px 10px 5px 10px;
3250         margin-bottom: 10px;
3251 }
3252
3253 #uexport-link:hover {
3254         color: #efefef;
3255         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #555753), color-stop(1, #7c7d7b) );
3256         background: -moz-linear-gradient( center top, #555753 5%, #7c7d7b 100% );
3257         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555753', endColorstr='#7c7d7b');
3258         background-color: #555753;
3259 }
3260
3261 #uexport-link:active {
3262         color: #efefef;
3263         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3264         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3265         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3266         background-color: #1873a2;
3267         position: relative;
3268         top: 1px;
3269 }
3270
3271 #settings-default-perms .fakelink {
3272         color: #efefef;
3273 }
3274
3275 #settings-default-perms {
3276         width: 260px;
3277         text-align: center;
3278         color: #EFEFEF;
3279         padding: 5px 10px 5px 10px;
3280         margin-bottom: 10px;
3281         background-color: #BDBDBD;
3282         background: -moz-linear-gradient(center top , #BDBDBD 5%, #A2A2A2 100%) repeat scroll 0 0 #BDBDBD;
3283         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3284         border: 1px solid #7C7D7B;
3285         border-radius: 5px;
3286                 -moz-border-radius: 5px;
3287                 -webkit-border-radius: 5px;
3288 }
3289
3290 #settings-default-perms:hover {
3291         color: #efefef;
3292         background-color: #555753;
3293         border: 1px solid #7C7D7B;
3294         box-shadow: 0 0 8px #BDBDBD;
3295                 -moz-box-shadow: 0 0 8px #BDBDBD;
3296                 -webkit-box-shadow: 0 0 8px #BDBDBD;
3297         border-radius: 5px;
3298                 -moz-border-radius: 5px;
3299                 -webkit-border-radius: 5px;
3300 }
3301
3302 #settings-default-perms:active {
3303         color: #efefef;
3304         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3305         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3306         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3307         background-color: #1873a2;
3308         position: relative;
3309         top: 1px;
3310 }
3311
3312 #settings-nickname-desc {
3313         width: 80%;
3314         background-color: #efefef;
3315         margin-top: 10px;
3316         margin-bottom: 10px;
3317         border-radius: 5px;
3318                 -webkit-border-radius: 5px;
3319                 -moz-border-radius: 5px;
3320         padding: 10px;
3321 }
3322
3323 #register-form div {
3324         clear: both;
3325 }
3326
3327 #profile-edit-form div {
3328         margin-bottom: 5px;
3329 }
3330
3331 #profile-edit-form div[id$='desc'] {
3332         font-size: 0.8em;
3333         margin-left: 2%;
3334 }
3335
3336 #register-form label,
3337 #profile-edit-form label {
3338         width: 575px;
3339         float: right;
3340         margin-right: 155px;
3341 }
3342
3343 #register-form span {
3344         color: #555753;
3345         display: block;
3346         margin-bottom: 20px;
3347 }
3348
3349 .settings-submit,
3350 .settings-submit-wrapper,
3351 .profile-edit-submit-wrapper {
3352         margin: 30px 0px;
3353 }
3354
3355 .profile-listing,
3356 .profile-listing-end {
3357         float: left;
3358         clear: both;
3359         margin: 20px 20px 0px 0px;
3360 }
3361
3362
3363 #register-sitename {
3364         display: inline;
3365         font-weight: bold;
3366 }
3367
3368 #register-submit-button {
3369         margin-top: 10px;
3370 }
3371
3372 #label-register-name,
3373 #label-register-email,
3374 #label-register-nickname,
3375 #label-register-openid {
3376         float: left;
3377         width: 350px;
3378         margin-top: 10px;
3379 }
3380
3381 #register-name,
3382 #register-email,
3383 #register-nickname {
3384         float: left;
3385         margin-top: 10px;
3386         width: 150px;
3387 }
3388
3389 #register-openid {
3390         float: left;
3391         margin-top: 10px;
3392         width: 130px;
3393 }
3394
3395 #register-fill-ext {
3396         margin-bottom: 25px;
3397 }
3398
3399 #register-name-end,
3400 #register-email-end,
3401 #register-nickname-end,
3402 #register-submit-end,
3403 #register-openid-end {
3404         clear: both;
3405 }
3406
3407 #register-nickname-desc {
3408         margin-top: 30px;
3409         width: 650px;
3410 }
3411
3412 /* ===================== */
3413 /* = Contacts Selector = */
3414 /* ===================== */
3415
3416 #group-edit-wrapper {
3417         margin-bottom: 10px;
3418 }
3419
3420 #group-edit-name-wrapper {
3421         margin-bottom: 0px;
3422         display: inline;
3423 }
3424 #group-edit-submit-wrapper {
3425         margin-bottom: 10px;
3426         margin-right: 400px;
3427         float: right;
3428         display: inline;
3429 }
3430
3431 .group-delete-wrapper {
3432         width: 90px;
3433         display: inline;
3434         padding: 5px;
3435         margin-bottom: 10px;
3436         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3437                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3438                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3439         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3440         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3441         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3442         background-color: #bdbdbd;
3443         border-radius: 5px;
3444                 -moz-border-radius: 5px;
3445                 -webkit-border-radius: 5px;
3446 }
3447
3448 .group-delete-wrapper:hover {
3449         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3450         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3451         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3452         background-color: #1873a2;
3453 }
3454
3455 .group-delete-wrapper:active {
3456         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3457         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3458         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3459         background-color: #1873a2;
3460 }
3461
3462 .group-delete-wrapper a {
3463         color: #efefef;
3464         font-size: 0.9em;
3465 }
3466
3467 #group-edit-desc {
3468         margin: 10px 0xp;
3469 }
3470
3471 #group-new-text {
3472         font-size: 1.1em;
3473 }
3474
3475 #group-members,
3476 #prof-members {
3477         width: 83%;
3478         height: 200px;
3479         overflow: auto;
3480         border: none;
3481         background-color: #f0edf0;
3482         color: #555753;
3483         border: 1px solid #ccc;
3484         margin-bottom: 10px;
3485         padding: 10px;
3486 }
3487
3488 #group-all-contacts,
3489 #prof-all-contacts {
3490         width: 83%;
3491         height: 200px;
3492         overflow: auto;
3493         border: 1px solid #ccc;
3494         background-color: #f0edf0;
3495         padding: 10px;
3496 }
3497
3498 #group-members h3,
3499 #group-all-contacts h3,
3500 #prof-members h3,
3501 #prof-all-contacts h3 {
3502         color: #555753;
3503         margin: 0px;
3504         padding: 5px;
3505 }
3506
3507 #group-separator,
3508 #prof-separator {
3509         display: none;
3510 }
3511
3512 /* ========== */
3513 /* = Events = */
3514 /* ========== */
3515
3516 #events-reminder {}
3517
3518 .clear {
3519         clear: both;
3520         margin-top: 10px;
3521 }
3522
3523 .eventcal {
3524         float: left;
3525         font-size: 20px;
3526         padding: 20px;
3527 }
3528
3529 .vevent {
3530         position: relative;
3531         width: 400px;
3532         padding: 20px;
3533         padding-top: 10px;
3534         margin: 0 0px;
3535         margin-bottom: 10px;
3536         background-color: #fff;
3537         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3538                 -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3539                 -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
3540 }
3541
3542 .vevent:before,
3543 .vevent:after {
3544         position: absolute;
3545         width: 40%;
3546         height: 10px;
3547         content: ' ';
3548         left: 12px;
3549         bottom: 12px;
3550         background: transparent;
3551         transform: skew(-5deg) rotate(-5deg);
3552                 -webkit-transform: skew(-5deg) rotate(-5deg);
3553                 -moz-transform: skew(-5deg) rotate(-5deg);
3554                 -ms-transform: skew(-5deg) rotate(-5deg);
3555                 -o-transform: skew(-5deg) rotate(-5deg);
3556         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3557                 -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3558                 -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
3559         z-index: -1;
3560 }
3561
3562 .vevent:after {
3563         left: auto;
3564         right: 12px;
3565         transform: skew(5deg) rotate(5deg);
3566                 -webkit-transform: skew(5deg) rotate(5deg);
3567                 -moz-transform: skew(5deg) rotate(5deg);
3568                 -ms-transform: skew(5deg) rotate(5deg);
3569                 -o-transform: skew(5deg) rotate(5deg);
3570 }
3571
3572 .vevent .event-description {
3573         margin-left: 10px;
3574         margin-right: 10px;
3575         text-align: center;
3576         font-size: 1.2em;
3577         font-weight: bolder;
3578 }
3579
3580 .vevent .event-location {
3581         margin-left: 10px;
3582         margin-right: 10px;
3583         font-size: 1em;
3584         font-style: oblique;
3585         text-align: center;
3586 }
3587
3588 .vevent .event-start,
3589 .vevent .event-end  {
3590         margin-left: 20px;
3591         margin-right: 20px;
3592         margin-bottom: 2px;
3593         margin-top: 2px;
3594         font-size: 0.9em;
3595         text-align: left;
3596 }
3597
3598 #new-event-link {
3599         width: 130px;
3600         padding: 7px;
3601         margin-bottom: 10px;
3602         margin-left: 170px;
3603         box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3604                 -moz-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3605                 -webkit-box-shadow: inset 0px 1px 0px 0px #cfcfcf;
3606         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3607         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3608         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3609         background-color: #bdbdbd;
3610         border-radius: 5px;
3611                 -moz-border-radius: 5px;
3612                 -webkit-border-radius: 5px;
3613         color: #efefef;
3614 }
3615
3616 #new-event-link:hover {
3617         color: #efefef;
3618         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
3619         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
3620         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
3621         background-color: #1873a2;
3622 }
3623
3624 #new-event-link:active {
3625         background-color: #1873a2;
3626         position: relative;
3627         top: 1px;
3628 }
3629
3630 #new-event-link a {
3631         color: #efefef;
3632         text-align: center;
3633 }
3634
3635 .edit-event-link, .plink-event-link {
3636         float: left;
3637         margin-top: 4px;
3638         margin-right: 4px;
3639         margin-bottom: 15px;
3640 }
3641
3642 .event-description:before {
3643         content: url('images/calendar.png');
3644         margin-right: 15px;
3645         vertical-align: middle;
3646 }
3647
3648 .event-start,
3649 .event-end {
3650         margin-left: 10px;
3651         width: 330px;
3652 }
3653
3654 .event-start .dtstart,
3655 .event-end .dtend {
3656         float: right;
3657 }
3658
3659 .event-list-date {
3660         color: #626262;
3661         margin-bottom: 10px;
3662         font-stretch: condensed;
3663 }
3664
3665 .prevcal,
3666 .nextcal {
3667         float: left;
3668         margin-left: 32px;
3669         margin-right: 32px;
3670         margin-top: 64px;
3671 }
3672
3673 .event-calendar-end {
3674         clear: both;
3675 }
3676
3677 .calendar {
3678         width: 300px;
3679         font-family: Helvetica, Arial, sans-serif;
3680         background-color: #f1f1f1;
3681         border: 1px solid #dedede;
3682         margin-bottom: 10px;
3683         box-shadow: 5px 5px 8px #959494;
3684                 -moz-box-shadow: 5px 5px 8px #959494;
3685                 -webkit-box-shadow: 5px 5px 8px #959494;
3686 }
3687
3688 .calendar caption {
3689         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6da6c4), color-stop(1, #1873a2) );
3690         background: -moz-linear-gradient( center top, #6da6c4 5%, #1873a2 100% );
3691         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da6c4', endColorstr='#1873a2');
3692         background-color: #1873a2;
3693         padding: 10px 0px 10px 0px;
3694         width: 300px;
3695         color: #ffffff;
3696         font-weight: bold;
3697         text-align: center;
3698         box-shadow: 5px 2px 8px #959494;
3699                 -moz-box-shadow: 5px 2px 8px #959494;
3700                 -webkit-box-shadow: 5px 2px 8px #959494;
3701 }
3702
3703 .calendar td {
3704         font-size: 14px;
3705         text-align: center;
3706         padding: 3px 0px;
3707 }
3708
3709 .calendar td > a {
3710         background-color: #cdcdcd;
3711         padding: 2px;
3712         color: #000000;
3713 }
3714
3715 .calendar th {
3716         font-size: 16px;
3717 }
3718
3719 .today {
3720         font-weight: bold;
3721         text-align: center;
3722         background-color: #1873a2;
3723         color: #ffffff;
3724 }
3725
3726 #event-start-text,
3727 #event-finish-text {
3728         margin-top: 10px;
3729         margin-bottom: 5px;
3730 }
3731
3732 #event-nofinish-checkbox,
3733 #event-nofinish-text,
3734 #event-adjust-checkbox,
3735 #event-adjust-text,
3736 #event-share-checkbox {
3737         float: left;
3738 }
3739
3740 #event-datetime-break {
3741         margin-bottom: 10px;
3742 }
3743
3744 #event-nofinish-break,
3745 #event-adjust-break,
3746 #event-share-break {
3747         clear: both;
3748 }
3749
3750 #event-desc-text,
3751 #event-location-text {
3752         margin-top: 10px;
3753         margin-bottom: 5px;
3754 }
3755
3756 #event-submit {
3757         margin-top: 10px;
3758 }
3759
3760 /* ============= */
3761 /* = Directory = */
3762 /* ============= */
3763
3764 .directory-item {
3765         float: left;
3766         margin: 50px 50px 0px 0px;
3767 }
3768
3769 .directory-details {
3770         font-size: 0.9em;
3771         width: 160px;
3772 }
3773
3774 .directory-name {
3775         font-size: 1em;
3776         width: 150px;
3777 }
3778
3779 /* ========= */
3780 /* = Admin = */
3781 /* ========= */
3782
3783 #adminpage {
3784         width: 90%;
3785 }
3786
3787 #pending-update {
3788         float:right;
3789         color: #ffffff;
3790         font-weight: bold;
3791         background-color: #FF0000;
3792         padding: 0em 0.3em;
3793 }
3794
3795 .admin.linklist {
3796         border: 0px; padding: 0px;
3797 }
3798
3799 .admin.link {
3800         list-style-position: inside;
3801         font-size: 1em;
3802         padding: 5px;
3803         width: auto;
3804         margin: 5px;
3805 }
3806
3807 #adminpage dl {
3808         clear: left;
3809         margin-bottom: 2px;
3810         padding-bottom: 2px;
3811         border-bottom: 1px solid black;
3812 }
3813
3814 #adminpage dt {
3815         width: 200px;
3816         float: left;
3817         font-weight: bold;
3818 }
3819
3820 #adminpage dd {
3821         margin-left: 200px;
3822 }
3823 #adminpage h3 {
3824         border-bottom: 1px solid #898989;
3825         margin-bottom: 5px;
3826         padding-bottom: 5px;
3827         margin-top: 10px;
3828 }
3829
3830 #adminpage .submit {
3831         clear:left;
3832 }
3833
3834 #adminpage
3835 #addonslist {
3836         margin: 0px;
3837         padding: 0px;
3838 }
3839
3840 #adminpage .addon {
3841         list-style: none;
3842         display: block;
3843         clear: left;
3844         border: 1px solid #7C7D7B;
3845         box-shadow: 0 0 8px #BDBDBD;
3846                 -moz-box-shadow: 0 0 8px #BDBDBD;
3847                 -webkit-box-shadow: 0 0 8px #BDBDBD;
3848         border-radius: 5px;
3849                 -moz-border-radius: 5px;
3850                 -webkit-border-radius: 5px;
3851         padding:10px;
3852         margin:10px 10px 10px 0;
3853 }
3854
3855 #adminpage .toggleaddon {
3856         float: left;
3857         margin-right: 1em;
3858 }
3859
3860 #adminpage table {
3861         width: 100%;
3862         border-bottom: 1p solid #000000;
3863         margin: 5px 0px;
3864 }
3865
3866 #adminpage table th {
3867         text-align: left;
3868 }
3869
3870 #adminpage td .icon {
3871         float: left;
3872 }
3873
3874 #adminpage table#users img {
3875         width: 16px;
3876         height: 16px;
3877 }
3878
3879 #adminpage table tr:hover {
3880         background-color: #eeeeee;
3881 }
3882
3883 #adminpage .selectall {
3884         text-align: right;
3885 }
3886
3887 /* =============== */
3888 /* = Form Fields = */
3889 /* =============== */
3890
3891 .field {
3892     /*margin-bottom: 10px;*/
3893     overflow: auto;
3894     padding-bottom: 10px;
3895     width: 100%;
3896 }
3897
3898 .field.radio .field_help {
3899     margin-left: 255px;
3900 }
3901
3902 .field .field_help {
3903     color: #666666;
3904     display: block;
3905     margin-left: 225px;
3906 }
3907
3908 .field label {
3909     float: left;
3910     width: 230px;
3911 }
3912
3913 .field checkbox {
3914         float: left;
3915         width: 480px;
3916 }
3917
3918 .field input,
3919 .field textarea {
3920         /*width: 400px;*/
3921         float: left;
3922         border: 1px solid #7C7D7B;
3923         border-radius: 5px;
3924                 -moz-border-radius: 5px;
3925                 -webkit-border-radius: 5px;
3926 }
3927
3928 .field password {
3929         height: 100px;
3930         margin-left: 150px;
3931 }
3932
3933 .field_help {
3934         display: block;
3935         margin-left: 0px;
3936         margin-bottom: 10px;
3937         color: #666666;
3938 }
3939
3940 .field .onoff {
3941         float: left;
3942         width: 80px;
3943 }
3944 .field .onoff a {
3945         display: block;
3946         border: 1px solid #c1c1c1;
3947         background-image: url("../../../images/onoff.jpg");
3948         background-repeat: no-repeat;
3949         padding: 4px 2px 2px 2px;
3950         height: 16px;
3951         text-decoration: none;
3952 }
3953 .field .onoff .off {
3954         border-color: #c1c1c1;
3955         padding-left: 40px;
3956         background-position: left center;
3957         background-color: #cccccc;
3958         color: #666666;
3959         text-align: right;
3960 }
3961
3962 .field .onoff .on {
3963         border-color: #c1c1c1;
3964         padding-right: 40px;
3965         background-position: right center;
3966         background-color: #1873a2;
3967         color: #FFFFFF;
3968         text-align: left;
3969 }
3970
3971 .field .radio .field_help {
3972         margin-left: 0px;
3973 }
3974
3975 /* ========= */
3976 /* = Icons = */
3977 /* ========= */
3978
3979 .sparkle {
3980         cursor: url('lock.cur'), pointer;
3981         width: 100%;
3982         height: auto;
3983         /*border: 1px solid #7C7D7B;
3984         border-radius: 3px;
3985                 -moz-border-radius: 3px;
3986                 -webkit-border-radius: 3px;
3987         box-shadow: 0 0 8px #BDBDBD;
3988                 -moz-box-shadow: 0 0 8px #BDBDBD;
3989                 -webkit-box-shadow: 0 0 8px #BDBDBD;*/
3990 }
3991
3992 .label {
3993         border: 0px;
3994         border-radius: 0px;
3995         box-shadow: none;
3996 }
3997
3998 .icon {
3999         margin-left: 5px;
4000         margin-right: 5px;
4001         display: block;
4002         width: 20px;
4003         height: 20px;
4004         background-image: url("images/icons.png");
4005 }
4006 .pinned {
4007         background-image: url("images/star.png");
4008         repeat: no-repeat;
4009 }
4010 .unpinned {
4011         background-image: url("images/premium.png");
4012         repeat: no-repeat;
4013 }
4014
4015 .starred {
4016         background-image: url("images/star.png");
4017         repeat: no-repeat;
4018 }
4019 .unstarred {
4020         background-image: url("images/premium.png");
4021         repeat: no-repeat;
4022 }
4023
4024 .notify {
4025         background-image: url("images/notifications.png");
4026         repeat: no-repeat;
4027 }
4028
4029 .border {
4030         border: 1px solid #c1c1c1;
4031         border-radius: 3px;
4032                 -webkit-border-radius: 3px;
4033                 -moz-border-radius: 3px;
4034 }
4035
4036 .article        { background-position: -50px  0px;}
4037 .audio          { background-position: -70px  0px;}
4038 .block          { background-position: -90px  0px;}
4039 .drop           { background-position: -110px 0px;}
4040 .drophide       { background-position: -130px 0px;}
4041 .edit           { background-position: -150px 0px;}
4042 .camera         { background-position: -170px 0px;}
4043 .dislike        { background-position: -190px 0px;}
4044 .like           { background-position: -210px 0px;}
4045 .link           { background-position: -230px 0px;}
4046 .globe          { background-position: -50px  -20px;}
4047 .noglobe        { background-position: -70px  -20px;}
4048 .no             { background-position: -90px  -20px;}
4049 .pause          { background-position: -110px -20px;}
4050 .play           { background-position: -130px -20px;}
4051 .pencil         { background-position: -150px -20px; margin-right: 12px;}
4052 .small-pencil   { background-position: -170px -20px;}
4053 .recycle        { background-position: -190px -20px;}
4054 .remote-link    { background-position: -210px -20px; margin-right: 10px;}
4055 .share          { background-position: -230px -20px;}
4056 .tools          { background-position: -50px  -40px;}
4057 .lock           { background-position: -70px  -40px;}
4058 .unlock         {
4059         background-position: -90px  -40px;
4060         background-image: none;
4061         width: 70px;
4062         height: 20px;
4063 }
4064
4065 .sharePerms {
4066         background-image: url("images/icons.png");
4067         width: 20px;
4068         height: 20px;
4069         margin: 2px 0px 2px 3px;
4070         display: block;
4071 }
4072
4073 .video          { background-position: -110px -40px;}
4074 .youtube        { background-position: -130px -40px;}
4075 .attach         { background-position: -190px -40px;}
4076 .language       { background-position: -210px -40px;}
4077 .on             { background-position: -50px  -60px;}
4078 .off            { background-position: -70px  -60px;}
4079 .prev           { background-position: -90px  -60px;}
4080 .next           { background-position: -110px -60px;}
4081 .tagged         { background-position: -130px -60px; margin-right: 10px;}
4082 .icon.dim       { opacity: 0.3;filter:alpha(opacity=30);}
4083
4084 .attachtype {
4085         display: block; width: 20px; height: 23px;
4086         background-image: url("../../../images/content-types.png");
4087         background-position: -80px 0px;
4088 }
4089
4090 .type-video { background-position: 0px 0px; }
4091 .type-image { background-position: -20px 0px; }
4092 .type-audio { background-position: -40px 0px; }
4093 .type-text  { background-position: -60px 0px; }
4094 .type-unkn  { background-position: -80px 0px; }
4095
4096 /* ========== */
4097 /* = Footer = */
4098 /* ========== */
4099
4100 .cc-license {
4101         margin-top: 100px;
4102         font-size: 0.7em;
4103 }
4104
4105 footer { display: block; margin: 50px 20%; clear: both; }
4106
4107 /* ========== */
4108 /* = Tools = */
4109 /* ========== */
4110
4111 tools {
4112         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f0edf0), color-stop(1, #e2e2e2) );
4113         background: -moz-linear-gradient( center top, #f0edf0 5%, #e2e2e2 100% );
4114         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0edf0', endColorstr='#e2e2e2');
4115         background-color: #f0edf0;
4116         border-radius: 5px 5px 0px 0px;
4117                 -moz-border-radius: 5px 5px 0px 0px;
4118                 -webkit-border-radius: 5px 5px 0px 0px;
4119         border: 1px solid #7C7D7B;
4120         border-bottom: none;
4121         box-shadow: 1px 2px 6px 0px #959494;
4122                 -moz-box-shadow: 1px 2px 6px 0px #959494;
4123                 -webkit-box-shadow: 1px 2px 6px 0px #959494;
4124         color: #EFEFEF;
4125         display: block;
4126         float: right;
4127         font-size: 15px;
4128         height: 38px;
4129         list-style: none outside none;
4130         margin: 0 0 0 755px;
4131         padding: 0;
4132         position: fixed;
4133         bottom: 0;
4134         width: 203px;
4135         z-index: 10;
4136         clear:both;
4137 }
4138
4139 /* ======= */
4140 /* = ACL = */
4141 /* ======= */
4142
4143 #photo-edit-perms-select,
4144 #photos-upload-permissions-wrapper,
4145 #profile-jot-acl-wrapper{
4146         display: block!important;
4147 }
4148
4149 #acl-wrapper {
4150         width: 690px;
4151         float:left;
4152 }
4153 #acl-wrapper a:hover {
4154         text-decoration: none;
4155         background-color:#1873a2;
4156 }
4157
4158 /* ========================= */
4159 /* = Global Directory Link = */
4160 /* ========================= */
4161
4162 #global-directory-link {
4163         width: 150px;
4164         padding: 4px;
4165         /*margin-bottom: 10px;*/
4166         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
4167         background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
4168         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
4169         background-color: #bdbdbd;
4170         color: #efefef;
4171         text-align: center;
4172         -webkit-padding-start: 0px;
4173         border: 1px solid #7C7D7B;
4174         border-radius: 5px;
4175                 -moz-border-radius: 5px;
4176                 -webkit-border-radius: 5px;
4177 }
4178
4179 #global-directory-link:hover {
4180         color: #efefef;
4181         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4182         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4183         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4184         background-color: #1873a2;
4185         border: 1px solid #7C7D7B;
4186         box-shadow: 0 0 8px #BDBDBD;
4187                 -moz-box-shadow: 0 0 8px #BDBDBD;
4188                 -webkit-box-shadow: 0 0 8px #BDBDBD;
4189         border-radius: 5px;
4190                 -moz-border-radius: 5px;
4191                 -webkit-border-radius: 5px;
4192 }
4193
4194 #global-directory-link:active {
4195         background-color: #1873a2;
4196         position: relative;
4197         top: 1px;
4198 }
4199
4200 #global-directory-link a {
4201         color: #efefef;
4202 }
4203
4204 a.active {
4205         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4206         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4207         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4208         background-color: #1873a2;
4209         color: #fec01d;
4210         padding: 5px 10px 5px 10px;
4211         margin-right: 5px;
4212 }
4213
4214 /* notifications popup menu */
4215 .delegation-notify {
4216         font-size: 10px;
4217         padding: 1px 3px;
4218         top: 0px;
4219         min-width: 15px;
4220         text-align: center;
4221         float: right;
4222         margin-top: -14px;
4223         margin-right: -20px;
4224 }
4225
4226 .nav-notification {
4227         display: none;
4228         position: absolute;
4229         font-size: 10px;
4230         padding: 1px 3px;
4231         top: 0px;
4232         right: -10px;
4233         min-width: 15px;
4234         text-align: right;
4235 }
4236 .nav-notification.show {
4237         display: block;
4238 }
4239 #nav-notifications-menu {
4240         width: 320px;
4241         max-height: 400px;
4242         overflow-y: scroll;
4243         overflow-style: scrollbar;
4244         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #797979), color-stop(1, #898988) );
4245         background: -moz-linear-gradient( center top, #797979 5%, #898988 100% );
4246         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#797979', endColorstr='#898988');
4247         background-color: #a2a2a2;
4248         border-radius: 0px 0px 5px 5px;
4249                 -moz-border-radius: 0px 0px 5px 5px;
4250                 -webkit-border-radius: 0px 0px 5px 5px;
4251         border: 1px solid #9A9A9A;
4252         border-top: none;
4253         box-shadow: 5px 5px 10px #242424;
4254                 -moz-box-shadow: 5px 5px 10px #242424;
4255                 -webkit-box-shadow: 5px 5px 10px #242424;
4256         top: 40px;
4257 }
4258
4259 #nav-notifications-menu .contactname {
4260         font-weight: bold;
4261         font-size: 0.9em;
4262 }
4263
4264 #nav-notifications-menu img {
4265         float: left;
4266         margin-right: 5px;
4267 }
4268
4269 #nav-notifications-menu .notif-when {
4270         font-size: 0.8em;
4271         display: block;
4272 }
4273
4274 #nav-notifications-menu li {
4275         padding: 7px 0px 7px 10px;
4276         word-wrap: normal;
4277         border-bottom: 1px solid #626262;
4278 }
4279
4280 #nav-notifications-menu li:hover {
4281         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4282         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4283         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4284         background-color: #1873a2;
4285 }
4286
4287 #nav-notifications-menu a:hover {
4288         text-decoration: underline;
4289 }
4290
4291 .notif-item a {
4292         vertical-align: middle;
4293         color: #626262;
4294         padding-bottom: 7px;
4295 }
4296
4297 .notif-item a:hover {
4298         color: #1873a2;
4299 }
4300
4301 .notif-image {
4302         width: 32px;
4303         height: 32px;
4304         padding: 7px 7px 0px 0px;
4305 }
4306
4307 #jGrowl {
4308         z-index: 20000;
4309 }
4310
4311 /* autocomplete popup */
4312 .acpopup, acpopup-mce {
4313         overflow: auto;
4314         z-index: 100000;
4315         color: #2e3436;
4316         border-top: 0px;
4317         background: #eeeeee;
4318         border-right: 1px solid #7C7D7B;
4319         border-left: 1px solid #7C7D7B;
4320         border-bottom: 1px solid #7C7D7B;
4321         border-radius: 0px 5px 5px 5px;
4322                 -webkit-border-radius: 0px 5px 5px 5px;
4323                 -moz-border-radius: 0px 5px 5px 5px;
4324         box-shadow: 0 0 8px #BDBDBD;
4325                 -moz-box-shadow: 0 0 8px #BDBDBD;
4326                 -webkit-box-shadow: 0 0 8px #BDBDBD;
4327 }
4328
4329 .acpopup-mce {
4330         max-height: 150px;
4331 }
4332
4333 .acpopupitem {
4334         color: #2e3436;
4335         padding: 4px;
4336         clear:left;
4337 }
4338 .acpopupitem img {
4339         float: left;
4340         margin-right: 4px;
4341 }
4342
4343 .acpopupitem.selected, .textcomplete-item.active {
4344         color: #efefef;
4345         background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
4346         background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
4347         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
4348         background-color: #1873a2;
4349         order-bottom: none;
4350 }
4351
4352 .textcomplete-item a:hover, .textcomplete-item a:hover .acpopup-sub-text, .textcomplete-item.active a .acpopup-sub-text {
4353         color: #efefef;
4354 }
4355
4356 .qcomment {
4357         opacity: 0.8;
4358         filter: alpha(opacity=0);
4359         position: relative;
4360         left: 30px;
4361 }
4362
4363 .qcomment:hover {
4364         opacity: 1.0;
4365         filter: alpha(opacity=100);
4366 }
4367
4368 .notification-seen {
4369         background: #000000;
4370 }
4371
4372 .notification-seen a {
4373         color: #efefef !important;
4374 }
4375
4376 /* Pages profile widget ----------------------------------------------------------- */
4377
4378 #page-profile,
4379 #profile-page-list {
4380         margin-left: 45px;
4381 }
4382
4383 #page-profile .title {
4384         font-weight: bold;
4385 }
4386
4387 #profile-vcard-break {
4388         clear: both;
4389 }
4390
4391 #profile-extra-links {
4392         clear: both;
4393         margin-top: 10px;
4394 }
4395
4396 #profile-extra-links ul {
4397         list-style-type: none;
4398         padding: 0px;
4399 }
4400
4401
4402 #profile-extra-links li {
4403         margin-top: 5px;
4404 }
4405
4406 .profile-edit-side-div {
4407         float: right;
4408 }
4409
4410 .profile-edit-side-link {
4411         opacity: 0.3;
4412         filter:alpha(opacity=30);
4413 }
4414 .profile-edit-side-link:hover {
4415         opacity: 1.0;
4416         filter:alpha(opacity=100);
4417 }
4418
4419 /* SCROLL TO TOP
4420 ----------------------------------------------------------- */
4421 #scrollup {
4422         position: absolute;
4423         right: 0px;
4424         bottom: -1px;
4425         z-index: 100;
4426 padding-right: 10px;
4427 }
4428
4429 #scrollup a:hover {
4430         text-decoration: none;
4431         border: 0;
4432 }
4433
4434 .item-scrollup {
4435         margin-left: 5px;
4436 }
4437
4438 /* New posts and comments => background color
4439 ----------------------------------------------------------- */
4440 .shiny {
4441         background: #fbfde9;
4442 }
4443
4444 div.wall-item-content-wrapper.shiny {
4445         background-image: url("images/shiny.png");
4446         background-repeat: repeat-x;
4447 }
4448
4449 /* from default */
4450 #jot-perms-icon,
4451 #profile-location,
4452 #profile-nolocation,
4453 #profile-youtube,
4454 #profile-video,
4455 #profile-audio,
4456 #profile-link,
4457 #profile-title,
4458 #wall-image-upload,
4459 #wall-file-upload,
4460 #profile-upload-wrapper,
4461 #wall-image-upload-div,
4462 #wall-file-upload-div,
4463 .hover,
4464 .focus {
4465         cursor: pointer;
4466 }
4467
4468 hr.line-dots {
4469     background: url("images/dot.png") repeat-x scroll left center transparent;
4470     border: medium none;
4471 }
4472
4473 .body-tag,
4474 .filesavetags,
4475 .categorytags {
4476         opacity: 0.5;
4477         filter:alpha(opacity=50);
4478 }
4479
4480 .body-tag:hover,
4481 .filesavetags:hover,
4482 .categorytags:hover {
4483         opacity: 1.0 !important;
4484         filter:alpha(opacity=100) !important;
4485 }
4486
4487 .item-select {
4488         opacity: 0.5;
4489         filter:alpha(opacity=10);
4490         float: right;
4491         margin-right: 10px;
4492
4493 }
4494 .item-select:hover,
4495 .checkeditem {
4496         opacity: 1;
4497         filter:alpha(opacity=100);
4498 }
4499
4500 .filer-icon {
4501         display: block; width: 16px; height: 16px;
4502         background-image: url('images/file.gif');
4503         margin-left: 5px;
4504         float: left;
4505 }
4506
4507 .icon.dim { opacity: 0.3;filter:alpha(opacity=30); }
4508 [class^="comment-edit-bb"] {
4509         list-style: none;
4510         display: none;
4511         margin: 0px 0 -5px 0px;
4512         padding: 0px;
4513         width: 75%;
4514 }
4515
4516 .body-attach {
4517         margin-top: 10px;
4518 }
4519
4520 .grey {
4521         color: #888888;
4522 }
4523
4524 .location,
4525 .location-label,
4526 .gender-label,
4527 .marital-label,
4528 .homepage-label,
4529 .network-label {
4530         float: left;
4531         text-align: left;
4532         display: block;
4533         line-height: 0.6em;
4534 }
4535
4536 .adr,
4537 .x-gender,
4538 .marital-text,
4539 .homepage-url,
4540 .x-network {
4541         float: left;
4542         display: block;
4543         margin-left: 8px;
4544         line-height: 1em;
4545         text-align: left;
4546 }
4547
4548 #birthday-notice {}
4549 #nav-notifications-template {}
4550 #category-sidebar {}
4551 #nets-desc {}
4552 #status-tab {}
4553 #page-footer {}
4554 #live-profile {}
4555
4556 .city-state-zip {}
4557 .country-name {}
4558 .locality {}
4559 .region {}
4560 .postal-code {}
4561 .mpfriend {}
4562 .toplevel_item {}
4563
4564 .fc-header,
4565 .fc-view,
4566 .fc-view-basicWeek,
4567 .fc-grid,
4568 .fc-border-separate,
4569 .fc-content {}
4570
4571 div #datebrowse-sidebar.widget {
4572         text-align:center;
4573 }
4574
4575 /* Fakelink */
4576
4577 .fakelink,
4578 .fakelink:visited,
4579 .fakelink:link {
4580         color: #1873a2;
4581         cursor: pointer;
4582         margin-bottom: 10px;
4583         /*background: url("images/down.png") no-repeat scroll left center transparent;*/
4584 }
4585
4586 .fakelink:hover {
4587         color: #6da6c4;
4588 }
4589
4590 #id_theme {
4591         margin:10px 10px 0 0;
4592 }
4593
4594 #id_maxreq,
4595 #id_cntunkmail,
4596 #id_expire {
4597         width: 75px;
4598 }
4599
4600 #id_notify1,
4601 #id_notify2,
4602 #id_notify3,
4603 #id_notify4,
4604 #id_notify5,
4605 #id_notify6,
4606 #id_notify7,
4607 #id_notify8,
4608 #id_allow_location {
4609         margin: 6px 0 0 10px;
4610 }
4611
4612 #settings-form {}
4613 .select {}
4614 .field_help {
4615         margin: 5px 0 10px;
4616 }
4617
4618 #settings-activity-desc,
4619 #settings-notification-desc {
4620         margin: 10px 10px 10px 0;
4621         font-weight: bold;
4622 }
4623
4624 #settings-notifications {
4625         width: 410px;
4626         border: 1px solid #7C7D7B;
4627         box-shadow: 0 0 8px #BDBDBD;
4628                 -moz-box-shadow: 0 0 8px #BDBDBD;
4629                 -webkit-box-shadow: 0 0 8px #BDBDBD;
4630         border-radius: 5px;
4631                 -moz-border-radius: 5px;
4632                 -webkit-border-radius: 5px;
4633         padding: 10px;
4634         margin: 10px 10px 10px 0;
4635 }
4636
4637 #id_npassword {}
4638
4639 #hide-comments-page-widget {
4640         margin-left: 40px;
4641 }
4642
4643 #collapsed-comments-page-widget {}
4644
4645 .tool {
4646     list-style-type: disc;
4647 }
4648
4649 #logo-text {
4650 }
4651
4652 #logo-img {
4653         margin: 3px 0 0 0;
4654 }
4655
4656 .bigwidget {}
4657
4658 #remote-friends-in-common  {}
4659
4660 .settings-block {
4661         border: 1px solid #7C7D7B;
4662         box-shadow: 0 0 8px #BDBDBD;
4663                 -moz-box-shadow: 0 0 8px #BDBDBD;
4664                 -webkit-box-shadow: 0 0 8px #BDBDBD;
4665         border-radius: 5px;
4666                 -moz-border-radius: 5px;
4667                 -webkit-border-radius: 5px;
4668         padding:10px;
4669         margin:10px 10px 10px 0;
4670 }
4671
4672 #page-settings-label{
4673         width: auto !important;
4674         margin-bottom: 5px !important;
4675 }
4676
4677 .onoff {
4678         margin-right: 10px;
4679 }
4680
4681 .settings-heading {
4682         margin: 25px 0 25px 0;
4683 }
4684
4685 #id_itemcache,
4686 #id_basepath,
4687 #id_temppath,
4688 #id_lockpath,
4689 #id_proxyuser,
4690 #id_proxy,
4691 #id_allowed_email,
4692 #id_allowed_sites,
4693 #id_directory_submit_url,
4694 #id_register_text {
4695         width: 440px;
4696 }
4697
4698 #id_itemcache_duration,
4699 #id_abandon_days,
4700 #id_maxloadavg,
4701 #id_poll_interval,
4702 #id_delivery_interval,
4703 #id_timeout,
4704 #id_jpegimagequality,
4705 #id_maximagelength,
4706 #id_maximagesize,
4707 #id_max_daily_registrations {
4708         width: 75px;
4709 }
4710
4711 #id_remember {
4712         width: auto;
4713         float: right;
4714 }
4715
4716 .field.input.openid {
4717 }