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