CSS Conflict with Woo Commerce

Hi,

I am currently trying to build my first shop with Enfold and Woocommerce.

I am running into a slight issue, which could be down to my lack of experience.

I am trying to change the size of the info which sits above the header – the phone number and shop menu/cart etc.
I’m using the following CSS, which is causing the images, and tabbed info on product to not display. The info is too small by default, so I’d like it to be bigger. I copied some CSS, whilst it works, it’s giving me problems.

#top #header_meta a, #top #header_meta li, #top #header_meta .phone-info { font-weight: 400!important; text-transform: uppercase!important; font-size: 14px;}

@media only screen and (max-width: 767px) {
 #top #header_meta a, #top #header_meta li, #top #header_meta .phone-info { font-weight: 400!important; text-transform: uppercase!important; font-size: 10px;}
}

I think it’s this, because when I delete it and refresh the page, the info comes back.

Can someone please help?
Thanks!

• This topic was modified 6 years, 3 months ago by jonrouse.