$header-height: 6rem; .site-header { background: $background; color: white; height: $header-height; } .site-header__content { height: 100%; display: flex; justify-content: space-between; align-items: center; } .site-header__nav { a { color: white; text-decoration: none; } a:hover { opacity: 0.8; text-decoration: underline; } } .site-header__title { height: 100%; } .site-header__logo { width: $header-height; height: 100%; } @media (max-width: $md-breakpoint) { .site-header .page-container { width: 100% !important; } .site-header__title { padding-right: 1rem; } .site-header__nav { line-height: 2rem; } }