Superslides Plugin - Vertical Content Alignment

by bizamajig

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="http://nicinabox.com/superslides/dist/stylesheets/superslides.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://nicinabox.com/superslides/javascripts/jquery.easing.1.3.js"></script>
<script src="http://nicinabox.com/superslides/javascripts/jquery.animate-enhanced.min.js"></script>
<script src="http://nicinabox.com/superslides/dist/jquery.superslides.js"></script>
<div id="slides">
    <ul class="slides-container">
        <li>
            <img src="http://nicinabox.com/superslides/images/girl.jpg" alt="">
            <div class="container">
                <div class="row">
                    <div class="col-xs-6 col-xs-offset-3">
                        <div class="well">
                            <p>Text 1</p>
                        </div>
                    </div>
                </div>
            </div>
        </li>
        <li>
            <img src="http://nicinabox.com/superslides/images/building.jpg" alt="">
            <div class="container">
                <div class="row">
                    <div class="col-xs-6 col-xs-offset-3">
                        <div class="well">
                            <p>Text 2</p>
                        </div>
                    </div>
                </div>
            </div>
        </li>
        <li>
            <img src="http://nicinabox.com/superslides/images/floor-kid.jpg" alt="">
            <div class="container">
                <div class="row">
                    <div class="col-xs-12">
                        <div class="well">
                            	<h1>Heading 3</h1>

                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="well">
                            <table class="table">
                                <tbody>
       ...

CSS

.container{
    display:table;
    width:100%;
    height:100%;
}
.container .row{
    display:table-cell;
    vertical-align:middle;
}

JavaScript

$(document).ready(function () {
    $('#slides').superslides({
        animation: 'fade',
        play: 7000,
        pagination: true
    });
});