CSS Mystery - Sections are styled differently

[colleenc]

I have two sections that I can’t seem to match the styling on. I have been struggling to make changes to the CSS using both CSS in the sections on the home page as well as making global changes via base.css. I just can’t seem to get the styling to match. The two sections are coded differently, and that may be contributing to the issue.

Issues:

Vendor Names are at different opacity

On mobile the two sections render the “Buy Now” button differently

Line heights are different

Site: https://scent-lodge.myshopify.com/

Password: hello

I think I have been fiddling with this for too long and I am getting frustrated with my results - and I am worried I am going to throw of the styling in other parts of the site. Any help would be gratefully received. 

[colleenc · Accepted solution]

I solved the issue by rebuilding one of the sections and modifying the custom css in that section. Everything matches now - but I shouldn’t have needed the custom css modifier. Can’t understand why the two sections were reacting differently to the same css.