/* https://stackoverflow.com/questions/42586729/how-can-i-change-the-bootstrap-4-navbar-button-icon-color */
/* https://work.smarchal.com/twbscolor/ */

/* MAIN LEVEL ********************************** */
.navbar-custom {
  background-color: royalblue !important;
}

/* change the brand and text color */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
  color: white;
}

/* change the link color */
.navbar-custom .navbar-nav .nav-link {
  color: #fff;
}

/* change the color of active or hovered links */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link {
    color: #fff;
}

/* DROPDOWN ************************************* */
.navbar-custom .dropdown-menu {
  background-color: royalblue;
}

.navbar-custom .dropdown-item {
  color: #fff; /* if not a link */
}

.navbar-custom .dropdown-item:hover,
.navbar-custom .dropdown-item:focus {
  background-color: royalblue;
  background-color: rgba(0,0,0,.1);
  background-color: darkblue !important;
}

.navbar-custom .dropdown-item a {
  color: white !important;
}

.navbar-custom .dropdown-item a:hover,
.navbar-custom .dropdown-item:focus {
  color: white !important;
  color: black !important;
}

/*
<button 
     class="navbar-toggler collapsed" 
    data-target="#navbarsExampleDefault" 
    data-toggle="collapse">
        <span class="line"></span> 
        <span class="line"></span> 
        <span class="line"></span>
</button>

.navbar-toggler{
width: 47px;
height: 34px;
background-color: #7eb444;

}
.navbar-toggler .line{
width: 100%;
float: left;
height: 2px;
background-color: #fff;
margin-bottom: 5px;
}
*/