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