.carousel-container {
    /* height: auto; */
    position: relative;
    width: 100%;
    height: 600px;
    /*max-height: 50vh;*/
    padding-bottom: 20px;
}

.carousel-slider .owl-stage-outer,
.carousel {
    /* display: flex; */
    background: rgba(0, 0, 0, 0.7);
    scroll-snap-type: x mandatory;
    overflow-x: scroll;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    /* flex-direction: row;
    min-width: 0;
    min-height: 0; */
    white-space: nowrap;
}

.carousel-slider .owl-stage-outer::-webkit-scrollbar-button:horizontal:start:increment,
.carousel-slider .owl-stage-outer::-webkit-scrollbar-button:horizontal:end:decrement,
.carousel::-webkit-scrollbar-button:horizontal:start:increment,
.carousel::-webkit-scrollbar-button:horizontal:end:decrement {
    display: none;
}


.carousel {
    height: 580px; /* inherit; */
}

.owl-item,
.carousel__item {
    /* flex-shrink: 1; */
    /* height: auto; */
    /* min-width: 0;
    min-height: 0; */
    /* max-height: 0: */
    display: inline-block;
    width: 100%;
    scroll-snap-align: start;
    height: inherit;
    text-align: center;
}

.carousel__item a {
    /* display: inline-block; */
    /* min-width: 0;
    min-height: 0; */
}

.carousel__image {
    /* display: block; */
     height: 100%;
    /* max-height: 50vh; */
    /* max-width: 30vw; */
    /* 100%; */
    /* max-height: 100%; */
    /* max-width: 100%; */
    /* max-width: 100vw;
    max-height: 50vh; */
    /* width: min-content; */
    /* object-fit: scale-down; */
}

.carousel-slider .owl-dots,
.carousel-container .controls {
    /* position: absolute;
    right: 0;
    bottom: 1em;
    left: 0; */
    display: block;
    margin-bottom: 20px;
    margin-top: 10px;
    text-align: center;
}

.carousel-slider .owl-dots .owl-dot,
.carousel-container .controls__dot {
    display: inline-block;
    width: 0.85em;
    height: 0.85em;
    border-radius: 50%;
    outline: none;
    background-color: #ccc;
    opacity: 0.8;
    cursor: pointer;
    transition: opacity 0.2s;
}

.carousel-slider .owl-dot.active,
.carousel-container .active {
    background-color: #666;
}

.carousel-slider .owl-dots .owl-dot:not(:first-child),
.carousel-container .controls__dot:not(:first-child) {
    margin-left: 0.25em;
}

.carousel-slider .owl-dots .owl-dot:hover,
.carousel-slider .owl-dots .owl-dot:focus,
.carousel-container .controls__dot:hover,
.carousel-container .controls__dot:focus {
    opacity: 1;
}

.carousel-slider:hover .owl-nav .owl-prev,
.carousel-slider:hover .owl-nav .owl-next,
.carousel-container:hover .nav .next,
.carousel-container:hover .nav .prev {
    opacity: 1;
}

.carousel-slider .owl-nav .owl-prev,
.carousel-slider .owl-nav .owl-next,
.carousel-container .nav .prev,
.carousel-container .nav .next {
    display: inline-block;
    position: absolute;
    width: 48px;
    height: 48px;
    fill: #ccc;
    top: 50%;
    opacity: 0;
    transform: translateY(-50%);
    transition: opacity 0.3s;
    border: 0;
}

.carousel-slider.arrows-outside .owl-nav .owl-prev,
.carousel-slider .owl-nav .owl-prev {
    left: 0px;
}

.carousel-container .nav .prev {
    left: -20px;
}

.carousel-slider.arrows-outside .owl-nav .owl-next,
.carousel-slider .owl-nav .owl-next {
    right: 0px;
}

.carousel-container .nav .next {
    right: -20px;
}

/*
    NextLink and prevLink buttons are using wp-jquery-lightbox plugin styles for the arrows.
    We are only overriding the width of the buttons here in order to allow for the
    lightbox itself.
*/

.carousel-container .nav .prevLink,
.carousel-container .nav .nextLink {
	width: 10% !important;
}

/* important - copied straight from lightbox-jquery */
/* since the lightbox uses id's for the nextLink/prevLink
we can't reuse this on the aml carousel */
.carousel-container .nav .prevLink,
.carousel-container .nav .nextLink {
	height: 100%;
	background: transparent url('../../../../plugins/wp-jquery-lightbox/styles/images/blank.gif') no-repeat; /* Trick IE into showing hover */
	display: block;
}

.carousel-container .nav .prevLink { left: 0; float: left;}
.carousel-container .nav .nextLink { right: 0; float: right;}

.carousel-container .nav .prevLink:hover,
.carousel-container .nav .prevLink:visited:hover { background: url('../../../../plugins/wp-jquery-lightbox/styles/images/prev.gif') left 50% no-repeat; }

.carousel-container .nav .nextLink:hover,
.carousel-container .nav .nextLink:visited:hover { background: url('../../../../plugins/wp-jquery-lightbox/styles/images/next.gif') right 50% no-repeat; }

/* -------------------- */

.carousel-slider .owl-nav .owl-prev svg,
.carousel-slider .owl-nav .owl-next svg,
.carousel-slider .owl-dots .owl-dot span {
    display: none;
}


/*** START : next / previous image links ***/
.carousel-slider .owl-nav .owl-prev,
.carousel-slider .owl-nav .owl-next {
	width: 10% !important;
	height: 100%;
	background: transparent url('/wp-content/plugins/wp-jquery-lightbox/styles/images/blank.gif') no-repeat; /* Trick IE into showing hover */
	display: block;
}

.carousel-slider .owl-nav .owl-prev {
    left: 0;
    float: left;
}
.carousel-slider .owl-nav .owl-next {
    right: 0;
    float: right;
}
.carousel-slider .owl-nav .owl-prev:hover,
.carousel-slider .owl-nav .owl-prev:visited:hover {
    background: url('/wp-content/plugins/wp-jquery-lightbox/styles/images/prev.gif') left 50% no-repeat;
}
.carousel-slider .owl-nav .owl-next:hover,
.carousel-slider .owl-nav .owl-next:visited:hover {
    background: url('/wp-content/plugins/wp-jquery-lightbox/styles/images/next.gif') right 50% no-repeat;
}
