title: center row content in bootstrap grid
body: <p>I know this question has been asked a lot but each one seems to be a bit unique and I have tried at least 7 different versions here on StackOverflow and none have worked. </p>
  
  <p>It should be a simple fix but I can't center the div contents. I need all the rows centered to the gird and centered when scaled all the way down to the mobile view.</p>
  
  <p>Here is my code example:
  <a href="http://codepen.io/anon/pen/aOBJEv" rel="nofollow">http://codepen.io/anon/pen/aOBJEv</a></p>
  
  <p>Here is the html:</p>
  
  <pre><code>&lt;div class="row-fluid"&gt;
    &lt;div class="bottom col-xs-12 col-sm-12 col-md-6 col-lg-6"&gt;&lt;img src="http://edvizenor.com/2015/wordpress/wp-content/uploads/2015/05/image-333x333.jpg" class="img-btm"&gt;
  
      &lt;div class="top"&gt; &lt;img src="http://www.edvizenor.com/2015/images/TopicCircleBlue.png"&gt; &lt;/div&gt;
      &lt;div class="topic text-center"&gt;cheese &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="bottom col-xs-12 col-sm-12 col-md-6 col-lg-6"&gt;&lt;img src="http://edvizenor.com/2015/wordpress/wp-content/uploads/2015/05/Ed-Vizenor-150x150.jpg" class="img-btm"&gt;
  
      &lt;div class="top"&gt; &lt;img src="http://www.edvizenor.com/2015/images/TopicCircleBlue.png"&gt; &lt;/div&gt;
      &lt;div class="topic text-center"&gt;Cool Beans &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="bottom col-xs-12 col-sm-12 col-md-6 col-lg-6"&gt;&lt;img src="http://edvizenor.com/2015/wordpress/wp-content/uploads/2015/05/BeauBird-150x150.png" class="img-btm"&gt;
  
      &lt;div class="top"&gt; &lt;img src="http://www.edvizenor.com/2015/images/TopicCircleBlue.png"&gt; &lt;/div&gt;
      &lt;div class="topic text-center"&gt;I am happy &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="bottom col-xs-12 col-sm-12 col-md-6 col-lg-6"&gt;&lt;img src="http://edvizenor.com/2015/wordpress/wp-content/uploads/2015/05/ave4-150x150.jpg" class="img-btm"&gt;
  
      &lt;div class="top"&gt; &lt;img src="http://www.edvizenor.com/2015/images/TopicCircleBlue.png"&gt; &lt;/div&gt;
      &lt;div class="topic text-center"&gt;Hello world! &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>