Hide button captions on extra small devices

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<section>

<table class="table">
    <thead>
        <tr>
            <th>Last login</th>
            <th>Actions</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>2014-02-24 11:43</td>
            <td>
                <div class="btn-group hidden-xs">
                    <button class="btn btn-default">View</button>
                    <button class="btn btn-default">Delete</button>
                </div>
                <div class="btn-group-vertical visible-xs">
                    <button class="btn btn-blue">View</button>
                    <button class="btn btn-blue">Delete</button>
                </div> 
            </td>
        </tr>
        <tr>
            <td>2014-02-24 09:57</td>
            <td>
                <div class="btn-group hidden-xs">
                    <button class="btn btn-default">View</button>
                    <button class="btn btn-default">Delete</button>
                </div>
                <div class="btn-group-vertical visible-xs">
                    <button class="btn btn-default">View</button>
                    <button class="btn btn-default">Delete</button>
                </div>                 
            </td>
        </tr>        
    </tbody>
</table>
    
</section>

CSS

h2 {
    margin:0 0 15px 0;
}

section {
    padding:15px;
}