Header opacity darkens during naviation

I’m trying to add an opacity to my header bar, but I’ve noticed that during the standard navigation animation my header bars are stacking up, doubling the opacity which darkens everything. Changing the nav-bar-transition="none" fixes the stacking, but kills the nice animation. Any ideas?