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         position: relative;
 191         top: -130px;
 192         font-weight: normal;
 193         margin: -36px 0 0 0;
 194         padding: 10px;
 195         border: 1px solid #dec5b5;
 196         color: #fff6d5;
 197         }
 198 .success {
 199         background-color: #48705b;
 200         }
 201 .error {
 202         background-color: #ce3728;
 203         }
 204
 205
 206
 207 /* ----- Profile -----*/
 208 #profile {
 209         clear: left;
 210         margin: 0 -110px;
 211         padding: 10px 0 0 0;
 212         min-height: 170px;
 213         border-top: 1px solid #dec5b5;
 214         font-family: Georgia, "Times New Roman", Times, serif;
 215         }
 216 #profile h1 {
 217         margin: 0;
 218         padding: 0;
 219         font-family: Verdana, Arial, Helvetica, sans-serif;
 220         font-size: 14px;
 221         }
 222 #profile h2 {
 223         margin: 0;
 224         padding: 0;
 225         font-family: Verdana, Arial, Helvetica, sans-serif;
 226         font-size: 11px;
 227         text-transform: uppercase;
 228         color: #dab134;
 229         }
 230 #profile p {
 231         margin: 0 10px 0 0;
 232         font-size: 12px;
 233         line-height: 14px;
 234         }
 235 #profile p.location {
 236         margin: 0 10px 12px 0;
 237         font-style: italic;
 238         }
 239 #profile p.notice_current {
 240         font-size: 18px;
 241         line-height: 21px;
 242         /*min-height: 96px;*/
 243         }
 244
 245 #profile_avatar {
 246         float: left;
 247         margin-right: 4px;
 248         }
 249 #profile_avatar img {
 250         margin-bottom: 5px;
 251         }
 252 .avatar.profile {
 253         float: none;
 254         clear: left;
 255         margin: 0 10px 5px 0;
 256         }
 257 .avatar.original {
 258         margin: 0 10px 18px 0;
 259         }
 260 a.nickname {
 261         font-family: Verdana, Arial, Helvetica, sans-serif;
 262         font-weight: bold;
 263         font-size: 12px;
 264         padding-right: 3px;
 265         }
 266 #profile_information {
 267         float: left;
 268         position: relative;
 269         width: 270px;
 270         height: 200px;
 271         }
 272
 273 .statistics {
 274         margin-top: 18px;
 275         }
 276 .statistics h2 {
 277         margin: 12px 0 3px 0;
 278         }
 279 dl.statistics {
 280         margin: 0;
 281         font-size: 12px;
 282         line-height: 14px;
 283         }
 284 .statistics dt, .statistics dd {
 285         float: left;
 286         margin: 0;
 287         }
 288 .statistics dt {
 289         clear: left;
 290         width: 96px;
 291         }
 292 .statistics dd {
 293         clear: right;
 294         }
 295 .statistics dt:after {
 296         content: ":";
 297         }
 298 #subscriptions {
 299         float: left;
 300         margin: 18px 0 30px 0;
 301         }
 302 #subscriptions_avatars {
 303         /*float: left;*/
 304         margin: 6px 0 0 0;
 305         padding: 0;
 306         list-style-type: none;
 307         width: 270px;
 308         }
 309 #subscriptions_avatars li .avatar.mini {
 310         float: left;
 311         margin: 0 3px 3px 0;
 312         padding: 0;
 313         line-height: 0;
 314         }
 315 #subscriptions_viewall {
 316         clear: left;
 317         }
 318
 319 #notices {
 320         clear: both;
 321         margin: 0 auto;
 322         padding: 0;
 323         list-style-type: none;
 324         width: 540px;
 325         border-top: 1px solid #dec5b5;
 326         /*border: 1px solid #F00;*/
 327         }
 328 #notices a:hover {
 329         text-decoration: underline;
 330         }
 331 .notice_single {
 332         clear: both;
 333         display: block;
 334         margin: 0;
 335         padding: 5px 5px 5px 0;
 336         min-height: 48px;
 337         font-family: Georgia, "Times New Roman", Times, serif;
 338         font-size: 13px;
 339         line-height: 16px;
 340         border-bottom: 1px solid #dec5b5;
 341         }
 342 .notice_single:hover {
 343         background-color: #f7ebcc;
 344         }
 345 .notice_single p {
 346         display: inline;
 347         margin: 0;
 348         padding: 0;
 349         }
 350 .avatar {
 351         float: left;
 352         margin: 0 10px 0 0;
 353         }
 354
 355 p.time {
 356         display: block;
 357         font-family: Verdana, Arial, Helvetica, sans-serif;
 358         font-size: 10px;
 359         line-height: 15px;
 360         }
 361 p.time a {
 362         color: #dab134;
 363         }
 364
 365 #pagination {
 366         margin: 18px auto;
 367         width: 540px;
 368         }
 369 #nav_pagination {
 370         margin: 0 0 36px 0;
 371         padding: 0;
 372         float: right;
 373         list-style-type: none;
 374         font-size: 12px;
 375         font-weight: bold;
 376         }
 377 #nav_pagination li {
 378         display: block;
 379         float: left;
 380         background-color: #701238;
 381         }
 382 #nav_pagination li.before {
 383         margin-right: 1px;
 384         }
 385 #nav_pagination li a {
 386         padding: 6px 15px;
 387         line-height: 21px;
 388         background-color: #701238;
 389         color: #fff6d5;
 390         }
 391 #nav_pagination li a:hover {
 392         background-color: #3F606F;
 393         color: #fff6d5;
 394         text-decoration: none;
 395         }
 396
 397 #footer {
 398         clear: both;
 399         margin: 0 auto;
 400         padding: 0 0 36px 0;
 401         width: 540px;
 402         border-top: 1px solid #dec5b5;
 403         }
 404 #footer p {
 405         margin-top: 9px;
 406         }
 407 #cc {
 408         float: left;
 409         margin: 3px 10px 0 0;
 410         }
 411
 412 /* ===== Begin Forms Styling ===== */
 413
 414 /* ----- Forms General Style ----- */
 415 form {
 416         margin: 0 auto;
 417         padding: 0;
 418         }
 419 form {
 420         font-family: Verdana, Arial, Helvetica, sans-serif;
 421         font-size: 12px;
 422         }
 423 form label {
 424         display: block;
 425         font-size: 12px;
 426         font-weight: bold;
 427         line-height: 18px;
 428         }
 429 form input {
 430         border: 1px solid #dec5b5;
 431         width: 264px;
 432         }
 433 input#submit  {
 434         display: block;
 435         margin: 18px 0;
 436         padding: 4px;
 437         font-weight: bold;
 438         color: #fff6d5;
 439         background-color: #F60;
 440         cursor: pointer;
 441         border: 0;
 442         width: auto;
 443         }
 444 input#submit:hover {
 445         background-color: #701238;
 446         }
 447 textarea, input {
 448         font-family: Verdana, Arial, Helvetica, sans-serif;
 449         font-size: 12px;
 450         color: #701238;
 451         padding: 3px;
 452         }
 453 textarea:focus, input:focus {
 454         background-color: #f8ebc0;
 455         }
 456 textarea {
 457         width: 270px;
 458         border: 1px solid #D8E2D7;
 459         }
 460 .input_instructions {
 461         display: block;
 462         font-size: 11px;
 463         line-height: 21px;
 464         color: #924959;
 465         font-family: Verdana, Arial, Helvetica, sans-serif;
 466         }
 467
 468 /* ----- Status Form ----- */
 469 #status_form {
 470         height: 96px;
 471         /*background-color: #F00;*/
 472         }
 473 #status_form p {
 474         margin: 36px 0 0 0;
 475         padding: 0;
 476         }
 477 #status_label {
 478         display: block;
 479         clear: both;
 480         margin: 0;
 481         padding: 0 0 3px 0;
 482         font-size: 18px;
 483         font-weight: bold;
 484         line-height: 24px;
 485         /*color: #701238;*/
 486         color: #dab134;
 487         }
 488 #status_textarea {
 489         display: block;
 490         float: left;
 491         width: 463px;
 492         height: 35px;
 493         padding: 5px;
 494         font-family: Verdana, Arial, Helvetica, sans-serif;
 495         font-size: 12px;
 496         color: #701238;
 497         border: 0;
 498         }
 499 #status_submit {
 500         display: block;
 501         float: left;
 502         margin: 1px 0 0 4px;
 503         width: 63px;
 504         height: 45px;
 505         background-color: #F60;
 506         font-family: Verdana, Arial, Helvetica, sans-serif;
 507         font-weight: bold;
 508         font-size: 14px;
 509         color: #fff6d5;
 510         cursor: pointer;
 511         border: 0;
 512         }
 513 #status_submit:hover {
 514         background-color: #d1451a;
 515         }
 516
 517 /* ----- Subscribe Form ----- */
 518 #subscribe .button, #unsubscribe .button, #remotesubscribe .button {
 519         margin: 0;
 520         width: 96px;
 521         height: 27px;
 522         font-family: verdana, arial, helvetica, sans-serif;
 523         font-weight: bold;
 524         font-size: 10px;
 525         text-transform: uppercase;
 526         background-color: #F60;
 527         color: #fff6d5;
 528         border: 0;
 529         }
 530 #subscribe .button:hover, #unsubscribe .button:hover {
 531         background-color: #904632;
 532         cursor: pointer;
 533         }
 534 input#profile_url {
 535         width: 88px;
 536         padding: 3px;
 537         margin: 0 0 10px 0;
 538         }
 539 /* ----- Login Form -----*/
 540 input#license {
 541         width: auto;
 542         }
 543 /* ----- Avatar Form -----*/
 544 form {
 545         clear: left;
 546 }
 547
 548 /* ----- OpenID Form -----*/
 549
 550 input#openid_url {
 551    background: url(login-bg.gif) no-repeat;
 552    background-color: #fff;
 553    background-position: 0 50%;
 554    color: #000;
 555    padding-left: 18px;
 556 }
 557
 558 /* ===== End Forms Styling ===== */
 559