Small grid lines on Image Slider

Hey Yall,

So I am using the image slider on a site I am designing for a friend and I love the look and this modules simplicity... however, my clients are noticing that when the image is viewed in a mobile format and shrunken to that size, there are grid lines all
over... well, they love the slider, but want clean views of their images.... can someone perhaps explain how this can be avoided or let me know if there is another option...? Also, I would like to change the font and color of the title text, and the colors of the blocks for titles, if possible?

..and here is the site: www.rollingnectar.com

Thanks,

Charles

Hi

First css to change header:

Code: Select all

.gkIsWrapper-gk_game figcaption h2 {
    color: #fff;
    font-family: Times New Roman;
    font-size: 86px;
}


now text

Code: Select all

.gkIsWrapper-gk_game figcaption p,
.gkIsWrapper-gk_game figcaption a {
    color: #fff;
}


About slider. It does not fit the size to the height of image. It has a static height, it may not be the best style here. Please try a different one.

But if You decide to keep it try if You like if image is resized to cover the available space (by cutting some of the image).

Code: Select all

#gkIs-gk-is-94.gkIsWrapper-gk_game .gkIsSlide {
    background-size: cover;
}


Thanks so much!

Sorry, this must sound stupid, but where do I put that coding?

Please add this code to override.css and make sure override is enabled in template settings.