.slide-controls-wrapper {
    position: relative;
    padding-right: 220px;
    padding-left: 220px;
}
.slide-controls {
    align-items: center;
    justify-content: center;
    display: flex;
    position: absolute;
    font-size: 1rem;
    font-weight: var(--weight-normal);
    line-height: 1rem;
    right: 3rem;
    top: 1rem;
}
.slide-controls > span {
    padding-right: 3px;
}
.slide-controls button {
    background: none;
    border: none;
    box-shadow: none;
    cursor: pointer;
    font-size: 140%;
    margin: 0;
    padding: 5px 0px 5px 4px;
}
.slide-controls button.inactive {
    opacity: 0.4;
}

.hide-more-button .slider-more-button {
    display: none;
}

@media screen and (min-width: 768px) {

    .slider-active .slide {
        margin-left: 0;
        left: 0px;
        transition: left 350ms ease;
    }
    .slider-active[data-page="2"] .slide {left: calc(0px - 100%);}
    .slider-active[data-page="3"] .slide {left: calc(0px - 200%);}
    .slider-active[data-page="4"] .slide {left: calc(0px - 300%);}
    .slider-active[data-page="5"] .slide {left: calc(0px - 400%);}


    .slider-more-button {
        display: none;
    }

}

@media screen and (max-width: 1215px) {
    .slide-controls-wrapper {
        padding-left: 0;
        padding-right: 0;
    }
    .slide-controls {
        position: relative;
        right: auto;
        top: auto;
        margin-bottom: 1rem;
    }
}

@media screen and (max-width: 768px) {

    .slide-controls-wrapper {
        padding-left: 0;
        padding-right: 0;
    }

    .slider-active .mobile-hidden {
        display: none;
    }

    .slide-controls {
        display: none;
    }
}