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: 40%;
 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 -40px; }
 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         max-width: 85%;
 845         border-bottom: 1px solid #dedede;
 846         margin-top: 20px;
 847         padding-right: 10px;
 848         overflow: hidden;
 849 }
 850
 851 .wall-item-outside-wrapper-end { clear: both;}
 852 .wall-item-content-wrapper { position: relative; max-width: 100%; }
 853 .wall-item-photo-menu { display: none;}
 854 .wall-item-photo-menu-button {
 855         display:none;
 856         text-indent: -99999px;
 857         background: #eeeeee url("menu-user-pin.png") no-repeat 75px center;
 858         position: absolute;
 859         overflow: hidden;
 860         height: 20px; width: 90px;
 861         top: 85px;      left: -1px;
 862         -webkit-border-radius: 0px 0px 5px  5px;
 863         -moz-border-radius: 0px 0px 5px  5px;
 864         border-radius: 0px 0px 5px  5px;
 865 }
 866
 867 .wall-item-info { float: left; width: 140px; }
 868 .wall-item-photo-wrapper {
 869         width: 80px; height: 80px;
 870         position: relative;
 871 }
 872
 873 .wall-item-tools {
 874         filter: alpha(opacity=60);
 875         opacity: 0.7;
 876         -webkit-transition: all 0.25s ease-in-out;
 877         -moz-transition: all 0.25s ease-in-out;
 878         -o-transition: all 0.25s ease-in-out;
 879         -ms-transition: all 0.25s ease-in-out;
 880         transition: all 0.25s ease-in-out;
 881         margin-left: 140px;
 882         margin-top: 10px;
 883         padding-bottom: 6px;
 884 }
 885
 886 .wall-item-tools:hover {
 887         filter: alpha(opacity=100);
 888         opacity: 1;
 889         -webkit-transition: all 0.25s ease-in-out;
 890         -moz-transition: all 0.25s ease-in-out;
 891         -o-transition: all 0.25s ease-in-out;
 892         -ms-transition: all 0.25s ease-in-out;
 893         transition: all 0.25s ease-in-out;
 894         margin-left: 140px;
 895 }
 896
 897 .wall-item-outside-wrapper.comment .wall-item-tools {
 898         margin: 5px 5px 10px 70px;
 899         float: left;
 900 }
 901
 902 .wall-item-like-buttons {
 903         float: left;
 904         padding-left: 10px;
 905 }
 906 .wall-item-like-buttons a.icon {
 907         float: left;
 908         margin-right: 5px;
 909         display: inline;
 910 }
 911 .wall-item-links-wrapper {
 912         width: 20px;
 913         float: left;
 914 }
 915 .wall-item-delete-wrapper {
 916         float: left;
 917 }
 918 .wall-item-links-wrapper a.icon {
 919         float: left;
 920         margin-right: 5px;
 921         display: inline;
 922 }
 923 .pencil {
 924         float: left;
 925 }
 926
 927 .star-item {
 928         margin-left: 5px;
 929         margin-right: 2px;
 930         float: left;
 931 }
 932 .wall-item-title { font-size: 1.2em; font-weight: bold;}
 933 .wall-item-body {
 934         margin-left: 140px;
 935         padding-right: 10px;
 936         max-width: 85%;
 937 }
 938
 939 .wall-item-body p {
 940         font-size: 0.8em;
 941 }
 942 .wall-item-lock-wrapper { float: right; }
 943 .wall-item-dislike,
 944 .wall-item-like,
 945 .wall-item-author {
 946         clear: left;
 947         font-size: 0.9em;
 948         margin: 4px 0px 0px 140px;
 949         padding-left: 10px;
 950         font-variant:small-caps;
 951 }
 952
 953 .wall-item-author a {
 954         color: #898989;
 955 }
 956
 957 .wall-item-ago { display: inline; padding-left: 10px; color: #898989;}
 958 .wall-item-wrapper-end { clear:both; }
 959 .wall-item-location {
 960         margin-top:5px;
 961         width: 100px;
 962         overflow: hidden;
 963         text-overflow: ellipsis;
 964         -o-text-overflow: ellipsis;
 965 }
 966
 967 .wall-item-location .icon { float: left; }
 968 .wall-item-location > a {
 969         margin-left: 25px;
 970         font-size: 0.9em;
 971         display: block;
 972         font-variant:small-caps;
 973         color: #898989;
 974 }
 975
 976 .wall-item-location .smalltext { margin-left: 25px;  font-size: 0.9em; display: block;}
 977 .wall-item-location > br { display: none; }
 978 .wall-item-conv a{
 979         font-size: 0.9em;
 980         color: #898989;
 981         font-variant:small-caps;
 982 }
 983
 984 .wallwall .wwto {
 985     left: -10px;
 986     margin: 0;
 987     position: absolute;
 988     top: 65px;
 989     width: 30px;
 990     z-index: 10001;
 991         width: 30px;
 992         height: 30px;
 993 }
 994
 995 .wallwall .wwto img { width: 30px!important; height: 30px!important;}
 996 .wallwall .wall-item-photo-end { clear: both; }
 997 .wall-item-arrowphoto-wrapper {
 998     position: absolute;
 999     left: 20px;
1000     top: 70px;
1001     z-index: 10002;
1002 }
1003
1004 .wall-item-photo-menu {
1005         min-width: 92px;
1006         color: #2e3436;
1007         border-top: 0px;
1008         background: #eeeeee;
1009         border-right: 1px solid #dddddd;
1010         border-left: 1px solid #dddddd;
1011         border-bottom: 1px solid #dddddd;
1012         position: absolute;
1013         left: -2px; top: 101px;
1014         display: none;
1015         z-index: 10000;
1016         -webkit-border-radius: 0px 5px 5px 5px;
1017         -moz-border-radius: 0px 5px 5px 5px;
1018         border-radius: 0px 5px 5px 5px;
1019         -moz-box-shadow: 3px 3px 4px #959494;
1020         -webkit-box-shadow: 3px 3px 4px #959494;
1021         box-shadow: 3px 3px 4px #959494;
1022 }
1023
1024 .wall-item-photo-menu-button {
1025         border-right: 1px solid #dddddd;
1026         border-left: 1px solid #dddddd;
1027         border-bottom: 1px solid #dddddd;
1028         -moz-box-shadow: 3px 3px 4px #959494;
1029         -webkit-box-shadow: 3px 3px 4px #959494;
1030         box-shadow: 3px 3px 4px #959494;
1031 }
1032
1033 .fakelink wall-item-photo-menu-button {
1034         -webkit-border-radius: 0px 5px 5px 5px;
1035         -moz-border-radius: 0px 5px 5px 5px;
1036         border-radius: 0px 5px 5px 5px;
1037         -moz-box-shadow: 3px 3px 4px #959494;
1038         -webkit-box-shadow: 3px 3px 4px #959494;
1039         box-shadow: 3px 3px 4px #959494;
1040 }
1041
1042 .wall-item-photo-menu ul { margin:0px; padding: 0px; list-style: none }
1043 .wall-item-photo-menu li a { white-space: nowrap;  display: block; padding: 5px 2px;    color: #2e3436;  }
1044 .wall-item-photo-menu li a:hover {
1045         color: #efefef;
1046         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1047         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1048         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1049         background-color:#b20202;
1050         order-bottom: none;
1051 }
1052
1053 .icon.drop,
1054 .icon.drophide { float: left; }
1055 #item-delete-selected { overflow: auto; width: 100%;}
1056
1057
1058 /* ============ */
1059 /* = Comments = */
1060 /* ============ */
1061
1062  .ccollapse-wrapper {
1063         font-size: 0.9em;
1064         color: #898989;
1065         margin-left: 60px;
1066         font-variant:small-caps;
1067 }
1068
1069 .wall-item-outside-wrapper.comment { margin-left: 70px; }
1070 .wall-item-outside-wrapper.comment .wall-item-photo {
1071         width: 40px!important;
1072         height: 40px!important;
1073 }
1074
1075 .wall-item-outside-wrapper.comment .wall-item-photo-wrapper {width: 40px; height: 40px; }
1076 .wall-item-outside-wrapper.comment .wall-item-photo-menu-button {
1077         width: 50px;
1078         top: 45px;
1079         background-position: 35px center;
1080 }
1081 .wall-item-outside-wrapper.comment .wall-item-info { width: 60px; }
1082 .wall-item-outside-wrapper.comment .wall-item-body {
1083         margin-left: 70px;
1084         max-width: 85%;
1085         padding-right: 10px;
1086         padding-left: 10px;
1087 }
1088
1089 .wall-item-outside-wrapper.comment .wall-item-author { margin-left: 60px;}
1090
1091 .wall-item-outside-wrapper.comment .wall-item-photo-menu {
1092         min-width: 50px;
1093         top: 60px;
1094 }
1095 .icollapse-wrapper {
1096         font-size: 0.9em;
1097         color: #898989;
1098         font-variant:small-caps;
1099 }
1100
1101 .comment-wwedit-wrapper,
1102 .comment-edit-wrapper { margin: 30px 0px 0px 80px;}
1103 .comment-wwedit-wrapper img,
1104 .comment-edit-wrapper img { width: 20px; height: 20px; }
1105 .comment-edit-photo-link { float: left; width: 40px;}
1106 .comment-edit-text-empty {
1107         width: 80%;
1108         height: 20px;
1109         border: 0px;
1110         color: #babdb6;
1111         -webkit-transition: all 0.5s ease-in-out;
1112         -moz-transition: all 0.5s ease-in-out;
1113         -o-transition: all 0.5s ease-in-out;
1114         -ms-transition: all 0.5s ease-in-out;
1115         transition: all 0.5s ease-in-out;
1116 }
1117 .comment-edit-text-empty:hover { color: #999999;}
1118 .comment-edit-text-full { width: 80%; height: 6em;
1119         -webkit-transition: all 0.5s ease-in-out;
1120         -moz-transition: all 0.5s ease-in-out;
1121         -o-transition: all 0.5s ease-in-out;
1122         -ms-transition: all 0.5s ease-in-out;
1123         transition: all 0.5s ease-in-out;
1124 }
1125 .comment-edit-submit-wrapper { width: 80%; margin-left: 40px; text-align: right; }
1126 .comment-edit-submit {
1127         height: 22px;
1128         background-color: #a2a2a2;
1129         color: #eeeeec;
1130         -webkit-border-radius: 5px;
1131         -moz-border-radius: 5px;
1132         border-radius: 5px;
1133         border: 0px;
1134 }
1135
1136 .comment-edit-submit:hover {
1137         background-color: #b20202;
1138 }
1139
1140 .comment-edit-submit:active {
1141         background-color: #b20202;
1142 }
1143
1144 #item-delete-selected-desc {
1145         color: #898989;
1146 }
1147
1148 .wall-item-body code {
1149         font-family: Courier, monospace;
1150         white-space: pre;
1151         display: block;
1152         overflow: auto;
1153         border: 1px solid #cccccc;
1154     border-width: 1px 1px 1px 10px;
1155         padding-left: 10px;
1156         margin-top: 20px;
1157 }
1158
1159 /* =========== */
1160 /* = Profile = */
1161 /* =========== */
1162
1163 .advanced-profile-content {
1164         margin-top: 5px;
1165         margin-bottom: 10px;
1166         margin-left: 30px;
1167         width: 60%;
1168 }
1169
1170 .advanced-profile-label {
1171         margin-top: 10px;
1172         margin-bottom: 0px;
1173         padding-bottom: 5px;
1174         font-size: 18px;
1175         font-variant:small-caps;
1176 }
1177
1178 div[id$="wrapper"] { height: 100%;}
1179 div[id$="wrapper"] br { clear: left; }
1180 #advanced-profile-with { margin-left: 20px;}
1181
1182 #profile-listing-desc {
1183         float: left;
1184         display: inline;
1185         padding: 5px 10px 5px 10px;
1186         width: 150px;
1187         margin-bottom:20px;
1188         margin-top: 20px;
1189         display:inline-block;
1190         font-style: bold;
1191         text-align: center;
1192 }
1193
1194 #profile-listing-new-link-wrapper {
1195         float: left;
1196         display: inline;
1197         width: 130px;
1198         margin-left:5px;
1199         margin-top: 20px;
1200         padding: 5px 10px 5px 10px;
1201         font-style: bold;
1202         text-align: center;
1203 }
1204
1205 .profile-listing-name {
1206         font-size: 1em;
1207         font-variant: small-caps;
1208 }
1209 .profile-listing-name a {
1210         color: #898989;
1211 }
1212
1213 #profile-edit-links li {
1214         display: inline;
1215         width: 150px;
1216         margin-bottom:20px;
1217         margin-top: 20px;
1218         background-color: #a2a2a2;
1219         color: #eeeeec;
1220         padding: 5px 10px 5px 10px;
1221         margin-right: 5px;
1222         font-style: bold;
1223         -webkit-border-radius: 5px 5px 5px 5px;
1224     -moz-border-radius: 5px 5px 5px 5px;
1225     border-radius: 5px 5px 5px 5px;
1226 }
1227
1228 #profile-edit-links li a {
1229         color: #efefef;
1230 }
1231
1232 #profile-edit-links li:hover {
1233         background-color: #b20202;
1234 }
1235
1236 #profile-edit-links li:active {
1237         background-color: #b20202;
1238 }
1239
1240 #cropimage-wrapper { float:left; }
1241 #crop-image-form { clear:both; }
1242
1243 .profile-match-name a{
1244         color: #999;
1245         font-variant: small-caps;
1246         font-size: 1em;
1247 }
1248
1249 .profile-match-name a:hover {
1250         color: #999;
1251 }
1252
1253 .profile-match-wrapper {
1254         width: 300px;
1255         padding: 5px;
1256         margin-bottom:10px;
1257         background-color: #f6f6f6;
1258         border: 1px solid #dddddd;
1259         -moz-box-shadow: 3px 3px 4px #959494;
1260         -webkit-box-shadow: 3px 3px 4px #959494;
1261         box-shadow: 3px 3px 4px #959494;
1262 }
1263
1264 /* ========== */
1265 /* = Photos = */
1266 /* ========== */
1267
1268 #side-bar-photos-albums h3:before {
1269         content: url("photography.png");
1270         padding-right: 10px;
1271         vertical-align: middle;
1272 }
1273
1274 #side-bar-photos-albums li {
1275         font-size: 14px;
1276         font-variant: none;
1277         text-align: left;
1278         padding-left: 20px;
1279         margin-bottom: 5px;
1280 }
1281
1282 #photo-top-links {
1283         width: 130px;
1284         margin-bottom:20px;
1285         margin-top: 20px;
1286         background-color: #a2a2a2;
1287         color: #eeeeec;
1288         padding: 5px 10px 5px 10px;
1289         margin-right: 5px;
1290         font-style: bold;
1291         -webkit-border-radius: 5px 5px 5px 5px;
1292     -moz-border-radius: 5px 5px 5px 5px;
1293     border-radius: 5px 5px 5px 5px;
1294 }
1295 #photo-top-links a {
1296         color: #efefef;
1297 }
1298
1299 #photo-top-links:hover {
1300         background-color: #b20202;
1301 }
1302
1303 #photo-top-links:active {
1304         background-color: #b20202;
1305 }
1306
1307 .photo-album-image-wrapper {
1308         float: left;
1309         margin: 0px 10px 10px 0px;
1310         padding-bottom: 30px;
1311         position:relative;
1312 }
1313
1314 .photo-top-image-wrapper {
1315         float: left;
1316         width: 180px;
1317         height: 180px;
1318         margin: 0px 10px 10px 0px;
1319         padding-bottom: 30px;
1320         position:relative;
1321 }
1322
1323 #photo-album-wrapper-inner {
1324         position: relative;
1325         float: left;
1326         width: 180px;
1327         height: 180px;
1328         overflow: hidden;
1329 }
1330
1331 #photo-photo { max-width: 85%; height: auto; }
1332 #photo-photo img { max-width: 100% }
1333
1334 .photo-top-image-wrapper a:hover,
1335 #photo-photo a:hover,
1336 .photo-album-image-wrapper a:hover {
1337         border-bottom: 0px;
1338 }
1339
1340 .photo-top-photo {}
1341 .photo-album-photo {}
1342
1343 .photo-top-album-name {
1344         position: absolute;
1345         bottom: 0px;
1346         padding: 0px 5px;
1347         font-weight: bold;
1348         font-stretch:semi-expanded;
1349         font-variant:small-caps;
1350 }
1351
1352 .photo-top-album-name a{
1353         text-align: center;
1354         color: #6e6e6e;
1355 }
1356 .caption {
1357         position: absolute;
1358         bottom: 0px;
1359         margin: 0px 5px;
1360         text-align: center;
1361         color: #6e6e6e;
1362         font-size: 0.9em;
1363         font-variant: small-caps;
1364 }
1365
1366 #photo-photo{
1367         position: relative;
1368         float:left;
1369 }
1370
1371 #photo-caption {
1372         margin-top: 10px;
1373         color: #6E6E6E;
1374         font-variant:small-caps;
1375         font-size: 1.1em;
1376 }
1377
1378 #photo-photo-end { clear: both; }
1379 #photo-prev-link,
1380 #photo-next-link{
1381         position: absolute;
1382         width:10%;
1383         height: 100%;
1384         background-color: rgba(255,255,255,0.2);
1385         opacity: 0;
1386         -webkit-transition: all 0.2s ease-in-out;
1387         -moz-transition: all 0.2s ease-in-out;
1388         -o-transition: all 0.2s ease-in-out;
1389         -ms-transition: all 0.2s ease-in-out;
1390         transition: all 0.2s ease-in-out;
1391         background-position: center center;
1392         background-repeat: no-repeat;
1393 }
1394
1395 #photo-prev-link { left:0px; top:0px; background-image: url('prev.png'); }
1396 #photo-next-link { right:0px; top:0px; background-image: url('next.png');}
1397 #photo-prev-link a,
1398 #photo-next-link a{
1399         display: block; width: 100%; height: 100%;
1400         overflow: hidden;
1401         text-indent: -900000px;
1402 }
1403
1404 #photo-prev-link:hover,
1405 #photo-next-link:hover {
1406         opacity: 1;
1407         -webkit-transition: all 0.2s ease-in-out;
1408         -moz-transition: all 0.2s ease-in-out;
1409         -o-transition: all 0.2s ease-in-out;
1410         -ms-transition: all 0.2s ease-in-out;
1411         transition: all 0.2s ease-in-out;
1412 }
1413
1414 #photo-next-link .icon,
1415 #photo-prev-link .icon { display: none }
1416
1417 #photos-upload-spacer,
1418 #photos-upload-new-wrapper,
1419 #photos-upload-exist-wrapper { margin-bottom: 1em; }
1420 #photos-upload-existing-album-text,
1421 #photos-upload-newalbum-div {
1422         background-color: #fff;
1423         color: #909090;
1424         font-size: 1.2em;
1425         padding: 3px 0px;
1426         padding-left: 0px;
1427         width: 300px;
1428 }
1429
1430 #photos-upload-album-select,
1431 #photos-upload-newalbum { width: 400px; }
1432
1433 #photos-upload-perms-menu {
1434         width: 180px;
1435         padding: 7px;
1436 }
1437
1438 #photos-upload-perms-menu .icon {
1439         display: none;
1440 }
1441
1442 select, input {
1443         border: 2px solid #b0b0b0;
1444         padding: 2px;
1445     -webkit-border-radius: 3px 3px 3px 3px;
1446     -moz-border-radius: 3px 3px 3px 3px;
1447     border-radius: 3px 3px 3px 3px;
1448 }
1449
1450 select[size], select[multiple], select[size][multiple] {
1451         -webkit-appearance: listbox;
1452 }
1453
1454 select {
1455         -webkit-appearance: menulist;
1456         box-sizing: border-box;
1457         -webkit-box-align: center;
1458         cursor: default;
1459 }
1460
1461 keygen, select {
1462         -webkit-border-radius: ;
1463 }
1464
1465 input, textarea, keygen {
1466         font-size: 0.9em;
1467         letter-spacing: normal;
1468         word-spacing: normal;
1469         line-height: 1.2em;
1470         text-transform: none;
1471         text-indent: 0px;
1472         text-shadow: none;
1473         display: inline-block;
1474         text-align: -webkit-auto;
1475 }
1476
1477 .qq-upload-button {
1478         -moz-border-radius:5px;
1479         -webkit-border-radius:5px;
1480         border-radius:5px;
1481 }
1482
1483 #album-edit-link {
1484         width: 70px;
1485         margin-bottom:20px;
1486         margin-top: 20px;
1487         background-color: #a2a2a2;
1488         color: #eeeeec;
1489         padding: 5px 10px 5px 10px;
1490         margin-right: 5px;
1491         font-style: bold;
1492         -webkit-border-radius: 5px 5px 5px 5px;
1493         -moz-border-radius: 5px 5px 5px 5px;
1494         border-radius: 5px 5px 5px 5px;
1495 }
1496
1497 #album-edit-link  a {
1498         color: #efefef;
1499 }
1500
1501 #album-edit-link:hover {
1502         background-color: #b20202;
1503 }
1504
1505 #photo-edit-link-wrap {
1506         margin-bottom: 10px;
1507 }
1508
1509 #photo_edit_form {
1510         width: 500px;
1511         margin-top:20px;
1512         text-align: left;
1513 }
1514
1515 input#photo_edit_form {
1516         display: block;
1517         width: 100%;
1518 }
1519
1520 #photo-edit-perms-menu {
1521         float: left;
1522         display: inline;
1523         margin-top: 10px;
1524         margin-right: 10px;
1525         padding: 4px;
1526         width: 100px;
1527 }
1528
1529 #photo-edit-perms-menu .icon {
1530         display: none;
1531 }
1532
1533 #photo-edit-delete-button {
1534         float: left;
1535         display: inline;
1536         margin-left: 190px;
1537 }
1538
1539 #photo-album-edit-wrapper {
1540         margin-bottom: 10px;
1541 }
1542
1543 /* ============ */
1544 /* = Messages = */
1545 /* ============ */
1546
1547 #prvmail-wrapper, .mail-conv-detail, .mail-list-detail {
1548         position: relative;
1549         width: 500px;
1550         padding: 50px;
1551         margin: 20px auto;
1552         background-color: #fff;
1553         -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
1554         -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
1555         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
1556 }
1557
1558 #prvmail-wrapper:before, #prvmail-wrapper:after, .mail-conv-detail:before, .mail-conv-detail:after, .mail-list-detail:before, .mail-list-detail:after {
1559         position: absolute;
1560         width: 40%;
1561         height: 10px;
1562         content: ' ';
1563         left: 12px;
1564         bottom: 12px;
1565         background: transparent;
1566         -webkit-transform: skew(-5deg) rotate(-5deg);
1567         -moz-transform: skew(-5deg) rotate(-5deg);
1568         -ms-transform: skew(-5deg) rotate(-5deg);
1569         -o-transform: skew(-5deg) rotate(-5deg);
1570         transform: skew(-5deg) rotate(-5deg);
1571         -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
1572         -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
1573         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
1574         z-index: -1;
1575 }
1576
1577 #prvmail-wrapper:after, .mail-conv-detail:after, .mail-list-detail:after {
1578         left: auto;
1579         right: 12px;
1580         -webkit-transform: skew(5deg) rotate(5deg);
1581         -moz-transform: skew(5deg) rotate(5deg);
1582         -ms-transform: skew(5deg) rotate(5deg);
1583         -o-transform: skew(5deg) rotate(5deg);
1584         transform: skew(5deg) rotate(5deg);
1585 }
1586
1587 .prvmail-text {
1588         width: 100%;
1589 }
1590
1591 #prvmail-form input
1592
1593 #prvmail-subject { width: 490px;; padding-left: 10px; font-size: 1.1em; font-style: bold;}
1594 #prvmail-subject .input{
1595         border: none !important ;
1596 }
1597
1598 #prvmail-subject-label {
1599         font-variant:small-caps;
1600 }
1601
1602 #prvmail-to {
1603         padding-left: 10px;
1604 }
1605 #prvmail-to-label {
1606         font-variant:small-caps;
1607 }
1608
1609 #prvmail-message-label {
1610         font-variant:small-caps;
1611         font-size: 1em;
1612 }
1613
1614 #prvmail-submit-wrapper { margin-top: 10px; }
1615 #prvmail-submit {
1616         float: right;
1617         margin-top: 0px;
1618         margin-right: 0px;
1619 }
1620
1621 #prvmail-upload {
1622 margin-left: 0px;
1623 }
1624
1625 #prvmail-submit-wrapper > div {
1626         margin-right: 5px;
1627         float: left;
1628 }
1629
1630 .mail-list-outside-wrapper {
1631         margin-top: 20px;
1632 }
1633
1634 .mail-list-sender {
1635         float: left;
1636         padding: 5px;
1637         background-color: #efefef;
1638         border: 2px dotted #eeeeee;
1639         -moz-box-shadow: 3px 3px 4px #959494;
1640         -webkit-box-shadow: 3px 3px 4px #959494;
1641         box-shadow: 3px 3px 4px #959494;
1642 }
1643
1644 .mail-list-detail {
1645         margin-left: 100px;
1646         width: 300px;
1647         min-height: 70px;
1648         padding: 20px;
1649         padding-top:10px;
1650         border: 1px solid #dddddd;
1651         }
1652
1653 .mail-list-sender-name {
1654         font-size: 1.1em;
1655         display: inline;
1656         font-variant:small-caps;
1657 }
1658
1659 .mail-list-date {
1660         float: right;
1661         clear: block;
1662         display: inline;
1663         font-size: 0.9em;
1664         padding-left: 10px;
1665         font-stretch:ultra-condensed;
1666         font-variant:small-caps;
1667 }
1668
1669 .mail-list-subject {
1670         clear: block;
1671         font-size: 1.2em;
1672         padding-top: 20px;
1673         padding-right: 50px;
1674 }
1675
1676 .mail-list-subject a {
1677         color: #626262;
1678 }
1679
1680 .mail-list-delete-wrapper { float: right;}
1681 .mail-list-outside-wrapper-end {
1682         clear: both;
1683 }
1684
1685 .mail-conv-outside-wrapper {
1686         margin-bottom: 10px;
1687 }
1688
1689 .mail-conv-sender {float: left; margin: 0px 5px 5px 0px; }
1690 .mail-conv-sender-photo {
1691         width: 64px;
1692         height: 64px;
1693 }
1694
1695 .mail-conv-sender-name { float: left; font-variant:small-caps; font-style: bold; }
1696 .mail-conv-date { float: right; font-variant:small-caps; }
1697 .mail-conv-subject { clear: right; font-weight: bold; font-size: 1.2em }
1698 .mail-conv-body {
1699         clear: both;
1700 }
1701
1702 .mail-conv-detail {
1703         width: 500px;
1704         padding: 30px;
1705         padding-bottom: 10px;
1706         margin-left: 20px;
1707         margin-bottom: 0px;
1708         vertical-align: middle;
1709         margin: auto;
1710         border: 1px solid #dddddd;
1711 }
1712 .mail-conv-break { display: none; border: none;}
1713 .mail-conv-delete-wrapper { padding-top: 10px; width: 510px; text-align: right; }
1714
1715 #prvmail-subject {
1716         font-weight: bold;
1717         border: 1px solid #dddddd;
1718 }
1719
1720 /* ================= */
1721 /* = Notifications = */
1722 /* ================= */
1723
1724 /*#notification-show-hide-wrapper {
1725         width: 160px;
1726         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1727         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1728         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1729         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1730         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1731         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1732         background-color:#bdbdbd;
1733         -moz-border-radius:5px;
1734         -webkit-border-radius:5px;
1735         border-radius:5px;
1736         padding: 5px 10px 5px 10px;
1737         margin-right: 5px;
1738         margin-top: 10px;
1739         font-style: bold;
1740         color: #efefef;
1741         text-align: center;
1742 }
1743
1744 #notification-show-hide-wrapper:hover {
1745         color: #efefef;
1746         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1747         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1748         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1749         background-color:#b20202;
1750 }
1751
1752 #notification-show-hide-wrapper:active {
1753         background-color: #b20202;
1754         position:relative;
1755         top:1px;
1756 }
1757
1758 #notification-show-hide-wrapper a {
1759         color: #efefef;
1760 }*/
1761
1762 /* ============ */
1763 /* = Contacts = */
1764 /* ============ */
1765
1766 #contacts-main {
1767         margin-bottom: 10px;
1768 }
1769
1770 .view-contact-wrapper,
1771 .contact-entry-wrapper {
1772         float: left;
1773         margin-right: 30px;
1774         margin-bottom: 20px;
1775         width: 88px;
1776         height: 120px;
1777         position: relative;
1778 }
1779
1780 .contact-entry-direction-wrapper {position: absolute; top: 20px;}
1781 .contact-entry-edit-links { position: absolute; top: 60px; }
1782 #contacts-show-hide-link { margin-bottom: 20px; margin-top: 10px; font-weight: bold;}
1783
1784 .contact-entry-name {
1785         width: 100px;
1786         overflow: hidden;
1787         font: #999;
1788         font-size: 12px;
1789         text-align:center;
1790         font-variant:small-caps;
1791         font-weight: bold;
1792         margin-top:5px;
1793 }
1794
1795 .contact-entry-photo {
1796         position: relative;
1797 }
1798
1799 .contact-entry-edit-links .icon {
1800         border: 1px solid #babdb6;
1801     -webkit-border-radius: 3px;
1802     -moz-border-radius: 3px;
1803     border-radius: 3px;
1804         background-color: #ffffff;
1805 }
1806
1807 #contact-edit-banner-name { font-size: 1.5em; margin-left: 30px; font-variant: small-caps; }
1808 #contact-edit-photo-wrapper {position: relative; float: left; padding: 20px;}
1809 #contact-edit-direction-icon { position: absolute; top: 60px; left:0px;}
1810 #contact-edit-nav-wrapper { margin-left: 210px; }
1811 #contact-edit-links { float: left; margin-top: 23px; }
1812 #contact-edit-nav-wrapper .icon {
1813         border: 1px solid #babdb6;
1814     -webkit-border-radius: 3px;
1815     -moz-border-radius: 3px;
1816     border-radius: 3px;
1817 }
1818
1819 #contact-edit-nettype {
1820         font-size: 1em;
1821         font-variant: small-caps;
1822         margin-left: 30px;
1823         margin-bottom: 0px;
1824         padding-bottom: 0px;
1825 }
1826
1827 #contact-edit-poll-wrapper { margin-left: 50px; width: 300px;}
1828 #contact-edit-last-update-text { margin-bottom: 15px; padding-top: 20px; padding-left: 10px; font-size: 0.9em; max-width: 300px; }
1829 #contact-edit-last-updated { font-weight: bold; }
1830 #contact-edit-poll-text { display: inline; font-size: 0.9em; padding-left: 10px; }
1831 #contact-edit-end { clear: both; margin-bottom: 65px;}
1832
1833 #contact-edit-update-now {
1834         width: 80px;
1835         padding: 5px 10px 5px 10px;
1836         margin-left: 125px;
1837         margin-top: 10px;
1838         font-style: bold;
1839 }
1840
1841 #contact-edit-update-now:hover {
1842         color: #efefef;
1843         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1844         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1845         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1846         background-color:#b20202;
1847 }
1848
1849 #contact-edit-update-now:active {
1850         background-color: #b20202;
1851         position:relative;
1852         top:1px;
1853 }
1854
1855 #contact-edit-update-now a {
1856         color: #efefef;
1857 }
1858
1859
1860 #contact-edit-profile-select-text > p {
1861         font-size: 1em;
1862 }
1863
1864 .contact-photo-menu-button {
1865         position: absolute;
1866     background-image: url("photo-menu.jpg");
1867     background-position: top left;
1868     background-repeat: no-repeat;
1869     margin: 0px; padding: 0px;
1870     width: 16px;
1871     height: 16px;
1872     top: 64px; left:0px;
1873     overflow: hidden;
1874     text-indent: 40px;
1875     display: none;
1876 }
1877
1878 .contact-photo-menu {
1879     width: auto;
1880     border: 1px solid #ddd;
1881     background: #f1f1f1;
1882     position: absolute;
1883     left: 0px; top: 90px;
1884     display: none;
1885     z-index: 10000;
1886         -moz-box-shadow: 3px 3px 5px #888;
1887         -webkit-box-shadow: 3px 3px 5px #888;
1888         box-shadow: 3px 3px 5px #888;
1889 }
1890
1891 .contact-photo-menu ul { margin:0px; padding: 0px; list-style: none }
1892 .contact-photo-menu li a { display: block; padding: 3px; color: #626262; font-size: 1em; }
1893 .contact-photo-menu li a:hover {
1894         color: #FFFFFF;
1895         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1896         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1897         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1898         background-color:#b20202;
1899         text-decoration: none;
1900 }
1901
1902 .view-contact-name {
1903         font-variant: small-caps;
1904 }
1905
1906 #div.side-link {
1907         background-color: #efefef;
1908         padding: 10px;
1909         margin-top:20px;
1910 }
1911
1912 #follow-sidebar {
1913         margin-bottom: 20px;
1914 }
1915
1916 #follow-sidebar h3:before {
1917         content: url("user.png");
1918         padding-right: 10px;
1919         vertical-align: middle;
1920 }
1921
1922 #follow-sidebar input[type="text"] {
1923         margin-left: 10px;
1924         margin-bottom: 10px;
1925 }
1926
1927 #side-follow-submit {
1928         width: 70px;
1929 }
1930
1931 #side-match-link {
1932         width: 180px;
1933         padding: 10px;
1934         margin: auto;
1935         margin-bottom: 20px;
1936         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1937         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1938         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1939         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1940         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1941         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1942         background-color:#bdbdbd;
1943         -moz-border-radius:5px;
1944         -webkit-border-radius:5px;
1945         border-radius:5px;
1946         padding: 5px 10px 5px 10px;
1947         color: #efefef;
1948         font-size: 1.2em;
1949         text-align: center;
1950 }
1951
1952 #side-match-link:hover {
1953         color: #efefef;
1954         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1955         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1956         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1957         background-color:#b20202;
1958 }
1959
1960 #side-match-link:active {
1961         background-color: #b20202;
1962         position:relative;
1963         top:1px;
1964 }
1965
1966 #side-match-link a {
1967         color: #efefef;
1968 }
1969
1970 #side-invite-link {
1971         width: 180px;
1972         padding: 10px;
1973         margin: auto;
1974         margin-bottom: 20px;
1975         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1976         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1977         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
1978         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
1979         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
1980         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
1981         background-color:#bdbdbd;
1982         -moz-border-radius:5px;
1983         -webkit-border-radius:5px;
1984         border-radius:5px;
1985         padding: 5px 10px 5px 10px;
1986         color: #efefef;
1987         font-size: 1.2em;
1988         text-align: center;
1989 }
1990
1991 #side-invite-link:hover {
1992         color: #efefef;
1993         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
1994         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
1995         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
1996         background-color:#b20202;
1997 }
1998
1999 #side-invite-link:active {
2000         background-color: #b20202;
2001         position:relative;
2002         top:1px;
2003 }
2004
2005 #side-invite-link a {
2006         color: #efefef;
2007 }
2008
2009 #invite-message, #invite-recipients, #invite-recipient-text {
2010         padding: 10px;
2011 }
2012
2013 #side-follow-wrapper {
2014         font-size: 1em;
2015         font-weight: bold;
2016         font-stretch:semi-expanded;
2017         background-color: #f3f3f3;
2018         border: 1px solid #cdcdcd;
2019         padding: 10px;
2020         margin-top: 20px;
2021         -webkit-border-radius: 5px 5px 5px 5px;
2022     -moz-border-radius: 5px 5px 5px 5px;
2023     border-radius: 5px 5px 5px 5px;
2024 }
2025
2026 #side-follow-wrapper label{
2027         font-size: 1.1em;
2028         font-variant: normal;
2029 }
2030
2031 #contact-view-recent {
2032         float: left;
2033         width: 150px;
2034         padding: 5px;
2035         margin-bottom: 20px;
2036 }
2037
2038 #contact-suggest {
2039         float: left;
2040         margin-left: 10px;
2041         width: 120px;
2042         padding: 10px;
2043         margin-bottom: 20px;
2044         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2045         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2046         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2047         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2048         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2049         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2050         background-color:#bdbdbd;
2051         -moz-border-radius:5px;
2052         -webkit-border-radius:5px;
2053         border-radius:5px;
2054         padding: 5px 10px 5px 10px;
2055         color: #efefef;
2056         font-size: 1.2em;
2057         text-align: center;
2058 }
2059
2060 #contact-suggest:hover {
2061         color: #efefef;
2062         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2063         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2064         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2065         background-color:#b20202;
2066 }
2067
2068 #contact-suggest:active {
2069         background-color: #b20202;
2070         position:relative;
2071         top:1px;
2072 }
2073
2074 #contact-suggest a {
2075         color: #efefef;
2076 }
2077
2078 #contact-edit-info-wrapper {
2079         clear: both;
2080 }
2081
2082 /* ===================================== */
2083 /* = Register, Settings, Profile Forms = */
2084 /* ===================================== */
2085
2086 #id_openid_url,
2087 .openid {
2088         background: url(login-bg.gif) no-repeat;
2089         background-position: 0 50%;
2090         padding-left: 18px;
2091         width: 385px;
2092 }
2093
2094 #profile-tabs-wrapper {
2095         padding-top: 10px;
2096 }
2097
2098 #profile-tab-status-link {
2099         border: 0px;
2100         padding: 5px 10px 5px 10px;
2101         font-style: bold;
2102 }
2103
2104 #uexport-link a {
2105         color: #efefef;
2106 }
2107
2108 #profile-tab-profile-link {
2109         border: 0px;
2110         padding: 5px 10px 5px 10px;
2111 }
2112
2113 #uexport-link {
2114         width: 140px;
2115         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2116         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2117         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2118         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7c7d7b), color-stop(1, #555753) );
2119         background:-moz-linear-gradient( center top, #7c7d7b 5%, #555753 100% );
2120         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7c7d7b', endColorstr='#555753');
2121         background-color:#7c7d7b;
2122         -moz-border-radius:5px;
2123         -webkit-border-radius:5px;
2124         border-radius:5px;
2125         padding: 5px 10px 5px 10px;
2126         margin-bottom: 10px;
2127 }
2128
2129 #uexport-link:hover {
2130         color: #efefef;
2131         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #555753), color-stop(1, #7c7d7b) );
2132         background:-moz-linear-gradient( center top, #555753 5%, #7c7d7b 100% );
2133         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#555753', endColorstr='#7c7d7b');
2134         background-color:#555753;
2135 }
2136
2137 #uexport-link:active {
2138         color: #efefef;
2139         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2140         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2141         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2142         background-color:#b20202;
2143         position:relative;
2144         top:1px;
2145 }
2146
2147 #settings-default-perms {
2148         width: 160px;
2149         text-align: center;
2150         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2151         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2152         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2153         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7c7d7b), color-stop(1, #555753) );
2154         background:-moz-linear-gradient( center top, #7c7d7b 5%, #555753 100% );
2155         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7c7d7b', endColorstr='#555753');
2156         background-color:#7c7d7b;
2157         -moz-border-radius:5px;
2158         -webkit-border-radius:5px;
2159         border-radius:5px;
2160         padding: 5px 10px 5px 10px;
2161         margin-bottom: 10px;
2162 }
2163
2164 #settings-default-perms .fakelink {
2165         color: #efefef;
2166 }
2167
2168 #settings-default-perms:hover {
2169         color: #efefef;
2170         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #555753), color-stop(1, #7c7d7b) );
2171         background:-moz-linear-gradient( center top, #555753 5%, #7c7d7b 100% );
2172         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#555753', endColorstr='#7c7d7b');
2173         background-color:#555753;
2174 }
2175
2176 #settings-default-perms:active {
2177         color: #efefef;
2178         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2179         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2180         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2181         background-color:#b20202;
2182         position:relative;
2183         top:1px;
2184 }
2185
2186 #settings-nickname-desc {
2187         width: 80%;
2188         background-color: #efefef;
2189         margin-bottom: 10px;
2190         -webkit-border-radius: 5px;
2191         -moz-border-radius: 5px;
2192     border-radius: 5px;
2193     padding: 5px;
2194 }
2195
2196 #register-form div,
2197 #profile-edit-form div {
2198         clear: both;
2199 }
2200
2201 #register-form label,
2202 #profile-edit-form label {
2203         width: 300px; float: left;
2204 }
2205
2206 #register-form span,
2207 #profile-edit-form span  {
2208         color: #555753;
2209         display:block;
2210         margin-bottom: 20px;
2211 }
2212
2213 .settings-submit-wrapper,
2214 .profile-edit-submit-wrapper { margin: 30px 0px;}
2215 .profile-listing { float: left; clear: both; margin: 20px 20px 0px 0px}
2216
2217 #profile-edit-links ul { margin: 20px 0px; padding: 0px; list-style: none; }
2218
2219
2220 #register-sitename { display: inline; font-weight: bold;}
2221
2222 /* ===================== */
2223 /* = Contacts Selector = */
2224 /* ===================== */
2225
2226 #group-edit-wrapper {
2227         margin-bottom: 10px;
2228 }
2229
2230 #group-edit-name-wrapper {
2231         margin-bottom: 0px;
2232         display: inline;
2233 }
2234 #group-edit-submit-wrapper {
2235         margin-bottom: 10px;
2236         margin-right: 400px;
2237         float: right;
2238         display: inline;
2239 }
2240
2241 .group-delete-wrapper {
2242         width: 90px;
2243         display: inline;
2244         padding: 5px;
2245         margin-bottom: 10px;
2246         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2247         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2248         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2249         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2250         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2251         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2252         background-color:#bdbdbd;
2253         -moz-border-radius:5px;
2254         -webkit-border-radius:5px;
2255         border-radius:5px;*/
2256 }
2257
2258 .group-delete-wrapper:hover {
2259         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2260         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2261         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2262         background-color:#b20202;
2263 }
2264
2265 .group-delete-wrapper:active {
2266         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2267         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2268         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2269         background-color:#b20202;
2270 }
2271
2272 .group-delete-wrapper a {
2273         color: #efefef;
2274         font-size: 0.9em;
2275 }
2276
2277 #group-edit-desc { margin: 10px 0xp; }
2278 #group-new-text {font-size: 1.1em;}
2279 #group-members,
2280 #prof-members {
2281         width: 83%;
2282         height: 200px;
2283         overflow: auto;
2284         border: none;
2285         background-color: #f0edf0;
2286         color: #555753;
2287         border: 1px solid #ccc;
2288         margin-bottom: 10px;
2289         padding: 10px;
2290 }
2291
2292 #group-all-contacts,
2293 #prof-all-contacts {
2294         width: 83%;
2295         height: 200px;
2296     overflow: auto;
2297         border: 1px solid #ccc;
2298         background-color: #f0edf0;
2299         padding: 10px;
2300 }
2301
2302 #group-members h3,
2303 #group-all-contacts h3,
2304 #prof-members h3,
2305 #prof-all-contacts h3{
2306         color: #555753;
2307         margin: 0px;
2308         padding: 5px;
2309 }
2310
2311 #group-separator,
2312 #prof-separator { display: none;}
2313
2314 /* ========== */
2315 /* = Events = */
2316 /* ========== */
2317
2318 .clear { clear: both; }
2319 .eventcal {
2320         float: left;
2321         font-size: 20px;
2322         padding: 20px;
2323 }
2324
2325 .vevent {
2326         position: relative;
2327         width: 400px;
2328         padding: 20px;
2329         padding-top: 10px;
2330         margin: 0 0px;
2331         background-color: #fff;
2332         -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2333         -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2334         box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
2335 }
2336
2337 .vevent:before, .vevent:after {
2338         position: absolute;
2339         width: 40%;
2340         height: 10px;
2341         content: ' ';
2342         left: 12px;
2343         bottom: 12px;
2344         background: transparent;
2345         -webkit-transform: skew(-5deg) rotate(-5deg);
2346         -moz-transform: skew(-5deg) rotate(-5deg);
2347         -ms-transform: skew(-5deg) rotate(-5deg);
2348         -o-transform: skew(-5deg) rotate(-5deg);
2349         transform: skew(-5deg) rotate(-5deg);
2350         -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2351         -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2352         box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
2353         z-index: -1;
2354 }
2355
2356 .vevent:after {
2357         left: auto;
2358         right: 12px;
2359         -webkit-transform: skew(5deg) rotate(5deg);
2360         -moz-transform: skew(5deg) rotate(5deg);
2361         -ms-transform: skew(5deg) rotate(5deg);
2362         -o-transform: skew(5deg) rotate(5deg);
2363         transform: skew(5deg) rotate(5deg);
2364 }
2365
2366 .vevent .event-description {
2367         margin-left: 10px;
2368         margin-right: 10px;
2369         text-align:center;
2370         font-size: 1.2em;
2371         font-weight:bolder;
2372 }
2373
2374  .vevent .event-location{
2375         margin-left: 10px;
2376         margin-right: 10px;
2377         font-size: 1em;
2378         font-style: oblique;
2379         text-align: center;
2380
2381 }
2382
2383 .vevent .event-start, .vevent .event-end  {
2384         margin-left: 20px;
2385         margin-right: 20px;
2386         margin-bottom: 2px;
2387         margin-top: 2px;
2388         font-size: 0.9em;
2389         font-variant: small-caps;
2390         text-align: left;
2391 }
2392
2393 #new-event-link{
2394         width: 130px;
2395         padding: 7px;
2396         margin-bottom: 10px;
2397         margin-left: 170px; ;
2398         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2399         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2400         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2401         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2402         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2403         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2404         background-color:#bdbdbd;
2405         -moz-border-radius:5px;
2406         -webkit-border-radius:5px;
2407         border-radius:5px;
2408         color: #efefef;
2409 }
2410
2411 #new-event-link:hover {
2412         color: #efefef;
2413         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2414         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2415         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2416         background-color:#b20202;
2417 }
2418
2419 #new-event-link:active {
2420         background-color: #b20202;
2421         position:relative;
2422         top:1px;
2423 }
2424
2425 #new-event-link a {
2426         color: #efefef;
2427         text-align: center;
2428 }
2429
2430 .edit-event-link, .plink-event-link {
2431         float: left;
2432         margin-top: 4px;
2433         margin-right: 4px;
2434         margin-bottom: 15px;
2435 }
2436
2437 .event-description:before {
2438         content: url('calendar.png');
2439         margin-right: 15px;
2440         vertical-align: middle;
2441 }
2442
2443 .event-start, .event-end {
2444         margin-left: 10px;
2445         width: 330px;
2446 }
2447
2448 .event-start .dtstart, .event-end .dtend {
2449         float: right;
2450 }
2451
2452 .event-list-date {
2453         color: #626262;
2454         margin-bottom: 10px;
2455         font-variant:small-caps;
2456         font-stretch:condensed;
2457 }
2458
2459 .prevcal, .nextcal {
2460         float: left;
2461         margin-left: 32px;
2462         margin-right: 32px;
2463         margin-top: 64px;
2464 }
2465
2466 .event-calendar-end {
2467         clear: both;
2468 }
2469
2470 .calendar {
2471         width: 300px;
2472         font-family: Helvetica, Arial, sans-serif;
2473         background-color: #f1f1f1;
2474         border: 1px solid #dedede;
2475         margin-bottom: 10px;
2476         -moz-box-shadow: 5px 5px 8px #959494;
2477         -webkit-box-shadow: 5px 5px 8px #959494;
2478         box-shadow: 5px 5px 8px #959494;
2479 }
2480
2481 .calendar caption{
2482         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #d60808), color-stop(1, #b20202) );
2483         background:-moz-linear-gradient( center top, #d60808 5%, #b20202 100% );
2484         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d60808', endColorstr='#b20202');
2485         background-color: #b20202;
2486         padding: 10px 0px 10px 0px;
2487         width: 300px;
2488         color: #ffffff;
2489         font-weight: bold;
2490         text-align:center;
2491         font-variant:small-caps;
2492         -moz-box-shadow: 5px 2px 8px #959494;
2493         -webkit-box-shadow: 5px 2px 8px #959494;
2494         box-shadow: 5px 2px 8px #959494;
2495 }
2496
2497 tr {
2498         border: 1px solid #eeeeee;
2499 }
2500
2501 .calendar td {
2502         font-size: 14px;
2503         text-align: center;
2504         padding: 3px 0px;
2505 }
2506
2507 .calendar td > a {
2508         background-color: #cdcdcd;
2509         padding: 2px;
2510         color: #000;
2511 }
2512
2513 .calendar th {
2514         font-size: 16px;
2515 }
2516
2517 .today {
2518         font-weight: bold;
2519         text-align: center;
2520         background-color: #b20202;
2521         color: #fff;
2522 }
2523
2524 #event-start-text,
2525 #event-finish-text {
2526         margin-top: 10px;
2527         margin-bottom: 5px;
2528 }
2529
2530 #event-nofinish-checkbox,
2531 #event-nofinish-text,
2532 #event-adjust-checkbox,
2533 #event-adjust-text,
2534 #event-share-checkbox {
2535         float: left;
2536 }
2537
2538 #event-datetime-break {
2539         margin-bottom: 10px;
2540 }
2541
2542 #event-nofinish-break,
2543 #event-adjust-break,
2544 #event-share-break {
2545         clear: both;
2546 }
2547
2548 #event-desc-text,
2549 #event-location-text {
2550         margin-top: 10px;
2551         margin-bottom: 5px;
2552 }
2553
2554 #event-submit {
2555         margin-top: 10px;
2556 }
2557
2558 /* ============= */
2559 /* = Directory = */
2560 /* ============= */
2561
2562 .directory-item {
2563         float: left;
2564         margin: 50px 50px 0px 0px;
2565 }
2566
2567 .directory-details {
2568         font-size: 0.9em;
2569         font-variant: small-caps;
2570         width: 160px;
2571 }
2572
2573 .directory-name {
2574         font-size: 1em;
2575         font-variant: small-caps;
2576         width: 150px;
2577 }
2578
2579 /* ========= */
2580 /* = Admin = */
2581 /* ========= */
2582
2583 #adminpage {
2584         width: 80%;
2585 }
2586
2587 #pending-update {
2588         float:right;
2589         color: #ffffff;
2590         font-weight: bold;
2591         background-color: #FF0000;
2592         padding: 0em 0.3em;
2593 }
2594
2595 .admin.linklist {
2596         border: 0px; padding: 0px;
2597 }
2598
2599 .admin.link {
2600         list-style-position: inside;
2601         font-size: 1em;
2602         padding: 5px;
2603         width: 100px;
2604         margin: 5px;
2605 }
2606
2607 #adminpage dl {
2608         clear: left;
2609         margin-bottom: 2px;
2610         padding-bottom: 2px;
2611         border-bottom: 1px solid black;
2612 }
2613
2614 #adminpage dt {
2615         width: 200px;
2616         float: left;
2617         font-weight: bold;
2618 }
2619
2620 #adminpage dd {
2621         margin-left: 200px;
2622 }
2623 #adminpage h3 {
2624         border-bottom: 1px solid #898989;
2625         margin-bottom: 5px;
2626         margin-top: 10px;
2627 }
2628
2629 #adminpage .submit {
2630         clear:left;
2631 }
2632
2633 #adminpage #pluginslist {
2634         margin: 0px; padding: 0px;
2635 }
2636
2637 #adminpage .plugin {
2638         list-style: none;
2639         display: block;
2640         border: 1px solid #888888;
2641         padding: 1em;
2642         margin-bottom: 5px;
2643         clear: left;
2644 }
2645
2646 #adminpage .toggleplugin {
2647         float:left;
2648         margin-right: 1em;
2649 }
2650
2651 #adminpage table {width:100%; border-bottom: 1p solid #000000; margin: 5px 0px;}
2652 #adminpage table th { text-align: left;}
2653 #adminpage td .icon { float: left;}
2654 #adminpage table#users img { width: 16px; height: 16px; }
2655 #adminpage table tr:hover { background-color: #eeeeee; }
2656 #adminpage .selectall { text-align: right; }
2657
2658 /* =============== */
2659 /* = Form Fields = */
2660 /* =============== */
2661
2662 .field {
2663         margin-bottom: 5px;
2664         padding-bottom: 10px;
2665         overflow: auto;
2666         width: 90%;
2667 }
2668
2669 .field label {
2670         float: left;
2671         width: 200px;
2672 }
2673
2674 .field input,
2675 .field textarea {
2676         width: 400px;
2677 }
2678 .field textarea { height: 100px; }
2679 .field_help {
2680         display: block;
2681         margin-left: 100px;
2682         color: #666666;
2683 }
2684
2685 .field .onoff {
2686         float: left;
2687         width: 80px;
2688 }
2689 .field .onoff a {
2690         display: block;
2691         border:1px solid #c1c1c1;
2692         background-image:url("../../../images/onoff.jpg");
2693         background-repeat: no-repeat;
2694         padding: 4px 2px 2px 2px;
2695         height: 16px;
2696         text-decoration: none;
2697 }
2698 .field .onoff .off {
2699         border-color:#c1c1c1;
2700         padding-left: 40px;
2701         background-position: left center;
2702         background-color: #cccccc;
2703         color: #666666;
2704         text-align: right;
2705 }
2706
2707 .field .onoff .on {
2708         border-color:#c1c1c1;
2709         padding-right: 40px;
2710         background-position: right center;
2711         background-color: #b20202;
2712         color: #FFFFFF;
2713         text-align: left;
2714 }
2715
2716 .hidden { display: none!important; }
2717
2718 .field.radio .field_help { margin-left: 0px; }
2719
2720 /* ========= */
2721 /* = Icons = */
2722 /* ========= */
2723
2724 .icon {
2725         display: block; width: 20px; height: 20px;
2726         background-image: url('icons.png');
2727 }
2728 .starred {
2729         background-image: url("star.png");
2730         repeat: no-repeat;
2731 }
2732 .unstarred {
2733         background-image: url("premium.png");
2734         repeat: no-repeat;
2735 }
2736
2737
2738 .border {
2739         border: 1px solid #c1c1c1;
2740     -webkit-border-radius: 3px;
2741     -moz-border-radius: 3px;
2742     border-radius: 3px;
2743 }
2744
2745 .article        { background-position: -50px  0px;}
2746 .audio          { background-position: -70px  0px;}
2747 .block          { background-position: -90px  0px;}
2748 .drop           { background-position: -110px 0px;}
2749 .drophide       { background-position: -130px 0px;}
2750 .edit           { background-position: -150px 0px;}
2751 .camera         { background-position: -170px 0px;}
2752 .dislike        { background-position: -190px 0px;}
2753 .like           { background-position: -210px 0px;}
2754 .link           { background-position: -230px 0px;}
2755
2756 .globe          { background-position: -50px  -20px;}
2757 .noglobe        { background-position: -70px  -20px;}
2758 .no             { background-position: -90px  -20px;}
2759 .pause          { background-position: -110px -20px;}
2760 .play           { background-position: -130px -20px;}
2761 .pencil         { background-position: -150px -20px;}
2762 .small-pencil   { background-position: -170px -20px;}
2763 .recycle        { background-position: -190px -20px;}
2764 .remote-link    { background-position: -210px -20px;}
2765 .share          { background-position: -230px -20px;}
2766
2767 .tools          { background-position: -50px  -40px;}
2768 .lock           { background-position: -70px  -40px;}
2769
2770 .unlock         {
2771         background-position: -90px  -40px;
2772         background-image: none;
2773         width: 70px;
2774         height: 20px;
2775 }
2776
2777 .sharePerms {
2778         background-image: url(icons.png);
2779         width: 20px;
2780         height: 20px;
2781         margin: 2px 0px 2px 3px;
2782         display: block;
2783 }
2784
2785 .video          { background-position: -110px -40px;}
2786 .youtube        { background-position: -130px -40px;}
2787
2788 .attach         { background-position: -190px -40px;}
2789 .language       { background-position: -210px -40px;}
2790
2791
2792 .on             { background-position: -50px  -60px;}
2793 .off            { background-position: -70px  -60px;}
2794 .prev           { background-position: -90px  -60px;}
2795 .next           { background-position: -110px  -60px;}
2796
2797 .icon.dim { opacity: 0.3;filter:alpha(opacity=30); }
2798
2799 .attachtype {
2800         display: block; width: 20px; height: 23px;
2801         background-image: url('../../../images/content-types.png');
2802 }
2803
2804 .type-video { background-position: 0px 0px; }
2805 .type-image { background-position: -20px 0px; }
2806 .type-audio { background-position: -40px 0px; }
2807 .type-text  { background-position: -60px 0px; }
2808 .type-unkn  { background-position: -80px 0px; }
2809
2810 /* ========== */
2811 /* = Footer = */
2812 /* ========== */
2813
2814 .cc-license { margin-top: 100px; font-size: 0.7em; }
2815 footer { display: block; margin: 50px 20%; clear: both; }
2816
2817 #profile-jot-text {
2818     height: 20px;
2819     color:#cccccc;
2820     border: 1px solid #cccccc;
2821 }
2822
2823 /* ======= */
2824 /* = ACL = */
2825 /* ======= */
2826
2827 #photo-edit-perms-select,
2828 #photos-upload-permissions-wrapper,
2829 #profile-jot-acl-wrapper{
2830         display:block!important;
2831 }
2832
2833 #acl-wrapper {
2834         width: 690px;
2835         float:left;
2836 }
2837 #acl-search {
2838         float:right;
2839         background: #ffffff url("../../../images/search_18.png") no-repeat right center;
2840         padding-right:20px;
2841 }
2842 #acl-showall {
2843         float: left;
2844         display: block;
2845         font-size: 1em;
2846         font-style: bold;
2847         text-align: center;
2848         padding: 3px;
2849         margin-bottom: 5px;
2850         background-color: #cccccc;
2851         background-position: 7px 7px;
2852         background-repeat: no-repeat;
2853         padding: 5px;
2854         -webkit-border-radius: 5px ;
2855         -moz-border-radius: 5px;
2856         border-radius: 5px;
2857         color: #999999;
2858 }
2859 #acl-showall.selected {
2860         color: #fff;
2861         background-color: #b20202;
2862 }
2863
2864 #acl-list {
2865         height: 210px;
2866         border: 1px solid #cccccc;
2867          background-color: #efefef;
2868         clear: both;
2869         margin-top: 30px;
2870         overflow: auto;
2871 }
2872
2873 #acl-list-content {
2874         margin-left: 20px;
2875 }
2876
2877 .acl-list-item {
2878         display: block;
2879         width: 150px;
2880         height: 40px;
2881         border: 1px solid #cccccc;
2882         background-color: #fff;
2883         margin: 5px;
2884         float: left;
2885         -moz-box-shadow: 2px 2px 3px #c1c1c1;
2886         -webkit-box-shadow: 2px 2px 3px #c1c1c1;
2887         box-shadow: 2px 2px 3px #c1c1c1;
2888 }
2889 .acl-list-item img{
2890         width:30px;
2891         height: 30px;
2892         float: left;
2893         margin: 5px;
2894 }
2895
2896 .acl-list-item p {
2897         color: #999;
2898         height: 12px;
2899         font-size: 0.7em;
2900         margin: 0px;
2901         padding: 2px 0px 1px;
2902         overflow: hidden;
2903 }
2904
2905 .acl-list-item a {
2906         font-size: 10px;
2907         display: block;
2908         float: left;
2909         color: #efefef;
2910         background-color: #898989;
2911         background-position: 3px 3px;
2912         background-repeat: no-repeat;
2913         margin-right: 5px;
2914         -webkit-border-radius: 2px ;
2915         -moz-border-radius: 2px;
2916         border-radius: 2px;
2917         padding: 3px;
2918 }
2919
2920 #acl-wrapper a:hover {
2921         text-decoration: none;
2922         background-color:#b20202;
2923 }
2924
2925 .acl-button-show.selected {
2926         color: #efefef;
2927         background-color: #b20202;
2928 }
2929
2930 .acl-button-hide.selected {
2931         color: #efefef;
2932         background-color: #a2a2a2;
2933 }
2934
2935 .acl-list-item.groupshow { border-color: #b20202; }
2936 .acl-list-item.grouphide { border-color: #a2a2a2; }
2937
2938 /* ========================= */
2939 /* = Global Directory Link = */
2940 /* ========================= */
2941
2942 #global-directory-link {
2943         width: 130px;
2944         padding: 7px;
2945         margin-bottom: 10px;
2946         margin-left: 0px;
2947         -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2948         -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2949         box-shadow:inset 0px 1px 0px 0px #cfcfcf;
2950         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
2951         background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
2952         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
2953         background-color:#bdbdbd;
2954         -moz-border-radius:5px;
2955         -webkit-border-radius:5px;
2956         border-radius:5px;
2957         color: #efefef;
2958         text-align: center;
2959 }
2960
2961 #global-directory-link:hover {
2962         color: #efefef;
2963         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2964         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2965         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2966         background-color:#b20202;
2967 }
2968
2969 #global-directory-link:active {
2970         background-color: #b20202;
2971         position:relative;
2972         top:1px;
2973 }
2974
2975 #global-directory-link a {
2976         color: #efefef;
2977 }
2978
2979 #global-directory-link {
2980         -webkit-padding-start: 0px;
2981 }
2982
2983 a.active {
2984         background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) );
2985         background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% );
2986         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808');
2987         background-color:#b20202;
2988         color:#efefef;
2989         padding: 5px 10px 5px 10px;
2990         margin-right: 5px;
2991 }