bootstrap css color change

I have a website using Bootstrap v3.0.1

I added a carousel I found at https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_carousel2&stacked=h

The sample at w3schools is using the following:

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

Select allOpen in new window

 
 I did not use the above.
 
 In the sample, the indicators along the bottom have a white border, and the active one has a fill color of white.
 
 The goal was to change the all the indicators to have a black border, the non-active indicators to be filled with white (they were transparent) and to fill the active indicator with Black.
 
 After much experimenting, I found an example of the web that reset the styles for this particular page by adding the following in the style section.
 

 .carousel-indicators li {
   display: inline-block;
   width: 10px;
   height: 10px;
   margin: 1px;
   text-indent: -999px;
   cursor: pointer;
   background-color: #000 \9;
   background-color: rgba(255, 255, 255, 100);
   border: 1px solid #000000;
   border-radius: 10px;
 }
 
 .carousel-indicators .active {
   width: 12px;
   height: 12px;
   margin: 0;
   background-color: #333 \59;
   background-color: rgba(255, 0, 0, 50);
}

Select allOpen in new window

This worked to put a black border around all the indicators, and to fill the non-active indicators with the color white, but no luck trying to change the fill color of the active indicator.

As you can see in the link below, the active indicator is an orangish-brown color.  I have no idea where that color is coming from.


http://wallstreet-forecaster.com/infiniteprofits/