Underline on top navigation when on the page

How do I get an underline underneath the name of the link of the page I'm on, and have it stay that way when I'm on the page?

Link to page: https://lauraengeldesigns.com

@LauraAmber Add to Home > Design > Custom CSS

.Header-nav-item--active:after {
   background: #bb7939;
   height: 2px;
   width: 100px;
}

I already have this code, see below (that underlines the link on hover) :

//Header Navigation.Header-nav-item::after { content: ''; background: #BB7939; height: 4px; width: 0%; display: block; margin-top: 3px !important; transition: width 1s;

}

And when I include the code you gave me, it underlines all of the links at the top. I just want it to underline the link of the current page you are looking at.

Similar to this website:

https://kaye.hu/ett/isreadytochat

Similar to this page:

https://kaye.hu/ett/isreadytochat

@LauraAmber Looks good here. Screenshot: https://prnt.sc/p0i72t

I too want to know more about this you explained in a detailed way. Thanks for sharing this to us. Get more about divxcrawler tv here.