Edit in JSFiddle

<span class="fa fa-spinner fa-lg"></span> icon with large size<br/>

<i class="fa fa-spinner fa-2x"></i> x2 larger icon<br/>

<span class="fa fa-spinner fa-spin fa-3x"></span> x3 larger icon with spin class<br/>

<span class="fa fa-spinner fa-4x"></span> x3 larger icon with spin class<br/>

<span class="fa fa-spinner fa-5x"></span> x3 larger icon with spin class<br/>

<span class="fa-stack fa-lg">
  <i class="fa fa-circle fa-stack-2x"></i>
  <i class="fa fa-flag fa-stack-1x fa-inverse"></i>
</span> stacked icons<br>
<i class="fa fa-shield"></i> normal<br>
<i class="fa fa-shield fa-rotate-90"></i> fa-rotate-90<br>
<i class="fa fa-shield fa-rotate-180"></i> fa-rotate-180<br>
<i class="fa fa-shield fa-rotate-270"></i> fa-rotate-270<br>
<i class="fa fa-shield fa-flip-horizontal"></i> fa-flip-horizontal<br>
<i class="fa fa-shield fa-flip-vertical"></i> icon-flip-vertical
body{
    font-family: 'Open Sans', sans-serif;
}

span, i{
    margin-bottom: 20px;
}

.fa-flag{
    color: #f00;
}

.fa-circle{
    color: #454545;
}