[Summary view] [Print] [Text view]

   1  /*
   2      A dark color scheme for Twenty Eleven
   3  */
   4  
   5  /* =Global
   6  ----------------------------------------------- */
   7  
   8  body {
   9      background: #1d1d1d;
  10      color: #bbb;
  11  }
  12  #page {
  13      background: #0f0f0f;
  14  }
  15  
  16  /* Headings */
  17  hr {
  18      background-color: #333;
  19  }
  20  
  21  /* Text elements */
  22  blockquote cite {
  23      color: #999;
  24  }
  25  pre {
  26      background: #0b0b0b;
  27  }
  28  code, kbd {
  29      font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
  30  }
  31  abbr, acronym, dfn {
  32      border-bottom: 1px dotted #999;
  33  }
  34  ins {
  35      background: #00063f;
  36  }
  37  input[type=text],
  38  input[type=password],
  39  input[type=email],
  40  input[type=url],
  41  input[type=number],
  42  textarea {
  43      border: 1px solid #222;
  44  }
  45  input#s {
  46      background-color: #ddd;
  47  }
  48  
  49  /* Links */
  50  a {
  51  }
  52  
  53  
  54  /* =Header
  55  ----------------------------------------------- */
  56  
  57  #branding {
  58      border-top: 2px solid #0a0a0a;
  59  }
  60  #site-title a {
  61      color: #eee;
  62  }
  63  #site-title a:hover,
  64  #site-title a:focus,
  65  #site-title a:active {
  66  }
  67  #site-description {
  68      color: #858585;
  69  }
  70  #branding #s {
  71      background-color: #ddd;
  72  }
  73  
  74  
  75  /* =Menu
  76  ----------------------------------------------- */
  77  
  78  #access {
  79      background: #333; /* Show a solid color for older browsers */
  80      background: -moz-linear-gradient(#383838, #272727);
  81      background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#383838), to(#272727)); /* older webkit syntax */
  82      background: -webkit-linear-gradient(#383838, #272727);
  83      border-bottom: 1px solid #222;
  84  }
  85  
  86  /* =Content
  87  ----------------------------------------------- */
  88  
  89  .page-title {
  90      color: #ccc;
  91  }
  92  .hentry {
  93      border-color: #222;
  94  }
  95  .entry-title {
  96      color: #ddd;
  97  }
  98  .entry-title,
  99  .entry-title a {
 100      color: #ddd;
 101  }
 102  .entry-title a:hover,
 103  .entry-title a:focus,
 104  .entry-title a:active {
 105  }
 106  .entry-meta {
 107      color: #999;
 108  }
 109  .entry-content h1,
 110  .entry-content h2,
 111  .comment-content h1,
 112  .comment-content h2 {
 113      color: #fff;
 114  }
 115  .entry-content table,
 116  .comment-content table {
 117      border-color: #222;
 118  }
 119  .entry-content th,
 120  .comment-content th {
 121      color: #999;
 122  }
 123  .entry-content td,
 124  .comment-content td {
 125      border-color: #222;
 126  }
 127  .page-link {
 128  }
 129  .page-link a {
 130      background: #242424;
 131      color: #bbb;
 132  }
 133  .page-link a:hover {
 134      background: #999;
 135      color: #000;
 136  }
 137  .entry-meta .edit-link a {
 138      background: #242424;
 139      color: #bbb;
 140  }
 141  .entry-meta .edit-link a:hover,
 142  .entry-meta .edit-link a:focus,
 143  .entry-meta .edit-link a:active {
 144      background: #999;
 145      color: #000;
 146  }
 147  
 148  /* Images */
 149  .wp-caption {
 150      background: #2c2c2c;
 151  }
 152  .wp-caption .wp-caption-text {
 153      color: #999;
 154  }
 155  .wp-caption .wp-caption-text:before {
 156      color: #999;
 157  }
 158  
 159  /* Image borders */
 160  img[class*="wp-image-"],
 161  #content .gallery .gallery-icon img {
 162      border-color: #2c2c2c;
 163  }
 164  .wp-caption img {
 165      border-color: #2c2c2c;
 166  }
 167  a:focus img[class*="wp-image-"],
 168  a:hover img[class*="wp-image-"],
 169  a:active img[class*="wp-image-"] {
 170      background: #2c2c2c;
 171      border-color: #444;
 172  }
 173  .wp-caption a:focus img,
 174  .wp-caption a:active img,
 175  .wp-caption a:hover img {
 176      background: #0f0f0f;
 177      border-color: #2c2c2c;
 178  }
 179  
 180  /* Password Protected Posts */
 181  .post-password-required input[type=password] {
 182      background: #ddd;
 183  }
 184  .post-password-required input[type=password]:focus {
 185      background: #fff;
 186  }
 187  
 188  /* Author Info */
 189  .singular #author-info {
 190      background: #060606;
 191      border-color: #222;
 192  }
 193  .archive #author-info {
 194      border-color: #222;
 195  }
 196  #author-avatar img {
 197      background: #000;
 198      -webkit-box-shadow: 0 1px 2px #444;
 199      -moz-box-shadow: 0 1px 2px #444;
 200      box-shadow: 0 1px 2px #444;
 201  }
 202  #author-description h2 {
 203      color: #fff;
 204  }
 205  
 206  /* Comments link */
 207  .entry-header .comments-link a {
 208      background: #282828 url(../images/comment-bubble-dark.png) no-repeat;
 209      border-color: #222;
 210      color: #888;
 211  }
 212  
 213  .rtl .entry-header .comments-link a {
 214      background-image: url(../images/comment-bubble-dark-rtl.png);
 215  }
 216  /* Singular content styles for Posts and Pages */
 217  .singular .entry-title {
 218      color: #fff;
 219  }
 220  
 221  
 222  /* =Status
 223  ----------------------------------------------- */
 224  
 225  .format-status img.avatar {
 226      -webkit-box-shadow: 0 1px 2px #333;
 227      -moz-box-shadow: 0 1px 2px #333;
 228      box-shadow: 0 1px 2px #333;
 229  }
 230  
 231  
 232  /* =Quote
 233  ----------------------------------------------- */
 234  
 235  .format-quote blockquote {
 236      color: #aaa;
 237  }
 238  
 239  
 240  /* =Image
 241  ----------------------------------------------- */
 242  
 243  .indexed.format-image .wp-caption {
 244      background: #242424;
 245  }
 246  .indexed.format-image .entry-meta .edit-link a {
 247      color: #ddd;
 248  }
 249  .indexed.format-image .entry-meta .edit-link a:hover {
 250      color: #fff;
 251  }
 252  
 253  
 254  /* =error404
 255  ----------------------------------------------- */
 256  .error404 #main #searchform {
 257      background: #060606;
 258      border-color: #222;
 259  }
 260  
 261  
 262  /* =Showcase
 263  ----------------------------------------------- */
 264  
 265  h1.showcase-heading {
 266      color: #ccc;
 267  }
 268  
 269  /* Intro */
 270  article.intro {
 271      background: #060606;
 272  }
 273  article.intro .entry-content {
 274      color: #eee;
 275  }
 276  article.intro .edit-link a {
 277      background: #555;
 278      color: #000;
 279  }
 280  article.intro .edit-link a:hover {
 281      background: #888;
 282  }
 283  
 284  /* Featured post */
 285  section.featured-post .hentry {
 286      color: #999;
 287  }
 288  
 289  /* Small featured post */
 290  section.featured-post .attachment-small-feature {
 291      border-color: #444;
 292  }
 293  section.featured-post .attachment-small-feature:hover {
 294      border-color: #777;
 295  }
 296  article.feature-image.small .entry-summary {
 297      color: #aaa;
 298  }
 299  article.feature-image.small .entry-summary p a {
 300      background: #ddd;
 301      color: #111;
 302  }
 303  article.feature-image.small .entry-summary p a:hover {
 304      color: #40220c;
 305  }
 306  
 307  /* Large featured post */
 308  article.feature-image.large .entry-title a {
 309      background: #ddd;
 310      background: rgba(0,0,0,0.8);
 311      color: #fff;
 312  }
 313  section.feature-image.large:hover .entry-title a,
 314  section.feature-image.large .entry-title:hover a {
 315      background: #111;
 316      background: rgba(255,255,255,0.8);
 317      color: #000;
 318  }
 319  section.feature-image.large img {
 320      border-bottom: 1px solid #222;
 321  }
 322  
 323  /* Featured Slider */
 324  .featured-posts {
 325      border-color: #222;
 326  }
 327  .featured-posts section.featured-post {
 328      background: #000;
 329  }
 330  .featured-post .feature-text:after,
 331  .featured-post .feature-image.small:after {
 332      background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */
 333      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */
 334      background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
 335      background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Opera11.10+ */
 336      background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* IE10+ */
 337      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
 338      background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* W3C */
 339  }
 340  .feature-slider a {
 341      background: #c3c3c3;
 342      background: rgba(60,60,60,0.9);
 343      -webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
 344      -moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
 345      box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
 346  }
 347  .feature-slider a.active {
 348      background: #000;
 349      background: rgba(255,255,255,0.8);
 350      -webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
 351      -moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
 352      box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
 353  }
 354  
 355  /* Recent Posts */
 356  section.recent-posts .other-recent-posts {
 357      border-color: #222;
 358  }
 359  section.recent-posts .other-recent-posts .entry-title {
 360      border-color: #222;
 361  }
 362  section.recent-posts .other-recent-posts a[rel="bookmark"] {
 363      color: #ccc;
 364  }
 365  section.recent-posts .other-recent-posts a[rel="bookmark"]:hover {
 366  }
 367  section.recent-posts .other-recent-posts .comments-link a,
 368  section.recent-posts .other-recent-posts .comments-link > span {
 369      border-color: #959595;
 370      color: #bbb;
 371  }
 372  section.recent-posts .other-recent-posts .comments-link > span {
 373      border-color: #444;
 374      color: #777;
 375  }
 376  section.recent-posts .other-recent-posts .comments-link a:hover {
 377  }
 378  
 379  
 380  /* =Attachments
 381  ----------------------------------------------- */
 382  
 383  .image-attachment div.attachment {
 384      background: #060606;
 385      border-color: #222;
 386  }
 387  .image-attachment div.attachment a img {
 388      border-color: #060606;
 389  }
 390  .image-attachment div.attachment a:focus img,
 391  .image-attachment div.attachment a:hover img,
 392  .image-attachment div.attachment a:active img {
 393      border-color: #2c2c2c;
 394      background: #0f0f0f;
 395  }
 396  
 397  
 398  /* =Widgets
 399  ----------------------------------------------- */
 400  
 401  .widget-title {
 402      color: #ccc;
 403  }
 404  .widget ul li {
 405      color: #888;
 406  }
 407  
 408  /* Search Widget */
 409  .widget_search #searchsubmit {
 410      background: #222;
 411      border-color: #333;
 412      -webkit-box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
 413      -moz-box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
 414      box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
 415      color: #777;
 416  }
 417  .widget_search #searchsubmit:active {
 418      -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
 419      -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
 420      box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
 421      color: #40220c;
 422  }
 423  
 424  /* Calendar Widget */
 425  .widget_calendar #wp-calendar {
 426      color: #aaa;
 427  }
 428  .widget_calendar #wp-calendar th {
 429      background: #0b0b0b;
 430      border-color: #333;
 431  }
 432  .widget_calendar #wp-calendar tfoot td {
 433      background: #0b0b0b;
 434      border-color: #333;
 435  }
 436  
 437  
 438  /* =Comments
 439  ----------------------------------------------- */
 440  
 441  #comments-title {
 442      color: #bbb;
 443  }
 444  .nocomments {
 445      color: #555;
 446  }
 447  .commentlist > li.comment {
 448      background: #090909;
 449      border-color: #222;
 450  }
 451  .commentlist .children li.comment {
 452      background: #000;
 453      border-color: #222;
 454  }
 455  .rtl .commentlist .children li.comment {
 456      border-color: #222;
 457  }
 458  .comment-meta {
 459      color: #999;
 460  }
 461  .commentlist .avatar {
 462      -webkit-box-shadow: 0 1px 2px #222;
 463      -moz-box-shadow: 0 1px 2px #222;
 464      box-shadow: 0 1px 2px #222;
 465  }
 466  a.comment-reply-link {
 467      background: #242424;
 468      color: #bbb;
 469  }
 470  li.bypostauthor a.comment-reply-link {
 471      background: #111;
 472  }
 473  a.comment-reply-link:hover,
 474  a.comment-reply-link:focus,
 475  a.comment-reply-link:active,
 476  li.bypostauthor a.comment-reply-link:hover,
 477  li.bypostauthor a.comment-reply-link:focus,
 478  li.bypostauthor a.comment-reply-link:active {
 479      background: #999;
 480      color: #000;
 481  }
 482  .commentlist > li:before {
 483      content: url(../images/comment-arrow-dark.png);
 484  }
 485  .rtl .commentlist > li:before {
 486      content: url(../images/comment-arrow-dark-rtl.png);
 487  }
 488  
 489  /* Post author highlighting */
 490  .commentlist > li.bypostauthor {
 491      background: #222;
 492      border-color: #2c2c2c;
 493  }
 494  .commentlist > li.bypostauthor:before {
 495      content: url(../images/comment-arrow-bypostauthor-dark.png);
 496  }
 497  .rtl .commentlist > li.bypostauthor:before {
 498      content: url(../images/comment-arrow-bypostauthor-dark-rtl.png);
 499  }
 500  
 501  /* Post Author threaded comments */
 502  .commentlist .children > li.bypostauthor {
 503      background: #222;
 504      border-color: #2c2c2c;
 505  }
 506  .commentlist > li.bypostauthor .comment-meta {
 507      color: #a8a8a8;
 508  }
 509  
 510  /* Comment Form */
 511  #respond {
 512      background: #222;
 513      border-color: #2c2c2c;
 514  }
 515  #respond input[type="text"],
 516  #respond textarea {
 517      background: #000;
 518      border: 4px solid #111;
 519      -webkit-box-shadow: inset 0 1px 3px rgba(51,51,51,0.95);
 520      -moz-box-shadow: inset 0 1px 3px rgba(51,51,51,0.95);
 521      box-shadow: inset 0 1px 3px rgba(51,51,51,0.95);
 522      color: #bbb;
 523  }
 524  #respond .comment-form-author label,
 525  #respond .comment-form-email label,
 526  #respond .comment-form-url label,
 527  #respond .comment-form-comment label {
 528      background: #111;
 529      -webkit-box-shadow: 1px 2px 2px rgba(51,51,51,0.8);
 530      -moz-box-shadow: 1px 2px 2px rgba(51,51,51,0.8);
 531      box-shadow: 1px 1px 2px rgba(51,51,51,0.8);
 532      color: #aaa;
 533  }
 534  .rtl #respond .comment-form-author label,
 535  .rtl #respond .comment-form-email label,
 536  .rtl #respond .comment-form-url label,
 537  .rtl #respond .comment-form-comment label {
 538      -webkit-box-shadow: -1px 2px 2px rgba(51,51,51,0.8);
 539      -moz-box-shadow: -1px 2px 2px rgba(51,51,51,0.8);
 540      box-shadow: -1px 1px 2px rgba(51,51,51,0.8);
 541  }
 542  #respond .comment-form-author .required,
 543  #respond .comment-form-email .required {
 544      color: #42caff;
 545  }
 546  #respond input#submit {
 547      background: #ddd;
 548      -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
 549      -moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
 550      box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
 551      color: #111;
 552      text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
 553  }
 554  #respond input#submit:active {
 555      color: #40220c;
 556  }
 557  #respond #cancel-comment-reply-link {
 558      color: #999;
 559  }
 560  #reply-title {
 561      color: #ccc;
 562  }
 563  #cancel-comment-reply-link {
 564      color: #777;
 565  }
 566  #cancel-comment-reply-link:focus,
 567  #cancel-comment-reply-link:active,
 568  #cancel-comment-reply-link:hover {
 569      color: #00b4cc;
 570  }
 571  
 572  
 573  /* =Footer
 574  ----------------------------------------------- */
 575  
 576  #supplementary {
 577      border-color: #222;
 578  }
 579  
 580  /* Site Generator Line */
 581  #site-generator {
 582      background: #060606;
 583      border-color: #000;
 584  }
 585  
 586  
 587  /* =Print
 588  ----------------------------------------------- */
 589  
 590  @media print {
 591      body {
 592          color: #333;
 593          background: none !important;
 594      }
 595      #page {
 596          background: none !important;
 597      }
 598  
 599      /* Comments */
 600      .commentlist > li.comment {
 601      }
 602  
 603      /* Post author highlighting */
 604      .commentlist > li.bypostauthor {
 605          color: #333;
 606      }
 607      .commentlist > li.bypostauthor .comment-meta {
 608          color: #959595;
 609      }
 610      .commentlist > li:before {
 611          content: none !important;
 612      }
 613  
 614      /* Post Author threaded comments */
 615      .commentlist .children > li.bypostauthor {
 616          background: #fff;
 617          border-color: #ddd;
 618      }
 619      .commentlist .children > li.bypostauthor > article,
 620      .commentlist .children > li.bypostauthor > article .comment-meta {
 621          color: #959595;
 622      }
 623  }