Esta es la forma de añadir una clase Css determinada en el primer slide o item de Owl Carousel 2, para darle unos estilos determinados a este primer elemento, que se actualizara dinámicamente cuando el slider se deslice y cambie el ítem de la primera posición.
Tendrás que prestar atención a que las clases e ids sean los mismos que utiliza tu slider, que puede variar según tu versión exacta o tu elección personal.
<script>
jQuery(document).ready(function($) {
var carousel = jQuery("#owl1");
carousel.owlCarousel({
items:3,
margin:10,
autoPlay:true,
autoPlayTimeout:2000,
});
checkClasses();
carousel.on("translated.owl.carousel", function(event) {
checkClasses();
});
function checkClasses(){
var total = $(".owl-stage-outer .owl-stage .owl-item.active").length;
$(".owl-stage-outer .owl-stage .owl-item").removeClass("firstActiveItem lastActiveItem");
$(".owl-stage-outer .owl-stage .owl-item.active").each(function(index){
if (index === 0) {
// this is the first one
$(this).addClass("firstActiveItem");
}
if (index === total - 1 && total>1) {
// this is the last one
$(this).addClass("lastActiveItem");
}
});
}
});
</script>
Si te ha sido de utilidad ¡deja un comentario! 
