Centering odd number of columns in a div

So that working in my blank test file, but when I try to implement it into the actual page everything moves into a straight vertical line and all the way to the left. This is my actual working code (at least a portion of it). The section in bold is what I'm trying to center.

<div id="threatStat">

<div class="well-lg">This is the content inside a normal well. Use class "well-lg" or "well-sm" for large and small well, respectively.</div>

</div>

<div class="container-fluid" id="homeBodyContent">

    <h1>Draw On Our Extensive Expertise</h1>

    <div class="row text-center" id="homeIcons">

        <div class="col-sm-2"><img src="https://findicons.com/files/icons/2141/web_design_creatives/128/small_smile.png class="img-responsive" alt="Placeholder image">

          <p>This is the content for Layout P Tag</p>

        </div>

        <div class="col-sm-2"><img src="https://findicons.com/files/icons/2141/web_design_creatives/128/small_smile.png class="img-responsive" alt="Placeholder image">

          <p>This is the content for Layout P Tag</p>

        </div>

        <div class="col-sm-2"><img src="https://findicons.com/files/icons/2141/web_design_creatives/128/small_smile.png class="img-responsive" alt="Placeholder image">

          <p>This is the content for Layout P Tag</p>

        </div>

        <div class="col-sm-2"><img src="https://findicons.com/files/icons/2141/web_design_creatives/128/small_smile.png class="img-responsive" alt="Placeholder image">

          <p>This is the content for Layout P Tag</p>

        </div>

        <div class="col-sm-2"><img src="https://findicons.com/files/icons/2141/web_design_creatives/128/small_smile.png class="img-responsive" alt="Placeholder image">

          <p>This is the content for Layout P Tag</p>

        </div>

    </div>

  <div class="row">

  <div class="col-lg-6"></div>

  <div class="col-lg-6"></div>

  </div>

<!--Carousel-->  

  <div class="row">

  <div class="col-lg-6">

    <div id="carousel1" class="carousel slide" data-ride="carousel">

      <ol class="carousel-indicators">

        <li data-target="#carousel1" data-slide-to="0" class="active"></li>

        <li data-target="#carousel1" data-slide-to="1"></li>

        <li data-target="#carousel1" data-slide-to="2"></li>

          </ol>

      <div class="carousel-inner" role="listbox">

        <div class="item active"><img src="Images/Carousel_Placeholder.png" alt="First slide image" class="center-block">

          <div class="carousel-caption">

            <h3>First slide Heading</h3>

            <p>First slide Caption</p>

              </div>

            </div>

        <div class="item"><img src="Images/Carousel_Placeholder.png" alt="Second slide image" class="center-block">

          <div class="carousel-caption">

            <h3>Second slide Heading</h3>

            <p>Second slide Caption</p>

              </div>

            </div>

        <div class="item"><img src="Images/Carousel_Placeholder.png" alt="Third slide image" class="center-block">

          <div class="carousel-caption">

            <h3>Third slide Heading</h3>

            <p>Third slide Caption</p>

              </div>

            </div>

          </div>

      <a class="left carousel-control" href="#carousel1" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span><span class="sr-only">Previous</span></a><a class="right carousel-control" href="#carousel1" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span><span class="sr-only">Next</span></a></div>

      </div>

  <div class="col-lg-6">

  </div>

  </div>

</div>