/* change the background color */
.navbar-custom {
    background-color: #798cf9;
}
/* change the brand and text color */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
    color: rgba(255,255,255,.8);
    padding: 0.8rem 1rem;
}
/* change the link color and add padding for height */
.navbar-custom .navbar-nav .nav-link {
    color: rgba(255,255,255,.5);
    padding: 1rem 1rem;
}
/* change the color of active or hovered links */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link {
    color: #ffffff;
    background-color: #576ff9; /* add background-color to active links */
}