Owl Carousel cutting div

Question

У меня есть небольшая проблема. Я с помощью OwlCarousel 2, чтобы сделать «характеристику ротатора/слайдер», но это выглядит так:

Но мне нужно somethink, как это - изображение вырезанные на вершине:

Я упаковал «ящик» в еще одном div, но это не исправить.
Вот мой HTML:

<div> 
    <div class="testimonial-box"> 
     <div class="testimonial-content"> 
      <div class="testimonial-logo"> 
       <img src="http://placehold.it/100x100" alt="" class="img-responsive img-thumbnail pull-left" /> 
      </div> 
      <p> 
       <!-- CONTENT --> 
      </p> 
      <div class="testimonial-meta"> 
       <p> 
        <h5>Lorem Ipsum</h5> 
        <span>, <i>Web Developer</i></span> 
       </p> 
       <p class="website"> 
        <a href="http://vrs-factory.pl">VRS-Factory</a> 
       </p> 
      </div> 
     </div> 
    </div> 
</div> 

И CSS [SASS]:

section.testimonials { 
     padding: 30px 0; 

     .testimonial-logo { 
      img { 
       margin-top: -88px; 
      } 
     } 

     .testimonial-content { 
      border: 1px solid rgba($SecondColor, .2); 
      border-radius: 3px; 
      padding: 20px; 
     } 

     .testimonial-meta { 
      h5 { 
       display: inline-block; 
       margin-bottom: 0; 
      } 
     } 

     .owl-carousel { 
      .owl-item { 
       img { 
        width: auto; 
       } 
      } 
     } 
    } 

UPDATE: Вот демо: DEMO

Answer 1

Это произошло потому, что overflow: hidden из .owl-carousel .owl-stage-outer.

Я добавляю margin-top на .owl-item, чтобы исправить это.

.owl-item { margin-top: 70px; } 

Live example