.live-diades-wrapper {
    margin-bottom: 4rem;

    .carousel-indicators {
        bottom: -3rem;

        button {
            background-color: var(--color-gray-dark);
            width: 10px;
            height: 10px;
            border-radius: 50%;
            transition: opacity 125ms ease;

            &:hover {
                opacity: 1;
            }
        }
    }

    .carousel-control-prev {
        left: -2rem;
    }

    .carousel-control-next {
        right: -2rem;
    }

    .carousel-control-prev,
    .carousel-control-next {
        width: fit-content;
        height: fit-content;
        top: 50%;
        transform: translateY(-50%);
        font-size: 2em;
        color: var(--color-gray-darkest);
        opacity: 0.25;
        transition: opacity 125ms ease;

        &:hover {
            opacity: 1;
        }
    }
}