title: Bootstrap: fa-icons go above the header in sm layout (smartphone view)
body: <p>I'm having problems with a Bootstap template I'm not able to fix:
  When the page is viewed by a smartphone (sm layout) my fa-icons (I have 3 of them in the page) go above the header.</p>
  
  <p>All the other items work properly, and I can't find a good suggestion to fix it: is there a propery to set? How is it managed?</p>
  
  <p>Here you can see an example taken from etreviso.it:
  <a href="http://www.etreviso.it/images/3viso.jpg" rel="nofollow">http://www.etreviso.it/images/3viso.jpg</a></p>
  
  <p>This is the code used to insert the icons:
  <div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>          &lt;div class="col-md-4"&gt; &lt;span class="fa-stack fa-5x"&gt; &lt;i class="fa fa-circle fa-stack-2x text-primary"&gt;&lt;/i&gt; 
              &lt;i class="fa fa-cutlery fa-stack-1x fa-inverse"&gt;&lt;/i&gt; &lt;/span&gt; &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>cal-md-4 is defined as container in a css file.
  fa-items are taken from Awsome font.</p>
  
  <p>Thanks in advance for your help,
  Alessio</p>