Changing container size

The home page logo is enclosed by a paragraph tag with an inline style:

<p style="text-align: center;">

Whereas all of the other logos are enclosed by <h1> tags. I would change the home page logo to make it more consistent, then the CSS rule would affect it the same way as the other pages.

Bingo! Thanks again.

So, I changed the logo to be more consistent, which now shows the header logo as full as requested.

For some reason it is not carrying over to the mobile version of the site.

Why would that be?

Viewed on a mobile the header logo has white space to the sides of it?

Also regarding the custom css I have this error in Google PageSpeed Insights for load time (https://developers.google.com/speed/pagespeed/insights/):

82 / 100 Speed
Consider Fixing:
Eliminate render-blocking JavaScript and CSS in above-the-fold content
Your page has 1 blocking CSS resources. This causes a delay in rendering your page.
None of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.
Optimize CSS Delivery of the following:

https://investmentpropertyquotes.com.au/?action=display_custom_css_code

Does this mean that the custom css manager needs optimising?
I need the custom css to run first, but that slows me down right?

What is the other way to do this if I don’t use the custom css route – as it seems to be slowing things down considerably due to parsing of java script before the page loads.

Adwords will be extremely important to my site – so page load time is priority.

Can we somehow put the custom css code below into the coding rather than using custom css?:

.row {
max-width: 38.25em;
}
#footer a:hover {
color: #000000;
}
.entry-content > * {
padding: 0 30px;
}
.entry-content h1,
.entry-content h1 * {
padding: 0;
}