How to align `button-group` horizontal in the centre of the column div?

How to align `button-group` horizontal in the centre of the column div?

<div class="row">
<div class="large-12 columns">
<ul class="button-group ">
<li><a class="tiny secondary button" href="#">3 months</a></li>
<li><a class="tiny secondary button" href="#">6 months</a></li>
<li><a class="tiny secondary button" href="#">9 months</a></li>
<li><a class="tiny secondary button" href="#">1 year</a></li>
<li><a class="tiny secondary button" href="#">2 years</a></li>
</ul>
</div>
</div>
I tried to add text-center to the ul and also large-centered to the column
without success.
I believe there is a class in foundation to centre the group of buttons,
but I could not find it.
http://jsfiddle.net/vZdbY/1/