Grab the snippet(s) you need. Adjust the values as you see fit.

Changing colors

CSS
/* ===== Strong Testimonials ===== */
/* ----- Default template ----- */

/* heading color */
.strong-view.default .testimonial-heading {
    color: red;
}

/* testimonial text color */
.strong-view.default .testimonial-content p {
    color: red;
}

/* custom fields color */
.strong-view.default .testimonial-client div {
    color: red;
}

/* custom fields link color */
.strong-view.default .testimonial-client a {
    color: red;
}

/* custom fields link hover color */
.strong-view.default .testimonial-client a:hover {
    color: blue;
}

/* read-more link color */
.strong-view.default a.readmore {
    color: red;
}

/* read-more link hover color */
.strong-view.default a.readmore:hover {
    color: blue;
}

Removing borders

CSS
/* ===== Strong Testimonials ===== */
/* ----- Default template ----- */

/* remove outer border */
.strong-view.default.slider-container .wpmslider-viewport {
    border: none !important;
}
.strong-view.default .testimonial {
    border: none;
}
/* remove inner border */
.strong-view.default .testimonial-inner {
    border: none;
}

The featured image

CSS
/* ===== Strong Testimonials ===== */
/* ----- Default template ----- */

/* ----- featured image ----- */

/* remove border */
.strong-view.default .testimonial-image img {
    border: none;
    padding: 0;
}

/* rounded corners */
/* barely rounded */
.strong-view.default .testimonial-image img {
    border-radius: 4px;
}
/* slightly rounded */
.strong-view.default .testimonial-image img {
    border-radius: 20px;
}
/* circle or oval depending on image's aspect ratio */
.strong-view.default .testimonial-image img {
    border-radius: 50%;
}

Centered text

CSS
/* ===== Strong Testimonials ===== */
/* ----- Default template ----- */

/* ----- centered -----  */

/* heading */
.strong-view.default .testimonial-heading {
    text-align: center;
}
/* content */
.strong-view.default .testimonial-inner {
    text-align: center;
}
/* If that doesn't work, try this instead: */
.strong-view.default .testimonial-content p {
    text-align: center;
}
/* custom fields */
.strong-view.default .testimonial-client {
    text-align: center;
}

The heading

CSS
/* ===== Strong Testimonials ===== */
/* ----- Default template ----- */

/* ----- heading ----- */

/* remove quote image (instead of using the No Quotes option) */
.strong-view.default .testimonial-heading {
    background: none;
    padding-left: 0;
}

/* increase font-size */
.strong-view.default .testimonial-heading {
    font-size: 2em;
}

/* increase height */
.strong-view.default .testimonial-heading {
    line-height: 3;
}

/* increase weight */
.strong-view.default .testimonial-heading {
    font-weight: 600;
}

/* when linked to full testimonial */
.strong-view.default .testimonial-heading a {
    color: red;
}
.strong-view.default .testimonial-heading a:hover {
    color: blue;
}

Background

CSS
/* ===== Strong Testimonials ===== */
/* ----- Default template ----- */

/* ----- background ----- */

/* color (instead of using the view setting) */
.strong-view.default .testimonial-inner {
    background: #EEE;
}

/* rounded corners */
/* barely rounded */
.strong-view.default .testimonial-inner {
    border-radius: 4px;
}
/* slightly rounded */
.strong-view.default .testimonial-inner {
    border-radius: 20px;
}

Other tweaks

CSS
/* ===== Strong Testimonials ===== */
/* ----- Default template ----- */

/* normal font weight on client name */
.strong-view.default .testimonial-name {
    font-weight: normal;
}

/* semi-bold font weight on client name */
.strong-view.default .testimonial-name {
    font-weight: 600;
}

/* italic custom fields */
.strong-view.default .testimonial-client {
    font-style: italic;
}

Isn't CSS fun!

CSS
/* ===== Strong Testimonials ===== */
/* ----- Default template ----- */

/* ----- FUN ----- */

.strong-view.default .testimonial-content p:first-letter {
    font-size: 1.5em;
    font-weight: bold;
    color: white;
    background: gray;
    border-radius: 1px;
    padding: 0 5px;
    margin-right: 1px;
}

Steps

  1. Where to put custom CSS code
  2. Take care of your code
  3. Get familiar with the elements
  4. Examples for the Default template — you are here
  5. More examples on the way
  6. Resources for information and inspiration