Owl Carousel 2 Responsive

HTML

<script src="https://rawgit.com/OwlFonk/OwlCarousel2/develop/src/js/owl.carousel.js"></script>
<link rel="stylesheet" href="https://rawgit.com/OwlFonk/OwlCarousel2/develop/src/css/owl.carousel.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/OwlFonk/OwlCarousel2/develop/src/css/owl.theme.default.css">
<div class="owl-carousel">
  <div>
    <p>Slide 1 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Placeat quisquam rem assumenda, ullam, beatae earum animi magnam! Reiciendis, laboriosam, itaque.</p>
    <div class="customNavigation"> <a class="prev">Previous</a>
      <a class="next">Next</a>

    </div>
  </div>
  <div>
    <p>Slide 2 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Placeat quisquam rem assumenda, ullam, beatae earum animi magnam! Reiciendis, laboriosam, itaque.</p>
    <div class="customNavigation"> <a class="prev">Previous</a>
      <a class="next">Next</a>

    </div>
  </div>
  <div>
    <p>Slide 3 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Placeat quisquam rem assumenda, ullam, beatae earum animi magnam! Reiciendis, laboriosam, itaque.</p>
    <div class="customNavigation"> <a class="prev">Previous</a>
      <a class="next">Next</a>

    </div>
  </div>

CSS

.owl-carousel p {
  height: 100px;
  width: 500px;
}

.owl-item {
  padding: 30px;
}

JavaScript

$('.owl-carousel').owlCarousel({
  loop: true,
  items: 1,
});
owl = $('.owl-carousel').owlCarousel();
$(".prev").click(function() {
  owl.trigger('prev.owl.carousel');
});

$(".next").click(function() {
  owl.trigger('next.owl.carousel');
});