jsugp

I'm trying to remove or hide the custom bullet point from two areas on my website (site pw: team): 1) Calendar Block (/events) I only want to hide the logo bullet point in the hover box that appears when you hover over a date that has an event You can see the logo bullet point to the bottom left of the event title in the hover box I want to keep the logo bullet points displaying directly on the calendar for when there are multiple events (eg. June 19) 2) Accordion Block (/faqs) The logo bullet point shows on the upper left corner of each row of the accordion block and I'd like to hide or remove it The code used for the custom bullet point was: ul li:before{ content: ' '; display: inline-block; background-image: url(https://static1.squarespace.com/static/5601dac0e4b09de7ae50400c/t/5e0a70cf8b7f0f48e56721c3/1577742543701/UGP+Logo+No+Background.png); background-repeat: no-repeat; background-size: 18px; background-position: center; width: 18px; height: 18px; position: absolute; margin-left: -25px; margin-right: 0px; margin-top: 8px; margin-bottom: 0px; }

I am trying to remove or hide the custom bullet point from two areas on my page (teamugp.squarespace.com // pw: team): 1) Calendar Block (/events) I only want to hide the logo bullet point in the hover box that appears when you hover over a date that has an event You can see the logo bullet point to the bottom left of the event title in the hover box I want to keep the logo bullet points displaying directly on the calendar for when there are multiple events (eg. June 19) 2) FAQs (/faqs) The logo bullet point shows on the upper left corner of each row of the accordion block and I'd like to hide or remove it

Disregard my initial reply. I added this after my initial code and it works to show the full width of the image + the arrows. Now it's just missing the image titles. They should display on the center of the image (if you view on desktop, you'll see it).

This worked to show the arrows, but unfortunately it still crops the image 😞 Is there a way to show the arrows but also show the entire image instead of cropping it to fit mobile?

Hey Tuan, It's the top gallery of our home page: http://urbangolfperformance.com/

I want to edit our homepage gallery slideshow on mobile only so that it shows the max width without cropping the height or stretching the image. This is the code I tried using to show the full images in the gallery, but now it won't show the the navigation arrows on the sides nor the image descriptions (should be centered like how it is on the desktop). <STYLE> @media screen and (max-width:640px) { section#home-gallery img { width: 100% !important; left: 0 !important; height: auto !important; } section#home-gallery { height: 210px; } }</STYLE> *Note: I don't mind if the width of the images is cropped slightly. It just can't be cropped to the point of how it looks without any custom code. As long as you can read "Collin" and "UGP" on the first image in the gallery, that's fine with me.