Box shadow on items in owl carousel being cut off

Question

I have got a box shadow on every element in my owl carousel. Problem is the outer most elements have their Box shadow cut off because of the overflow: hidden that owl-carousel utilizes. How can i get around this?

Answer 1

To answer my own question. A workaround for this would be to set overflow: visible on the outer stage. Hiding all none active elements with opacity 0 and then for smoothness transition the opacity.

.owl-stage-outer { 
overflow: visible;
}

 .owl-item {
   opacity: 0;
   transition: opacity 500ms;
}
.owl-item.active {
  opacity: 1;
}

.