change classes on owl items based on active item so that active item can get special treatment, but remove class as it passes by...

settings.js

$(function(){

    $('.loop').on('initialized.owl.carousel translate.owl.carousel', function(e){
        idx = e.item.index;
        $('.owl-item.active.big').removeClass('big');
        $('.owl-item.medium').removeClass('medium');
        $('.owl-item').eq(idx).addClass('big');
        $('.owl-item').eq(idx-1).addClass('medium');
        $('.owl-item').eq(idx+1).addClass('medium');
        $('.owl-item').eq(idx+2).addClass('medium');
        $('.owl-item').eq(idx+3).addClass('medium');
        $('.owl-item').eq(idx+4).addClass('medium');
    });

    $('.loop').owlCarousel({
        center: true,
        items:2,
        loop:true,
        margin:10,
        nav: true,
        navText: ['<i class="fa fa-arrow-left"></i> ','<i class="fa fa-arrow-right"></i>'],
        dots:false,
        // autoplay: true,
        // autoPlay: 3000
    })
});