Help with custom HTML/CSS

Hello,

I have a theme (Business Logistic by CMS Masters) that has a custom header feature where I’ve input the following so I can have a telephone number displayed in the header

<div class="cmsmasters-icon"-phone-4">
    <span>
        <span>Call Us Anytime</span>
        <a href="tel:0800-689-0150"><strong> 0800 689 0150</strong></a>
    </span>

The HTML appears fine on the site and I have tried styling this with the below CSS versions :

.cmsmasters-icon-phone-4 span a strong { font-size: 20rem;}

!important .cmsmasters-icon-phone-4 span a strong { font-size: 20px !important;}

but I could not make it to change the font size. I’ve tried inspecting the element and I could see it is being overriden by

.header_mid .slogan_wrap .slogan_wrap_text strong { font-family: 'Roboto Condensed', Arial, Helvetica, 'Nimbus Sans L', sans-serif; font-size: 13px; line-height: 18px; font-weight: 700; font-style: normal; text-transform: uppercase; text-decoration: none;

Is there anyway I can override this and only increase font of the telephone number?

The page I need help with: [log in to see the link]