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_placeholder .placeholder {
 308     width: 473px;
 309     padding: 4px 10px 4px 10px;
 310     border: 1px solid #a6a6a6;
 311     -webkit-border-radius: 4px;
 312     -moz-border-radius: 4px;
 313     border-radius: 4px;
 314     box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 315     -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 316     -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 317     z-index: 97;
 318     font-size: 1em;
 319 }
 320
 321 .form_notice textarea {
 322     width: 473px;
 323     height: 42px;
 324     padding: 6px 10px 18px 10px;
 325     border: 1px solid #a6a6a6;
 326     -webkit-border-radius: 4px;
 327     -moz-border-radius: 4px;
 328     border-radius: 4px;
 329     box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 330     -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 331     -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 332     z-index: 97;
 333     font-size: 1.2em;
 334 }
 335
 336
 337 .form_notice textarea {
 338     height: 42px;
 339     padding: 6px 10px 18px 10px;
 340     border: 1px solid #a6a6a6;
 341     -webkit-border-radius: 4px;
 342     -moz-border-radius: 4px;
 343     border-radius: 4px;
 344     box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 345     -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 346     -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 347     z-index: 97;
 348     font-size: 1.2em;
 349 }
 350
 351 .form_notice label.notice_data-attach {
 352     top: 0px;
 353     right: 0px;
 354     z-index: 96;
 355 }
 356
 357 .form_notice .notice_data-geo_wrap label,
 358 .form_notice .notice_data-geo_wrap input {
 359     top: 26px;
 360     right: 0px;
 361     z-index: 99;
 362 }
 363
 364 .form_notice .count {
 365     position: absolute;
 366     top: 50px;
 367     right: 35px;
 368     font-size: 0.8em;
 369     height: 1em;
 370     z-index: 99;
 371 }
 372
 373 .form_notice #notice_action-submit {
 374     position: absolute;
 375     top: 100%;
 376     left: 0px;
 377     margin-top: -44px;
 378     float: left;
 379     width: 90px;
 380     padding: 0px;
 381     z-index: 99;
 382 }
 383
 384 .form_notice .error,
 385 .form_notice .success,
 386 .form_notice .notice-status {
 387     width: 478px;
 388     position: relative;
 389     top: 0px;
 390     float: none;
 391     clear: none;
 392     margin-left: 0px;
 393     margin-top: 10px;
 394     padding: 5px 5px 5px 10px;
 395     border: 1px solid #ccc;
 396 }
 397
 398 .form_notice .error {
 399     border: 1px solid #d05858;
 400 }
 401
 402 .form_notice .attach-status code {
 403     font-size: 1em;
 404 }
 405
 406 .input_form fieldset {
 407     margin: 0px;
 408     padding: 0px;
 409 }
 410
 411 .input_form fieldset fieldset {
 412     margin-bottom: 10px !important;
 413 }
 414
 415 #aside_primary {
 416     width: 218px;
 417     float: left;
 418     overflow: hidden;
 419     position: relative;
 420     left: 802px;
 421     padding: 22px 10px 40px 10px;
 422     margin-top: 0px;
 423     background: none;
 424 }
 425
 426 #aside_primary .section {
 427     width: 100%;
 428     margin-left: 0px;
 429     margin-right: 0px;
 430     font-size: 0.88em;
 431 }
 432
 433 #aside_primary h2 {
 434     margin-bottom: 10px;
 435     padding-bottom: 6px;
 436     background: url('../images/brdr_black_dot.png') repeat-x bottom left;
 437     color: #7a7c87;
 438     font-size: 1.25em;
 439     letter-spacing: 2px;
 440     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 441     text-transform: uppercase;
 442 }
 443
 444 .profile_block_name {
 445     font-size: 14px;
 446     font-weight: bold;
 447 }
 448
 449 .profile_block_location {
 450     font-weight: bold;
 451 }
 452
 453 .profile_block_description {
 454     line-height: 1.2em;
 455 }
 456
 457 .profile_block .entity_actions {
 458     float: left;
 459     margin-left: 0px;
 460 }
 461
 462 .profile_block .entity_moderation:hover ul,
 463 .profile_block .entity_role:hover ul {
 464     left: 20px;
 465 }
 466
 467 .profile_block a.profiledetail {
 468     display: block;
 469 }
 470
 471 .section ul.entities {
 472     width: 240px;
 473 }
 474
 475 .section .entities li {
 476     margin-right: 23px;
 477     margin-bottom: 12px;
 478     width: 24px;
 479 }
 480
 481 #popular_notices .avatar {
 482     position: relative;
 483     top: 4px;
 484     margin-bottom: 6px;
 485 }
 486
 487 #aside_primary td {
 488     padding-right: 20px;
 489     padding-bottom: 14px;
 490 }
 491
 492 #aside_primary td .nickname {
 493     line-height: 1.6em;
 494 }
 495
 496 .section .avatar {
 497     box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 498     -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 499     -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 500 }
 501
 502 #content h1 {
 503     border-bottom: 3px solid #A6ADBF;
 504     color: #A6ADBF;
 505     font-size: 1.4em;
 506     letter-spacing: 4px;
 507     text-transform: none;
 508 }
 509
 510 #notices_primary {
 511     margin-top: -5px;
 512 }
 513
 514 #content .notice {
 515     padding-bottom: 14px;
 516     border-bottom: 2px dotted #eee;
 517 }
 518
 519 .notice {
 520     line-height: 1.36em;
 521     margin-bottom: 10px;
 522 }
 523
 524 #content .notice .author .photo {
 525     left: 0px;
 526     top: 9px;
 527 }
 528
 529 #content .notice .entry-title {
 530     min-height: 35px;
 531 }
 532
 533 #showstream .notice .entry-title {
 534     min-height: 1px;
 535 }
 536
 537 #shownotice .notice .entry-title {
 538     min-height:123px;
 539 }
 540
 541 .notice div.entry-content {
 542     font-size: 0.88em;
 543     line-height: 1.2em;
 544     margin-top: 6px;
 545     opacity: 0.6;
 546 }
 547
 548 .notice:hover div.entry-content {
 549     opacity: 1;
 550 }
 551
 552 .user_in .notice div.entry-content {
 553     max-width: 440px;
 554 }
 555
 556 div.entry-content a.response:before {
 557         content: "(";
 558 }
 559
 560 div.entry-content a.response:after {
 561         content: ")";
 562 }
 563
 564 .notice-options {
 565     margin-top: 4px;
 566 }
 567
 568 .threaded-replies {
 569     clear: both;
 570     float: left;
 571     width: 458px;
 572     margin-left: 59px;
 573     margin-top: 10px;
 574     padding-right: 2px;
 575     border-left: 3px solid #ECECF2;
 576     background: #fafafa;
 577     font-size: 1em;
 578 }
 579
 580 #content .notice .threaded-replies .notice,
 581 #content .notice .threaded-replies .notice-data {
 582     width: 440px;
 583     min-height: 1px;
 584     padding-bottom: 14px;
 585     padding-top: 5px;
 586     border-bottom: 2px dotted #eee;
 587     line-height: 1.36em;
 588     margin-top: 0px;
 589     margin-bottom: 0px;
 590     margin-left: 10px;
 591     background: none;
 592 }
 593
 594 #content .notice .threaded-replies .entry-title {
 595     min-height: 1px;
 596 }
 597
 598 #content .threaded-replies .notice .author .photo {
 599     height: 24px;
 600     width: 24px;
 601     top: 14px;
 602     box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 603     -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 604     -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
 605 }
 606
 607 #content .notice .threaded-replies .notice .entry-title {
 608     margin: 2px 7px 0px 35px;
 609 }
 610
 611 #content .notice .threaded-replies .notice div.entry-content {
 612     clear:left;
 613     float:left;
 614     margin-left: 35px;
 615     margin-top: 4px !important;
 616 }
 617
 618 .threaded-replies li {
 619     list-style-type: none;
 620 }
 621
 622 .threaded-replies .notice-reply-comments {
 623     margin: 2px 0px 4px 10px;
 624 }
 625
 626 .threaded-replies .placeholder {
 627     margin: 10px;
 628     width: 426px;
 629 }
 630
 631 .threaded-replies .notice-reply {
 632     clear: left;
 633     position: relative;
 634     padding: 10px;
 635     padding-bottom: 44px;
 636 }
 637
 638 .threaded-replies .form_notice textarea {
 639     width: 385px;
 640 }
 641
 642 .threaded-replies .form_notice label.notice_data-attach {
 643     top: 10px;
 644     right: 10px;
 645 }
 646
 647 .threaded-replies .form_notice .notice_data-geo_wrap label,
 648 .threaded-replies .form_notice .notice_data-geo_wrap input {
 649     top: 36px;
 650     right: 10px;
 651 }
 652
 653 .threaded-replies .form_notice .count {
 654     top: 60px;
 655     right: 50px;
 656 }
 657
 658 .threaded-replies .form_notice #notice_action-submit {
 659     left: 10px;
 660 }
 661
 662 .threaded-replies .form_notice .error,
 663 .threaded-replies .form_notice .success,
 664 .threaded-replies .form_notice .notice-status {
 665     width: 390px;
 666 }
 667
 668 #content .notice .notice {
 669     width: 100%;
 670     margin-left: 0;
 671     margin-top: 16px;
 672     margin-bottom: 10px;
 673 }
 674
 675 .notice .notice {
 676 background-color:rgba(200, 200, 200, 0.050);
 677 }
 678 .notice .notice .notice {
 679 background-color:rgba(200, 200, 200, 0.100);
 680 }
 681 .notice .notice .notice .notice {
 682 background-color:rgba(200, 200, 200, 0.150);
 683 }
 684 .notice .notice .notice .notice .notice {
 685 background-color:rgba(200, 200, 200, 0.300);
 686 }
 687
 688 .pagination {
 689     height: 1.2em;
 690 }
 691
 692 #jOverlayContent button {
 693     top: 20px;
 694     right: 36px;
 695 }
 696
 697 .entity_profile {
 698     float: left;
 699     width: 360px;
 700     margin-top: 4px;
 701 }
 702
 703 .entity_profile .entity_depiction {
 704     margin-top: 4px;
 705 }
 706
 707 .entity_actions {
 708     width: 140px;
 709     margin-top: 8px;
 710     margin-bottom: 10px;
 711 }
 712
 713 .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 {
 714         text-shadow:0 1px 0 rgba(255,255,255,0.4);
 715     border-radius: 4px;
 716     -moz-border-radius: 4px;
 717     -webkit-border-radius: 4px;
 718     background-color: #CDD1DD !important;
 719 }
 720
 721 .entity_moderation:hover ul,
 722 .entity_role:hover ul {
 723     border-radius: 4px;
 724     -moz-border-radius: 4px;
 725     -webkit-border-radius: 4px;
 726 }
 727
 728 .entity_send-a-message .form_notice legend {
 729         text-shadow:0 1px 0 rgba(255,255,255,0.4);
 730 }
 731
 732 .entity_send-a-message .form_notice {
 733     border: 1px solid #7B4E82;
 734 }
 735
 736 .entity_send-a-message .form_notice #notice_action-submit {
 737     color: #fff !important;
 738     top: 46px;
 739 }
 740
 741 #aside_primary #entity_remote_subscribe a:hover {
 742     background-color: #fff !important;
 743 }
 744
 745 #entity_remote_subscribe .dialogbox {
 746     border: 1px solid #7B4E82;
 747     border-radius: 8px;
 748         -moz-border-radius: 8px;
 749         -webkit-border-radius: 8px;
 750 }
 751
 752 #entity_remote_subscribe input {
 753     padding-left: 4px;
 754 }
 755
 756 #entity_remote_subscribe .submit_dialogbox {
 757     margin-top: 10px;
 758     float: right;
 759 }
 760
 761 #filter_tags_item .submit {
 762   left: 6px;
 763   top: -3px;
 764 }
 765
 766 #pagination {
 767     height: 1.2em;
 768     padding-bottom: 12px;
 769     -webkit-border-radius: 6px;
 770     -moz-border-radius: 6px;
 771     border-radius: 6px;
 772 }
 773
 774 #footer {
 775     position: relative;
 776     top: -6px;
 777     color: #000;
 778     margin-left: 0px;
 779     margin-right: 0px;
 780     -webkit-border-top-left-radius: 6px;
 781     -webkit-border-top-right-radius: 6px;
 782     -moz-border-radius-topleft: 6px;
 783     -moz-border-radius-topright: 6px;
 784     border-top-left-radius: 6px;
 785     border-top-right-radius: 6px;
 786 }
 787
 788 #footer a {
 789     color: #3e3e8c;
 790 }
 791
 792 #site_nav_global_secondary {
 793     margin-bottom: 10px;
 794 }
 795
 796 .error, .success, .notice-status {
 797     background-color: #F7E8E8;
 798     padding: 4px;
 799     -webkit-border-radius: 6px;
 800     -moz-border-radius: 6px;
 801     border-radius: 6px;
 802 }
 803 .success, .notice-status {
 804     background-color: #f2f2f2;
 805 }
 806
 807 .form_notice input.submit, .form_settings input.submit, .form_settings input.cancel {
 808     height: 1.9em;
 809     padding: 0px 10px;
 810     color:#fff;
 811     font-weight: bold;
 812     text-transform: uppercase;
 813     font-size: 1.2em;
 814     text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.2);
 815     border: 1px solid #d7621c;
 816     border-radius: 4px;
 817     -moz-border-radius: 4px;
 818     -webkit-border-radius: 4px;
 819     background: #FB6104;
 820     background: -moz-linear-gradient(top, #ff9d63 , #FB6104);
 821     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9d63), color-stop(100%,#FB6104));
 822     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9d63', endColorstr='#FB6104',GradientType=0 );
 823 }
 824
 825 .form_notice input.submit:hover, .form_settings input.submit:hover, .form_settings input.cancel:hover {
 826     text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.6);
 827     background: #ff9d63;
 828     background: -moz-linear-gradient(top, #FB6104 , #fc8035);
 829     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FB6104), color-stop(100%,#fc8035));
 830     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FB6104', endColorstr='#fc8035',GradientType=0 );
 831 }
 832
 833 .form_settings input#settings_design_reset, .form_settings input.cancel {
 834     background: #e2e2e2;
 835     color: #8e181b;
 836     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 837 }
 838
 839 .form_settings input#settings_design_reset:hover, .form_settings input.cancel:hover {
 840     background: #f2f2f2;
 841     color: #8e181b;
 842     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 843 }
 844
 845 .form_settings input.checkbox, .form_settings input.radio {
 846     margin-left: 24%;
 847     margin-top: 2px;
 848     position: relative;
 849     left: -14px;
 850 }
 851
 852 .form_settings label.checkbox, .form_settings label.radio {
 853     width: auto;
 854     max-width: 60%;
 855     position: relative;
 856     left: -30px;
 857 }
 858
 859 .form_settings li input.radio {
 860     clear: left;
 861 }
 862
 863 .form_settings label.radio {
 864     margin-left: 10px;
 865     margin-right: 10px;
 866     text-align: left;
 867 }
 868
 869 #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 {
 870     margin-left: 26%;
 871 }
 872
 873 #form_search ul.form_data #q {
 874     margin-left: 10px;
 875 }
 876
 877 .form_settings fieldset fieldset {
 878     margin-bottom: 30px;
 879     padding-top: 25px;
 880 }
 881
 882
 883 #content thead th {
 884 text-align:left;
 885 }
 886 #content tbody th {
 887 vertical-align:top;
 888 text-align:left;
 889 font-weight:normal;
 890 padding-top:11px;
 891 padding-right:18px;
 892 }
 893 #content tbody tr {
 894     border-top: 1px dotted #bbb;
 895 }
 896 #content td {
 897 padding:11px 18px 11px 0;
 898 vertical-align:top;
 899 }
 900 #content td:last-child {
 901 padding-right:0;
 902 }
 903
 904
 905 #realtime_actions {
 906     position: relative !important;
 907     float: right;
 908     padding-top: 15px;
 909     margin-bottom: -8px !important;
 910 }
 911
 912 .realtime-popup #content {
 913     padding-left: 4px !important;
 914     padding-right: 4px !important;
 915     margin-right: 0px;
 916     left: 0;
 917     right: 0;
 918     width: 400px;
 919     overflow: visible;
 920 }
 921
 922 .realtime-popup .threaded-replies {
 923     margin-left: 10px;
 924 }
 925
 926 .realtime-popup .input_forms {
 927     display: none; /* XXX fixme! */
 928 }
 929
 930 .realtime-popup .form_notice textarea {
 931     width: 325px !important;
 932 }
 933
 934 .realtime-popup .form_notice #notice_action-submit {
 935     top: 59px !important;
 936     right: 6px !important;
 937 }
 938
 939 .realtime-popup .form_notice label.notice_data-attach, .realtime-popup .form_notice input.notice_data-attach {
 940     right: 74px;
 941     top: 3px !important;
 942 }
 943
 944 .realtime-popup .form_notice #notice_data-geo_wrap label, .realtime-popup .form_notice #notice_data-geo_wrap input {
 945     right: 8px;
 946     top: 3px !important;
 947 }
 948
 949
 950 /* Bookmark specific styles */
 951
 952 #content .bookmark .entry-title {
 953     margin-left: 0px;
 954 }
 955
 956 .bookmark h3 {
 957     margin: 0px 0px 8px 0px;
 958     float: left;
 959     line-height: 1.2em;
 960     max-width: 92%;
 961 }
 962
 963 .bookmark-notice-count {
 964     border-radius: 4px;
 965         -moz-border-radius: 4px;
 966         -webkit-border-radius: 4px;
 967     padding: 1px 6px;
 968     font-size: 1.2em;
 969     line-height: 1.2em;
 970     background: #fff;
 971     border: 1px solid #7b8dbb;
 972     color: #3e3e8c !important;
 973     position: relative;
 974     right: 4px;
 975     margin-left: 10px;
 976 }
 977
 978 .bookmark-notice-count:hover {
 979     text-decoration: none;
 980     background: #f2f2f2;
 981     border: 1px solid #7b8dbb;
 982     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
 983 }
 984
 985 .notice .bookmark-description {
 986     clear: both;
 987     margin-left: 0px;
 988     margin-bottom: 0px;
 989 }
 990
 991 .notice .bookmark-author {
 992     margin-left: 0px;
 993     float: left;
 994 }
 995
 996 .bookmark-tags {
 997     clear: both;
 998     margin-bottom: 8px;
 999     line-height: 1.6em;
1000 }
1001
1002 ul.bookmark-tags a {
1003     border-radius: 4px;
1004         -moz-border-radius: 4px;
1005         -webkit-border-radius: 4px;
1006     padding: 1px 6px;
1007     background: #f2f2f2;
1008     color: #3e3e8c !important;
1009     text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
1010     font-size: 0.88em;
1011 }
1012
1013 ul.bookmark-tags a:hover {
1014     background-color: #cdd1dd;
1015     text-decoration: none;
1016 }
1017
1018 .bookmark-avatar {
1019     float: none !important;
1020     position: relative;
1021     top: 2px;
1022 }
1023
1024 .bookmark div.entry-content {
1025     font-size: 0.88em;
1026     line-height: 1.2em;
1027     margin-top: 6px;
1028     opacity: 0.6;
1029     margin-bottom: 0px;
1030 }
1031
1032 .bookmark:hover div.entry-content {
1033     opacity: 1;
1034 }
1035
1036 .bookmark .notice-options {
1037     margin-top: 16px;
1038 }
1039
1040 #bookmarkpopup {
1041     min-width: 600px;
1042     margin-top: 0px;
1043     height: 100%;
1044     border: 10px solid #364A84;
1045     background: #364A84;
1046 }
1047
1048 #bookmarkpopup #wrap {
1049     width: auto;
1050     min-width: 560px;
1051     padding: 40px 0px 25px 0px;
1052     margin-right: 2px;
1053     background: #fff url(../mobilelogo.png) no-repeat 6px 6px;
1054 }
1055
1056 #bookmarkpopup #header {
1057     width: auto;
1058     padding: 0px 10px;
1059 }
1060
1061 #bookmarkpopup .form_settings label {
1062     margin-top: 2px;
1063     text-align: right;
1064     width: 24%;
1065     font-size: 1.2em;
1066 }
1067
1068 #bookmarkpopup .form_settings .form_data input {
1069     width: 60%;
1070 }
1071
1072 #bookmarkpopup .form_guide {
1073     color: #777;
1074 }
1075
1076 #bookmarkpopup #submit {
1077     float: right;
1078     margin-right: 0px;
1079 }
1080
1081 #bookmarkpopup fieldset fieldset {
1082     margin-bottom: 10px;
1083 }
1084
1085 /* Onboard specific styles */
1086
1087 .onboard-flash {
1088     position: relative;
1089     right: -800px;
1090     top: 10px;
1091     border-radius: 6px;
1092         -moz-border-radius: 6px;
1093         -webkit-border-radius: 6px;
1094     font-size: 1.1em;
1095     box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.5);
1096     -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.5);
1097     -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.5);
1098 }
1099
1100 .onboard-flash p {
1101     margin-bottom: 10px;
1102 }
1103
1104 .onboard-flash .next:before {
1105     content: '\00BB';
1106     padding-right: 6px;
1107 }
1108
1109 .onboard-breadcrumbs {
1110     margin-bottom: 16px !important;
1111 }
1112
1113 .onboard-breadcrumbs li {
1114     background: none !important;
1115     border-top: none !important;
1116     padding: 6px 12px 2px 0px !important;
1117 }
1118
1119 .onboard-breadcrumbs li:last-child {
1120     padding-right: 0px !important;
1121 }
1122
1123 .onboard-breadcrumbs a {
1124     text-decoration: none;
1125 }
1126
1127 .onboard-breadcrumbs a:hover {
1128     color: #3e3e8c !important;
1129 }
1130
1131 /* Billing specific styles */
1132
1133 #content table.billing_info {
1134     margin-top: 10px;
1135     background:rgba(240, 240, 240, 0.4);
1136 }
1137
1138 #content table.billing_info th {
1139     text-align: right;
1140     width: 50%;
1141 }
1142
1143 .invalid {
1144     border: solid 2px red !important;
1145 }
1146
1147 #payment_history table {
1148     width: 100%;
1149 }
1150
1151 #billingadminpanel .form_settings input {
1152     margin-right: 0px;
1153 }
1154
1155 /* Directory specific styles */
1156
1157 td.entity_profile {
1158     width: auto;
1159 }
1160
1161 #user_directory {
1162     position: relative;
1163     top: -20px;
1164 }
1165
1166 div#user_directory div.alpha_nav > a {
1167     border-left: 1px solid #ccc !important;
1168     padding-left: 3.5px !important;
1169     padding-right: 4px !important;
1170     margin-right: 0px;
1171     float: left;
1172     line-height: 1.4em;
1173 }
1174
1175 div#user_directory div.alpha_nav > a.first {
1176     border-left: none !important;
1177 }
1178
1179 div#user_directory div.alpha_nav a.current {
1180     background-color: #ECECF2 !important;
1181 }
1182
1183 table.profile_list {
1184     margin-top: 10px;
1185 }
1186
1187 .profile_list th#created {
1188     width: 100px;
1189 }
1190
1191 .profile_list th#subscriptions {
1192     width: 120px;
1193 }
1194
1195 table.profile_list tr.alt {
1196     background-color: #fafafa !important;
1197 }
1198
1199 .profile_list .entity_actions {
1200     width: 30px;
1201     height: 26px;
1202     margin-right: 5px;
1203 }
1204
1205 .profile_list .entity_actions input {
1206     width: 26px;
1207     height: 26px;
1208     display: block;
1209     overflow: hidden;
1210     font-size: 0em;
1211 }
1212
1213 /* Event specific styles */
1214
1215 .notice .vevent div {
1216     margin-bottom: 8px;
1217 }
1218
1219 .event-info {
1220     margin-left: 0px !important;
1221     margin-top: 2px !important;
1222 }
1223
1224 .notice .event-info + .notice-options {
1225     margin-top: 14px;
1226 }
1227
1228 .notice .threaded-replies .event-info + .notice-options {
1229     margin-top: 20px;
1230 }
1231
1232 #form_event_rsvp #new_rsvp_data {
1233     display: inline;
1234     margin: 10px 0px;
1235 }
1236
1237 #form_event_rsvp input.submit {
1238     height: auto;
1239     padding: 0px 10px;
1240     margin-left: 10px;
1241     color:#fff;
1242     font-weight: bold;
1243     text-transform: uppercase;
1244     font-size: 1.1em;
1245     text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.2);
1246     border: 1px solid #d7621c;
1247     border-radius: 4px;
1248     -moz-border-radius: 4px;
1249     -webkit-border-radius: 4px;
1250     background: #FB6104;
1251     background: -moz-linear-gradient(top, #ff9d63 , #FB6104);
1252     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9d63), color-stop(100%,#FB6104));
1253     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9d63', endColorstr='#FB6104',GradientType=0 );
1254 }
1255
1256 #form_event_rsvp .notice input.submit:hover {
1257     text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.6);
1258     background: #ff9d63;
1259     background: -moz-linear-gradient(top, #FB6104 , #fc8035);
1260     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FB6104), color-stop(100%,#fc8035));
1261     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FB6104', endColorstr='#fc8035',GradientType=0 );
1262 }
1263
1264 }/*end of @media screen, projection, tv*/