Карусель со ссылками не кликабельна, вместо этого нажимает предыдущую ссылку

Question

<style>
html, body {
    margin: 0px;
    padding: 0px;
}

.carousel_lb {
    position: relative;
    margin-top: 26px;
}

.carousel_lb-inner {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.carousel_lb-open:checked + .carousel_lb-item {
    position: static;
    opacity: 100;
}

.carousel_lb-item {
    position: absolute;
    opacity: 0;
    -webkit-transition: opacity 0.6s ease-out;
    transition: opacity 0.6s ease-out;
    display: flex;
    justify-content: space-between;
}

.carousel_lb-item img {
    display: block;
    height: auto;
    max-width: 100%;
}

.carousel_lb-control {
    border-radius: 50%;
    color: #242627;
    cursor: pointer;
    display: none;
    font-size: 40px;
    height: 40px;
    line-height: 35px;
    position: fixed;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    cursor: pointer;
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-align: center;
    width: 40px;
    z-index: 10;
}

.carousel_lb-control.prev {
    left: -50px;
}

.carousel_lb-control.next {
    right: -50px;
}

.carousel_lb-control:hover {
    background: rgba(0, 0, 0, 0.8);
    color: #aaaaaa;
}

#carousel_lb-1:checked ~ .control-1,
#carousel_lb-2:checked ~ .control-2,
#carousel_lb-3:checked ~ .control-3,
#carousel_lb-4:checked ~ .control-4,
#carousel_lb-5:checked ~ .control-5,
#carousel_lb-6:checked ~ .control-6,
#carousel_lb-7:checked ~ .control-7,
#carousel_lb-8:checked ~ .control-8,
#carousel_lb-9:checked ~ .control-9,
#carousel_lb-10:checked ~ .control-10 {
    display: block;
}

.carousel_lb-indicators {
    list-style: none;
    margin: 0;
    padding: 0;
    bottom: -50px;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 10;
}

.carousel_lb-indicators li {
    display: inline-block;
    margin: 0 5px;
}

.carousel_lb-bullet {
    color: #fbd4ca;
    cursor: pointer;
    display: block;
    font-size: 35px;
}

.carousel_lb-bullet:hover {
    color: #aaaaaa;
}

#carousel_lb-1:checked ~ .control-1 ~ .carousel_lb-indicators li:nth-child(1) .carousel_lb-bullet,
#carousel_lb-2:checked ~ .control-2 ~ .carousel_lb-indicators li:nth-child(2) .carousel_lb-bullet,
#carousel_lb-3:checked ~ .control-3 ~ .carousel_lb-indicators li:nth-child(3) .carousel_lb-bullet,
#carousel_lb-4:checked ~ .control-4 ~ .carousel_lb-indicators li:nth-child(4) .carousel_lb-bullet,
#carousel_lb-5:checked ~ .control-5 ~ .carousel_lb-indicators li:nth-child(5) .carousel_lb-bullet,
#carousel_lb-6:checked ~ .control-6 ~ .carousel_lb-indicators li:nth-child(6) .carousel_lb-bullet,
#carousel_lb-7:checked ~ .control-7 ~ .carousel_lb-indicators li:nth-child(7) .carousel_lb-bullet,
#carousel_lb-8:checked ~ .control-8 ~ .carousel_lb-indicators li:nth-child(8) .carousel_lb-bullet,
#carousel_lb-9:checked ~ .control-9 ~ .carousel_lb-indicators li:nth-child(9) .carousel_lb-bullet,
#carousel_lb-10:checked ~ .control-10 ~ .carousel_lb-indicators li:nth-child(10) .carousel_lb-bullet {
    color: #428bca;
}

#title {
    width: 100%;
    position: absolute;
    padding: 0px;
    margin: 0px auto;
    text-align: center;
    font-size: 27px;
    color: rgba(255, 255, 255, 1);
    font-family: 'Open Sans', sans-serif;
    z-index: 9999;
    text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.33), -1px 0px 2px rgba(255, 255, 255, 0);
}

@media (max-width: 420px) {
    .only-desktop {
        display: none !important;
    }
    #lastcomments {
        margin: auto !important;
    }
    .carousel_lb-control.prev {
        left: 5px;
    }
    .carousel_lb-control.next {
        right: 5px;
    }

}

</style>
<div class="carousel_lb">
    <div class="carousel_lb-inner">
        <input class="carousel_lb-open" type="radio" id="carousel_lb-1" name="carousel_lb" aria-hidden="true" hidden="" checked="checked">
        <div class="carousel_lb-item">
            <a href="...">Link1</a>
        </div>
        <input class="carousel_lb-open" type="radio" id="carousel_lb-2" name="carousel_lb" aria-hidden="true" hidden="">
        <div class="carousel_lb-item">
            <a href="...">Link2</a>
        </div>
        <input class="carousel_lb-open" type="radio" id="carousel_lb-3" name="carousel_lb" aria-hidden="true" hidden="">
        <div class="carousel_lb-item">
            <a href="...">Link3</a>
        </div>
        <input class="carousel_lb-open" type="radio" id="carousel_lb-4" name="carousel_lb" aria-hidden="true" hidden="">
        <div class="carousel_lb-item">
            <a href="...">Link4</a>
        </div>
        <input class="carousel_lb-open" type="radio" id="carousel_lb-5" name="carousel_lb" aria-hidden="true" hidden="">
        <div class="carousel_lb-item">
            <a href="...">Link5</a>
        </div>
        <input class="carousel_lb-open" type="radio" id="carousel_lb-6" name="carousel_lb" aria-hidden="true" hidden="">
        <div class="carousel_lb-item">
            <a href="...">Link6</a>
        </div>
        <input class="carousel_lb-open" type="radio" id="carousel_lb-7" name="carousel_lb" aria-hidden="true" hidden="">
        <div class="carousel_lb-item">
            <a href="...">Link7</a>
        </div>
        <input class="carousel_lb-open" type="radio" id="carousel_lb-8" name="carousel_lb" aria-hidden="true" hidden="">
        <div class="carousel_lb-item">
            <a href="...">Link8</a>
        </div>
        <input class="carousel_lb-open" type="radio" id="carousel_lb-9" name="carousel_lb" aria-hidden="true" hidden="">
        <div class="carousel_lb-item">
            <a href="...">Link9</a>
        </div>
        <input class="carousel_lb-open" type="radio" id="carousel_lb-10" name="carousel_lb" aria-hidden="true" hidden="">
        <div class="carousel_lb-item">
            <a href="...">Link10</a>
        </div>
        <label for="carousel_lb-10" class="carousel_lb-control prev control-1">‹</label>
        <label for="carousel_lb-2" class="carousel_lb-control next control-1">›</label>
        <label for="carousel_lb-1" class="carousel_lb-control prev control-2">‹</label>
        <label for="carousel_lb-3" class="carousel_lb-control next control-2">›</label>
        <label for="carousel_lb-2" class="carousel_lb-control prev control-3">‹</label>
        <label for="carousel_lb-4" class="carousel_lb-control next control-3">›</label>
        <label for="carousel_lb-3" class="carousel_lb-control prev control-4">‹</label>
        <label for="carousel_lb-5" class="carousel_lb-control next control-4">›</label>
        <label for="carousel_lb-4" class="carousel_lb-control prev control-5">‹</label>
        <label for="carousel_lb-6" class="carousel_lb-control next control-5">›</label>
        <label for="carousel_lb-5" class="carousel_lb-control prev control-6">‹</label>
        <label for="carousel_lb-7" class="carousel_lb-control next control-6">›</label>
        <label for="carousel_lb-6" class="carousel_lb-control prev control-7">‹</label>
        <label for="carousel_lb-8" class="carousel_lb-control next control-7">›</label>
        <label for="carousel_lb-7" class="carousel_lb-control prev control-8">‹</label>
        <label for="carousel_lb-9" class="carousel_lb-control next control-8">›</label>
        <label for="carousel_lb-8" class="carousel_lb-control prev control-9">‹</label>
        <label for="carousel_lb-10" class="carousel_lb-control next control-9">›</label>
        <label for="carousel_lb-9" class="carousel_lb-control prev control-10">‹</label>
        <label for="carousel_lb-1" class="carousel_lb-control next control-10">›</label>
        <ol class="carousel_lb-indicators">
            <li>
                <label for="carousel_lb-1" class="carousel_lb-bullet">•</label>
            </li>
            <li>
                <label for="carousel_lb-2" class="carousel_lb-bullet">•</label>
            </li>
            <li>
                <label for="carousel_lb-3" class="carousel_lb-bullet">•</label>
            </li>
            <li>
                <label for="carousel_lb-4" class="carousel_lb-bullet">•</label>
            </li>
            <li>
                <label for="carousel_lb-5" class="carousel_lb-bullet">•</label>
            </li>
            <li>
                <label for="carousel_lb-6" class="carousel_lb-bullet">•</label>
            </li>
            <li>
                <label for="carousel_lb-7" class="carousel_lb-bullet">•</label>
            </li>
            <li>
                <label for="carousel_lb-8" class="carousel_lb-bullet">•</label>
            </li>
            <li>
                <label for="carousel_lb-9" class="carousel_lb-bullet">•</label>
            </li>
            <li>
                <label for="carousel_lb-10" class="carousel_lb-bullet">•</label>
            </li>
        </ol>
    </div>
</div>

С помощью этого кода я пытаюсь показать некоторые элементы с фоновой фотографией и ссылками (внутри .carousel_lb-item). Первые элементы на карусели работают нормально, остальные выглядят нормально, но их ссылки не кликабельны, вместо них ссылка предыдущего элемента на самом деле сверху. Например, когда я нажимаю Link2, он фактически щелкает Link1, щелкает Link4, когда я пытаюсь нажать Link5, и так далее. Я думаю, что есть проблема с дисплеями и непрозрачностью, но не смог заставить его работать. Спасибо за любую помощь!