a { color: black; text-decoration: none; } [v-cloak] { display: none !important; } //HeaderNav.scss .HeaderNav { //margin-right: 10%; .HeaderNav-container { display: flex; justify-content: space-between; align-items: center; .nav-active { display: flex; align-items: center; span { color: black !important; } // padding: 60px 30px !important; } .HeaderNav-navItems { padding: 0 25px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 600; // color: rgb(198, 198, 198); color: black; position: relative; transition: 0.4s; &::before { content: ''; width: 0; height: 3px; background: var(--rootColor); position: absolute; bottom: -10px; text-align: center; margin: 15px 0 auto; transition: 0.3s; } &:hover{ &::before { width: 70%; } } .HeaderNav-navItems-child-box { background: #ffffff; position: absolute; left: -20px; top: 40px; border-radius: 5px; z-index: 9999999999999999; min-width: 190px; .HeaderNav-navItems-child-items { padding: 10px 40px; word-break: keep-all; &:hover { a { color: var(--rootColor) !important; } } } } } } }