Hi there!

Thanks for your query.

Please use the following code in your custom CSS:

.lassons-home-slider.sp-slider .sp-slider-content-align-left:after{
    background-color: deeppink;
}

Note: Path towards custom CSS(Joomla 3): Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

Best Regards

and how do I make the text stay inside the circle

You can check with lower font size I think. Can I have your admin access to check?

for the mobile the rest I solved it