Bootstrap 3.0 - Tiny Navbar

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<div class="alert alert-danger alert-dismissible fade in" role="alert">
      <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">Ă—</span></button>
      <h4>Oh snap! You got an error!</h4>
      <p>Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.</p>
      <p>
        <button type="button" class="btn btn-danger">Take this action</button>
        <button type="button" class="btn btn-default">Or do this</button>
      </p>
    </div>
<table class="table table-hover table-bordered">
            <thead>
            <tr>
                <th>name</th>
                <th>email</th>
                <th>phone</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>sadsad</td>
                <td>sadsad</td>
                <td>sadsad</td>
            </tr>
            <tr>
                <td>sadsad</td>
                <td>sadsad</td>
                <td>sadsad</td>
            </tr>
            <tr>
                <td>sadsad</td>
                <td>sadsad</td>
                <td>sadsad</td>
            </tr>
            <tr>
                <td>sadsad</td>
                <td>sadsad</td>
                <td>sadsad</td>
            </tr>
            <tr>
                <td>sadsad</td>
                <td>sadsad</td>
                <td>sadsad</td>
            </tr>
            </tbody>
        </table>

CSS

.fade {
    max-height: 400px;
    -webkit-transition: .3s;
    -ms-transition: .3s;
    transition: .3s;
}

.fade:not(.in) {
    max-height: 0;
}