I can not change the color of the navbar

#footer{
background-color:black;
}

nav.navbar {
  background-color: #ae2822;
}

.navbar .navbar-brand {
  color: #f9f7f7;
}

.navbar .navbar-brand:hover,
.navbar .navbar-brand:focus {
  color: #c91b1b;
}

.navbar .navbar-text {
  color: #f9f7f7;
}

.navbar .navbar-nav .nav-link {
  color: #f9f7f7;
  border-radius: .25rem;
  margin: 0 0.25em;
}

.navbar .navbar-nav .nav-link:not(.disabled):hover,
.navbar .navbar-nav .nav-link:not(.disabled):focus {
  color: #c91b1b;
}

.navbar .navbar-nav .nav-item.active .nav-link,
.navbar .navbar-nav .nav-item.active .nav-link:hover,
.navbar .navbar-nav .nav-item.active .nav-link:focus,
.navbar .navbar-nav .nav-item.show .nav-link,
.navbar .navbar-nav .nav-item.show .nav-link:hover,
.navbar .navbar-nav .nav-item.show .nav-link:focus {
  color: #c91b1b;
  background-color: #f9f9f9;
}

.navbar .navbar-toggle {
  border-color: #f9f9f9;
}

.navbar .navbar-toggle:hover,
.navbar .navbar-toggle:focus {
  background-color: #f9f9f9;
}

.navbar .navbar-toggle .navbar-toggler-icon {
  color: #f9f7f7;
}

.navbar .navbar-collapse,
.navbar .navbar-form {
  border-color: #f9f7f7;
}

.navbar .navbar-link {
  color: #f9f7f7;
}

.navbar .navbar-link:hover {
  color: #c91b1b;
}

@media (max-width: 575px) {
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown- item {
    color: #f9f7f7;
  }
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown-item:hover,
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown- item:focus {
    color: #c91b1b;
  }
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown- item.active {
    color: #c91b1b;
    background-color: #f9f9f9;
  }
}

@media (max-width: 767px) {
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown- item {
    color: #f9f7f7;
  }
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown- item:hover,
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown- item:focus {
    color: #c91b1b;
  }
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown- item.active {
    color: #c91b1b;
    background-color: #f9f9f9;
  }
}

@media (max-width: 991px) {
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown- item {
    color: #f9f7f7;
  }
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown-item:hover,
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown- item:focus {
    color: #c91b1b;
  }
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown-item.active {
    color: #c91b1b;
    background-color: #f9f9f9;
  }
}

@media (max-width: 1199px) {
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown- item {
    color: #f9f7f7;
  }
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown- item:hover,
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown- item:focus {
    color: #c91b1b;
  }
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown- item.active {
    color: #c91b1b;
    background-color: #f9f9f9;
  }
}

.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item {
  color: #f9f7f7;
}

.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item:hover,
.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item:focus {
  color: #c91b1b;
}

.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item.active {
  color: #c91b1b;
  background-color: #f9f9f9;
}


}
.thumb-name {
  font-weight: bold;
  display: block;
}
.stock-counter {
  opacity: 0.8;
  position: absolute;
  margin-top: 5px;
  right: 21px;
}
.badge {
  display: inline-block;
  min-width: 10px;
  padding: 3px 7px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  background-color: #777;
  border-radius: 10px;
}
.low-stock-alert {
  opacity: 0.8;
  position: absolute;
  margin-top: 5px;
  left: 21px;
  color: red;
}
.item-quantity {
  font-size: 40px;
}
.current-stock {
  font-size: 99px;
  font-weight: bold;
}
.item-number {
  font-size: 20px;
}
.item-title {
  font-size: 23px;
  font-weight: bold;
}
.item-price {
  font-size: 23px;
  font-weight: bold;
  color: #388e3c;
}
.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
  z-index: 3;
  color: #fff;
  cursor: default;
  background-color: #3c763d;
  border-color: #ccc;
}
a {
  color: #3c763d;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<nav class="navbar navbar-default ">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Simple Stock</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="<?php if (isset($active_productos)){echo $active_productos;}?>"><a href="stock.php"><i class='glyphicon glyphicon-barcode'></i> Inventario</a></li>
        <li class="<?php if (isset($active_categoria)){echo $active_categoria;}?>"><a href="categorias.php"><i class='glyphicon glyphicon-tags'></i> Categorías</a></li>
        <li class="<?php if (isset($active_usuarios)){echo $active_usuarios;}?>"><a href="usuarios.php"><i  class='glyphicon glyphicon-user'></i> Usuarios</a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="http://obedalvarado.pw/contacto/" target='_blank'><i class='glyphicon glyphicon-envelope'></i> Soporte</a></li>
        <li><a href="login.php?logout"><i class='glyphicon glyphicon-off'></i> Salir</a></li>
      </ul>
    </div>
    <!-- /.navbar-collapse -->
  </div>
  <!-- /.container-fluid -->
</nav>
Editada: solo tienes que darle un id al footer, y 
despues darle el color que quieras: te dejo el ejemplo,
 si te fijas llame id="footer" a el div y 
luego aplique css a ese id, 
#footer{background-color:black}

<div class="navbar navbar-default navbar-fixed-bottom" id="footer">
  <div class="container">
    <p class="navbar-text pull-left">&copy
      <?php echo date('Y');?> - Swisslub soluciones Integrales
    </p>
    <div class="navbar-text pull-right">
      <?php  echo  $_SESSION['firstname'];?> &nbsp &nbsp &nbsp &nbsp &nbsp
      <?php  echo  $_SESSION['user_permision'];?>

    </div>
  </div>
  <div class="container">

  </div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js">
</script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-
   0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>