Hi Petro,

Can you please share your site credentials here, because we need to login to your site and see this issue live. Your information is safe (private) in this thread.

To include your credentials click Insert Credentials button in editor toolbar. (See how)

Hi Petro,

By adding this CSS to Custom CSS the underline effect will show in the custom menu item too:

.main-header.menu-type-standard-menu .standard-menu-container div.menu>ul>li>span:after, 
.main-header.menu-type-standard-menu .standard-menu-container ul.menu>li>span:after {
    zoom: 1;
    filter: alpha(opacity=80);
    -webkit-opacity: .8;
    -moz-opacity: .8;
    opacity: .8;
    background-color: #000;
    content: '';
    overflow: hidden;
    position: absolute;
    left: 0;
    bottom: -1px;
    display: block;
    width: 0;
    height: 1px;
    transition: all .3s cubic-bezier(.175,.885,.32,1.075);
}
.main-header.menu-type-standard-menu .standard-menu-container div.menu>ul>li>span:hover:after, 
.main-header.menu-type-standard-menu .standard-menu-container ul.menu>li>span:hover:after {
    width: 100%;
}

Hi Petro,

Go to Typography and in the font you use (Heebo) and follow the GIF image:

(view large version)

I have already done this so there is no need to follow this example, just for the next time.