How to make gallery pages full width of browser in Charlotte template

Site URL: http://www.jennharrington.com

Hello, I'm trying to have my gallery pages span the full width of the browser. I'm on 7.0 and using the Charlotte template.

It does appear to fill the full width on some small screens/when I reduce the size of the browser,  but on my 27" monitor it's about 50% white space, and I'd like for the images to be full width regardless of screen/browser size.

Attached you can see the amount of white space in different browser sizes.

Is there any way to do it via CSS? It's not an option in the Site Styles page.

Add to Design > Custom CSS > Then save & reload the site

body.homepage main#page {
    max-width: 100% !important;
}

10 hours ago, tuanphan said:

Add to Design > Custom CSS > Then save & reload the site

body.homepage main#page {
    max-width: 100% !important;
}

 

Thanks @tuanphan, this worked for the homepage. Is there a way to apply it to all gallery pages, not just the homepage?

Did some guesswork with the code provided and added this to Custom CSS and it seems to be working:

body.collection-type-gallery main#page {
    max-width: 100% !important;
}