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 .avatar {
 352         float: left;
 353         margin: 0 10px 0 0;
 354         }
 355
 356 p.time {
 357         display: block;
 358         font-family: Verdana, Arial, Helvetica, sans-serif;
 359         font-size: 10px;
 360         line-height: 15px;
 361         }
 362 p.time a {
 363         color: #dab134;
 364         }
 365
 366 #pagination {
 367         margin: 18px auto;
 368         width: 540px;
 369         }
 370 #nav_pagination {
 371         margin: 0 0 36px 0;
 372         padding: 0;
 373         float: right;
 374         list-style-type: none;
 375         font-size: 12px;
 376         font-weight: bold;
 377         }
 378 #nav_pagination li {
 379         display: block;
 380         float: left;
 381         background-color: #701238;
 382         }
 383 #nav_pagination li.before {
 384         margin-right: 1px;
 385         }
 386 #nav_pagination li a {
 387         padding: 6px 15px;
 388         line-height: 21px;
 389         background-color: #701238;
 390         color: #fff6d5;
 391         }
 392 #nav_pagination li a:hover {
 393         background-color: #3F606F;
 394         color: #fff6d5;
 395         text-decoration: none;
 396         }
 397
 398 #footer {
 399         clear: both;
 400         margin: 0 auto;
 401         padding: 0 0 36px 0;
 402         width: 540px;
 403         border-top: 1px solid #dec5b5;
 404         }
 405 #footer p {
 406         margin-top: 9px;
 407         }
 408 #cc {
 409         float: left;
 410         margin: 3px 10px 0 0;
 411         }
 412
 413 /* ===== Begin Forms Styling ===== */
 414
 415 /* ----- Forms General Style ----- */
 416 form {
 417         margin: 0 auto;
 418         padding: 0;
 419         }
 420 form {
 421         font-family: Verdana, Arial, Helvetica, sans-serif;
 422         font-size: 12px;
 423         }
 424 form label {
 425         display: block;
 426         font-size: 12px;
 427         font-weight: bold;
 428         line-height: 18px;
 429         }
 430 form input {
 431         border: 1px solid #dec5b5;
 432         width: 264px;
 433         }
 434 input#submit  {
 435         display: block;
 436         margin: 18px 0;
 437         padding: 4px;
 438         font-weight: bold;
 439         color: #fff6d5;
 440         background-color: #F60;
 441         cursor: pointer;
 442         border: 0;
 443         width: auto;
 444         }
 445 input#submit:hover {
 446         background-color: #701238;
 447         }
 448 textarea, input {
 449         font-family: Verdana, Arial, Helvetica, sans-serif;
 450         font-size: 12px;
 451         color: #701238;
 452         padding: 3px;
 453         }
 454 textarea:focus, input:focus {
 455         background-color: #f8ebc0;
 456         }
 457 textarea {
 458         width: 270px;
 459         border: 1px solid #D8E2D7;
 460         }
 461 .input_instructions {
 462         display: block;
 463         font-size: 11px;
 464         line-height: 21px;
 465         color: #924959;
 466         font-family: Verdana, Arial, Helvetica, sans-serif;
 467         }
 468
 469 /* ----- Status Form ----- */
 470 #status_form {
 471         height: 96px;
 472         /*background-color: #F00;*/
 473         }
 474 #status_form p {
 475         margin: 36px 0 0 0;
 476         padding: 0;
 477         }
 478 #status_label {
 479         display: inline;
 480         clear: both;
 481         margin: 0;
 482         padding: 0 0 3px 0;
 483         font-size: 18px;
 484         font-weight: bold;
 485         line-height: 24px;
 486         /*color: #701238;*/
 487         color: #dab134;
 488         }
 489 #status_textarea {
 490         display: block;
 491         float: left;
 492         width: 463px;
 493         height: 35px;
 494         padding: 5px;
 495         font-family: Verdana, Arial, Helvetica, sans-serif;
 496         font-size: 12px;
 497         color: #701238;
 498         border: 0;
 499         }
 500 #status_submit {
 501         display: block;
 502         float: left;
 503         margin: 1px 0 0 4px;
 504         width: 63px;
 505         height: 45px;
 506         background-color: #F60;
 507         font-family: Verdana, Arial, Helvetica, sans-serif;
 508         font-weight: bold;
 509         font-size: 14px;
 510         color: #fff6d5;
 511         cursor: pointer;
 512         border: 0;
 513         }
 514 #status_submit:hover {
 515         background-color: #d1451a;
 516         }
 517 #counter {
 518     position: relative;
 519     color: black;
 520     font-weight: bold;
 521     font-size: 18px;
 522     left: 255px;
 523 }
 524
 525 #counter.toomuch {
 526     color: red;
 527 }
 528
 529 /* ----- Subscribe Form ----- */
 530 #subscribe .button, #unsubscribe .button, #remotesubscribe .button {
 531         margin: 0;
 532         width: 96px;
 533         height: 27px;
 534         font-family: verdana, arial, helvetica, sans-serif;
 535         font-weight: bold;
 536         font-size: 10px;
 537         text-transform: uppercase;
 538         background-color: #F60;
 539         color: #fff6d5;
 540         border: 0;
 541         }
 542 #subscribe .button:hover, #unsubscribe .button:hover {
 543         background-color: #904632;
 544         cursor: pointer;
 545         }
 546 input#profile_url {
 547         width: 88px;
 548         padding: 3px;
 549         margin: 0 0 10px 0;
 550         }
 551 /* ----- Login Form -----*/
 552 input#license {
 553         width: auto;
 554         }
 555 /* ----- Avatar Form -----*/
 556 form {
 557         clear: left;
 558 }
 559
 560 /* ----- OpenID Form -----*/
 561
 562 input#openid_url {
 563    background: url(login-bg.gif) no-repeat;
 564    background-color: #fff;
 565    background-position: 0 50%;
 566    color: #000;
 567    padding-left: 18px;
 568 }
 569
 570 /* ===== End Forms Styling ===== */
 571