#header { width: 100%; height: $header-height-large; border-bottom: 1px solid rgba($dark-color, 0.2); @extend .default-animation; font-size: 0.7rem; font-weight: 700; background: $header-color; color: $light-color; position: fixed; top: 0; z-index: 2; a { color: rgba($light-color, 0.7); } a.active { color: $light-color !important; } .dropmenu ul ul a { color: rgba($light-color, 0.7); } .navbar-section { height: $header-height-large; @extend .default-animation; } .logo svg { width: 80px; display: inherit; @extend .default-animation; } .logo h1 { height: $header-height-large; line-height: $header-height-large; vertical-align: middle; margin: 0 0 0 0.5rem; white-space: nowrap; text-transform: uppercase; font-size: 1.75rem; a { color: $header-title !important; } @extend .default-animation; } } #header.scrolled { height: $header-height-small; .navbar-section { height: $header-height-small; } .logo svg { width: 45px; } ~ .mobile-menu .button_container { top: 0.5rem; } } .login-status-wrapper { white-space: nowrap; .icon { font-size: 120%; } }