How to vertically align some text inside css3 circles?

I've got those three inline elements here that I am trying to make a circle out of it with css3, but the problem is when I add the css3 style the text inside the circle is not vertically aligned, so my question is how do i make sure that no matter font-size/ family/ browser/ font size inside the circle will be verticaly aligned ?!

    <div class="row">
   <div class="col-xs-4">
      <div class="num">
         <div class="num-content">
            41, 000+ <span>jobs</span>
         </div>
         <!--num content-->
      </div>
      <!--num-->
   </div>
   <!--col-->
   <div class="col-xs-4">
      <div class="num">
         <div class="num-content">
            56 <span>countries</span>
         </div>
         <!--num content-->
      </div>
      <!--num-->
   </div>
   <!--col-->
   <div class="col-xs-4">
      <div class="num">
         <div class="num-content">
            8 <span>programs</span>
         </div>
         <!--num content-->
      </div>
      <!--num-->
   </div>
   <!--col-->
</div>
<!--row-->

and the css applied to the html:

.num{
font-size: 30px;
font-weight: bold;
color: white;
height: 140px;
width: 140px;
text-align: center;
background: #dd5638;
-webkit-border-radius:100%;
-moz-border-radius:100%;
border-radius: 100%;
-webkit-font-smoothing:antialiased;
text-rendering: optimizeLegibility;
}