title: Owl Carousel 2 - how can I get Left and Right Arrows outside the slideshow?
body: <p>Finally trying to learn responsive design and needed a slideshow. I was able to easily get Owl Carousel up and running on one page and love it (right above footer on test page): <a href="http://cismiami.org/new.html" rel="nofollow noreferrer">http://cismiami.org/new.html</a></p>
  
  <p>I'd like to tweak the slideshow to use for staff photos: <a href="http://cismiami.org/owlstaff.html" rel="nofollow noreferrer">http://cismiami.org/owlstaff.html</a></p>
  
  <p>I found instructions for switching to arrows and getting them on the same line as the images, but cannot figure out how to get them to appear outside the image carousel instead of superimposed on them. I'm using a separate folder for the CSS files so I don't mess up the first sample, but here are my CSS files for the Staff page:</p>
  
  <p><a href="http://cismiami.org/js/owlstaff/assets/owl.carousel.css" rel="nofollow noreferrer">http://cismiami.org/js/owlstaff/assets/owl.carousel.css</a>
  <a href="http://cismiami.org/js/owlstaff/assets/owl.theme.default.css" rel="nofollow noreferrer">http://cismiami.org/js/owlstaff/assets/owl.theme.default.css</a></p>
  
  <p>Any help would be greatly appreciated.</p>