Change gallery arrow / SVG icon colour to appear on hover

Site URL: https://oboe-flute-k5m3.squarespace.com

Hi,

Would love some help with changing the colours of the left and right arrows on my simple gallery. 

Ideally so they appear on hover only, if this is possible. 

Before: #F2F0E8

Hover: #CCC7B7

URL: https://oboe-flute-k5m3.squarespace.com/seasonal-recipes/sydney-street

PW: BASIL

Any help or information would be very much appreciated!

Thanks,

Claudia 🙂
 

Add to Design > Custom CSS

/* Gallery arrows color */
.gallery-fullscreen-slideshow-control-btn svg, .gallery-slideshow-control-btn svg {
    stroke: red !important;
    stroke-width: 2px;
}

Also, do you want to fix these problems?

1. (Mobile) Want to remove Slideshow top/bottom padding

2. (Footer-Tablet) Increase right column text width?

3. (Tablet-Homepage) Reduce spacing?

4. (Mobile-Services) Remove line above How we work?