Help with css – woocommerce elements

[ Moderator note: moved to Fixing WordPress. Please do not use Developing With WordPress for these topics. ]

Hi,

I am on a css learning curve.
Could someone please assist me with css code that could manage the following items (I have taken a screenshot of existing code in Chrome ‘Inspect’, some am hopeful that when new css code is added I will have an idea how to frame more css code).

URL to the page I am working on (Woocommerce elements in Elementor page template):
https://www.storeit4less.co.nz/?page_id=487

Element I would like css for:
Woocommerce top rated products
Item
– Product title (Sikuro security padlock)
– css to move product title from right side of image to below the image
– css to change the title font color/hover color

Element I would like css for:
Woocommerce product search
Item
– ‘Search’ button
– css to change the button text font and background colour
– css to add hover elements
Item – ‘search products ‘textarea box’
– css to adjust textarea box height/length
– css to add textarea radius
– css to change font and color of ‘search products’ text in text area box

Any help would be hugely appreciated!
Thank you
Tim