Issue with dropdown-toggle background color

Question

I'm getting a little issue in my Django project when I'm using Bootstrap navbar.

I have a dropdown-toggle menu and hover effect which makes black dropdown-menu background color. But When I set my mouse somewhere else, background-color becomes white instead of black.

I don't overcome in my script to fix it to black color.

I put 2 screenshots in order to illustrate my issue :

And second screen :

My HTML script to this part looks like :

<nav class="navbar navbar-inverse">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="navbar-header">
                    <a class="navbar-brand" href="http://www.datasystems.fr/"> DatasystemsCORE </a>
                </div>


                <ul class="nav navbar-nav">
                    <li><a class="dropdown-toggle" href="{% url "accueil" %}"> <span class="glyphicon glyphicon-home"></span> Accueil </a></li> 
                    {% if user.is_authenticated %}
                    <li class = "dropdown">
                        <a href = "#" class = "dropdown-toggle" data-toggle = "dropdown">
                            <span class="glyphicon glyphicon-info-sign"> </span> Informations Institution
                            <b class = "caret"></b>
                        </a>
                            <ul class = "dropdown-menu">
                                <li><a href = "{% url "InstitutionFormulaire" %}"> <span class="glyphicon glyphicon-pencil"></span> Créer/Editer les informations de l'institution </a></li>
                                <li><a href = "{% url "InstitutionResume" %}"> <span class="glyphicon glyphicon-home"></span> Consulter les informations de l'institution </a></li>
                            </ul>
                    </li>


                    <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown"> <span class="glyphicon glyphicon-file">
                        </span>  Gestion des Fiches d'Identifications <b class="caret"></b></a>
                        <ul class="dropdown-menu">

                            <li><a href="{% url 'Home' %}"> <span class="glyphicon glyphicon-home"></span> Accueil Fiches d'Identifications</a></li>
                            <li><a href="{% url 'Statistiques' %}"> <span class="glyphicon glyphicon-cog"></span> Statistiques</a></li>

                            <li class="dropdown-submenu">

                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                    <span class="glyphicon glyphicon-user"></span>
                                    </span> Partie Individus 
                                </a>
                                    <ul class="dropdown-menu">
                                        <li><a href="{% url "IndividuFormulaire" %}">Création Fiches d'Identifications </a></li>
                                        <li><a href="{% url "IndividuRecherche" %}">Recherche Fiches d'Identifications</a></li>
                                        <li><a href="{% url "Consultation" %}">Consultation Fiches d'Identifications</a></li>
                                        <li><a href="{% url "IdentityChoice" %}">Edition partielle Fiches d'Identifications</a></li>
                                        {% if request.user|has_group:"admin" %}
                                        <li><a href="{% url "Edition" %}">Edition Fiches d'Identifications</a></li>
                                        <li><a href="{% url "Suppression" %}">Suppression Fiches d'Identifications</a></li>
                                        {% endif %}
                                    </ul>
                            </li>

And CSS part :

.dropdown-submenu{
        position:relative;
        }

    .dropdown-submenu>.dropdown-menu{
        top:0;
        left:100%;
        margin-top:0%;
        margin-left:0%;
        -webkit-border-radius:0 6px 6px 6px;
        /*-moz-border-radius:0 6px 6px 6px;*/
        border-radius:0 6px 6px 6px;
        }

    .dropdown-submenu>a:after{
        display:block;
        content:" ";
        float:right;
        width:0;
        height:0;
        border-color:transparent;
        border-style:solid;
        /*border-width:3% 0 5px 5px;*/
        border-left-color:#cccccc;
        margin-top:5px;
        margin-right:-10px;
        }

    .dropdown-submenu:hover>a:after{
        border-left-color:#555;
        }

    .dropdown-submenu.pull-left{
        float:none;
        }

    .dropdown-submenu.pull-left>.dropdown-menu{
        left:-100%;
        margin-left:10px;
        -webkit-border-radius:6px 0 6px 6px;
        /*-moz-border-radius:6px 0 6px 6px;*/
        border-radius:6px 0 6px 6px;
        }

    div.alert.alert-success.alert-dismissible {
        width:63%;
        margin-left: 10%;   
    }

    ul.dropdown-menu {
        background-color: #0083A2;
    }


    ul.dropdown-menu:active {
        background-color: black;
    }

    /*.sidebar-only ul.dropdown-menu > li.dropdown-submenu.open > a.dropdown-toggle {
        background-color: black;
        margin-right:15%;
        }*/

    ul.dropdown-menu > li.dropdown-submenu:hover > a.dropdown-toggle, a.dropdown-toggle:hover {
        background-color: black;
        color : white;
        }
    /* Gestion de chaque ligne du menu sans sous-menu */
    ul.dropdown-menu > li:hover > a{
        background-color: black;
        color: white;
    }

Answer 1

Try using important there may be other conflicts that is doing so :

ul.dropdown-menu > li.dropdown-submenu:hover > a.dropdown-toggle, 
a.dropdown-toggle:hover {
    background-color: black !important;
    color : white;
}
/* Gestion de chaque ligne du menu sans sous-menu */
ul.dropdown-menu > li:hover > a{
    background-color: black !important;
    color: white;
}

Sorry for bad formatting using from mobi...tell me what happens

Answer 2

I found the solution, I get :

ul.dropdown-menu > li.dropdown-submenu:hover > a.dropdown-toggle,
a.dropdown-toggle:hover, a.dropdown-toggle:visited {
    background-color: black !important;
    color : white;
}

And it works because I added visited selector