Use CSS like this in your Global Header file:

div.w-navlist.nav-wrap {
    background: rgba(255,255,255,0.0);
}

If you want it to have a semi-transparent behavior on-scroll ie when the user scrolls down you may want to increase the opacity or chage the background entirely use some jQuery like this and accompanying CSS (remember to place the jQuery in your global footer & use script tags):

CSS for controlling Nav bar background on scroll

div.w-navlist.nav-wrap.transparent-background {
    background: rgba(255,255,255,0.75);
}

Place this jQuery in your Global Footer

<script>
jQuery(window).scroll(function(){
    if (jQuery(this).scrollTop() > 50) {
       jQuery('.w-navlist').addClass('transparent-background');//adds a new class when scrolled 50px or more
    } else {
       jQuery('.w-navlist').removeClass('transparent-background');//removes the class when nav bar is less than 50px from top
    }
});
</script>