Hi,
Because the letter spacing of menu so can’t use border bottom for current state.
Please remove border bottom attribute
.jas-menu li > a:hover,
.jas-menu li.current-menu-ancestor > a,
.jas-menu li.current-menu-item > a,
.jas-account-menu a:hover,
.jas-action a:hover {
color: rgb(65, 14, 55) !important;
padding-bottom: 5px;
border-bottom: 3px solid rgb(65, 14, 55) !important;
text-align: left;
}
and add new code
.jas-menu li > a:before {
background-color: rgb(65, 14, 55);
top: 100%;
content: "";
height: 3px;
left: 0;
margin-left: 0;
position: absolute;
transition-duration: 0.2s;
width: 100%;
opacity: 0;
visiblity: hidden;
}
.jas-menu li:hover > a:before,
.jas-menu li.current-menu-ancestor > a:before,
.jas-menu li.current-menu-item > a:before {
opacity: 1;
visiblity: visible;
}
Best regards
Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio