theme/default/display.css

   1 /* CSS Document */
   2 /* Design & CSS by Marie-Claude Doyon */
   3
   4 html {
   5         background-color: #f6e5b0;
   6
   7         }
   8 body {
   9         position: absolute;
  10         width: 100%;
  11         margin: 0;
  12         padding: 0;
  13         font-family: Verdana, Arial, Helvetica, sans-serif;
  14         font-size: 10px;
  15         line-height: 12px;
  16         min-height: 100%;
  17         color: #701238;
  18         /*background: url(bg-body.gif) repeat-y top center;*/
  19         }
  20 a {
  21         color: #d1451a;
  22         text-decoration: none;
  23         }
  24 a:hover {
  25         text-decoration: underline;
  26         }
  27 img, img a {
  28         border: 0;
  29         }
  30 h1 {
  31         font-size: 14px;
  32         }
  33
  34
  35 #wrap {
  36         margin: 0 auto;
  37         padding: 0 20px;
  38         width: 760px;
  39         background: url(bg-header.gif) repeat-x #fbf2d7;
  40
  41         }
  42 #header {
  43         position: relative;
  44         margin: 0 auto;
  45         width: 540px;
  46         height: 216px;
  47         /*border: 1px solid #FF0;*/
  48         /*background-color: #701238;*/
  49         }
  50 #logo {
  51         margin-top: 9px;
  52         }
  53 p#branding {
  54         margin: 0;
  55         padding: 6px 0 3px 0;
  56         color: #fbf2d7;
  57         font-size: 21px;
  58         font-weight: bold;
  59         line-height: 27px;
  60         }
  61 p#branding a {
  62         color: #dab134;
  63         }
  64 #header h1.pagetitle {
  65         /*display: none;*/
  66         margin: 0;
  67         padding: 0;
  68         /*font-family: Georgia, "Times New Roman", Times, serif;*/
  69         font-size: 15px;
  70 /*      font-weight: normal;
  71         font-style: italic;*/
  72         line-height: 24px;
  73         color: #fff6d5;
  74         }
  75
  76 #header h2.sitename {
  77         display: none;
  78         margin: 0;
  79         padding: 0;
  80         color: #fff6d5;
  81         }
  82
  83 /* ===== Begin Navigation Styling ===== */
  84
  85 /* ----- Navigation ------ */
  86 #nav {
  87         float: right;
  88         margin: 0;
  89         padding: 0;
  90         list-style-type: none;
  91         font-size: 12px;
  92         }
  93 #nav li {
  94         display: block;
  95         float: left;
  96         }
  97 #nav li a {
  98         display: block;
  99         padding: 9px 9px 12px 9px;
 100         color: #F60;
 101         }
 102 #nav li a:hover {
 103         text-decoration: underline;
 104         }
 105
 106 /* ----- Tabs ----- */
 107 #nav_views {
 108         margin: 0 auto;
 109         padding: 0;
 110         position: absolute;
 111         bottom: 0;
 112         list-style-type: none;
 113         font-size: 14px;
 114         font-weight: bold;
 115         width: 540px;
 116         /*height: 30px;*/
 117         }
 118 #nav_views li {
 119         display: block;
 120         float: left;
 121         line-height: 21px;
 122         }
 123 #nav_views li a {
 124         display: block;
 125         margin: 0;
 126         padding: 4px 12px 3px 12px;
 127         color: #fff6d5;
 128         background-color: #d1451a;
 129         border-right: 1px solid #dcaa3f;
 130         }
 131 #nav_views li a:hover {
 132         text-decoration: none;
 133         }
 134 #nav_views li.current a, #nav_views li.current a:hover {
 135         color: #701238;
 136         background-color: #fff6d5;
 137         border-right: 1px solid #dcaa3f;
 138         }
 139 #nav_views li.current a:hover {
 140         color: #d1451a;
 141         }
 142 #nav_views li a:hover {
 143         color: #fff6d5;
 144         background-color: #701238;
 145         border-right: 1px solid #dcaa3f;
 146         }
 147
 148 /* ----- Nav Footer ----- */
 149 #nav_sub {
 150         clear: both;
 151         margin: 18px auto 0 auto;
 152         padding: 0;
 153         list-style-type: none;
 154         font-size: 11px;
 155         font-weight: bold;
 156         line-height: 21px;
 157         border-top: 1px solid #dec5b5;
 158         width: 540px;
 159         }
 160 #nav_sub li {
 161         display: block;
 162         float: left;
 163         }
 164 #nav_sub li a {
 165         padding: 6px 24px 6px 0;
 166         }
 167 #nav_sub li a:hover {
 168         text-decoration: underline;
 169         }
 170 /* ===== End Navigation Styling ===== */
 171
 172 #content {
 173         clear: left;
 174         margin: 40px 0 45px 0;
 175         padding: 0 110px;
 176         font-family: Georgia, "Times New Roman", Times, serif;
 177         font-size: 14px;
 178         line-height: 18px;
 179         /*border: 1px solid #F00;*/
 180         }
 181 #content h2 {
 182         font-family: Verdana, Arial, Helvetica, sans-serif;
 183         font-size: 15px;
 184         }
 185 #content label {
 186         font-family: Verdana, Arial, Helvetica, sans-serif;
 187         font-size: 12px;
 188         }
 189 .instructions, .success, .error {
 190         font-weight: normal;
 191         margin: 36px 0 0 0;
 192         padding: 10px;
 193         font-family: Georgia, "Times New Roman", Times, serif;
 194         font-size: 13px;
 195         line-height: 15px;
 196         border: 1px solid #dec5b5;
 197         color: #fff6d5;
 198         }
 199 .success {
 200         background-color: #48705b;
 201         }
 202 .error {
 203         background-color: #ce3728;
 204         }
 205
 206
 207
 208 /* ----- Profile -----*/
 209 #profile {
 210         clear: left;
 211         margin: 0 -110px;
 212         padding: 10px 0 0 0;
 213         min-height: 170px;
 214         border-top: 1px solid #dec5b5;
 215         font-family: Georgia, "Times New Roman", Times, serif;
 216         }
 217 #profile h1 {
 218         margin: 0;
 219         padding: 0;
 220         font-family: Verdana, Arial, Helvetica, sans-serif;
 221         font-size: 14px;
 222         }
 223 #profile h2 {
 224         margin: 0;
 225         padding: 0;
 226         font-family: Verdana, Arial, Helvetica, sans-serif;
 227         font-size: 11px;
 228         text-transform: uppercase;
 229         color: #dab134;
 230         }
 231 #profile p {
 232         margin: 0 10px 0 0;
 233         font-size: 12px;
 234         line-height: 14px;
 235         }
 236 #profile p.location {
 237         margin: 0 10px 12px 0;
 238         font-style: italic;
 239         }
 240 #profile p.notice_current {
 241         font-size: 18px;
 242         line-height: 21px;
 243         /*min-height: 96px;*/
 244         }
 245
 246 #profile_avatar {
 247         float: left;
 248         margin-right: 4px;
 249         }
 250 #profile_avatar img {
 251         margin-bottom: 5px;
 252         }
 253 .avatar.profile {
 254         float: none;
 255         clear: left;
 256         margin: 0 10px 5px 0;
 257         }
 258 .avatar.original {
 259         margin: 0 10px 18px 0;
 260         }
 261 a.nickname {
 262         font-family: Verdana, Arial, Helvetica, sans-serif;
 263         font-weight: bold;
 264         font-size: 12px;
 265         padding-right: 3px;
 266         }
 267 #profile_information {
 268         float: left;
 269         position: relative;
 270         width: 270px;
 271         height: 200px;
 272         }
 273
 274 .statistics {
 275         margin-top: 18px;
 276         }
 277 .statistics h2 {
 278         margin: 12px 0 3px 0;
 279         }
 280 dl.statistics {
 281         margin: 0;
 282         font-size: 12px;
 283         line-height: 14px;
 284         }
 285 .statistics dt, .statistics dd {
 286         float: left;
 287         margin: 0;
 288         }
 289 .statistics dt {
 290         clear: left;
 291         width: 96px;
 292         }
 293 .statistics dd {
 294         clear: right;
 295         }
 296 .statistics dt:after {
 297         content: ":";
 298         }
 299 #subscriptions {
 300         float: left;
 301         margin: 18px 0 30px 0;
 302         }
 303 #subscriptions_avatars {
 304         /*float: left;*/
 305         margin: 6px 0 0 0;
 306         padding: 0;
 307         list-style-type: none;
 308         width: 270px;
 309         }
 310 #subscriptions_avatars li .avatar.mini {
 311         float: left;
 312         margin: 0 3px 3px 0;
 313         padding: 0;
 314         line-height: 0;
 315         }
 316 #subscriptions_viewall {
 317         clear: left;
 318         }
 319
 320 #notices {
 321         clear: both;
 322         margin: 0 auto;
 323         padding: 0;
 324         list-style-type: none;
 325         width: 540px;
 326         border-top: 1px solid #dec5b5;
 327         /*border: 1px solid #F00;*/
 328         }
 329 #notices a:hover {
 330         text-decoration: underline;
 331         }
 332 .notice_single {
 333         clear: both;
 334         display: block;
 335         margin: 0;
 336         padding: 5px 5px 5px 0;
 337         min-height: 48px;
 338         font-family: Georgia, "Times New Roman", Times, serif;
 339         font-size: 13px;
 340         line-height: 16px;
 341         border-bottom: 1px solid #dec5b5;
 342         }
 343 .notice_single:hover {
 344         background-color: #f7ebcc;
 345         }
 346 .notice_single p {
 347         display: inline;
 348         margin: 0;
 349         padding: 0;
 350         }
 351 #notice_delete_form #confirmation_text {
 352         display: block;
 353         font-size: 14px;
 354         font-weight: bold;
 355         }
 356 input#submit_yes, input#submit_no {
 357         margin: 18px 0;
 358         padding: 8px;
 359         font-weight: bold;
 360         color: #fff6d5;
 361         background-color: #F60;
 362         cursor: pointer;
 363         border: 0;
 364         width: auto;
 365         }
 366 input#submit_yes:hover, input#submit_no:hover {
 367         background-color: #701238;
 368         }
 369 .avatar {
 370         float: left;
 371         margin: 0 10px 0 0;
 372         }
 373
 374 p.time {
 375         display: block;
 376         font-family: Verdana, Arial, Helvetica, sans-serif;
 377         font-size: 10px;
 378         line-height: 15px;
 379         }
 380 p.time a {
 381         color: #dab134;
 382         }
 383
 384 #pagination {
 385         margin: 18px auto;
 386         width: 540px;
 387         }
 388 #nav_pagination {
 389         margin: 0 0 36px 0;
 390         padding: 0;
 391         float: right;
 392         list-style-type: none;
 393         font-size: 12px;
 394         font-weight: bold;
 395         }
 396 #nav_pagination li {
 397         display: block;
 398         float: left;
 399         background-color: #701238;
 400         }
 401 #nav_pagination li.before {
 402         margin-right: 1px;
 403         }
 404 #nav_pagination li a {
 405         padding: 6px 15px;
 406         line-height: 21px;
 407         background-color: #701238;
 408         color: #fff6d5;
 409         }
 410 #nav_pagination li a:hover {
 411         background-color: #3F606F;
 412         color: #fff6d5;
 413         text-decoration: none;
 414         }
 415
 416 #footer {
 417         clear: both;
 418         margin: 0 auto;
 419         padding: 0 0 36px 0;
 420         width: 540px;
 421         border-top: 1px solid #dec5b5;
 422         }
 423 #footer p {
 424         margin-top: 9px;
 425         }
 426 #cc {
 427         float: left;
 428         margin: 3px 10px 0 0;
 429         }
 430
 431 /* ===== Begin Forms Styling ===== */
 432
 433 /* ----- Forms General Style ----- */
 434 form {
 435         margin: 0 auto;
 436         padding: 0;
 437         }
 438 form {
 439         font-family: Verdana, Arial, Helvetica, sans-serif;
 440         font-size: 12px;
 441         }
 442 form label {
 443         display: block;
 444         font-size: 12px;
 445         font-weight: bold;
 446         line-height: 18px;
 447         }
 448 form input {
 449         border: 1px solid #dec5b5;
 450         width: 264px;
 451         }
 452 input#submit  {
 453         display: block;
 454         margin: 18px 0;
 455         padding: 4px;
 456         font-weight: bold;
 457         color: #fff6d5;
 458         background-color: #F60;
 459         cursor: pointer;
 460         border: 0;
 461         width: auto;
 462         }
 463 input#submit:hover {
 464         background-color: #701238;
 465         }
 466 textarea, input {
 467         font-family: Verdana, Arial, Helvetica, sans-serif;
 468         font-size: 12px;
 469         color: #701238;
 470         padding: 3px;
 471         }
 472 textarea:focus, input:focus {
 473         background-color: #f8ebc0;
 474         }
 475 textarea {
 476         width: 270px;
 477         border: 1px solid #D8E2D7;
 478         }
 479 .input_instructions {
 480         display: block;
 481         font-size: 11px;
 482         line-height: 21px;
 483         color: #924959;
 484         font-family: Verdana, Arial, Helvetica, sans-serif;
 485         }
 486
 487 /* ----- Status Form ----- */
 488 #status_form {
 489         height: 96px;
 490         /*background-color: #F00;*/
 491         }
 492 #status_form p {
 493         margin: 36px 0 0 0;
 494         padding: 0;
 495         }
 496 #status_label {
 497         display: inline;
 498         clear: both;
 499         margin: 0;
 500         padding: 0 0 3px 0;
 501         font-size: 18px;
 502         font-weight: bold;
 503         line-height: 24px;
 504         /*color: #701238;*/
 505         color: #dab134;
 506         }
 507 #status_textarea {
 508         display: block;
 509         float: left;
 510         width: 463px;
 511         height: 35px;
 512         padding: 5px;
 513         font-family: Verdana, Arial, Helvetica, sans-serif;
 514         font-size: 12px;
 515         color: #701238;
 516         border: 0;
 517         }
 518 #status_submit {
 519         display: block;
 520         float: left;
 521         margin: 1px 0 0 4px;
 522         width: 63px;
 523         height: 45px;
 524         background-color: #F60;
 525         font-family: Verdana, Arial, Helvetica, sans-serif;
 526         font-weight: bold;
 527         font-size: 14px;
 528         color: #fff6d5;
 529         cursor: pointer;
 530         border: 0;
 531         }
 532 #status_submit:hover {
 533         background-color: #d1451a;
 534         }
 535 #counter {
 536     position: relative;
 537     color: black;
 538     font-weight: bold;
 539     font-size: 18px;
 540     left: 255px;
 541 }
 542
 543 #counter.toomuch {
 544     color: red;
 545 }
 546
 547 /* ----- Subscribe Form ----- */
 548 #subscribe .button, #unsubscribe .button, #remotesubscribe .button {
 549         margin: 0;
 550         width: 96px;
 551         height: 27px;
 552         font-family: verdana, arial, helvetica, sans-serif;
 553         font-weight: bold;
 554         font-size: 10px;
 555         text-transform: uppercase;
 556         background-color: #F60;
 557         color: #fff6d5;
 558         border: 0;
 559         }
 560 #subscribe .button:hover, #unsubscribe .button:hover {
 561         background-color: #904632;
 562         cursor: pointer;
 563         }
 564 input#profile_url {
 565         width: 88px;
 566         padding: 3px;
 567         margin: 0 0 10px 0;
 568         }
 569 /* ----- Login Form -----*/
 570 input#license {
 571         width: auto;
 572         }
 573 /* ----- Avatar Form -----*/
 574 form {
 575         clear: left;
 576 }
 577
 578 /* ----- OpenID Form -----*/
 579
 580 input#openid_url {
 581    background: url(login-bg.gif) no-repeat;
 582    background-color: #fff;
 583    background-position: 0 50%;
 584    color: #000;
 585    padding-left: 18px;
 586 }
 587
 588 /* for people lists */
 589
 590 #profiles {
 591         clear: both;
 592         margin: 0 auto;
 593         padding: 0;
 594         list-style-type: none;
 595         width: 540px;
 596         border-top: 1px solid #dec5b5;
 597         /*border: 1px solid #F00;*/
 598         }
 599 #profiles a:hover {
 600         text-decoration: underline;
 601         }
 602
 603 .profile_single {
 604         clear: both;
 605         display: block;
 606         margin: 0;
 607         padding: 5px 5px 5px 0;
 608         min-height: 48px;
 609         font-family: Georgia, "Times New Roman", Times, serif;
 610         font-size: 13px;
 611         line-height: 16px;
 612         border-bottom: 1px solid #dec5b5;
 613         }
 614 .profile_single:hover {
 615         background-color: #f7ebcc;
 616         }
 617
 618 /* ----- favor/disfavor -----*/
 619
 620 input#disfavor, input.disfavor  {
 621         display: inline;
 622         color: #C15D42;
 623         background-color: white;
 624         cursor: pointer;
 625         border: 0;
 626         width: auto;
 627         }
 628
 629 input#favor, input.favor  {
 630         display: inline;
 631         color: #C15D42;
 632         background-color: white;
 633         cursor: pointer;
 634         border: 0;
 635         width: auto;
 636         }
 637
 638 /* ===== End Forms Styling ===== */
 639
 640 /* ----- messages ----- */
 641
 642 #messages {
 643         clear: both;
 644         margin: 0 auto;
 645         padding: 0;
 646         list-style-type: none;
 647         width: 540px;
 648         border-top: 1px solid #dec5b5;
 649         /*border: 1px solid #F00;*/
 650         }
 651 #messages a:hover {
 652         text-decoration: underline;
 653         }
 654 .message_single {
 655         clear: both;
 656         display: block;
 657         margin: 0;
 658         padding: 5px 5px 5px 0;
 659         min-height: 48px;
 660         font-family: Georgia, "Times New Roman", Times, serif;
 661         font-size: 13px;
 662         line-height: 16px;
 663         border-bottom: 1px solid #dec5b5;
 664         }
 665 .message_single:hover {
 666         background-color: #f7ebcc;
 667         }
 668 .message_single p {
 669         display: inline;
 670         margin: 0;
 671         padding: 0;
 672         }