view/theme/testbubble/style.css

   1 /*
   2         style.css
   3         TestBubble
   4
   5         Created by Anne Walk and Devlon Duthie on 2011-09-24.
   6         Based loosely on the Dipsy theme.
   7 */
   8 /* ========== */
   9 /* = Colors
  10
  11 Red links - #b20202
  12 Red link hover - #db0503
  13 Red Gradients (buttons and other gradients) - #b20202 and #d60808
  14
  15 Grey/body text - #626262
  16 Grey Gradients (buttons and other gradients) - #bdbdbd and #a2a2a2
  17
  18 Dark Grey Gradients - #7c7d7b and #555753
  19
  20 You can switch out the colors of the header, buttons and links by using a find and replace in your text editor.
  21
  22  = */
  23 /* ========== */
  24
  25 /*html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, nav, section {
  26         margin: 0;
  27         padding: 0;
  28         border: 0;
  29         font-weight: inherit;
  30         font-style: inherit;
  31         font-size: 100%;
  32         font-family: inherit;
  33         vertical-align: baseline;
  34 }*/
  35
  36 body {
  37         margin: 0px;
  38         padding: 0px;
  39         font-family: freesans,helvetica,arial,clean,sans-serif;
  40         font-size: 15px;
  41         color: #626262;
  42         width: 100%;
  43 }
  44
  45 img {  border: 0 none; max-width: 550px; }
  46
  47 a { color: #b20202; text-decoration: none; margin-bottom:1px;}
  48 a:hover { color: #db0503; padding-bottom: 0px;}
  49
  50 h3 > a, h4 > a {
  51         font-size: 18px;
  52         color: #626262;
  53 }
  54
  55 h3 {
  56         margin: 0px;
  57         margin-bottom: 5px;
  58         font-size: 18px;
  59         color: #626262;
  60 }
  61
  62 h2 {
  63         color: #626262;
  64 }
  65
  66 p {
  67
  68         max-width: 600px;
  69 }
  70
  71 label {
  72         font-variant:small-caps;
  73 }
  74
  75 li {
  76         list-style: none;
  77 }
  78
  79 .required { display: inline; color: #b20202; }
  80 .fakelink { color: #b20202; cursor: pointer; }
  81 .fakelink :hover { color: #db0503; }
  82
  83 input[type=text] {
  84         border: 2px solid #b0b0b0;
  85         padding: 2px;
  86         margin: 0px;
  87     -webkit-border-radius: 3px 3px 3px 3px;
  88     -moz-border-radius: 3px 3px 3px 3px;
  89     border-radius: 3px 3px 3px 3px;
  90 }
  91
  92 input[type=submit] {
  93         margin: 10px 2px 5px 2px;
  94         border: none;
  95         font-size: 0.9em;
  96         padding: 5px;
  97         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
  98         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
  99         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 100         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
 101         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
 102         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
 103         background-color:#bdbdbd;
 104         -moz-border-radius:5px;
 105         -webkit-border-radius:5px;
 106         border-radius:5px;
 107         color:#efefef;
 108         text-align: center;
 109 }
 110
 111 input[type=submit]:hover {
 112         border: none;
 113         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
 114         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
 115         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
 116         background-color:#b20202;
 117         color: #efefef;
 118 }
 119 input[type=submit]:active {
 120         position:relative;
 121         top:1px;
 122 }
 123
 124 .smalltext { font-size: 0.7em }
 125
 126 ::selection     { background:#fdf795; color: #000; /* Safari and Opera */ }
 127 ::-moz-selection { background:#fdf795; color: #000; /* Firefox */ }
 128
 129 section {
 130         margin: 20px 11% 0px 11%;
 131         font-size: 0.9em;
 132         line-height: 1.2em;
 133         padding-right: 230px;
 134 }
 135
 136 #wall-item-lock {
 137         margin-left: 10px;
 138 }
 139
 140 /* ========= */
 141 /* = Login = */
 142 /* ========= */
 143
 144 #login-name-wrapper {
 145         vertical-align: middle;
 146         margin: auto;
 147 }
 148
 149 #login-name-wrapper input {
 150         width: 120px;
 151         margin-left: 20px;
 152 }
 153
 154 #login-password-wrapper {
 155         vertical-align: middle;
 156         margin: auto;
 157 }
 158
 159 #login-extra-links {
 160         width: 90px;
 161         margin-top: 20px;
 162         border: none;
 163         font-size: 0.9em;
 164         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 165         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 166         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 167         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
 168         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
 169         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
 170         background-color:#bdbdbd;
 171         -moz-border-radius:5px;
 172         -webkit-border-radius:5px;
 173         border-radius:5px;
 174         color:#efefef;
 175         text-align: center;
 176 }
 177
 178 #login-extra-links a {
 179         display: block;
 180         margin: 10px;
 181         padding: 5px 0px 5px 0px;
 182         color: #efefef;
 183         text-align: center;
 184         margin-right: 20px;
 185 }
 186
 187 #login-extra-links:hover {
 188         border: none;
 189         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
 190         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
 191         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
 192         background-color:#b20202;
 193         color: #efefef;
 194 }
 195
 196 #login-extra-links:active {
 197         position:relative;
 198         top:1px;
 199 }
 200
 201 #login-extra-filler {
 202         display: none;
 203 }
 204
 205 /* ========= */
 206 /* = Panel = */
 207 /* ========= */
 208
 209 #panel {
 210         position: absolute;
 211         font-size:0.8em;
 212         -webkit-border-radius: 5px ;
 213         -moz-border-radius: 5px;
 214         border-radius: 5px;
 215         border: 1px solid #494948;
 216         background-color: #2e3436;
 217         opacity:50%;
 218         color: #eeeeec;
 219         padding:1em;
 220         z-index: 200;
 221         -moz-box-shadow: 7px 7px 12px #434343;
 222         -webkit-box-shadow: 7px75px 12px #434343;
 223         box-shadow: 7px 7px 10px #434343;
 224 }
 225
 226 /* ========= */
 227 /* = Pager = */
 228 /* ========= */
 229
 230 .pager {
 231         padding-top: 30px;
 232         display:block;
 233         clear: both;
 234         text-align: center;
 235 }
 236
 237 .pager a {
 238         color: #626262;
 239 }
 240
 241 .pager span { padding: 4px; margin:4px; }
 242 .pager_current { background-color: #b20202; color: #ffffff; }
 243
 244 /* ======= */
 245 /* = Nav = */
 246 /* ======= */
 247
 248 nav {
 249         height: 50px;
 250         display: block;
 251         position: relative;
 252         padding: 0px 10%;
 253         color: #efefef;
 254         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7c7d7b), color-stop(1, #555753) );
 255         background:-moz-linear-gradient( center top, #7c7d7b 5%, #555753 100% );
 256         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7c7d7b', endColorstr='#555753');
 257         background-color:#7c7d7b;
 258         border-bottom: 1px solid #494948;
 259 }
 260 nav a { text-decoration: none;  color: #eeeeec; border:0px;}
 261 nav a:hover { text-decoration: none;    color: #eeeeec; border:0px;}
 262
 263 nav #banner {
 264         display: block;
 265         position: absolute;
 266         margin-left: 20px;
 267         margin-top: 5px;
 268         padding-bottom:5px;
 269 }
 270 nav #banner #logo-text a {
 271         display: hidden;
 272         font-size: 40px;
 273         font-weight: bold;
 274         margin-left: 3px;
 275 }
 276
 277 nav #user-menu {
 278     display: block;
 279         width: 250px;
 280     float: right;
 281         margin-right:15px;
 282     margin-top: 10px;
 283         padding: 5px;
 284     position: relative;
 285     vertical-align: middle;
 286         background:-webk/*      margin-right:10px;*/it-gradient( linear, left top, left bottom, color-stop(0.05, #898988), color-stop(1, #a2a2a2) );
 287         background:-moz-linear-gradient( center top, #898988 5%, #a2a2a2 100% );
 288         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#898988', endColorstr='#a2a2a2');
 289         background-color:#a2a2a2;
 290         -moz-border-radius:5px;
 291         -webkit-border-radius:5px;
 292         border-radius:5px;
 293         color:#efefef;
 294         text-decoration:none;
 295         text-align: center;
 296 }
 297
 298 nav #user-menu-label::after {
 299         content: url("menu-user-pin.png") no-repeat;
 300         padding-left: 15px;
 301 }
 302
 303 nav #user-menu-label {
 304         vertical-align: middle;
 305         font-size: 12px;
 306     padding: 5px;
 307         text-align: center;
 308 }
 309
 310 ul#user-menu-popup {
 311     display: none;
 312     position: absolute;
 313         background:-webk/*      margin-right:10px;*/it-gradient( linear, left top, left bottom, color-stop(0.05, #797979), color-stop(1, #898988) );
 314         background:-moz-linear-gradient( center top, #a2a2a2 5%, #898988 100% );
 315         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#797979', endColorstr='#898988');
 316         background-color:#898988;
 317     width: 100%;
 318     padding: 10px 0px;
 319     margin: 0px;
 320         margin-top: 10px;
 321     top: 20px;
 322         left: 0px;
 323         border: 1px solid #9a9a9a;
 324         border-top: none;
 325     -webkit-border-radius: 0px 0px 5px 5px;
 326     -moz-border-radius: 0px 0px 5px 5px;
 327     border-radius: 0px 0px 5px 5px;
 328         -moz-box-shadow: 5px 5px 10px #242424;
 329         -webkit-box-shadow: 5px 5px 10px #242424;
 330         box-shadow: 5px 5px 10px #242424;
 331     z-index: 10000;
 332 }
 333
 334 ul#user-menu-popup li { display: block; }
 335 ul#user-menu-popup li a { display: block; padding: 5px; }
 336 ul#user-menu-popup li a:hover {
 337         color: #efefef;
 338         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #d60808), color-stop(1, #b20202) );
 339         background:-moz-linear-gradient( center top, #d60808 5%, #b20202 100% );
 340         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d60808', endColorstr='#b20202');
 341         background-color:#d60808;
 342 }
 343
 344 ul#user-menu-popup li a.nav-sep { border-top: 1px solid #989898; border-style:inset; }
 345
 346 /* ============= */
 347 /* = Notifiers = */
 348 /* ============= */
 349
 350 #notifications {
 351         height: 32px;
 352         position: absolute;
 353         top:10px; left: 650px;
 354 }
 355 .nav-ajax-update {
 356         width: 44px;
 357         height: 32px;
 358         background: transparent url('notifications.png') 0px 0px no-repeat;
 359         color: #efefef;
 360         font-weight: bold;
 361         font-size: 0.8em;
 362         padding-top: 0.5em;
 363         float: left;
 364         padding-left: 11px;
 365     display: none;
 366 }
 367 #net-update { background-position: 0px 0px; }
 368 #mail-update { background-position: 0px -42px; }
 369 #notify-update { background-position: 0px -84px; }
 370 #home-update { background-position: 0px -126px; }
 371
 372 #lang-select-icon {
 373         cursor: pointer;
 374         position: absolute;
 375         left: 5px;
 376         top: 5px;
 377 }
 378
 379 #language-selector {
 380         position: absolute;
 381         top: 0;
 382         left: 16px;
 383 }
 384
 385 /* =================== */
 386 /* = System Messages = */
 387 /* =================== */
 388
 389 #sysmsg_info, #sysmsg {
 390         position:fixed;
 391         bottom: 0px; right:20%;
 392         -moz-box-shadow: 7px 7px 12px #434343;
 393         -webkit-box-shadow: 7px75px 12px #434343;
 394         box-shadow: 7px 7px 10px #434343;
 395         padding: 10px;
 396         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
 397         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
 398         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
 399         background-color:#b20202;
 400         -webkit-border-radius: 5px 5px 0px 0px;
 401         -moz-border-radius: 5px 5px 0px 0px;
 402         border-radius: 5px 5px 0px 0px;
 403         border: 1px solid #da2c2c;
 404         border-bottom:0px;
 405         padding-bottom: 50px;
 406         z-index: 1000;
 407         color: #efefef;
 408         font-style: bold;
 409 }
 410
 411 #sysmsg_info br,
 412 #sysmsg br {
 413         display:block;
 414         margin:2px 0px;
 415         border-top: 1px solid #dddddd;
 416 }
 417
 418 /* ================= */
 419 /* = Aside/Sidebar = */
 420 /* ================= */
 421
 422 aside {
 423     position: absolute;
 424     right: 11%;
 425 /*      float: right;
 426         margin-right: 11%;*/
 427         width: 260px;
 428         margin-top: auto;
 429     font-size: 0.8em;
 430         font-style: bold;
 431 }
 432
 433 aside a{
 434         padding-bottom: 5px;
 435
 436 }
 437
 438 .vcard {
 439         font-size: 1em;
 440         font-variant:small-caps;
 441 }
 442
 443 .marital {
 444         font-size: 1em;
 445         font-variant:small-caps;
 446 }
 447
 448 .homepage-label {
 449         font-size: 1em;
 450         font-variant:small-caps;
 451 }
 452
 453 .vcard .fn {
 454         font-size: 1.4em;
 455         font-weight: bold;
 456         border-bottom: none;
 457         padding-top: 10px;
 458 }
 459
 460 .vcard #profile-photo-wrapper {
 461         margin: 10px 0px;
 462         padding: 12px;
 463         width: 175px;
 464         background-color: #f3f3f3;
 465         border: 1px solid #dddddd;
 466         -moz-box-shadow: 3px 3px 4px #959494;
 467         -webkit-box-shadow: 3px 3px 4px #959494;
 468         box-shadow: 3px 3px 4px #959494;
 469 }
 470
 471 aside h4 { font-size: 1.3em; }
 472
 473 aside #viewcontacts {
 474         text-align: center;
 475         font-weight: bold;
 476         font-variant:small-caps;
 477         font-size: 1.1em;
 478         padding-top: 5px;
 479 }
 480
 481 #viewcontacts a{
 482         color: #898989;
 483 }
 484
 485 #profile-extra-links ul { margin-left: 0px; padding-left: 0px; list-style: none; }
 486
 487 #dfrn-request-link {
 488         -moz-box-shadow:inset 0px 1px 0px 0px #a65151;
 489         -webkit-box-shadow:inset 0px 1px 0px 0px #a65151;
 490         box-shadow:inset 0px 1px 0px 0px #a65151;
 491         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #d60808), color-stop(1, #b20202) );
 492         background:-moz-linear-gradient( center top, #d60808 5%, #b20202 100% );
 493         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d60808', endColorstr='#b20202');
 494         background-color:#d60808;
 495         -moz-border-radius:5px;
 496         -webkit-border-radius:5px;
 497         border-radius:5px;
 498         border:1px solid #fc5656;
 499         display:inline-block;
 500         color:#f0e7e7;
 501         font-family:Trebuchet MS;
 502         font-size:19px;
 503         font-weight:bold;
 504         text-align: center;
 505         padding:10px;
 506         width: 185px;
 507         text-decoration:none;
 508         text-shadow:1px 1px 0px #b36f6f;
 509 }
 510
 511 #dfrn-request-link:hover {
 512         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
 513         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
 514         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
 515         background-color:#b20202;
 516 }
 517
 518 #dfrn-request-link:active {
 519         position:relative;
 520         top:1px;
 521 }
 522
 523 #dfrn-request-intro {
 524         width: 600px;
 525 }
 526
 527 #netsearch-box {
 528         background-color: #f6f6f6;
 529         /*padding: 10px 10px 10px 20px;*/
 530         padding: 10px 8px 10px 8px;
 531 }
 532 #netsearch-box input[type="text"] {
 533         width: 97%;
 534 }
 535 #netsearch-box input[type="submit"] {
 536         width: 48%;
 537 }
 538
 539 h3#search:before {
 540         content: url("search.png");
 541         padding-right: 10px;
 542         vertical-align: middle;
 543 }
 544
 545 #network-new-link {
 546         background-color: #f3f3f3;
 547         border: 1px solid #cdcdcd;
 548         margin-bottom: 10px;
 549         -webkit-border-radius: 5px 5px 5px 5px;
 550     -moz-border-radius: 5px 5px 5px 5px;
 551     border-radius: 5px 5px 5px 5px;
 552 }
 553
 554 #group-sidebar {
 555         vertical-align: middle;
 556         margin: auto;
 557         margin-top: 20px;
 558         padding-bottom: 10px;
 559 }
 560
 561 #sidebar-group-list {
 562         margin-left: 30px;
 563         margin-right: 30px;
 564 }
 565
 566 #sidebar-group-list > a{
 567         padding-bottom: 10px;
 568 }
 569
 570 .widget {
 571         margin-top: 20px;
 572         -moz-box-shadow: 1px 2px 6px 0px #959494;
 573         -webkit-box-shadow: 1px 2px 6px 0px #959494;
 574         box-shadow: 1px 2px 6px 0px #959494;
 575         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f8f8f8), color-stop(1, #f6f6f6) );
 576         background:-moz-linear-gradient( center top, #f8f8f8 5%, #f6f6f6 100% );
 577         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f8f8f8', endColorstr='#f6f6f6');
 578         background-color:#f8f8f8;
 579         -moz-border-radius:5px;
 580         -webkit-border-radius:5px;
 581         border-radius:5px;
 582         border:1px solid #eee;
 583         color:#e6e6e6;
 584         text-shadow:-1px 0px 0px #bdbdbd;
 585         border: 1px solid #cdcdcd;
 586 }
 587
 588 #sidebar-new-group {
 589         padding:7px;
 590         width: 165px;
 591         margin: auto;
 592         margin-left: 40px;
 593         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 594         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 595         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 596         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
 597         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
 598         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
 599         background-color:#bdbdbd;
 600         -moz-border-radius:5px;
 601         -webkit-border-radius:5px;
 602         border-radius:5px;
 603         display:inline-block;
 604         color:#efefef;
 605         text-decoration:none;
 606         text-align: center;
 607 }
 608
 609 #sidebar-new-group:hover {
 610         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
 611         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
 612         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
 613         background-color:#b20202;
 614 }
 615
 616 #sidebar-new-group:active {
 617         position:relative;
 618         top:1px;
 619 }
 620
 621 #sidebar-new-group a {
 622         color: #efefef;
 623         font-size: 14px;
 624         text-align: center;
 625         margin: auto;
 626 }
 627
 628 ul .sidebar-group-li{
 629         list-style: none;
 630         font-size: 1.2em;
 631         padding-bottom: 5px;
 632 }
 633
 634 ul .sidebar-group-li img{
 635         display: none;
 636 }
 637
 638 .widget h3{
 639         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f0edf0), color-stop(1, #e2e2e2) );
 640         background:-moz-linear-gradient( center top, #f0edf0 5%, #e2e2e2 100% );
 641         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0edf0', endColorstr='#e2e2e2');
 642         background-color:#f0edf0;
 643         -moz-border-radius:5px 5px 0px 0px;
 644         -webkit-border-radius:5px 5px 0px 0px;
 645         border-radius:5px 5px 0px 0px;
 646         border:1px solid #e2e2e2;
 647         border-bottom: 1px solid #cdcdcd;
 648         padding-top:5px;
 649         padding-bottom: 5px;
 650         vertical-align: baseline;
 651         text-align: center;
 652         text-shadow:-1px 0px 0px #bdbdbd;
 653 }
 654
 655 #group-sidebar h3:before{
 656         content: url("groups.png");
 657         padding-right: 10px;
 658         vertical-align: middle;
 659 }
 660
 661 #saved-search-list{
 662         margin-top: 15px;
 663         padding-bottom: 20px;
 664 }
 665
 666 .saved-search-li {
 667         list-style: none;
 668         font-size: 1.2em;
 669 }
 670
 671 .saved-search-li .icon {
 672         margin-right: 5px;
 673 }
 674
 675 /* ================== */
 676 /* = Contacts Block = */
 677 /* ================== */
 678
 679 .contact-block-img {
 680         width: 42px;
 681         height: 42px;
 682         padding-right: 2px;
 683 }
 684 .contact-block-div {
 685         float: left;
 686 }
 687
 688 .contact-block-textdiv { width: 150px; height: 34px; float: left; }
 689 #contact-block-end { clear: both; }
 690
 691 /* ======= */
 692 /* = Jot = */
 693 /* ======= */
 694
 695 #profile-jot-text_tbl { margin-bottom: 10px; }
 696 #profile-jot-text_ifr { width: 99.9%!important }
 697 #profile-jot-submit-wrapper {
 698 }
 699
 700 #profile-jot-perms, #profile-jot-submit {
 701         width: 60px;
 702         font-size: 12px;
 703         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 704         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 705         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 706         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
 707         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
 708         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
 709         background-color:#bdbdbd;
 710         -moz-border-radius:5px;
 711         -webkit-border-radius:5px;
 712         border-radius:5px;
 713         display:inline-block;
 714         color:#efefef;
 715         text-decoration:none;
 716         text-align: center;
 717 }
 718
 719 #profile-jot-perms {
 720         width: 30px;
 721         overflow: hidden;
 722         border: 0px;
 723         margin-left:5px;
 724 }
 725
 726 #jot-perms-perms .icon {
 727         height: 1px;
 728 }
 729
 730 #profile-jot-submit {
 731         float: left;
 732         margin-right:5px;
 733         border: 0px;
 734         margin-top: 0px;
 735         margin-left: -30px;
 736 }
 737
 738 #profile-jot-perms:hover, #profile-jot-submit:hover {
 739         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
 740         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
 741         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
 742         background-color:#b20202;
 743 }
 744 #profile-jot-perms:active, #profile-jot-submit:active {
 745         position:relative;
 746         top:1px;
 747 }
 748
 749 #character-counter {
 750         /*float: left; padding: 8px 10px;*/
 751         position: absolute: right: 100px; top:100px;
 752 }
 753 #profile-rotator-wrapper {
 754  float: right;
 755 }
 756
 757 .jot-tool {
 758         float: left;
 759         margin-right: 5px;
 760 }
 761 #profile-jot-tools-end,
 762 #profile-jot-banner-end { clear: both; }
 763
 764 #profile-jot-email-wrapper {
 765         margin: 10px 10% 0px 10%;
 766         border: 1px solid #eeeeee;
 767         border-bottom: 0px;
 768 }
 769 #profile-jot-email-label { background-color: #555753; color: #ccccce;   padding: 5px;}
 770 #profile-jot-email { margin: 5px; width: 98%; }
 771
 772 #profile-jot-networks {
 773         margin: 0px 10%;
 774         border: 1px solid #eeeeee;
 775         border-top: 0px;
 776         border-bottom: 0px;
 777         padding: 5px;
 778 }
 779 #profile-jot-acl-wrapper {
 780         margin: 0px 10px;
 781         border: 1px solid #eeeeee;
 782         border-top: 0px;
 783         display:block!important;
 784 }
 785 #group_allow_wrapper,
 786 #group_deny_wrapper,
 787 #acl-permit-outer-wrapper { width: 47%; float: left; }
 788
 789 #contact_allow_wrapper,
 790 #contact_deny_wrapper,
 791 #acl-deny-outer-wrapper { width: 47%; float: right; }
 792
 793 #acl-permit-text {background-color: #555753; color: #ccccce; padding: 5px; float: left;}
 794 #jot-public {background-color: #555753; color: #ff0000; padding: 5px; float: left;}
 795 #acl-deny-text {background-color: #555753; color: #ccccce; padding: 5px; float: left;}
 796
 797 #acl-permit-text-end,
 798 #acl-deny-text-end { clear: both; }
 799 #profile-jot-wrapper {
 800         margin-top: 0px;
 801         padding-top: 0px;
 802 }
 803
 804 profile-jot-banner-wrapper {
 805         padding: 0px;
 806         margin: 0px;
 807 }
 808
 809 .contact-h4 {
 810         font-size: 1.2em;
 811 }
 812
 813 /* ======== */
 814 /* = Tabs = */
 815 /* ======== */
 816
 817 .tabs-wrapper {
 818         width: 450px;
 819         list-style: none;
 820         padding: 10px;
 821         margin: 0px 0px 10px 0px;
 822         border-bottom: 1px solid #efefef;
 823 }
 824 .tabs-wrapper li { display: inline;}
 825
 826 .tabs {
 827         padding: 5px 10px 5px 10px;
 828         margin-right: 5px;
 829         font-style: bold;
 830         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 831         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 832         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
 833         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
 834         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
 835         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
 836         background-color:#bdbdbd;
 837         -moz-border-radius:5px;
 838         -webkit-border-radius:5px;
 839         border-radius:5px;
 840         color:#efefef;
 841         text-decoration:none;
 842         text-align: center;
 843 }
 844
 845 .tabs:hover {
 846         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
 847         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
 848         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
 849         background-color:#b20202;
 850         color:#efefef;
 851         padding: 5px 10px 5px 10px;
 852         margin-right: 5px;
 853 }
 854 .tabs:active {
 855         position:relative;
 856         top:1px;
 857         color:#efefef;
 858         padding: 5px 10px 5px 10px;
 859         margin-right: 5px;
 860 }
 861
 862 /* ========= */
 863 /* = Posts = */
 864 /* ========= */
 865
 866 .wall-item-outside-wrapper {
 867         margin-top: 50px;
 868 }
 869 .wall-item-outside-wrapper-end { clear: both;}
 870 .wall-item-content-wrapper { position: relative; max-width: 95%; }
 871 .wall-item-photo-menu { display: none;}
 872 .wall-item-photo-menu-button {
 873         display:none;
 874         text-indent: -99999px;
 875         background: #eeeeee url("menu-user-pin.png") no-repeat 75px center;
 876         position: absolute;
 877         overflow: hidden;
 878         height: 20px; width: 90px;
 879         top: 85px;      left: -1px;
 880         -webkit-border-radius: 0px 0px 5px  5px;
 881         -moz-border-radius: 0px 0px 5px  5px;
 882         border-radius: 0px 0px 5px  5px;
 883 }
 884
 885 .wall-item-info { float: left; width: 140px; }
 886 .wall-item-photo-wrapper {
 887         width: 80px; height: 80px;
 888         position: relative;
 889         padding: 5px;
 890         background-color: #eeeeee;
 891         border: 1px solid #dddddd;
 892         -moz-box-shadow: 3px 3px 4px #959494;
 893         -webkit-box-shadow: 3px 3px 4px #959494;
 894         box-shadow: 3px 3px 4px #959494;
 895 }
 896
 897 .wall-item-tools {
 898         filter: alpha(opacity=60);
 899         opacity: 0.7;
 900         -webkit-transition: all 0.25s ease-in-out;
 901         -moz-transition: all 0.25s ease-in-out;
 902         -o-transition: all 0.25s ease-in-out;
 903         -ms-transition: all 0.25s ease-in-out;
 904         transition: all 0.25s ease-in-out;
 905         margin-left: 140px;
 906         margin-top: 10px;
 907         padding-bottom: 6px;
 908 }
 909
 910 .wall-item-tools:hover {
 911         filter: alpha(opacity=100);
 912         opacity: 1;
 913         -webkit-transition: all 0.25s ease-in-out;
 914         -moz-transition: all 0.25s ease-in-out;
 915         -o-transition: all 0.25s ease-in-out;
 916         -ms-transition: all 0.25s ease-in-out;
 917         transition: all 0.25s ease-in-out;
 918         margin-left: 140px;
 919 }
 920
 921 .wall-item-outside-wrapper.comment .wall-item-tools {
 922         margin: 5px 5px 10px 60px;
 923         float: left;
 924 }
 925
 926 .wall-item-like-buttons {
 927         float: left;
 928 }
 929 .wall-item-like-buttons a.icon {
 930         float: left;
 931         margin-right: 5px;
 932         display: inline;
 933 }
 934 .wall-item-links-wrapper {
 935         width: 20px;
 936         float: left;
 937 }
 938 .wall-item-delete-wrapper {
 939         float: left;
 940 }
 941 .wall-item-links-wrapper a.icon {
 942         float: left;
 943         margin-right: 5px;
 944         display: inline;
 945 }
 946 .pencil {
 947         float: left;
 948 }
 949
 950 .star-item {
 951         margin-left: 5px;
 952         margin-right: 2px;
 953         float: left;
 954 }
 955 .wall-item-title { font-size: 1.2em; font-weight: bold;}
 956 .wall-item-body { margin-left: 140px; padding-right: 20px; }
 957 .wall-item-body p {
 958         max-width: 600px;
 959         font-size: 0.8em;
 960 }
 961 .wall-item-lock-wrapper { float: right; }
 962 .wall-item-dislike,
 963 .wall-item-like,
 964 .wall-item-author {
 965         clear: left;
 966         font-size: 0.9em;
 967         margin: 4px 0px 0px 140px;
 968         font-variant:small-caps;
 969 }
 970
 971 .wall-item-author a {
 972         color: #898989;
 973 }
 974
 975 .wall-item-ago { display: inline; padding-left: 10px; color: #898989;}
 976 .wall-item-wrapper-end { clear:both; }
 977 .wall-item-location {
 978         margin-top:5px;
 979         width: 100px;
 980         overflow: hidden;
 981         text-overflow: ellipsis;
 982         -o-text-overflow: ellipsis;
 983 }
 984
 985 .wall-item-location .icon { float: left; }
 986 .wall-item-location > a {
 987         margin-left: 25px;
 988         font-size: 0.9em;
 989         display: block;
 990         font-variant:small-caps;
 991         color: #898989;
 992 }
 993
 994 .wall-item-location .smalltext { margin-left: 25px;  font-size: 0.9em; display: block;}
 995 .wall-item-location > br { display: none; }
 996 .wall-item-conv a{
 997         font-size: 0.9em;
 998         color: #898989;
 999         font-variant:small-caps;
1000 }
1001
1002 .wallwall .wwto {
1003     left: -10px;
1004     margin: 0;
1005     position: absolute;
1006     top: 65px;
1007     width: 30px;
1008     z-index: 10001;
1009         width: 30px;
1010         height: 30px;
1011 }
1012
1013 .wallwall .wwto img { width: 30px!important; height: 30px!important;}
1014 .wallwall .wall-item-photo-end { clear: both; }
1015 .wall-item-arrowphoto-wrapper {
1016     position: absolute;
1017     left: 20px;
1018     top: 70px;
1019     z-index: 10002;
1020 }
1021
1022 .wall-item-photo-menu {
1023         min-width: 92px;
1024         color: #2e3436;
1025         border-top: 0px;
1026         background: #eeeeee;
1027         border-right: 1px solid #dddddd;
1028         border-left: 1px solid #dddddd;
1029         border-bottom: 1px solid #dddddd;
1030         position: absolute;
1031         left: -2px; top: 101px;
1032         display: none;
1033         z-index: 10000;
1034         -webkit-border-radius: 0px 5px 5px 5px;
1035         -moz-border-radius: 0px 5px 5px 5px;
1036         border-radius: 0px 5px 5px 5px;
1037         -moz-box-shadow: 3px 3px 4px #959494;
1038         -webkit-box-shadow: 3px 3px 4px #959494;
1039         box-shadow: 3px 3px 4px #959494;
1040 }
1041
1042 .wall-item-photo-menu-button {
1043         border-right: 1px solid #dddddd;
1044         border-left: 1px solid #dddddd;
1045         border-bottom: 1px solid #dddddd;
1046         -moz-box-shadow: 3px 3px 4px #959494;
1047         -webkit-box-shadow: 3px 3px 4px #959494;
1048         box-shadow: 3px 3px 4px #959494;
1049 }
1050
1051 .fakelink wall-item-photo-menu-button {
1052         -webkit-border-radius: 0px 5px 5px 5px;
1053         -moz-border-radius: 0px 5px 5px 5px;
1054         border-radius: 0px 5px 5px 5px;
1055         -moz-box-shadow: 3px 3px 4px #959494;
1056         -webkit-box-shadow: 3px 3px 4px #959494;
1057         box-shadow: 3px 3px 4px #959494;
1058 }
1059
1060 .wall-item-photo-menu ul { margin:0px; padding: 0px; list-style: none }
1061 .wall-item-photo-menu li a { white-space: nowrap;  display: block; padding: 5px 2px;    color: #2e3436;  }
1062 .wall-item-photo-menu li a:hover {
1063         color: #efefef;
1064         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1065         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1066         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1067         background-color:#b20202;
1068         order-bottom: none;
1069 }
1070
1071 .icon.drop,
1072 .icon.drophide { float: left; }
1073 #item-delete-selected { overflow: auto; width: 100%;}
1074 .wall-item-outside-wrapper {
1075         max-width: 90%;
1076         border-bottom: 1px solid #dedede;
1077         margin-top: 20px;
1078 }
1079
1080 /* ============ */
1081 /* = Comments = */
1082 /* ============ */
1083
1084  .ccollapse-wrapper {
1085         font-size: 0.9em;
1086         color: #898989;
1087         margin-left: 80px;
1088         font-variant:small-caps;
1089 }
1090
1091 .wall-item-outside-wrapper.comment { margin-left: 80px; }
1092 .wall-item-outside-wrapper.comment .wall-item-photo { width: 40px!important; height: 40px!important;}
1093 .wall-item-outside-wrapper.comment .wall-item-photo-wrapper {width: 40px; height: 40px; }
1094 .wall-item-outside-wrapper.comment .wall-item-photo-menu-button {
1095         width: 50px;
1096         top: 45px;
1097         background-position: 35px center;
1098 }
1099 .wall-item-outside-wrapper.comment .wall-item-info { width: 60px; }
1100 .wall-item-outside-wrapper.comment .wall-item-body { margin-left: 60px; max-width: 85%;}
1101 .wall-item-outside-wrapper.comment .wall-item-author { margin-left: 60px;}
1102
1103 .wall-item-outside-wrapper.comment .wall-item-photo-menu {
1104         min-width: 50px;
1105         top: 60px;
1106 }
1107 .icollapse-wrapper {
1108         font-size: 0.9em;
1109         color: #898989;
1110         font-variant:small-caps;
1111 }
1112
1113 .comment-wwedit-wrapper,
1114 .comment-edit-wrapper { margin: 30px 0px 0px 80px;}
1115 .comment-wwedit-wrapper img,
1116 .comment-edit-wrapper img { width: 20px; height: 20px; }
1117 .comment-edit-photo-link { float: left; width: 40px;}
1118 .comment-edit-text-empty {
1119         width: 80%;
1120         height: 20px;
1121         border: 0px;
1122         color: #babdb6;
1123         -webkit-transition: all 0.5s ease-in-out;
1124         -moz-transition: all 0.5s ease-in-out;
1125         -o-transition: all 0.5s ease-in-out;
1126         -ms-transition: all 0.5s ease-in-out;
1127         transition: all 0.5s ease-in-out;
1128 }
1129 .comment-edit-text-empty:hover { color: #999999;}
1130 .comment-edit-text-full { width: 80%; height: 6em;
1131         -webkit-transition: all 0.5s ease-in-out;
1132         -moz-transition: all 0.5s ease-in-out;
1133         -o-transition: all 0.5s ease-in-out;
1134         -ms-transition: all 0.5s ease-in-out;
1135         transition: all 0.5s ease-in-out;
1136 }
1137 .comment-edit-submit-wrapper { width: 80%; margin-left: 40px; text-align: right; }
1138 .comment-edit-submit {
1139         height: 22px;
1140         background-color: #a2a2a2;
1141         color: #eeeeec;
1142         -webkit-border-radius: 5px;
1143         -moz-border-radius: 5px;
1144         border-radius: 5px;
1145         border: 0px;
1146 }
1147
1148 .comment-edit-submit:hover {
1149         background-color: #b20202;
1150 }
1151
1152 .comment-edit-submit:active {
1153         background-color: #b20202;
1154 }
1155
1156 #item-delete-selected-desc {
1157         color: #898989;
1158 }
1159
1160 /**
1161  * item text style
1162  **/
1163 .wall-item-body code {
1164     border-color: #CCCCCC;
1165     border-style: solid;
1166     border-width: 1px 1px 1px 10px;
1167     display: block;
1168     padding-left: 10px;
1169 }
1170
1171 /* =========== */
1172 /* = Profile = */
1173 /* =========== */
1174
1175 .advanced-profile-content {
1176         margin-top: 5px;
1177         margin-bottom: 10px;
1178         margin-left: 30px;
1179         width: 60%;
1180 }
1181
1182 .advanced-profile-label {
1183         margin-top: 10px;
1184         margin-bottom: 0px;
1185         padding-bottom: 5px;
1186         font-size: 18px;
1187         font-variant:small-caps;
1188 }
1189
1190 div[id$="wrapper"] { height: 100%;}
1191 div[id$="wrapper"] br { clear: left; }
1192 #advanced-profile-with { margin-left: 20px;}
1193
1194 #profile-listing-desc {
1195         float: left;
1196         display: inline;
1197         padding: 5px 10px 5px 10px;
1198         width: 150px;
1199         margin-bottom:20px;
1200         margin-top: 20px;
1201         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1202         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1203         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1204         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1205         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1206         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1207         background-color:#bdbdbd;
1208         -moz-border-radius:5px;
1209         -webkit-border-radius:5px;
1210         border-radius:5px;
1211         display:inline-block;
1212         color:#efefef;
1213         font-style: bold;
1214         text-align: center;
1215 }
1216
1217 #profile-listing-desc:hover {
1218         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1219         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1220         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1221         background-color:#b20202;
1222 }
1223
1224 #profile-listing-desc:active {
1225         background-color: #b20202;
1226         position:relative;
1227         top:1px;
1228 }
1229
1230 #profile-listing-desc a {
1231         color: #efefef;
1232 }
1233
1234 #profile-listing-new-link-wrapper {
1235         float: left;
1236         display: inline;
1237         width: 130px;
1238         margin-left:5px;
1239         margin-top: 20px;
1240         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1241         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1242         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1243         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1244         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1245         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1246         background-color:#bdbdbd;
1247         -moz-border-radius:5px;
1248         -webkit-border-radius:5px;
1249         border-radius:5px;
1250         padding: 5px 10px 5px 10px;
1251         font-style: bold;
1252         color:#efefef;
1253         text-align: center;
1254 }
1255
1256 #profile-listing-new-link-wrapper:hover {
1257         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1258         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1259         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1260         background-color:#b20202;
1261 }
1262
1263 #profile-listing-new-link-wrapper:active {
1264         background-color: #b20202;
1265         position:relative;
1266         top:1px;
1267 }
1268
1269 #profile-listing-new-link-wrapper a {
1270         color: #efefef;
1271 }
1272
1273 .profile-listing-name {
1274         font-size: 1em;
1275         font-variant: small-caps;
1276 }
1277 .profile-listing-name a {
1278         color: #898989;
1279 }
1280
1281 .profile-listing-visible {
1282         width: 90px;
1283         margin-bottom:20px;
1284         margin-top: 10px;
1285         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1286         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1287         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1288         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1289         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1290         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1291         background-color:#bdbdbd;
1292         -moz-border-radius:5px;
1293         -webkit-border-radius:5px;
1294         border-radius:5px;
1295         padding: 5px 10px 5px 10px;
1296         margin-right: 5px;
1297         color:#efefef;
1298         text-align: center;
1299 }
1300
1301 .profile-listing-visible:hover {
1302         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1303         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1304         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1305         background-color:#b20202;
1306 }
1307
1308 .profile-listing-visible:active {
1309         background-color: #b20202;
1310         position:relative;
1311         top:1px;
1312 }
1313
1314 .profile-listing-visible  a {
1315         color: #efefef;
1316 }
1317
1318 .profile-listing-photo {
1319         padding: 5px;
1320         background-color: #efefef;
1321         border: 2px dotted #eeeeee;
1322         -moz-box-shadow: 3px 3px 4px #959494;
1323         -webkit-box-shadow: 3px 3px 4px #959494;
1324         box-shadow: 3px 3px 4px #959494;
1325 }
1326
1327 #profile-edit-links li {
1328         display: inline;
1329         width: 150px;
1330         margin-bottom:20px;
1331         margin-top: 20px;
1332         background-color: #a2a2a2;
1333         color: #eeeeec;
1334         padding: 5px 10px 5px 10px;
1335         margin-right: 5px;
1336         font-style: bold;
1337         -webkit-border-radius: 5px 5px 5px 5px;
1338     -moz-border-radius: 5px 5px 5px 5px;
1339     border-radius: 5px 5px 5px 5px;
1340 }
1341
1342 #profile-edit-links li a {
1343         color: #efefef;
1344 }
1345
1346 #profile-edit-links li:hover {
1347         background-color: #b20202;
1348 }
1349
1350 #profile-edit-links li:active {
1351         background-color: #b20202;
1352 }
1353
1354 #cropimage-wrapper { float:left; }
1355 #crop-image-form { clear:both; }
1356
1357 .profile-match-name a{
1358         color: #999;
1359         font-variant: small-caps;
1360         font-size: 1em;
1361 }
1362
1363 .profile-match-name a:hover {
1364         color: #999;
1365 }
1366
1367 .profile-match-wrapper {
1368         width: 300px;
1369         padding: 5px;
1370         margin-bottom:10px;
1371         background-color: #f6f6f6;
1372         border: 1px solid #dddddd;
1373         -moz-box-shadow: 3px 3px 4px #959494;
1374         -webkit-box-shadow: 3px 3px 4px #959494;
1375         box-shadow: 3px 3px 4px #959494;
1376 }
1377
1378 /* ========== */
1379 /* = Photos = */
1380 /* ========== */
1381
1382 #side-bar-photos-albums li {
1383         font-size: 1.2em;
1384         font-variant: none;
1385 }
1386
1387 #photo-top-links {
1388         width: 130px;
1389         margin-bottom:20px;
1390         margin-top: 20px;
1391         background-color: #a2a2a2;
1392         color: #eeeeec;
1393         padding: 5px 10px 5px 10px;
1394         margin-right: 5px;
1395         font-style: bold;
1396         -webkit-border-radius: 5px 5px 5px 5px;
1397     -moz-border-radius: 5px 5px 5px 5px;
1398     border-radius: 5px 5px 5px 5px;
1399 }
1400 #photo-top-links a {
1401         color: #efefef;
1402 }
1403
1404 #photo-top-links:hover {
1405         background-color: #b20202;
1406 }
1407
1408 #photo-top-links:active {
1409         background-color: #b20202;
1410 }
1411
1412 .photo-album-image-wrapper,
1413 .photo-top-image-wrapper {
1414         float: left;
1415         margin: 0px 10px 10px 0px;
1416         border: 1px solid #dddddd;
1417         -moz-box-shadow: 3px 3px 6px #959494;
1418         -webkit-box-shadow: 3px 3px 6px #959494;
1419         box-shadow: 3px 3px 6px #959494;
1420         background-color: #efefef;
1421         padding: 10px;
1422         padding-bottom: 30px;
1423         position:relative;
1424 }
1425
1426 #photo-photo { max-width: 100% }
1427 #photo-photo img { max-width: 100% }
1428
1429 .photo-top-image-wrapper a:hover,
1430 #photo-photo a:hover,
1431 .photo-album-image-wrapper a:hover {
1432         border-bottom: 0px;
1433 }
1434
1435 .photo-top-photo,
1436 .photo-album-photo {}
1437
1438 .photo-top-album-name {
1439         position: absolute;
1440         bottom: 0px;
1441         padding: 0px 5px;
1442         font-weight: bold;
1443         font-stretch:semi-expanded;
1444         font-variant:small-caps;
1445 }
1446
1447 .photo-top-album-name a{
1448         text-align: center;
1449         color: #6e6e6e;
1450 }
1451 .caption {
1452         position: absolute;
1453         bottom: 0px;
1454         margin: 0px 5px;
1455         text-align: center;
1456         color: #6e6e6e;
1457         font-size: 0.9em;
1458         font-variant: small-caps;
1459 }
1460
1461 #photo-photo{
1462         position: relative;
1463         float:left;
1464         border: 1px solid #dddddd;
1465         -moz-box-shadow: 3px 3px 6px #959494;
1466         -webkit-box-shadow: 3px 3px 6px #959494;
1467         box-shadow: 3px 3px 6px #959494;
1468         background-color: #efefef;
1469         padding: 10px;
1470 }
1471
1472 #photo-caption {
1473         margin-top: 10px;
1474         color: #6E6E6E;
1475         font-variant:small-caps;
1476         font-size: 1.1em;
1477 }
1478
1479 #photo-photo-end { clear: both; }
1480 #photo-prev-link,
1481 #photo-next-link{
1482         position: absolute;
1483         width:10%;
1484         height: 100%;
1485         background-color: rgba(255,255,255,0.2);
1486         opacity: 0;
1487         -webkit-transition: all 0.2s ease-in-out;
1488         -moz-transition: all 0.2s ease-in-out;
1489         -o-transition: all 0.2s ease-in-out;
1490         -ms-transition: all 0.2s ease-in-out;
1491         transition: all 0.2s ease-in-out;
1492         background-position: center center;
1493         background-repeat: no-repeat;
1494 }
1495
1496 #photo-prev-link { left:0px; top:0px; background-image: url('prev.png'); }
1497 #photo-next-link { right:0px; top:0px; background-image: url('next.png');}
1498 #photo-prev-link a,
1499 #photo-next-link a{
1500         display: block; width: 100%; height: 100%;
1501         overflow: hidden;
1502         text-indent: -900000px;
1503 }
1504
1505 #photo-prev-link:hover,
1506 #photo-next-link:hover {
1507         opacity: 1;
1508         -webkit-transition: all 0.2s ease-in-out;
1509         -moz-transition: all 0.2s ease-in-out;
1510         -o-transition: all 0.2s ease-in-out;
1511         -ms-transition: all 0.2s ease-in-out;
1512         transition: all 0.2s ease-in-out;
1513 }
1514
1515 #photo-next-link .icon,
1516 #photo-prev-link .icon { display: none }
1517
1518 #photos-upload-spacer,
1519 #photos-upload-new-wrapper,
1520 #photos-upload-exist-wrapper { margin-bottom: 1em; }
1521 #photos-upload-existing-album-text,
1522 #photos-upload-newalbum-div {
1523         background-color: #fff;
1524         color: #909090;
1525         font-size: 1.2em;
1526         padding: 3px 0px;
1527         padding-left: 0px;
1528         width: 300px;
1529 }
1530
1531 #photos-upload-album-select,
1532 #photos-upload-newalbum { width: 400px; }
1533
1534 #photos-upload-perms-menu {
1535         width: 180px;
1536         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1537         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1538         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1539         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1540         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1541         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1542         background-color:#bdbdbd;
1543         -moz-border-radius:5px;
1544         -webkit-border-radius:5px;
1545         border-radius:5px;
1546         padding: 7px;
1547         text-align: center;
1548         font-size: 0.9em;
1549         color: #efefef;
1550 }
1551
1552 #photos-upload-perms-menu:hover {
1553         text-align: center;
1554         font-size: 0.9em;
1555         width: 180px;
1556         padding: 7px;
1557         color: #efefef;
1558         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1559         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1560         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1561         background-color:#b20202;
1562 }
1563
1564 #photos-upload-perms-menu:active {
1565         text-align: center;
1566         font-size: 0.9em;
1567         width: 180px;
1568         padding: 7px;
1569         background-color: #b20202;
1570         position:relative;
1571         top:1px;
1572 }
1573
1574 #photos-upload-perms-menu  a {
1575         color: #efefef;
1576 }
1577
1578 #photos-upload-perms-menu .icon {
1579         display: none;
1580 }
1581
1582 select[size], select[multiple], select[size][multiple] {
1583         -webkit-appearance: listbox;
1584         border: 2px solid #b0b0b0;
1585         padding: 2px;
1586     -webkit-border-radius: 3px 3px 3px 3px;
1587     -moz-border-radius: 3px 3px 3px 3px;
1588     border-radius: 3px 3px 3px 3px;
1589 }
1590
1591 select {
1592         -webkit-appearance: menulist;
1593         box-sizing: border-box;
1594         -webkit-box-align: center;
1595         cursor: default;
1596         border: 2px solid #b0b0b0;
1597         padding: 2px;
1598     -webkit-border-radius: 3px 3px 3px 3px;
1599     -moz-border-radius: 3px 3px 3px 3px;
1600     border-radius: 3px 3px 3px 3px;
1601 }
1602
1603 keygen, select {
1604         -webkit-border-radius: ;
1605 }
1606
1607 input, textarea, keygen {
1608         font-size: 0.9em;
1609         letter-spacing: normal;
1610         word-spacing: normal;
1611         line-height: 1.2em;
1612         text-transform: none;
1613         text-indent: 0px;
1614         text-shadow: none;
1615         display: inline-block;
1616         text-align: -webkit-auto;
1617         border: 2px solid #b0b0b0;
1618         padding: 2px;
1619     -webkit-border-radius: 3px 3px 3px 3px;
1620     -moz-border-radius: 3px 3px 3px 3px;
1621     border-radius: 3px 3px 3px 3px;
1622 }
1623
1624 .qq-upload-button {
1625         background-color: none;
1626         -moz-box-shadow:inset 0px 1px 0px 0px #a65151;
1627         -webkit-box-shadow:inset 0px 1px 0px 0px #a65151;
1628         box-shadow:inset 0px 1px 0px 0px #a65151;
1629         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #d60808), color-stop(1, #b20202) );
1630         background:-moz-linear-gradient( center top, #d60808 5%, #b20202 100%);
1631         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d60808', endColorstr='#b20202');
1632         background-color:#d60808;
1633         -moz-border-radius:5px;
1634         -webkit-border-radius:5px;
1635         border-radius:5px;
1636         border:1px solid #fc5656;
1637         display:inline-block;
1638         color:#f0e7e7;
1639         text-shadow:1px 1px 0px #b36f6f;
1640         text-align: center;
1641         font-size: 0.9em;
1642         color: #efefef;
1643         width: 91px;
1644         padding: 7px;
1645 }
1646
1647 .qq-upload-button:hover {
1648         text-align: center;
1649         font-size: 0.9em;
1650         color: #efefef;
1651         width: 91px;
1652         padding: 7px;
1653         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) )!important;
1654         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% )!important;
1655         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808')!important;
1656         background-color:#b20202;
1657 }
1658
1659 .qq-upload-button:active {
1660         text-align: center;
1661         font-size: 0.9em;
1662         color: #efefef;
1663         background-color: #B20202;
1664         width: 91px;
1665         padding: 7px;
1666         position:relative;
1667         top:1px;
1668 }
1669
1670 #album-edit-link {
1671         width: 70px;
1672         margin-bottom:20px;
1673         margin-top: 20px;
1674         background-color: #a2a2a2;
1675         color: #eeeeec;
1676         padding: 5px 10px 5px 10px;
1677         margin-right: 5px;
1678         font-style: bold;
1679         -webkit-border-radius: 5px 5px 5px 5px;
1680         -moz-border-radius: 5px 5px 5px 5px;
1681         border-radius: 5px 5px 5px 5px;
1682 }
1683
1684 #album-edit-link  a {
1685         color: #efefef;
1686 }
1687
1688 #album-edit-link:hover {
1689         background-color: #b20202;
1690 }
1691
1692 #photo-edit-link-wrap {
1693         margin-bottom: 10px;
1694 }
1695
1696 #photo_edit_form {
1697         width: 500px;
1698         margin-top:20px;
1699         text-align: left;
1700 }
1701
1702 input#photo_edit_form {
1703         display: block;
1704         width: 100%;
1705 }
1706
1707 #photo-edit-perms-menu {
1708         float: left;
1709         display: inline;
1710         margin-top: 10px;
1711         margin-right: 10px;
1712         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1713         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1714         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1715         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1716         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1717         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1718         background-color:#bdbdbd;
1719         -moz-border-radius:5px;
1720         -webkit-border-radius:5px;
1721         border-radius:5px;
1722         padding: 4px;
1723         color: #efefef;
1724         text-align: center;
1725         font-size: 0.9em;
1726         width: 100px;
1727 }
1728
1729 #photo-edit-perms-menu:hover {
1730         color: #efefef;
1731         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1732         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1733         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1734         background-color:#b20202;
1735 }
1736
1737 #photo-edit-perms-menu:active {
1738         background-color: #b20202;
1739         position:relative;
1740         top:1px;
1741 }
1742
1743 #photo-edit-perms-menu a {
1744         color: #efefef;
1745 }
1746
1747 #photo-edit-perms-menu .icon {
1748         display: none;
1749 }
1750
1751 #photo-edit-delete-button {
1752         float: left;
1753         display: inline;
1754         margin-left: 190px;
1755 }
1756
1757 #side-bar-photos-albums h3:before {
1758         content: url("photography.png");
1759         padding-right: 10px;
1760         vertical-align: middle;
1761 }
1762
1763 #side-bar-photos-albums li {
1764         margin-bottom: 5px;
1765 }
1766
1767 #photo-album-edit-wrapper {
1768         margin-bottom: 10px;
1769 }
1770
1771 /* ============ */
1772 /* = Messages = */
1773 /* ============ */
1774
1775 #prvmail-wrapper, .mail-conv-detail, .mail-list-detail {
1776         position: relative;
1777         width: 500px;
1778         padding: 50px;
1779         margin: 20px auto;
1780         background-color: #fff;
1781         -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
1782         -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
1783         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
1784 }
1785
1786 #prvmail-wrapper:before, #prvmail-wrapper:after, .mail-conv-detail:before, .mail-conv-detail:after, .mail-list-detail:before, .mail-list-detail:after {
1787         position: absolute;
1788         width: 40%;
1789         height: 10px;
1790         content: ' ';
1791         left: 12px;
1792         bottom: 12px;
1793         background: transparent;
1794         -webkit-transform: skew(-5deg) rotate(-5deg);
1795         -moz-transform: skew(-5deg) rotate(-5deg);
1796         -ms-transform: skew(-5deg) rotate(-5deg);
1797         -o-transform: skew(-5deg) rotate(-5deg);
1798         transform: skew(-5deg) rotate(-5deg);
1799         -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
1800         -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
1801         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
1802         z-index: -1;
1803 }
1804
1805 #prvmail-wrapper:after, .mail-conv-detail:after, .mail-list-detail:after {
1806         left: auto;
1807         right: 12px;
1808         -webkit-transform: skew(5deg) rotate(5deg);
1809         -moz-transform: skew(5deg) rotate(5deg);
1810         -ms-transform: skew(5deg) rotate(5deg);
1811         -o-transform: skew(5deg) rotate(5deg);
1812         transform: skew(5deg) rotate(5deg);
1813 }
1814
1815 .prvmail-text {
1816         width: 100%;
1817 }
1818
1819 #prvmail-form input
1820
1821 #prvmail-subject { width: 490px;; padding-left: 10px; font-size: 1.1em; font-style: bold;}
1822 #prvmail-subject .input{
1823         border: none !important ;
1824 }
1825
1826 #prvmail-subject-label {
1827         font-variant:small-caps;
1828 }
1829
1830 #prvmail-to {
1831         padding-left: 10px;
1832 }
1833 #prvmail-to-label {
1834         font-variant:small-caps;
1835 }
1836
1837 #prvmail-message-label {
1838         font-variant:small-caps;
1839         font-size: 1em;
1840 }
1841
1842
1843 #prvmail-submit-wrapper { margin-top: 10px; }
1844 #prvmail-submit {
1845         float: right;
1846         margin-top: 0px;
1847         margin-right: 90px;
1848 }
1849
1850 #prvmail-upload {
1851 margin-left: 90px;
1852 }
1853
1854 #prvmail-submit-wrapper > div {
1855         margin-right: 5px;
1856         float: left;
1857 }
1858
1859 .mail-list-outside-wrapper {
1860         margin-top: 20px;
1861 }
1862
1863 .mail-list-sender {
1864         float: left;
1865         padding: 5px;
1866         background-color: #efefef;
1867         border: 2px dotted #eeeeee;
1868         -moz-box-shadow: 3px 3px 4px #959494;
1869         -webkit-box-shadow: 3px 3px 4px #959494;
1870         box-shadow: 3px 3px 4px #959494;
1871 }
1872
1873 .mail-list-detail {
1874         margin-left: 100px;
1875         width: 300px;
1876         min-height: 70px;
1877         padding: 20px;
1878         padding-top:10px;
1879         border: 1px solid #dddddd;
1880         }
1881
1882 .mail-list-sender-name {
1883         font-size: 1.1em;
1884         display: inline;
1885         font-variant:small-caps;
1886 }
1887
1888 .mail-list-date {
1889         float: right;
1890         clear: block;
1891         display: inline;
1892         font-size: 0.8em;
1893         padding-left: 10px;
1894         font-stretch:ultra-condensed;
1895         font-variant:small-caps;
1896 }
1897
1898 .mail-list-subject {
1899         clear: block;
1900         font-size: 1.2em;
1901         padding-top: 20px;
1902         padding-right: 50px;
1903 }
1904
1905 .mail-list-subject a {
1906         color: #626262;
1907 }
1908
1909 .mail-list-delete-wrapper { float: left; margin-right:550px; }
1910 .mail-list-outside-wrapper-end {
1911         clear: both;
1912 }
1913
1914 .mail-conv-sender {float: left; margin: 0px 5px 5px 0px; }
1915 .mail-conv-sender-photo {
1916         width: 64px;
1917         height: 64px;
1918         padding: 5px;
1919         background-color: #efefef;
1920         border: 1px solid #dddddd;
1921         -moz-box-shadow: 3px 3px 4px #959494;
1922         -webkit-box-shadow: 3px 3px 4px #959494;
1923         box-shadow: 3px 3px 4px #959494;
1924 }
1925
1926 .mail-conv-sender-name { float: left; font-variant:small-caps; font-style: bold; }
1927 .mail-conv-date { float: right; font-variant:small-caps; }
1928 .mail-conv-subject { clear: right; font-weight: bold; font-size: 1.2em }
1929 .mail-conv-body {
1930         clear: both;
1931 }
1932
1933 .mail-conv-detail {
1934         width: 500px;
1935         padding: 30px;
1936         margin-left: 20px;
1937         vertical-align: middle;
1938         margin: auto;
1939         border: 1px solid #dddddd;
1940 }
1941 .mail-conv-break { display: none; border: none;}
1942 .mail-conv-delete-wrapper { margin-top: 5px; width: 650px; text-align: right; }
1943
1944 /* ================= */
1945 /* = Notifications = */
1946 /* ================= */
1947
1948 #notification-show-hide-wrapper {
1949         width: 160px;
1950         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1951         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1952         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1953         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1954         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1955         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1956         background-color:#bdbdbd;
1957         -moz-border-radius:5px;
1958         -webkit-border-radius:5px;
1959         border-radius:5px;
1960         padding: 5px 10px 5px 10px;
1961         margin-right: 5px;
1962         margin-top: 10px;
1963         font-style: bold;
1964         color: #efefef;
1965         text-align: center;
1966 }
1967
1968 #notification-show-hide-wrapper:hover {
1969         color: #efefef;
1970         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1971         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1972         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1973         background-color:#b20202;
1974 }
1975
1976 #notification-show-hide-wrapper:active {
1977         background-color: #b20202;
1978         position:relative;
1979         top:1px;
1980 }
1981
1982 #notification-show-hide-wrapper a {
1983         color: #efefef;
1984 }
1985
1986 /* ============ */
1987 /* = Contacts = */
1988 /* ============ */
1989
1990 #contacts-main {
1991         margin-bottom: 10px;
1992 }
1993
1994 .view-contact-wrapper,
1995 .contact-entry-wrapper {
1996         float: left;
1997         margin-right: 30px;
1998         margin-bottom: 20px;
1999         width: 88px;
2000         height: 120px;
2001         position: relative;
2002 }
2003
2004 .contact-entry-direction-wrapper {position: absolute; top: 20px;}
2005 .contact-entry-edit-links { position: absolute; top: 60px; }
2006 #contacts-show-hide-link { margin-bottom: 20px; margin-top: 10px; font-weight: bold;}
2007 .contact-entry-photo {
2008         padding: 3px;
2009         background-color: #eeeeee;
2010         border: 1px solid #dddddd;
2011         -moz-box-shadow: 3px 3px 4px #959494;
2012         -webkit-box-shadow: 3px 3px 4px #959494;
2013         box-shadow: 3px 3px 4px #959494;
2014 }
2015
2016 .contact-entry-name {
2017         width: 100px;
2018         overflow: hidden;
2019         font: #999;
2020         font-size: 12px;
2021         text-align:center;
2022         font-variant:small-caps;
2023         font-weight: bold;
2024         margin-top:5px;
2025 }
2026
2027 .contact-entry-photo {
2028         position: relative;
2029 }
2030
2031 .contact-entry-edit-links .icon {
2032         border: 1px solid #babdb6;
2033     -webkit-border-radius: 3px;
2034     -moz-border-radius: 3px;
2035     border-radius: 3px;
2036         background-color: #ffffff;
2037 }
2038
2039 #contact-edit-banner-name { font-size: 1.5em; margin-left: 30px; font-variant: small-caps; }
2040 #contact-edit-photo-wrapper {position: relative; float: left; padding: 20px;}
2041 #contact-edit-direction-icon { position: absolute; top: 60px; left:0px;}
2042 #contact-edit-nav-wrapper { margin-left: 210px; }
2043 #contact-edit-links { float: left; margin-top: 23px; }
2044 #contact-drop-links {/*position: absolute; top: 150px; left: 348px;*/}
2045 #contact-edit-nav-wrapper .icon {
2046         border: 1px solid #babdb6;
2047     -webkit-border-radius: 3px;
2048     -moz-border-radius: 3px;
2049     border-radius: 3px;
2050 }
2051
2052 #contact-edit-nettype {
2053         font-size: 1em;
2054         font-variant: small-caps;
2055         margin-left: 30px;
2056         margin-bottom: 0px;
2057         padding-bottom: 0px;
2058 }
2059
2060 #contact-edit-poll-wrapper { margin-left: 50px; width: 300px;}
2061 #contact-edit-last-update-text { margin-bottom: 15px; padding-top: 20px; padding-left: 10px; font-size: 0.9em; max-width: 300px; }
2062 #contact-edit-last-updated { font-weight: bold; }
2063 #contact-edit-poll-text { display: inline; font-size: 0.9em; padding-left: 10px; }
2064 #contact-edit-end { clear: both; margin-bottom: 65px;}
2065
2066 #contact-edit-update-now {
2067         width: 80px;
2068         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2069         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2070         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2071         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2072         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2073         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2074         background-color:#bdbdbd;
2075         -moz-border-radius:5px;
2076         -webkit-border-radius:5px;
2077         border-radius:5px;
2078         padding: 5px 10px 5px 10px;
2079         margin-left: 125px;
2080         margin-top: 10px;
2081         font-style: bold;
2082         color: #efefef;
2083 }
2084
2085 #contact-edit-update-now:hover {
2086         color: #efefef;
2087         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2088         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2089         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2090         background-color:#b20202;
2091 }
2092
2093 #contact-edit-update-now:active {
2094         background-color: #b20202;
2095         position:relative;
2096         top:1px;
2097 }
2098
2099 #contact-edit-update-now a {
2100         color: #efefef;
2101 }
2102
2103
2104 #contact-edit-profile-select-text > p {
2105         font-size: 1em;
2106 }
2107
2108 .contact-photo-menu-button {
2109         position: absolute;
2110     background-image: url("photo-menu.jpg");
2111     background-position: top left;
2112     background-repeat: no-repeat;
2113     margin: 0px; padding: 0px;
2114     width: 16px;
2115     height: 16px;
2116     top: 64px; left:0px;
2117     overflow: hidden;
2118     text-indent: 40px;
2119     display: none;
2120 }
2121
2122 #contact-edit-photo {
2123         padding: 10px;
2124         background-color: #f1f1f1;
2125         border: 1px solid #dedede;
2126         margin-bottom: 5px;
2127         -moz-box-shadow: 5px 5px 8px #959494;
2128         -webkit-box-shadow: 5px 5px 8px #959494;
2129         box-shadow: 5px 5px 8px #959494;
2130 }
2131 .contact-photo-menu {
2132     width: auto;
2133     border: 1px solid #ddd;
2134     background: #f1f1f1;
2135     position: absolute;
2136     left: 0px; top: 90px;
2137     display: none;
2138     z-index: 10000;
2139         -moz-box-shadow: 3px 3px 5px #888;
2140         -webkit-box-shadow: 3px 3px 5px #888;
2141         box-shadow: 3px 3px 5px #888;
2142 }
2143
2144 .contact-photo-menu ul { margin:0px; padding: 0px; list-style: none }
2145 .contact-photo-menu li a { display: block; padding: 3px; color: #626262; font-size: 1em; }
2146 .contact-photo-menu li a:hover {
2147         color: #FFFFFF;
2148         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2149         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2150         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2151         background-color:#b20202;
2152         text-decoration: none;
2153 }
2154
2155 .view-contact-photo {
2156         padding: 5px;
2157         background-color: #efefef;
2158         border: 1px solid #dddddd;
2159         -moz-box-shadow: 3px 3px 4px #959494;
2160         -webkit-box-shadow: 3px 3px 4px #959494;
2161         box-shadow: 3px 3px 4px #959494;
2162 }
2163
2164 .view-contact-name {
2165         font-variant: small-caps;
2166 }
2167
2168 #div.side-link {
2169         background-color: #efefef;
2170         padding: 10px;
2171         margin-top:20px;
2172 }
2173
2174 #follow-sidebar {
2175         margin-bottom: 20px;
2176 }
2177
2178 #follow-sidebar h3:before {
2179         content: url("user.png");
2180         padding-right: 10px;
2181         vertical-align: middle;
2182 }
2183
2184 #follow-sidebar input[type="text"] {
2185         margin-left: 10px;
2186         margin-bottom: 10px;
2187 }
2188
2189 #side-match-link {
2190         width: 180px;
2191         padding: 10px;
2192         margin: auto;
2193         margin-bottom: 20px;
2194         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2195         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2196         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2197         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2198         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2199         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2200         background-color:#bdbdbd;
2201         -moz-border-radius:5px;
2202         -webkit-border-radius:5px;
2203         border-radius:5px;
2204         padding: 5px 10px 5px 10px;
2205         color: #efefef;
2206         font-size: 1.2em;
2207         text-align: center;
2208 }
2209
2210 #side-match-link:hover {
2211         color: #efefef;
2212         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2213         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2214         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2215         background-color:#b20202;
2216 }
2217
2218 #side-match-link:active {
2219         background-color: #b20202;
2220         position:relative;
2221         top:1px;
2222 }
2223
2224 #side-match-link a {
2225         color: #efefef;
2226 }
2227
2228 #side-invite-link {
2229         width: 180px;
2230         padding: 10px;
2231         margin: auto;
2232         margin-bottom: 20px;
2233         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2234         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2235         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2236         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2237         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2238         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2239         background-color:#bdbdbd;
2240         -moz-border-radius:5px;
2241         -webkit-border-radius:5px;
2242         border-radius:5px;
2243         padding: 5px 10px 5px 10px;
2244         color: #efefef;
2245         font-size: 1.2em;
2246         text-align: center;
2247 }
2248
2249 #side-invite-link:hover {
2250         color: #efefef;
2251         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2252         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2253         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2254         background-color:#b20202;
2255 }
2256
2257 #side-invite-link:active {
2258         background-color: #b20202;
2259         position:relative;
2260         top:1px;
2261 }
2262
2263 #side-invite-link a {
2264         color: #efefef;
2265 }
2266
2267 #invite-message, #invite-recipients, #invite-recipient-text {
2268         padding: 10px;
2269 }
2270
2271 #side-follow-wrapper{
2272         font-size: 1em;
2273         font-weight: bold;
2274         font-stretch:semi-expanded;
2275         background-color: #f3f3f3;
2276         border: 1px solid #cdcdcd;
2277         padding: 10px;
2278         margin-top: 20px;
2279         -webkit-border-radius: 5px 5px 5px 5px;
2280     -moz-border-radius: 5px 5px 5px 5px;
2281     border-radius: 5px 5px 5px 5px;
2282 }
2283
2284 #side-follow-wrapper label{
2285         font-size: 1.1em;
2286         font-variant: normal;
2287 }
2288
2289 #contact-view-recent {
2290         float: left;
2291         width: 150px;
2292         padding: 10px;
2293         margin-bottom: 20px;
2294         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2295         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2296         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2297         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2298         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2299         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2300         background-color:#bdbdbd;
2301         -moz-border-radius:5px;
2302         -webkit-border-radius:5px;
2303         border-radius:5px;
2304         padding: 5px 10px 5px 10px;
2305         color: #efefef;
2306         font-size: 1.2em;
2307         text-align: center;
2308 }
2309
2310 #contact-view-recent:hover{
2311         color: #efefef;
2312         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2313         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2314         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2315         background-color:#b20202;
2316 }
2317
2318 #contact-view-recent:active {
2319         background-color: #b20202;
2320         position:relative;
2321         top:1px;
2322 }
2323
2324 #contact-view-recent a {
2325         color: #efefef;
2326 }
2327
2328 #contact-suggest {
2329         float: left;
2330         margin-left: 10px;
2331         width: 120px;
2332         padding: 10px;
2333         margin-bottom: 20px;
2334         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2335         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2336         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2337         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2338         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2339         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2340         background-color:#bdbdbd;
2341         -moz-border-radius:5px;
2342         -webkit-border-radius:5px;
2343         border-radius:5px;
2344         padding: 5px 10px 5px 10px;
2345         color: #efefef;
2346         font-size: 1.2em;
2347         text-align: center;
2348 }
2349
2350 #contact-suggest:hover {
2351         color: #efefef;
2352         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2353         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2354         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2355         background-color:#b20202;
2356 }
2357
2358 #contact-suggest:active {
2359         background-color: #b20202;
2360         position:relative;
2361         top:1px;
2362 }
2363
2364 #contact-suggest a {
2365         color: #efefef;
2366 }
2367
2368 #contact-edit-info-wrapper {
2369         clear: both;
2370 }
2371
2372 /* ===================================== */
2373 /* = Register, Settings, Profile Forms = */
2374 /* ===================================== */
2375
2376 #id_openid_url,
2377 .openid {
2378         background: url(login-bg.gif) no-repeat;
2379         background-position: 0 50%;
2380         padding-left: 18px;
2381         width: 385px;
2382 }
2383
2384 #profile-tabs-wrapper {
2385         padding-top: 10px;
2386 }
2387
2388 #profile-tab-status-link:hover {
2389         border: 0px;
2390         padding: 5px 10px 5px 10px;
2391         font-style: bold;
2392         color: #efefef;
2393         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2394         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2395         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2396         background-color:#b20202;
2397 }
2398
2399 #profile-tab-status-link:active {
2400         border: 0px;
2401         padding: 5px 10px 5px 10px;
2402         font-style: bold;
2403         background-color: #b20202;
2404         position:relative;
2405         top:1px;
2406 }
2407
2408 #profile-tab-status-link a {
2409         color: #efefef;
2410 }
2411
2412 #uexport-link a {
2413         color: #efefef;
2414 }
2415
2416 #profile-tab-profile-link:hover {
2417         border: 0px;
2418         padding: 5px 10px 5px 10px;
2419         font-style: bold;
2420         color: #efefef;
2421         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2422         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2423         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2424         background-color:#b20202;
2425 }
2426
2427 #profile-tab-profile-link:active {
2428         border: 0px;
2429         padding: 5px 10px 5px 10px;
2430         font-style: bold;
2431         background-color: #b20202;
2432         position:relative;
2433         top:1px;
2434 }
2435
2436 #profile-tab-profile-link a {
2437         color: #efefef;
2438 }
2439
2440 #uexport-link {
2441         width: 140px;
2442         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2443         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2444         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2445         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7c7d7b), color-stop(1, #555753) );
2446         background:-moz-linear-gradient( center top, #7c7d7b 5%, #555753 100% );
2447         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7c7d7b', endColorstr='#555753');
2448         background-color:#7c7d7b;
2449         -moz-border-radius:5px;
2450         -webkit-border-radius:5px;
2451         border-radius:5px;
2452         padding: 5px 10px 5px 10px;
2453         margin-bottom: 10px;
2454 }
2455
2456 #uexport-link:hover {
2457         color: #efefef;
2458         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #555753), color-stop(1, #7c7d7b) );
2459         background:-moz-linear-gradient( center top, #555753 5%, #7c7d7b 100% );
2460         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#555753', endColorstr='#7c7d7b');
2461         background-color:#555753;
2462 }
2463
2464 #uexport-link:active {
2465         color: #efefef;
2466         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2467         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2468         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2469         background-color:#b20202;
2470         position:relative;
2471         top:1px;
2472 }
2473
2474 #settings-default-perms {
2475         width: 160px;
2476         text-align: center;
2477         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2478         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2479         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2480         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7c7d7b), color-stop(1, #555753) );
2481         background:-moz-linear-gradient( center top, #7c7d7b 5%, #555753 100% );
2482         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7c7d7b', endColorstr='#555753');
2483         background-color:#7c7d7b;
2484         -moz-border-radius:5px;
2485         -webkit-border-radius:5px;
2486         border-radius:5px;
2487         padding: 5px 10px 5px 10px;
2488         margin-bottom: 10px;
2489 }
2490
2491 #settings-default-perms .fakelink {
2492         color: #efefef;
2493 }
2494
2495 #settings-default-perms:hover {
2496         color: #efefef;
2497         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #555753), color-stop(1, #7c7d7b) );
2498         background:-moz-linear-gradient( center top, #555753 5%, #7c7d7b 100% );
2499         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#555753', endColorstr='#7c7d7b');
2500         background-color:#555753;
2501 }
2502
2503 #settings-default-perms:active {
2504         color: #efefef;
2505         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2506         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2507         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2508         background-color:#b20202;
2509         position:relative;
2510         top:1px;
2511 }
2512
2513 #settings-nickname-desc {
2514         width: 80%;
2515         background-color: #efefef;
2516         margin-bottom: 10px;
2517         -webkit-border-radius: 5px;
2518         -moz-border-radius: 5px;
2519     border-radius: 5px;
2520     padding: 5px;
2521 }
2522
2523 #register-form div,
2524 #profile-edit-form div {
2525         clear: both;
2526 }
2527
2528 #register-form label,
2529 #profile-edit-form label {
2530         width: 300px; float: left;
2531 }
2532
2533 #register-form span,
2534 #profile-edit-form span  {
2535         color: #555753;
2536         display:block;
2537         margin-bottom: 20px;
2538 }
2539
2540 .settings-submit-wrapper,
2541 .profile-edit-submit-wrapper { margin: 30px 0px;}
2542 .profile-listing { float: left; clear: both; margin: 20px 20px 0px 0px}
2543
2544 #profile-edit-links ul { margin: 20px 0px; padding: 0px; list-style: none; }
2545
2546
2547 #register-sitename { display: inline; font-weight: bold;}
2548
2549 /* ===================== */
2550 /* = Contacts Selector = */
2551 /* ===================== */
2552
2553 #group-edit-wrapper {
2554         margin-bottom: 10px;
2555 }
2556
2557 #group-edit-name-wrapper {
2558         margin-bottom: 0px;
2559         display: inline;
2560 }
2561 #group-edit-submit-wrapper {
2562         margin-bottom: 10px;
2563         margin-right: 400px;
2564         float: right;
2565         display: inline;
2566 }
2567 #group-delete-icon-11 { position: absolute; left: 360px; top: 103px; }
2568 .group-delete-wrapper {
2569         width: 90px;
2570         display: inline;
2571         padding: 5px;
2572         margin-bottom: 10px;
2573         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2574         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2575         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2576         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2577         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2578         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2579         background-color:#bdbdbd;
2580         -moz-border-radius:5px;
2581         -webkit-border-radius:5px;
2582         border-radius:5px;
2583 }
2584
2585 .group-delete-wrapper:hover {
2586         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2587         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2588         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2589         background-color:#b20202;
2590 }
2591
2592 .group-delete-wrapper:active {
2593         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2594         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2595         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2596         background-color:#b20202;
2597 }
2598
2599 .group-delete-wrapper a {
2600         color: #efefef;
2601 }
2602
2603 #group-edit-desc { margin: 10px 0xp; }
2604 #group-new-text {font-size: 1.1em;}
2605 #group-members,
2606 #prof-members {
2607         width: 83%;
2608         height: 200px;
2609         overflow: auto;
2610         border: none;
2611         background-color: #f0edf0;
2612         color: #555753;
2613         border: 1px solid #ccc;
2614         margin-bottom: 10px;
2615         padding: 10px;
2616 }
2617
2618 #group-all-contacts,
2619 #prof-all-contacts {
2620         width: 83%;
2621         height: 200px;
2622     overflow: auto;
2623         border: 1px solid #ccc;
2624         background-color: #f0edf0;
2625         padding: 10px;
2626 }
2627
2628 #group-members h3,
2629 #group-all-contacts h3,
2630 #prof-members h3,
2631 #prof-all-contacts h3{
2632         color: #555753;
2633         margin: 0px;
2634         padding: 5px;
2635 }
2636
2637 #group-separator,
2638 #prof-separator { display: none;}
2639
2640 /* ========== */
2641 /* = Events = */
2642 /* ========== */
2643
2644 .clear { clear: both; }
2645 .eventcal {
2646         float: left;
2647         font-size: 20px;
2648         padding: 20px;
2649 }
2650
2651 .vevent {
2652         position: relative;
2653         width: 400px;
2654         padding: 20px;
2655         padding-top: 10px;
2656         margin: 0 0px;
2657         background-color: #fff;
2658         -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2659         -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2660         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2661 }
2662
2663 .vevent:before, .vevent:after {
2664         position: absolute;
2665         width: 40%;
2666         height: 10px;
2667         content: ' ';
2668         left: 12px;
2669         bottom: 12px;
2670         background: transparent;
2671         -webkit-transform: skew(-5deg) rotate(-5deg);
2672         -moz-transform: skew(-5deg) rotate(-5deg);
2673         -ms-transform: skew(-5deg) rotate(-5deg);
2674         -o-transform: skew(-5deg) rotate(-5deg);
2675         transform: skew(-5deg) rotate(-5deg);
2676         -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2677         -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2678         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2679         z-index: -1;
2680 }
2681
2682 .vevent:after {
2683         left: auto;
2684         right: 12px;
2685         -webkit-transform: skew(5deg) rotate(5deg);
2686         -moz-transform: skew(5deg) rotate(5deg);
2687         -ms-transform: skew(5deg) rotate(5deg);
2688         -o-transform: skew(5deg) rotate(5deg);
2689         transform: skew(5deg) rotate(5deg);
2690 }
2691
2692 .vevent .event-description {
2693         margin-left: 10px;
2694         margin-right: 10px;
2695         text-align:center;
2696         font-size: 1.2em;
2697         font-weight:bolder;
2698 }
2699
2700  .vevent .event-location{
2701         margin-left: 10px;
2702         margin-right: 10px;
2703         font-size: 1em;
2704         font-style: oblique;
2705         text-align: center;
2706
2707 }
2708
2709 .vevent .event-start, .vevent .event-end  {
2710         margin-left: 20px;
2711         margin-right: 20px;
2712         margin-bottom: 2px;
2713         margin-top: 2px;
2714         font-size: 0.9em;
2715         font-variant: small-caps;
2716         text-align: left;
2717 }
2718
2719 #new-event-link{
2720         width: 130px;
2721         padding: 7px;
2722         margin-bottom: 10px;
2723         margin-left: 170px; ;
2724         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2725         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2726         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2727         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2728         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2729         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2730         background-color:#bdbdbd;
2731         -moz-border-radius:5px;
2732         -webkit-border-radius:5px;
2733         border-radius:5px;
2734         color: #efefef;
2735 }
2736
2737 #new-event-link:hover {
2738         color: #efefef;
2739         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2740         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2741         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2742         background-color:#b20202;
2743 }
2744
2745 #new-event-link:active {
2746         background-color: #b20202;
2747         position:relative;
2748         top:1px;
2749 }
2750
2751 #new-event-link a {
2752         color: #efefef;
2753         text-align: center;
2754 }
2755
2756 .edit-event-link, .plink-event-link {
2757         float: left;
2758         margin-top: 4px;
2759         margin-right: 4px;
2760         margin-bottom: 15px;
2761 }
2762
2763 .event-description:before {
2764         content: url('calendar.png');
2765         margin-right: 15px;
2766         vertical-align: middle;
2767 }
2768
2769 .event-start, .event-end {
2770         margin-left: 10px;
2771         width: 330px;
2772 }
2773
2774 .event-start .dtstart, .event-end .dtend {
2775         float: right;
2776 }
2777
2778 .event-list-date {
2779         color: #626262;
2780         margin-bottom: 10px;
2781         font-variant:small-caps;
2782         font-stretch:condensed;
2783 }
2784
2785 .prevcal, .nextcal {
2786         float: left;
2787         margin-left: 32px;
2788         margin-right: 32px;
2789         margin-top: 64px;
2790 }
2791
2792 .event-calendar-end {
2793         clear: both;
2794 }
2795
2796 .calendar {
2797         width: 300px;
2798         font-family: Helvetica, Arial, sans-serif;
2799         background-color: #f1f1f1;
2800         border: 1px solid #dedede;
2801         margin-bottom: 10px;
2802         -moz-box-shadow: 5px 5px 8px #959494;
2803         -webkit-box-shadow: 5px 5px 8px #959494;
2804         box-shadow: 5px 5px 8px #959494;
2805 }
2806
2807 .calendar caption{
2808         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #d60808), color-stop(1, #b20202) );
2809         background:-moz-linear-gradient( center top, #d60808 5%, #b20202 100% );
2810         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d60808', endColorstr='#b20202');
2811         background-color: #b20202;
2812         padding: 10px 0px 10px 0px;
2813         width: 300px;
2814         color: #ffffff;
2815         font-weight: bold;
2816         text-align:center;
2817         font-variant:small-caps;
2818         -moz-box-shadow: 5px 2px 8px #959494;
2819         -webkit-box-shadow: 5px 2px 8px #959494;
2820         box-shadow: 5px 2px 8px #959494;
2821 }
2822
2823 tr {
2824         border: 1px solid #eeeeee;
2825 }
2826
2827 .calendar td {
2828         font-size: 14px;
2829         text-align: center;
2830         padding: 3px 0px;
2831 }
2832
2833 .calendar td > a {
2834         background-color: #cdcdcd;
2835         padding: 2px;
2836         color: #000;
2837 }
2838
2839 .calendar th {
2840         font-size: 16px;
2841 }
2842
2843 .today {
2844         font-weight: bold;
2845         text-align: center;
2846         background-color: #b20202;
2847         color: #fff;
2848 }
2849
2850 #event-start-text,
2851 #event-finish-text {
2852         margin-top: 10px;
2853         margin-bottom: 5px;
2854 }
2855
2856 #event-nofinish-checkbox,
2857 #event-nofinish-text,
2858 #event-adjust-checkbox,
2859 #event-adjust-text,
2860 #event-share-checkbox {
2861         float: left;
2862 }
2863
2864 #event-datetime-break {
2865         margin-bottom: 10px;
2866 }
2867
2868 #event-nofinish-break,
2869 #event-adjust-break,
2870 #event-share-break {
2871         clear: both;
2872 }
2873
2874 #event-desc-text,
2875 #event-location-text {
2876         margin-top: 10px;
2877         margin-bottom: 5px;
2878 }
2879
2880 #event-submit {
2881         margin-top: 10px;
2882 }
2883
2884 /* ============= */
2885 /* = Directory = */
2886 /* ============= */
2887
2888 .directory-item {
2889         float: left;
2890         margin: 50px 50px 0px 0px;
2891         padding: 10px;
2892         background-color: #f1f1f1;
2893         border: 1px solid #dedede;
2894         margin-bottom: 5px;
2895         -moz-box-shadow: 5px 5px 8px #959494;
2896         -webkit-box-shadow: 5px 5px 8px #959494;
2897         box-shadow: 5px 5px 8px #959494;
2898 }
2899
2900 .directory-details {
2901         font-size: 0.9em;
2902         font-variant: small-caps;
2903         width: 160px;
2904 }
2905
2906 .directory-name {
2907         font-size: 1em;
2908         font-variant: small-caps;
2909         width: 150px;
2910 }
2911
2912 /* ========= */
2913 /* = Admin = */
2914 /* ========= */
2915
2916 #adminpage {
2917         width: 80%;
2918 }
2919
2920 #pending-update {
2921         float:right;
2922         color: #ffffff;
2923         font-weight: bold;
2924         background-color: #FF0000;
2925         padding: 0em 0.3em;
2926 }
2927
2928 .admin.linklist {
2929         border: 0px; padding: 0px;
2930 }
2931
2932 .admin.link {
2933         list-style-position: inside;
2934         font-size: 1em;
2935         padding: 3px;
2936 }
2937
2938 #adminpage dl {
2939         clear: left;
2940         margin-bottom: 2px;
2941         padding-bottom: 2px;
2942         border-bottom: 1px solid black;
2943 }
2944
2945 #adminpage dt {
2946         width: 200px;
2947         float: left;
2948         font-weight: bold;
2949 }
2950
2951 #adminpage dd {
2952         margin-left: 200px;
2953 }
2954 #adminpage h3 {
2955         border-bottom: 1px solid #898989;
2956         margin-bottom: 5px;
2957         margin-top: 10px;
2958 }
2959
2960 #adminpage .submit {
2961         clear:left;
2962 }
2963
2964 #adminpage #pluginslist {
2965         margin: 0px; padding: 0px;
2966 }
2967
2968 #adminpage .plugin {
2969         list-style: none;
2970         display: block;
2971         border: 1px solid #888888;
2972         padding: 1em;
2973         margin-bottom: 5px;
2974         clear: left;
2975 }
2976
2977 #adminpage .toggleplugin {
2978         float:left;
2979         margin-right: 1em;
2980 }
2981
2982 #adminpage table {width:100%; border-bottom: 1p solid #000000; margin: 5px 0px;}
2983 #adminpage table th { text-align: left;}
2984 #adminpage td .icon { float: left;}
2985 #adminpage table#users img { width: 16px; height: 16px; }
2986 #adminpage table tr:hover { background-color: #eeeeee; }
2987 #adminpage .selectall { text-align: right; }
2988
2989 /* =============== */
2990 /* = Form Fields = */
2991 /* =============== */
2992
2993 .field {
2994         margin-bottom: 5px;
2995         padding-bottom: 10px;
2996         overflow: auto;
2997         width: 90%;
2998 }
2999
3000 .field label {
3001         float: left;
3002         width: 200px;
3003 }
3004
3005 .field input,
3006 .field textarea {
3007         width: 400px;
3008 }
3009 .field textarea { height: 100px; }
3010 .field_help {
3011         display: block;
3012         margin-left: 100px;
3013         color: #666666;
3014 }
3015
3016 .field .onoff {
3017         float: left;
3018         width: 80px;
3019 }
3020 .field .onoff a {
3021         display: block;
3022         border:1px solid #c1c1c1;
3023         background-image:url("../../../images/onoff.jpg");
3024         background-repeat: no-repeat;
3025         padding: 4px 2px 2px 2px;
3026         height: 16px;
3027         text-decoration: none;
3028 }
3029 .field .onoff .off {
3030         border-color:#c1c1c1;
3031         padding-left: 40px;
3032         background-position: left center;
3033         background-color: #cccccc;
3034         color: #666666;
3035         text-align: right;
3036 }
3037
3038 .field .onoff .on {
3039         border-color:#c1c1c1;
3040         padding-right: 40px;
3041         background-position: right center;
3042         background-color: #b20202;
3043         color: #FFFFFF;
3044         text-align: left;
3045 }
3046
3047 .hidden { display: none!important; }
3048
3049 .field.radio .field_help { margin-left: 0px; }
3050
3051 /* ========= */
3052 /* = Icons = */
3053 /* ========= */
3054
3055 .icon {
3056         display: block; width: 20px; height: 20px;
3057         background-image: url('icons.png');
3058 }
3059 .starred {
3060         background-image: url("star.png");
3061         repeat: no-repeat;
3062 }
3063 .unstarred {
3064         background-image: url("premium.png");
3065         repeat: no-repeat;
3066 }
3067
3068
3069 .border {
3070         border: 1px solid #c1c1c1;
3071     -webkit-border-radius: 3px;
3072     -moz-border-radius: 3px;
3073     border-radius: 3px;
3074 }
3075
3076 .article        { background-position: -50px  0px;}
3077 .audio          { background-position: -70px  0px;}
3078 .block          { background-position: -90px  0px;}
3079 .drop           { background-position: -110px 0px;}
3080 .drophide       { background-position: -130px 0px;}
3081 .edit           { background-position: -150px 0px;}
3082 .camera         { background-position: -170px 0px;}
3083 .dislike        { background-position: -190px 0px;}
3084 .like           { background-position: -210px 0px;}
3085 .link           { background-position: -230px 0px;}
3086
3087 .globe          { background-position: -50px  -20px;}
3088 .noglobe        { background-position: -70px  -20px;}
3089 .no             { background-position: -90px  -20px;}
3090 .pause          { background-position: -110px -20px;}
3091 .play           { background-position: -130px -20px;}
3092 .pencil         { background-position: -150px -20px;}
3093 .small-pencil   { background-position: -170px -20px;}
3094 .recycle        { background-position: -190px -20px;}
3095 .remote-link    { background-position: -210px -20px;}
3096 .share          { background-position: -230px -20px;}
3097
3098 .tools          { background-position: -50px  -40px;}
3099 .lock           { background-position: -70px  -40px;}
3100
3101 .unlock         {
3102         background-position: -90px  -40px;
3103         background-image: none;
3104         width: 70px;
3105         height: 20px;
3106 }
3107
3108 .sharePerms {
3109         background-image: url(icons.png);
3110         width: 20px;
3111         height: 20px;
3112         margin: 2px 0px 2px 3px;
3113         display: block;
3114 }
3115
3116 .video          { background-position: -110px -40px;}
3117 .youtube        { background-position: -130px -40px;}
3118
3119 .attach         { background-position: -190px -40px;}
3120 .language       { background-position: -210px -40px;}
3121
3122
3123 .on             { background-position: -50px  -60px;}
3124 .off            { background-position: -70px  -60px;}
3125 .prev           { background-position: -90px  -60px;}
3126 .next           { background-position: -110px  -60px;}
3127
3128 .icon.dim { opacity: 0.3;filter:alpha(opacity=30); }
3129
3130 .attachtype {
3131         display: block; width: 20px; height: 23px;
3132         background-image: url('../../../images/content-types.png');
3133 }
3134
3135 .type-video { background-position: 0px 0px; }
3136 .type-image { background-position: -20px 0px; }
3137 .type-audio { background-position: -40px 0px; }
3138 .type-text  { background-position: -60px 0px; }
3139 .type-unkn  { background-position: -80px 0px; }
3140
3141 /* ========== */
3142 /* = Footer = */
3143 /* ========== */
3144
3145 .cc-license { margin-top: 100px; font-size: 0.7em; }
3146 footer { display: block; margin: 50px 20%; clear: both; }
3147
3148 #profile-jot-text {
3149     height: 20px;
3150     color:#cccccc;
3151     border: 1px solid #cccccc;
3152 }
3153
3154 /* ======= */
3155 /* = ACL = */
3156 /* ======= */
3157
3158 #photo-edit-perms-select,
3159 #photos-upload-permissions-wrapper,
3160 #profile-jot-acl-wrapper{
3161         display:block!important;
3162 }
3163
3164 #acl-wrapper {
3165         width: 690px;
3166         float:left;
3167 }
3168 #acl-search {
3169         float:right;
3170         background: #ffffff url("../../../images/search_18.png") no-repeat right center;
3171         padding-right:20px;
3172 }
3173 #acl-showall {
3174         float: left;
3175         display: block;
3176         font-size: 1em;
3177         font-style: bold;
3178         text-align: center;
3179         padding: 3px;
3180         margin-bottom: 5px;
3181         background-color: #cccccc;
3182         background-position: 7px 7px;
3183         background-repeat: no-repeat;
3184         padding: 5px;
3185         -webkit-border-radius: 5px ;
3186         -moz-border-radius: 5px;
3187         border-radius: 5px;
3188         color: #999999;
3189 }
3190 #acl-showall.selected {
3191         color: #fff;
3192         background-color: #b20202;
3193 }
3194
3195 #acl-list {
3196         height: 210px;
3197         border: 1px solid #cccccc;
3198          background-color: #efefef;
3199         clear: both;
3200         margin-top: 30px;
3201         overflow: auto;
3202 }
3203
3204 #acl-list-content {
3205         margin-left: 20px;
3206 }
3207
3208 .acl-list-item {
3209         display: block;
3210         width: 150px;
3211         height: 40px;
3212         border: 1px solid #cccccc;
3213         background-color: #fff;
3214         margin: 5px;
3215         float: left;
3216         -moz-box-shadow: 2px 2px 3px #c1c1c1;
3217         -webkit-box-shadow: 2px 2px 3px #c1c1c1;
3218         box-shadow: 2px 2px 3px #c1c1c1;
3219 }
3220 .acl-list-item img{
3221         width:30px;
3222         height: 30px;
3223         float: left;
3224         margin: 5px;
3225 }
3226
3227 .acl-list-item p {
3228         color: #999;
3229         height: 12px;
3230         font-size: 0.7em;
3231         margin: 0px;
3232         padding: 2px 0px 1px;
3233         overflow: hidden;
3234 }
3235
3236 .acl-list-item a {
3237         font-size: 10px;
3238         display: block;
3239         float: left;
3240         color: #efefef;
3241         background-color: #898989;
3242         background-position: 3px 3px;
3243         background-repeat: no-repeat;
3244         margin-right: 5px;
3245         -webkit-border-radius: 2px ;
3246         -moz-border-radius: 2px;
3247         border-radius: 2px;
3248         padding: 3px;
3249 }
3250
3251 #acl-wrapper a:hover {
3252         text-decoration: none;
3253         background-color:#b20202;
3254 }
3255
3256 .acl-button-show.selected {
3257         color: #efefef;
3258         background-color: #b20202;
3259 }
3260
3261 .acl-button-hide.selected {
3262         color: #efefef;
3263         background-color: #a2a2a2;
3264 }
3265
3266 .acl-list-item.groupshow { border-color: #b20202; }
3267 .acl-list-item.grouphide { border-color: #a2a2a2; }
3268
3269 /* ========================= */
3270 /* = Global Directory Link = */
3271 /* ========================= */
3272
3273 #global-directory-link {
3274         width: 130px;
3275         padding: 7px;
3276         margin-bottom: 10px;
3277         margin-left: 0px;
3278         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
3279         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
3280         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
3281         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
3282         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
3283         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
3284         background-color:#bdbdbd;
3285         -moz-border-radius:5px;
3286         -webkit-border-radius:5px;
3287         border-radius:5px;
3288         color: #efefef;
3289         text-align: center;
3290 }
3291
3292 #global-directory-link:hover {
3293         color: #efefef;
3294         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
3295         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
3296         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
3297         background-color:#b20202;
3298 }
3299
3300 #global-directory-link:active {
3301         background-color: #b20202;
3302         position:relative;
3303         top:1px;
3304 }
3305
3306 #global-directory-link a {
3307         color: #efefef;
3308 }
3309
3310 #global-directory-link {
3311         -webkit-padding-start: 0px;
3312 }
3313
3314 a.active {
3315         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
3316         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
3317         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
3318         background-color:#b20202;
3319         color:#efefef;
3320         padding: 5px 10px 5px 10px;
3321         margin-right: 5px;
3322 }