Owl Carousel - Navigation same width as centered item?

Question

I have this Owl Slider: https://codepen.io/herrfischer/pen/qBEbpMx The navigation buttons are on the left side but I want them to be on the right side of the centered image like in the image below (second slider at the bottom). Any idea how to do it?

I use

$(".owl-carousel").owlCarousel({
    center: true,
    . . . 
    responsive: {
        0:{
            items: 1
        },
        576:{
            items: 1,
            stagePadding: 50,
        },
        992:{
            items: 1,
            stagePadding: 100,
        },
        1300:{
            items: 1,
            stagePadding: 200,
        },
        1500:{
            items: 1,
            stagePadding: 300,
        },
        1750:{
            items: 1,
            stagePadding: 450,
        }
    }
    . . .

to center the middle image.

Answer 1

I just realised that the left and right pane have a fixed width - so I can do it just with CSS and media queries. So my carousel code is:

$('.owl-<?php echo get_row_index(); ?>').owlCarousel({
    center: true,
    loop: true,
    margin: 0,
    nav: true,
    dots: false,
    responsive: {
    0:{
        items: 1
    },
    576:{
        items: 1,
        stagePadding: 0,
    },
    1200:{
        items: 1,
        stagePadding: 200,
    },
    1500:{
        items: 1,
        stagePadding: 300,
    },
    1750:{
        items: 1,
        stagePadding: 450,
    }
    }
})

"stagePadding" is a pixel value. So I just center ".owl-nav" and give it right and left margins with the exact same numbers and media queries from my responsive owl script:

.owl-nav {
    position: absolute;
    z-index: 99;
    top: auto;
    right: 0;
    bottom: 0;
    padding: 1em 1em .6em;
    margin-left: auto;
    margin-right: auto;

    @media (min-width: 1200px) {
        left: 200px;
        right: 200px;
    }

    @media (min-width: 1500px) {
        left: 300px;
        right: 300px;
    }

    @media (min-width: 1750px) {
        left: 450px;
        right: 450px;
    }

    ...