.menu { } .menu__link { display: inline-block; padding: $spacer } .menu__logo { display: block; svg { fill: #fff } } // // Main menu overlaying a dark background image // in front page hero or page headers // .menu--main { position: absolute;; left: 0; right: 0; top: 0; width: 100%; z-index: 2; border-bottom: 1px solid rgba(#fff, .2); height: 60px; .menu__link { color: #fff; opacity: .8; &:hover, &:focus { opacity: 1 } } } .menu--footer { @extend .text-center; }