These instructions assume you have either the JetPack plugin active with the Custom CSS module option turned on or our Themedy Toolbox plugin active (version 1.0.3 or higher).

Read more about adding the custom CSS feature here.


You can these CSS blocks to your Appearance -> Edit CSS screen (see steps above if you don't have this option)

Make sure to start adding your CSS code after the intro text as explained here.

1. Change Content / Header and / or Footer Background colors

body {background: #000;}

.site-header, #featured-area {background: #fff;}

#footer {
    background: #000;
    border-top: 1px solid #fff;

#featured-area, #featured-area a, #featured-area p, #featured-area h1, #featured-area h2, #featured-area h3, #featured-area h4, #featured-area h5, #featured-area h6, #featured-area ul, #featured-area ol, .site-title a {
    color: #000 !important;
    text-shadow: none;

.menu-primary a {color: #000;}

2. Change the featured slider image size

First you can change the default 500x300px size and regenerate your thumbnails easily with these steps and plugin. Assuming you changed it to 400x300px then you would add this CSS:

#featured-area #featured-slider {width: 430px;}
.flex-caption {width: 400px;}
.flex-caption-wrap {width: 200px;}

For full width you could do something like this:

#featured-area #featured-slider {width: 100%; background: none;}
#featured-slider .slide, .flex-caption-wrap {width: 100%;}
.flex-caption {width: 90%;}

The CSS may need to be increased or decreased depending on what size you actually pick.

3. Change the testimonial text and link colors

.testimonials-text p {color: #fff;}
.widget_woothemes_testimonials .url a {color: #000;}

4. Remove padding in footer

.footer-widgets .wrap {padding: 0px;}

5. Float featured images to the left in blog area

body {
    float: left; 
    margin: 0 20px 20px; 

body .post .entry-title { 
    clear: none;