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