theme/stoica/display.css

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