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