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