theme/neo/css/display.css

   1 /** theme: neo
   2  *
   3  * @package   StatusNet
   4  * @author    Samantha Doherty <sammy@status.net>
   5  * @copyright 2011 StatusNet, Inc.
   6  * @license   http://creativecommons.org/licenses/by/3.0/ Creative Commons Attribution 3.0 Unported
   7  * @link      http://status.net/
   8  */
   9
  10
  11 @media screen, projection, tv {
  12
  13 body {
  14     background-color: #C6C8CC;
  15     background-image: url(../images/bg.png);
  16     font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
  17     font-size: 14px;
  18     line-height: 1.6;
  19     color: #222;
  20 }
  21
  22 input, textarea, select, option {
  23     font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
  24     font-size: 1em;
  25 }
  26
  27 a {color: #3e3e8c;}
  28 a:hover {color: blue;}
  29
  30 abbr {border-bottom: none;}
  31
  32 h1 {font-size: 1.6em;}
  33 h2 {font-size: 1.6em;}
  34 h3 {font-size: 1.4em;}
  35 h4 {font-size: 1.4em;}
  36 h5 {font-size: 1.2em;}
  37 h6 {font-size: 1em;}
  38
  39 #wrap {
  40     width: 960px;
  41     margin: 0px auto;
  42     background: #fff url('../images/brdr_black_dot.png') repeat-x 0px 10px;
  43     border-left: 10px solid #fff;
  44     border-right: 10px solid #fff;
  45     padding-top: 10px;
  46 }
  47
  48 #header {
  49     width: 960px;
  50     padding: 0px;
  51     padding-top: 12px;
  52 }
  53
  54 address {
  55     float: left;
  56     position: relative;
  57     top: 1px;
  58     left: 2px;
  59     margin: 0px;
  60     padding: 0px;
  61     height: 24px;
  62     width: 148px;
  63     z-index: 99;
  64 }
  65
  66 #site_nav_global_primary {
  67     display: block;
  68     position: absolute;
  69     top: 10px;
  70     right: 0;
  71     width: 800px;
  72     margin: 0px;
  73     height: 24px;
  74     line-height: 20px;
  75     -webkit-border-top-right-radius: 6px;
  76     -moz-border-radius-topright: 6px;
  77     border-top-right-radius: 6px;
  78     background: #364A84;
  79     background: -moz-linear-gradient(top, #516499 , #364a84);
  80     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#516499), color-stop(100%,#364a84));
  81     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#516499', endColorstr='#364a84',GradientType=0 ); /* XXX move all to ie.css */
  82 }
  83
  84 #site_nav_global_primary ul {
  85     float: right;
  86 }
  87
  88 #site_nav_global_primary li {
  89     margin-right: 0px;
  90 }
  91
  92 #site_nav_global_primary li:last-child {
  93     margin-right: 10px;
  94 }
  95
  96 #site_nav_global_primary a {
  97     color: #fff !important;
  98     text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
  99     padding: 2px 10px 2px 10px;
 100     height: 20px;
 101     display: block;
 102     float: left;
 103 }
 104
 105 #site_nav_global_primary a:hover {
 106     color: #fff !important;
 107     text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
 108     background: #4c619c;
 109     text-decoration: none;
 110 }
 111
 112 #site_notice {
 113     color: #000;
 114     float: right;
 115     width: 280px;
 116     padding: 10px;
 117     margin-left: 40px;
 118     -webkit-border-radius: 6px;
 119     -moz-border-radius: 6px;
 120     border-radius: 6px;
 121 }
 122
 123 #site_notice a {
 124     color: #3e3e8c;
 125 }
 126
 127 #anon_notice {
 128     color: #000;
 129     clear: both;
 130     background: none;
 131     padding: 0px;
 132     margin-bottom: 10px;
 133 }
 134
 135 #anon_notice a {
 136     color: #3e3e8c;
 137 }
 138
 139 #core {
 140     clear: both;
 141     margin: 0px;
 142     width: 958px;
 143     border-top: 5px solid #FB6104;
 144     border-left: 1px solid #d8dae6;
 145     border-right: 1px solid #d8dae6;
 146 }
 147
 148 #aside_primary_wrapper {
 149     width: 100%;
 150     float: left;
 151     overflow: hidden;
 152     position: relative;
 153     background-color: #ececf2;
 154 }
 155
 156 #content_wrapper  {
 157     width: 100%;
 158     float: left;
 159     position: relative;
 160     right: 239px;
 161     background-color: #fff;
 162     border-right: 1px solid #d8dae6;
 163 }
 164
 165 #site_nav_local_views_wrapper  {
 166     width: 100%;
 167     float: left;
 168     position: relative;
 169     right: 561px;
 170     background-color: #ececf2;
 171     border-right: 1px solid #d8dae6;
 172 }
 173
 174 #site_nav_local_views {
 175     width: 138px;
 176     float: left;
 177     overflow: hidden;
 178     position: relative;
 179     left: 800px;
 180     margin-top: 0px;
 181     padding: 22px 10px 40px 10px;
 182 }
 183
 184 #site_nav_local_views H3 {
 185     margin-bottom: 10px;
 186     padding-bottom: 6px;
 187     background: url('../images/brdr_black_dot.png') repeat-x bottom left;
 188     color: #7a7c87;
 189     font-size: 1.1em;
 190     letter-spacing: 2px;
 191     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 192     text-transform: uppercase;
 193 }
 194
 195 #site_nav_local_views li {
 196     display: block;
 197     margin: 0px 0px 8px 0px;
 198 }
 199
 200 #site_nav_local_views li ul {
 201     margin-bottom: 20px;
 202 }
 203
 204 #site_nav_local_views a {
 205     display: block;
 206     padding: 0px 0px 1px 10px;
 207     -webkit-border-radius: 4px;
 208     -moz-border-radius: 4px;
 209     border-radius: 4px;
 210     text-transform: uppercase;
 211     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 212 }
 213
 214 #site_nav_local_views a:hover, #site_nav_local_views .current a {
 215     color: #fff;
 216     text-decoration: none;
 217     text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
 218     background: #364a84;
 219     background: -moz-linear-gradient(top, #7b8dbb , #364a84);
 220     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7b8dbb), color-stop(100%,#364a84));
 221     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7b8dbb', endColorstr='#364a84',GradientType=0 );
 222 }
 223
 224 #content {
 225     width: 520px;
 226     float: left;
 227     overflow: hidden;
 228     position: relative;
 229     left: 801px;
 230     margin: 0px;
 231     padding: 20px 20px 40px 20px;
 232 }
 233
 234 /* Input forms */
 235
 236 .input_forms {
 237     float: left;
 238     position: relative;
 239     top: -20px;
 240     left: -20px;
 241     padding: 18px 20px 0px 20px;
 242     background: #fafafa url('../images/brdr_black_dot.png') repeat-x bottom left;
 243 }
 244
 245 #input_form_nav {
 246     float: left;
 247     margin-bottom: 10px;
 248 }
 249
 250 #input_form_nav li a {
 251     display: block;
 252     float: left;
 253     padding: 0px 10px 1px 10px;
 254     margin-right: 10px;
 255     -webkit-border-radius: 4px;
 256     -moz-border-radius: 4px;
 257     border-radius: 4px;
 258     border: 1px solid #ECECF2;
 259     font-weight: bold;
 260     line-height: 1.4em;
 261     text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.9);
 262     background: #ececf2;
 263     background: -moz-linear-gradient(top, #fff , #ececf2);
 264     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#ececf2));
 265     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#ececf2',GradientType=0 );
 266 }
 267
 268 #input_form_nav li:hover a, #input_form_nav li.current a {
 269     color: #fff;
 270     text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
 271     border: 1px solid #ececf2;
 272     background: #364a84;
 273     background: -moz-linear-gradient(top, #7b8dbb , #364a84);
 274     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7b8dbb), color-stop(100%,#364a84));
 275     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7b8dbb', endColorstr='#364a84',GradientType=0 );
 276 }
 277
 278 .input_form_nav_tab a, .input_form_nav_tab.current {
 279     text-decoration: none !important; /* XXX cf rebase */
 280 }
 281
 282 .input_form {
 283     position: relative;
 284     float: left;
 285     width: 520px;
 286     padding-bottom: 15px;
 287 }
 288
 289 #input_form_status {
 290     padding-bottom: 45px;
 291 }
 292
 293 .form_notice {
 294     padding: 0px;
 295     background: none;
 296 }
 297
 298 .form_notice fieldset {
 299     width: auto;
 300     position: static;
 301 }
 302
 303 .form_notice #notice_data-text-label {
 304     display: none; /* XXX move into input with js */
 305 }
 306
 307 .form_notice textarea,
 308 .form_notice_placeholder .placeholder {
 309     width: 473px;
 310 }
 311 .form_notice textarea {
 312     height: 42px;
 313     padding: 6px 10px 18px 10px;
 314     border: 1px solid #a6a6a6;
 315     -webkit-border-radius: 4px;
 316     -moz-border-radius: 4px;
 317     border-radius: 4px;
 318     box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 319     -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 320     -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 321     z-index: 97;
 322     font-size: 1.2em;
 323 }
 324
 325 .form_notice label.notice_data-attach {
 326     top: 0px;
 327     right: 0px;
 328     z-index: 96;
 329 }
 330
 331 .form_notice .notice_data-geo_wrap label,
 332 .form_notice .notice_data-geo_wrap input {
 333     top: 26px;
 334     right: 0px;
 335     z-index: 99;
 336 }
 337
 338 .form_notice .count {
 339     position: absolute;
 340     top: 50px;
 341     right: 35px;
 342     font-size: 0.8em;
 343     height: 1em;
 344     z-index: 99;
 345 }
 346
 347 .form_notice #notice_action-submit {
 348     position: absolute;
 349     top: 100%;
 350     left: 0px;
 351     margin-top: -44px;
 352     float: left;
 353     width: 90px;
 354     padding: 0px;
 355     z-index: 99;
 356 }
 357
 358 .form_notice .error,
 359 .form_notice .success,
 360 .form_notice .notice-status {
 361     width: 478px;
 362     position: relative;
 363     top: 0px;
 364     float: none;
 365     clear: none;
 366     margin-left: 0px;
 367     margin-top: 5px;
 368     padding: 5px 5px 5px 10px;
 369     border: 1px solid #ccc;
 370 }
 371
 372 .form_notice .error {
 373     border: 1px solid #d05858;
 374 }
 375
 376 .form_notice .attach-status code {
 377     font-size: 1em;
 378 }
 379
 380 .input_form fieldset {
 381     margin: 0px;
 382     padding: 0px;
 383 }
 384
 385 .input_form fieldset fieldset {
 386     margin-bottom: 10px !important;
 387 }
 388
 389 #aside_primary {
 390     width: 218px;
 391     float: left;
 392     overflow: hidden;
 393     position: relative;
 394     left: 802px;
 395     padding: 22px 10px 40px 10px;
 396     margin-top: 0px;
 397     background: none;
 398 }
 399
 400 #aside_primary .section {
 401     width: 100%;
 402     margin-left: 0px;
 403     margin-right: 0px;
 404     font-size: 0.88em;
 405 }
 406
 407 #aside_primary h2 {
 408     margin-bottom: 10px;
 409     padding-bottom: 6px;
 410     background: url('../images/brdr_black_dot.png') repeat-x bottom left;
 411     color: #7a7c87;
 412     font-size: 1.25em;
 413     letter-spacing: 2px;
 414     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 415     text-transform: uppercase;
 416 }
 417
 418 .profile_block_name {
 419     font-size: 14px;
 420     font-weight: bold;
 421 }
 422
 423 .profile_block_location {
 424     font-weight: bold;
 425 }
 426
 427 .profile_block_description {
 428     line-height: 1.2em;
 429 }
 430
 431 .profile_block .entity_actions {
 432     float: left;
 433     margin-left: 0px;
 434 }
 435
 436 .profile_block .entity_moderation:hover ul,
 437 .profile_block .entity_role:hover ul {
 438     left: 20px;
 439 }
 440
 441 .profile_block a.profiledetail {
 442     display: block;
 443 }
 444
 445 .section ul.entities {
 446     width: 220px;
 447 }
 448
 449 .section .entities li {
 450     margin-right: 17px;
 451     margin-bottom: 10px;
 452     width: 24px;
 453 }
 454
 455 #popular_notices .avatar {
 456     position: relative;
 457     top: 4px;
 458     margin-bottom: 6px;
 459 }
 460
 461 #aside_primary td {
 462     padding-right: 20px;
 463     padding-bottom: 14px;
 464 }
 465
 466 #aside_primary td .nickname {
 467     line-height: 1.6em;
 468 }
 469
 470 .section .avatar {
 471     box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 472     -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 473     -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 474 }
 475
 476 #content h1 {
 477     border-bottom: 3px solid #A6ADBF;
 478     color: #A6ADBF;
 479     font-size: 1.4em;
 480     letter-spacing: 4px;
 481     text-transform: none;
 482 }
 483
 484 #notices_primary {
 485     margin-top: -5px;
 486 }
 487
 488 #content .notice {
 489     padding-bottom: 14px;
 490     border-bottom: 2px dotted #eee;
 491 }
 492
 493 .notice {
 494     line-height: 1.36em;
 495     margin-bottom: 10px;
 496 }
 497
 498 #content .notice .author .photo {
 499     left: 0px;
 500     top: 9px;
 501 }
 502
 503 #content .notice .entry-title {
 504     min-height: 35px;
 505 }
 506
 507 #showstream .notice .entry-title {
 508     min-height: 1px;
 509 }
 510
 511 #shownotice .notice .entry-title {
 512     min-height:123px;
 513 }
 514
 515 .notice div.entry-content {
 516     font-size: 0.88em;
 517     line-height: 1.2em;
 518     margin-top: 6px;
 519     opacity: 0.6;
 520 }
 521
 522 .notice:hover div.entry-content {
 523     opacity: 1;
 524 }
 525
 526 .user_in .notice div.entry-content {
 527     max-width: 440px;
 528 }
 529
 530 div.entry-content a.response:before {
 531         content: "(";
 532 }
 533
 534 div.entry-content a.response:after {
 535         content: ")";
 536 }
 537
 538 .notice-options {
 539     margin-top: 4px;
 540 }
 541
 542 .threaded-replies {
 543     clear: both;
 544     float: left;
 545     width: 458px;
 546     margin-left: 59px;
 547     margin-top: 10px;
 548     padding-right: 2px;
 549     border-left: 3px solid #ECECF2;
 550     background: #fafafa;
 551     font-size: 1em;
 552 }
 553
 554 #content .notice .threaded-replies .notice {
 555     padding-bottom: 14px;
 556     padding-top: 5px;
 557     border-bottom: 2px dotted #eee;
 558     line-height: 1.36em;
 559     margin-top: 0px;
 560     margin-bottom: 0px;
 561     margin-left: 10px;
 562     background: none;
 563 }
 564
 565 #content .notice .threaded-replies .entry-title {
 566     min-height: 1px;
 567 }
 568
 569 #content .threaded-replies .notice .author .photo {
 570     height: 24px;
 571     width: 24px;
 572     top: 14px;
 573     box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 574     -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 575     -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 576 }
 577
 578 #content .notice .threaded-replies .notice .entry-title {
 579     margin: 2px 7px 0px 35px;
 580 }
 581
 582 #content .notice .threaded-replies .notice div.entry-content {
 583     clear:left;
 584     float:left;
 585     margin-left: 35px;
 586     margin-top: 10px;
 587 }
 588
 589 .threaded-replies li {
 590     list-style-type: none;
 591 }
 592
 593 .threaded-replies .notice-reply-comments {
 594     margin: 2px 0px 4px 10px;
 595 }
 596
 597 .threaded-replies .placeholder {
 598     margin: 10px;
 599     width: 426px;
 600 }
 601
 602 .threaded-replies .notice-reply {
 603     clear: left;
 604     position: relative;
 605     padding: 10px;
 606     padding-bottom: 44px;
 607 }
 608
 609 .threaded-replies .form_notice textarea {
 610     width: 385px;
 611 }
 612
 613 .threaded-replies .form_notice label.notice_data-attach {
 614     top: 10px;
 615     right: 10px;
 616 }
 617
 618 .threaded-replies .form_notice .notice_data-geo_wrap label,
 619 .threaded-replies .form_notice .notice_data-geo_wrap input {
 620     top: 36px;
 621     right: 10px;
 622 }
 623
 624 .threaded-replies .form_notice .count {
 625     top: 60px;
 626     right: 50px;
 627 }
 628
 629 .threaded-replies .form_notice #notice_action-submit {
 630     left: 10px;
 631 }
 632
 633 .threaded-replies .form_notice .error,
 634 .threaded-replies .form_notice .success,
 635 .threaded-replies .form_notice .notice-status {
 636     width: 390px;
 637 }
 638
 639 .pagination {
 640     height: 1.2em;
 641 }
 642
 643 #jOverlayContent button {
 644     top: 20px;
 645     right: 36px;
 646 }
 647
 648 .entity_profile {
 649     float: left;
 650     width: 360px;
 651     margin-top: 4px;
 652 }
 653
 654 .entity_profile .entity_depiction {
 655     margin-top: 4px;
 656 }
 657
 658 .entity_actions {
 659     width: 140px;
 660     margin-top: 8px;
 661     margin-bottom: 10px;
 662 }
 663
 664 .entity_actions a, .entity_actions p, .entity_actions .entity_subscribe input, .entity_actions .entity_block input, .entity_actions .entity_moderation input, .entity_actions .entity_role input, .entity_actions .entity_nudge input, .entity_actions .entity_delete input {
 665         text-shadow:0 1px 0 rgba(255,255,255,0.4);
 666     border-radius: 4px;
 667     -moz-border-radius: 4px;
 668     -webkit-border-radius: 4px;
 669     background-color: #CDD1DD !important;
 670 }
 671
 672 .entity_moderation:hover ul,
 673 .entity_role:hover ul {
 674     border-radius: 4px;
 675     -moz-border-radius: 4px;
 676     -webkit-border-radius: 4px;
 677 }
 678
 679 .entity_send-a-message .form_notice legend {
 680         text-shadow:0 1px 0 rgba(255,255,255,0.4);
 681 }
 682
 683 .entity_send-a-message .form_notice {
 684     border: 1px solid #7B4E82;
 685 }
 686
 687 .entity_send-a-message .form_notice #notice_action-submit {
 688     color: #fff !important;
 689     top: 46px;
 690 }
 691
 692 #aside_primary #entity_remote_subscribe a:hover {
 693     background-color: #fff !important;
 694 }
 695
 696 #entity_remote_subscribe .dialogbox {
 697     border: 1px solid #7B4E82;
 698     border-radius: 8px;
 699         -moz-border-radius: 8px;
 700         -webkit-border-radius: 8px;
 701 }
 702
 703 #entity_remote_subscribe input {
 704     padding-left: 4px;
 705 }
 706
 707 #entity_remote_subscribe .submit_dialogbox {
 708     margin-top: 10px;
 709     float: right;
 710 }
 711
 712 #filter_tags_item .submit {
 713   left: 6px;
 714   top: -3px;
 715 }
 716
 717 #pagination {
 718     height: 1.2em;
 719     padding-bottom: 12px;
 720     -webkit-border-radius: 6px;
 721     -moz-border-radius: 6px;
 722     border-radius: 6px;
 723 }
 724
 725 #footer {
 726     position: relative;
 727     top: -6px;
 728     color: #000;
 729     margin-left: 0px;
 730     margin-right: 0px;
 731     -webkit-border-top-left-radius: 6px;
 732     -webkit-border-top-right-radius: 6px;
 733     -moz-border-radius-topleft: 6px;
 734     -moz-border-radius-topright: 6px;
 735     border-top-left-radius: 6px;
 736     border-top-right-radius: 6px;
 737 }
 738
 739 #footer a {
 740     color: #3e3e8c;
 741 }
 742
 743 #site_nav_global_secondary {
 744     margin-bottom: 10px;
 745 }
 746
 747 .error, .success, .notice-status {
 748     background-color: #F7E8E8;
 749     padding: 4px;
 750     -webkit-border-radius: 6px;
 751     -moz-border-radius: 6px;
 752     border-radius: 6px;
 753 }
 754 .success, .notice-status {
 755     background-color: #f2f2f2;
 756 }
 757
 758 .form_notice input.submit, .form_settings input.submit, .form_settings input.cancel {
 759     height: 1.9em;
 760     padding: 0px 10px;
 761     color:#fff;
 762     font-weight: bold;
 763     text-transform: uppercase;
 764     font-size: 1.2em;
 765     text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.2);
 766     border: 1px solid #d7621c;
 767     border-radius: 4px;
 768     -moz-border-radius: 4px;
 769     -webkit-border-radius: 4px;
 770     background: #FB6104;
 771     background: -moz-linear-gradient(top, #ff9d63 , #FB6104);
 772     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9d63), color-stop(100%,#FB6104));
 773     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9d63', endColorstr='#FB6104',GradientType=0 );
 774 }
 775
 776 .form_notice input.submit:hover, .form_settings input.submit:hover, .form_settings input.cancel:hover {
 777     text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.6);
 778     background: #ff9d63;
 779     background: -moz-linear-gradient(top, #FB6104 , #fc8035);
 780     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FB6104), color-stop(100%,#fc8035));
 781     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FB6104', endColorstr='#fc8035',GradientType=0 );
 782 }
 783
 784 .form_settings input#settings_design_reset, .form_settings input.cancel {
 785     background: #e2e2e2;
 786     color: #8e181b;
 787     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 788 }
 789
 790 .form_settings input#settings_design_reset:hover, .form_settings input.cancel:hover {
 791     background: #f2f2f2;
 792     color: #8e181b;
 793     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 794 }
 795
 796 .form_settings input.checkbox, .form_settings input.radio {
 797     margin-left: 24%;
 798     margin-top: 2px;
 799     position: relative;
 800     left: -14px;
 801 }
 802
 803 .form_settings label.checkbox, .form_settings label.radio {
 804     width: auto;
 805     max-width: 60%;
 806     position: relative;
 807     left: -30px;
 808 }
 809
 810 .form_settings li input.radio {
 811     clear: left;
 812 }
 813
 814 .form_settings label.radio {
 815     margin-left: 10px;
 816     margin-right: 10px;
 817     text-align: left;
 818 }
 819
 820 #form_login p.form_guide, #form_register #settings_rememberme p.form_guide, #form_openid_login #settings_rememberme p.form_guide, #settings_twitter_remove p.form_guide, #design_background-image_onoff p.form_guide {
 821     margin-left: 26%;
 822 }
 823
 824 #form_search ul.form_data #q {
 825     margin-left: 10px;
 826 }
 827
 828 .form_settings fieldset fieldset {
 829     margin-bottom: 30px;
 830     padding-top: 25px;
 831 }
 832
 833
 834 #content thead th {
 835 text-align:left;
 836 }
 837 #content tbody th {
 838 vertical-align:top;
 839 text-align:left;
 840 font-weight:normal;
 841 padding-top:11px;
 842 padding-right:18px;
 843 }
 844 #content tbody tr {
 845     border-top: 1px dotted #bbb;
 846 }
 847 #content td {
 848 padding:11px 18px 11px 0;
 849 vertical-align:top;
 850 }
 851 #content td:last-child {
 852 padding-right:0;
 853 }
 854
 855
 856 #realtime_actions {
 857     position: relative !important;
 858     float: right;
 859     padding-top: 15px;
 860     margin-bottom: -8px !important;
 861 }
 862
 863 .realtime-popup #content {
 864     padding-left: 4px !important;
 865     padding-right: 4px !important;
 866     margin-right: 0px;
 867 }
 868
 869 .realtime-popup .form_notice textarea {
 870     width: 325px !important;
 871 }
 872
 873 .realtime-popup .form_notice #notice_action-submit {
 874     top: 59px !important;
 875     right: 6px !important;
 876 }
 877
 878 .realtime-popup .form_notice label.notice_data-attach, .realtime-popup .form_notice input.notice_data-attach {
 879     right: 74px;
 880     top: 3px !important;
 881 }
 882
 883 .realtime-popup .form_notice #notice_data-geo_wrap label, .realtime-popup .form_notice #notice_data-geo_wrap input {
 884     right: 8px;
 885     top: 3px !important;
 886 }
 887
 888
 889 /* Bookmark specific styles */
 890
 891 #content .bookmark .entry-title {
 892     margin-left: 0px;
 893 }
 894
 895 .bookmark h3 {
 896     margin: 0px 0px 8px 0px;
 897     float: left;
 898     line-height: 1.2em;
 899     max-width: 92%;
 900 }
 901
 902 .bookmark-notice-count {
 903     border-radius: 4px;
 904         -moz-border-radius: 4px;
 905         -webkit-border-radius: 4px;
 906     padding: 1px 6px;
 907     font-size: 1.2em;
 908     line-height: 1.2em;
 909     background: #fff;
 910     border: 1px solid #7b8dbb;
 911     color: #3e3e8c !important;
 912     position: relative;
 913     right: 4px;
 914     margin-left: 10px;
 915 }
 916
 917 .bookmark-notice-count:hover {
 918     text-decoration: none;
 919     background: #f2f2f2;
 920     border: 1px solid #7b8dbb;
 921     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 922 }
 923
 924 .notice .bookmark-description {
 925     clear: both;
 926     margin-left: 0px;
 927     margin-bottom: 0px;
 928 }
 929
 930 .notice .bookmark-author {
 931     margin-left: 0px;
 932     float: left;
 933 }
 934
 935 .bookmark-tags {
 936     clear: both;
 937     margin-bottom: 8px;
 938     line-height: 1.6em;
 939 }
 940
 941 ul.bookmark-tags a {
 942     border-radius: 4px;
 943         -moz-border-radius: 4px;
 944         -webkit-border-radius: 4px;
 945     padding: 1px 6px;
 946     background: #f2f2f2;
 947     color: #3e3e8c !important;
 948     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 949     font-size: 0.9em;
 950 }
 951
 952 ul.bookmark-tags a:hover {
 953     background-color: #cdd1dd;
 954     text-decoration: none;
 955 }
 956
 957 .bookmark-avatar {
 958     float: none !important;
 959     position: relative;
 960     top: 2px;
 961 }
 962
 963 .bookmark div.entry-content {
 964     font-size: 0.9em;
 965     line-height: 1.2em;
 966     margin-top: 6px;
 967     opacity: 0.6;
 968     margin-bottom: 0px;
 969 }
 970
 971 .bookmark:hover div.entry-content {
 972     opacity: 1;
 973 }
 974
 975 .bookmark .notice-options {
 976     margin-top: 16px;
 977 }
 978
 979 #bookmarkpopup {
 980     min-width: 600px;
 981     margin-top: 0px;
 982     height: 100%;
 983     border: 10px solid #364A84;
 984     background: #364A84;
 985 }
 986
 987 #bookmarkpopup #wrap {
 988     width: auto;
 989     min-width: 560px;
 990     padding: 40px 0px 25px 0px;
 991     margin-right: 2px;
 992     background: #fff url(../mobilelogo.png) no-repeat 6px 6px;
 993 }
 994
 995 #bookmarkpopup #header {
 996     width: auto;
 997     padding: 0px 10px;
 998 }
 999
1000 #bookmarkpopup .form_settings label {
1001     margin-top: 2px;
1002     text-align: right;
1003     width: 24%;
1004     font-size: 1.2em;
1005 }
1006
1007 #bookmarkpopup .form_settings .form_data input {
1008     width: 60%;
1009 }
1010
1011 #bookmarkpopup .form_guide {
1012     color: #777;
1013 }
1014
1015 #bookmarkpopup #submit {
1016     float: right;
1017     margin-right: 0px;
1018 }
1019
1020 #bookmarkpopup fieldset fieldset {
1021     margin-bottom: 10px;
1022 }
1023
1024 /* Onboard specific styles */
1025
1026 .onboard-flash {
1027     border-radius: 6px;
1028         -moz-border-radius: 6px;
1029         -webkit-border-radius: 6px;
1030     font-size: 1.1em;
1031     box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.5);
1032     -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.5);
1033     -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.5);
1034 }
1035
1036 .onboard-flash p {
1037     margin-bottom: 10px;
1038 }
1039
1040 .onboard-flash .next:before {
1041     content: '\00BB';
1042     padding-right: 6px;
1043 }
1044
1045 .onboard-breadcrumbs {
1046     margin-bottom: 16px !important;
1047 }
1048
1049 .onboard-breadcrumbs li {
1050     background: none !important;
1051     border-top: none !important;
1052     padding: 6px 12px 2px 0px !important;
1053 }
1054
1055 .onboard-breadcrumbs li:last-child {
1056     padding-right: 0px !important;
1057 }
1058
1059 .onboard-breadcrumbs a {
1060     text-decoration: none;
1061 }
1062
1063 .onboard-breadcrumbs a:hover {
1064     color: #3e3e8c !important;
1065 }
1066
1067 /* Billing specific styles */
1068
1069 #content table.billing_info {
1070     margin-top: 10px;
1071     background:rgba(240, 240, 240, 0.4);
1072 }
1073
1074 #content table.billing_info th {
1075     text-align: right;
1076     width: 50%;
1077 }
1078
1079 .invalid {
1080     border: solid 2px red !important;
1081 }
1082
1083 #payment_history table {
1084     width: 100%;
1085 }
1086
1087 #billingadminpanel .form_settings input {
1088     margin-right: 0px;
1089 }
1090
1091 /* Directory specific styles */
1092
1093 td.entity_profile {
1094     width: auto;
1095 }
1096
1097 #user_directory {
1098     position: relative;
1099     top: -20px;
1100 }
1101
1102 div#user_directory div.alpha_nav > a {
1103     border-left: 1px solid #ccc !important;
1104     padding-left: 3.5px !important;
1105     padding-right: 4px !important;
1106     margin-right: 0px;
1107     float: left;
1108     line-height: 1.4em;
1109 }
1110
1111 div#user_directory div.alpha_nav > a.first {
1112     border-left: none !important;
1113 }
1114
1115 div#user_directory div.alpha_nav a.current {
1116     background-color: #ECECF2 !important;
1117 }
1118
1119 table.profile_list {
1120     margin-top: 10px;
1121 }
1122
1123 .profile_list th#created {
1124     width: 100px;
1125 }
1126
1127 .profile_list th#subscriptions {
1128     width: 120px;
1129 }
1130
1131 table.profile_list tr.alt {
1132     background-color: #fafafa !important;
1133 }
1134
1135 .profile_list .entity_actions {
1136     width: 30px;
1137     height: 26px;
1138     margin-right: 5px;
1139 }
1140
1141 .profile_list .entity_actions input {
1142     width: 26px;
1143     height: 26px;
1144     display: block;
1145     overflow: hidden;
1146     font-size: 0em;
1147 }
1148
1149 /* Event specific styles */
1150
1151 .notice .event div {
1152     margin-bottom: 8px;
1153 }
1154
1155 .event-info {
1156     margin-left: 0px !important;
1157     margin-top: 2px !important;
1158 }
1159
1160 .notice .event-info + .notice-options {
1161     margin-top: 14px;
1162 }
1163
1164 #form_event_rsvp #new_rsvp_data {
1165     display: inline;
1166     margin: 10px 0px;
1167 }
1168
1169 #form_event_rsvp input.submit {
1170     height: auto;
1171     padding: 0px 10px;
1172     margin-left: 10px;
1173     color:#fff;
1174     font-weight: bold;
1175     text-transform: uppercase;
1176     font-size: 1.1em;
1177     text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.2);
1178     border: 1px solid #d7621c;
1179     border-radius: 4px;
1180     -moz-border-radius: 4px;
1181     -webkit-border-radius: 4px;
1182     background: #FB6104;
1183     background: -moz-linear-gradient(top, #ff9d63 , #FB6104);
1184     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9d63), color-stop(100%,#FB6104));
1185     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9d63', endColorstr='#FB6104',GradientType=0 );
1186 }
1187
1188 #form_event_rsvp .notice input.submit:hover {
1189     text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.6);
1190     background: #ff9d63;
1191     background: -moz-linear-gradient(top, #FB6104 , #fc8035);
1192     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FB6104), color-stop(100%,#fc8035));
1193     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FB6104', endColorstr='#fc8035',GradientType=0 );
1194 }
1195
1196 }/*end of @media screen, projection, tv*/