.list-clone-item,
.list-clone-items {
    width: fit-content;
}

/* Hero slider */

/* Hero slider fix width issue  */
.hero__slider .list-clone-item,
.list-clone-items {
    width: 100%;
}


.hero__slider .item-content-wrapper a {
    display: grid;
    position: relative;
    place-items: center;
}

/* START CHANGES LIST with overflow wrapper */

.listjs-list-wrapper {
    margin-bottom: 2rem;
}

.list__item.fullwidth {
    padding: 0;
}

.list__highlight__slider .list-clone-item.list-item--visible {
    padding-top: 0.5rem;
}

.list-js-container {
    padding-bottom: 3rem;
    /* padding-top: 1em; */
    padding-top: 2.5em;
    /* margin-top: -1em; */
    margin-top: -1.5em;
    scrollbar-width: none;
    -moz-scrollbars-none: none;
    -ms-overflow-style: none;
}

.list-js-container::-webkit-scrollbar {
    display: none;
}

/* .season__selector .list-js-container {
    padding-bottom: 0;
} */

.list__item--quotes .list-js-container {
    padding-bottom: 1rem;
    margin-top: 1rem;
}

.listing .list-js-container {
    padding-top: 3.5em;
}

/* END CHANGES LIST with overflow wrapper */
.list__highlight .slide {
    border: 3px solid transparent;
    transition: border 0.2s ease-in-out;
}


.list__highlight.list-item--visible .slide {
    border: 3px solid transparent;
}

.list__highlight .list-item--focused .slide {
    border: 3px solid #fff;
    border-radius: 8px;
}


.list__highlight .list-item--focused .slide::before {
    content: "";
    position: absolute;
    top: -13px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 100%;
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid #fff;
    border-top: 12px solid transparent;
}


/* pagination dots */
button.list-pagination__dot {
    width: 8px;
    height: 8px;
    border-radius: 25%;
    background-color: var(--color__gray--translucent);
    padding: 0;
    margin: 3px;
    opacity: 0.7;
    transition: transform 200ms linear;
}

button.list-pagination__dot.active {
    transform: scale(1.4);
    background-color: var(--color__gray);
}

button.list-pagination__dot.active:hover {
    opacity: 1;
}

button.list-pagination__dot:hover {
    opacity: 0.9;
}

.block-object .list-controls.pagination {
    position: absolute;
    top: 32px;
    right: 0;
    left: auto;
    bottom: auto;
    padding-right: 6rem;
}

@media (max-width: 768px) {
    .block-object .list-controls.pagination {
        top: 2.6rem;
        padding: 0 1rem;
    }
}

@media (max-width: 400px) {
    .block-object .list-controls.pagination {
        top: 3rem;
        padding: 0 1rem;
        left: 0;
        right: auto;
    }
}

/* list arrows previous and next */
.list__arrows {
    display: flex;
    align-items: center;
    border: 0;
    cursor: pointer;
    justify-content: center;
    padding: 0;
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 1;
    width: 100%;
}

/* TEMPORARY FIX FOR FESTIVALS AND COMPANIES: */
.list__festival__container .list__arrows {
    top: 60%;
}

.list__companies__container .list__arrows {
    top: 60%;
}

.list__arrow {
    position: absolute;
    background: none;
    padding: 0;
}

.list__arrow,
.list__arrow:disabled {
    position: absolute;
    border-radius: unset;
    height: 100%;
    transition: 0.2s;
}

.list__arrow:disabled {
    opacity: 0;
}

@media (pointer: coarse) {
    .list__arrow {
        opacity: 1;
    }
}

@media (max-width: 768px) {
    .list__arrow {
        display: none
    }
}

.list__arrow:hover {
    transition: color 200ms ease-in-out;
}


.list__arrow svg {
    fill: var(--text-color__primary);
    width: 2.5rem;
    height: 2.5rem;
    display: block;
}

.list__arrow:hover {
    transition: color 200ms ease-in-out;
}

.list__arrow:hover svg {
    fill: var(--color__secondary);
}

.list__arrow:disabled svg {
    transition: color .2s ease-in-out;
    fill: var(--transparent);
}

.list__arrow--next {
    right: 0;
}

@media (max-width: 1024px) {
    .list__arrow--next {
        right: 0;
    }
}

.list__arrow--prev {
    left: 1rem;
}