Can't click links because a box is covering them

Question

Hello :) i got a little "slider", as shown on the screenshot. Under it, there is a link which opens the related lightbox... the problem is, the invisible box (the blue one in the screenshot) is covering the thumnails of the slider, so i cant click them. How can i fix this?

The blue box is covering the thumbnails

The button:

<label class="btn" for="modal-1">more...</label>

Css to it:

.btn {
cursor: pointer;
display: inline-block;
color: #000;
margin-top: 40vh;
margin-left: 30vw;
transform: rotate(-10deg);
z-index: 999999999;

Answer 1

try adding position: relative;

.btn {
position: relative;
cursor: pointer;
display: inline-block;
color: #000;
margin-top: 40vh;
margin-left: 30vw;
transform: rotate(-10deg);
z-index: 999999999;
}