:root { --menu-bar-width: 83px; } .menu-bar { background-color: $color-white; .scroll-wrapper { height: 100%; padding-top: 16px; width: var(--menu-bar-width); overflow-x: hidden; } ul.nav > li { & > a, & > span { @include font-small; color: $color-volcano; display: grid; margin-left: auto; margin-right: auto; padding: 10px 0; text-align: center; word-break: normal; .fas { font-size: 18px; padding-bottom: 5px; } } &.active { @include box-shadow(-4px 0 0 $brand-primary); background-color: $color-gainsboro; margin-left: 4px; & > a { color: $color-emperor; } } &.disabled { box-shadow: none; cursor: not-allowed; opacity: .65; } } ul.nav-bottom { bottom: 0; padding-bottom: 16px; position: fixed; width: inherit; } .dropup { .dropdown-menu { bottom: 0; left: 99%; margin-bottom: 0; & > li > a { padding: 8px 38px; } } &.open > a { color: $color-emperor; } .about-scinote { font-size: 12px; .core-version { color: $color-silver-chalice; } } } #knowledge-center-link { .fas { margin-left: -26px; padding: 3px; position: absolute } } } @media(max-height:510px) { .menu-bar .nav-bottom { position: relative; width: auto; } } .all-teams-navigation-link { color: $brand-primary !important; }