title: Owl carousel 2 nagivation arrows on side
body: <p>I am currently using owl carousel to make a slide with pictures. 
  But the problem now is, I wanna make the navigation on both side (not on top of the slide). </p>
  
  <p>Below is my script:</p>
  
  <pre><code>$('.teamc').owlCarousel({
  items: 4,
  margin: 20,
  autoHeight : true,
  autoWidth: true,
  center: true,
  nav: true,
  loop: true,
  autoplay:true,
  navText: ['&lt;div class="customNextBtn" style="float:left; margin-left:33px"&gt;&lt;/div&gt;', '&lt;div class="customPreviousBtn" style="float:right; margin-right:33px"&gt;&lt;/div&gt;'],
  responsiveClass: true,
  responsive: {
    0: {
      center: true,
      items: 1,
      margin: 20,
      autoHeight : true,
      autoWidth: true,
      nav: false,
      loop: true
    },
    600: {
      center: true,
      items: 4,
      margin: 20,
      autoHeight : true,
      autoWidth: true,
      nav: false,
      loop: true
    },
    1000: {
      center: true,
      items: 4,
      margin: 20,
      autoHeight : true,
      autoWidth: true,
      nav: true,
      loop: true
    }
  }});
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/MfYuV.png" rel="nofollow noreferrer">Here is the sample picture of what I want it to be:</a></p>