Side by side arrows on carousel mobile and circle images?

Hi,

On my Sessions page, I am having trouble making arrows display on the side of a carousel rather than underneath it on mobile, I would also like to use a custom image for the arrows. I have managed to find code for this on the forums for this however I cannot change the arrows to something custom.

I think the custom code I found online has broken something on my half term camps page as the circle images reveal and then revert to being square? any help would be greatly appreciated as I am new to all of this.

Website link:
https://carnation-seal-5e4k.squarespace.com/

You can use this code to Website > Website Tools > Custom CSS

@media screen and (max-width:767px) {
	[class*="desktop-arrow"] {
		display: flex !important;
}
[class*="mobile-arrow"] {
display: none !important;
}
}

With change to custom image, which page are you referring to? I dont see carousel on homepage