Remove Gray Background Around Gallery Block/Change Image Title Font Size/

Site URL: http://www.frankmeuschke.com

Hi,

Got some help regarding various Gallery Block issues, but three things remain to be solved. I'm hoping for some CSS help on the below:

• There is a light gray fill around some or most images in the Gallery Block. I'd like that to disappear, if possible.
• I'd also like to shrink the font of the title of each image.
• I'd like the image change arrows to disappear when not hovering over image.

Thank you!

On 1/25/2022 at 3:21 AM, tuanphan said:

Add to Design > Custom CSS

/* gallery block gray color */
.slide, .sqs-gallery, .gallery-block {
    background-color: white;
}
/* gallery caption */
.meta-title {
    font-size: 14px !important;
}
/* Show hide arrows */
a.previous, a.next {
    visibility: hidden;
}

.gallery-block:hover a.previous, .gallery-block:hover a.next {
    visibility: visible;
}

 

Thank you -will give it a try now.

On 1/25/2022 at 3:21 AM, tuanphan said:

Add to Design > Custom CSS

/* gallery block gray color */
.slide, .sqs-gallery, .gallery-block {
    background-color: white;
}
/* gallery caption */
.meta-title {
    font-size: 14px !important;
}
/* Show hide arrows */
a.previous, a.next {
    visibility: hidden;
}

.gallery-block:hover a.previous, .gallery-block:hover a.next {
    visibility: visible;
}

 

Works great -thank you! Just one remaining thing -although 90% pf the gray is gone, there is still a light gray band at the bottom of the images in the gallery block. See attached.

On 1/27/2022 at 7:14 AM, Frank_Mound said:

Works great -thank you! Just one remaining thing -although 90% pf the gray is gone, there is still a light gray band at the bottom of the images in the gallery block. See attached.

Add this CSS (don't remove above CSS)

.sqs-gallery-block-slideshow {
    background-color: white;
}

6 hours ago, tuanphan said:

Add this CSS (don't remove above CSS)

.sqs-gallery-block-slideshow {
    background-color: white;
}

 

Wonderful! You're a savior. Curious about how CSS works since this new set of lines nearly repeats the previous CSS line below:

/* gallery block gray color */
.slide, .sqs-gallery, .gallery-block {
    background-color: white;