Flatiron header issue

On the header of the Flatiron template there seems to be a spacer block on the right side. This causes my navigation buttons to stack one on top of the other on lower resolution screens. I would prefer that they stretch across the top for a little cleaner look. There is no way to just remove this block within the template settings so I am assuming that is embedded into the css for the template and I would like to modify the css on my site to resolve these issues. However, I would also like the mobile version to remain stacked for the navigation buttons. Is there anyone that can assist with this? I am not familiar enough with css to make these modifications myself. 

Also I have attached pictures to show what I am referring to. The first is my 4k monitor(this is how I would like the navigation buttons to look on all computer screens), the second is on my macbook pro where the third navigation button starts to stack(I do not want this on any computer screen, I want it stretching across the top as one line), the third is on a mobile screen and I want this to stay the same and ideally be the same on ipad and tablets as well(so far no issues with this).

Thank you!

Can you share link to your site?

www.jleonstudios.photo

Also thank you for that link but it did not have what I was looking for specifically. At least not that I was able to find.

4 hours ago, JLeonStudios said:

www.jleonstudios.photo

Also thank you for that link but it did not have what I was looking for specifically. At least not that I was able to find.

Add to Home > Design > Custom CSS (Logo is 35%)

ul#nav {
    float: none !important;
    max-width: 65% !important;
}

Thank you! This resolved my issues!