Styling issues after moving switcher into header.

Hello everyone,

I have a few styling issues with my two language flags and I wonder if anyone could give me some advice?

1. I have used this tag in header.php :
<ul><?php pll_the_languages(array('show_flags'=>1,'show_names'=>0)); ?></ul>
The language flags are now displaying at the top left of the header. I would like to add a bit of space between the flags as they are too close together, and I would like to move them to the center of the page. Could anyone let me know how to do this?

2. I have used the following custom CSS to remove the bullet points:

.lang-item {
    list-style: none;
}

Initially, when the page begins to load, you can see the bullet points. I figure this is because the custom CSS is applied after the header loads. I know it’s only a small thing, but is there any way to make sure that the bullet points are never seen? (I’m using Customify theme, if this is useful to know).

3. There is now too much white space below my 32px flag images – the site logo is now further down the page than it need be. How can I reduce the amount of space below the flags?

I would be very grateful for any help 🙂

Claire