Bootstrap Carousel + Annimate.css

This is a simple Twitter Bootstrap 3 template. You can fork it to get a ready to use Bootstrap 3 fiddle.

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
<div id="first-slider">
  <div id="carousel-example-generic" class="carousel slide carousel-fade">
    <!-- Indicators -->
    <ol class="carousel-indicators">
      <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
      <li data-target="#carousel-example-generic" data-slide-to="1"></li>
      <li data-target="#carousel-example-generic" data-slide-to="2"></li>
      <li data-target="#carousel-example-generic" data-slide-to="3"></li>
    </ol>
    <!-- Wrapper for slides -->
    <div class="carousel-inner" role="listbox">
      <!-- Item 1 -->
      <div class="item active">
        <img src="http://dev.ohiochristian.edu/sites/default/files/images/promo/banner1_0.jpg" alt="" width="1900" height="500">
        <div class="collapsible group-caption field-group-div speed-fast effect-none fieldgroup-effects-processed">
          <h3><span class="field-group-format-toggler"><a class="field-group-format-title" href="#">Caption</a></span></h3>
          <div class="field-group-format-wrapper white-box right-wrapper animated fadeInLeft">
            <h1 class="field-title-field">Mission:</h1>
            <p>Ohio Christian University is committed to offering a complete education that develops students intellectually, professionally, and spiritually.</p>
            <div class="field-promo-action">
              <a href="http://ohiochristian.edu/preview">Learn More</a>
            </div>
          </div>
        </div>
      </div>
      <!-- Item 2 -->
      <div class="item">
        <img...

CSS

/* Latest compiled and minified CSS included as External Resource*/

.field-group-format-toggler,
div.item > div.field-group-div h3 {
  display: none;
}

.field-promo-action a {
  font-weight: bold;
  color: #fff;
  background-color: #EA7600;
  padding: .5em .75em;
  font-weight: bold;
  color: #fff;
  display: inline-block;
  margin: .5em;
}

.field-promo-action a:hover {
  background-color: #BE4D00;
  text-decoration: none;
}

.group-caption h3 {
  visibility: hidden;
}

h3.field-title-field,
h2.field-title-field,
h1.field-title-field {
  font-size: 2.0em;
  visibility: visible;
}

.field-group-format-wrapper {
  display: block;
  position: absolute;
  bottom: 10%;
  width: 100%;
}

.field-group-format-wrapper.center-wrapper {
  color: black;
  text-shadow: 0px 0px 1.5em white;
  text-align: center;
}

.field-group-format-wrapper.center-wrapper.reverse {
  color: white;
  text-shadow: 0px 0px 1.5em black;
  width: 100%;
}

.field-group-format-wrapper.white-box {
  display: block;
  background-color: rgba(255, 255, 255, 0.6);
  position: absolute;
  top: 10%;
  width: 40%;
  padding: 1%;
}

.field-group-format-wrapper.left-wrapper {
  right: 0%;
  padding-right: 10%;
  text-align: left;
}

.field-group-format-wrapper.right-wrapper {
  left: 0%;
  padding-left: 10%;
  text-align: left;
}

.field-group-format-wrapper span {
  font-size: 1.0em;
  line-height: 0.8em;
}

.field-group-format-wrapper.center-wrapper {
  position: absolute;
  top: 38%;
}

@import url(https://fonts.googleapis.com/css?family=Quicksand:400,700);
body {
  font-family: 'Quicksand', sans-serif;
  font-weight: 700;
}


/********************************/


/*           Main CSS           */


/********************************/

.carousel-fade .carousel-inner .item {
  -webkit-transition-property: opacity;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  opacity:...

JavaScript

/* Latest compiled and minified JavaScript included as External Resource */