Aligning navigation in Five template

Site URL: http://www.toucan-electrical.co.uk

Hi there, is there a way to have the logo left aligned and the nav right aligned in the Five template? It currently looks so odd unless centered! Thanks!

Add to Design > Custom CSS

/* align logo nav */
.horizontal-navigation-bar.clear.with-logo {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: justify !important;
        -ms-flex-pack: justify !important;
            justify-content: space-between !important;
}
nav#main-navigation {
    margin-right: 0;
    padding-right: 0;
}

Thank you SO much you're a life saver! Please send me the link so I can pay you something 🙂