Link after visiting not clickable - html

Question

I have added an overlay dialog box to my homepage.
When I click on the tag the dialog box becomes visible.
The problem now is that when I close the dialog box
the link is disabled for clicking for about 7 seconds.
After doing nothing or clicking around it becomes enabled again.
I have created that fiddle of my source code.
The Css of the overlay dialog looks like that:
.overlay {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.7);
transition: opacity 500ms;
visibility: hidden;
opacity: 0;
z-index: 20;
}
.overlay:target {
visibility: visible;
opacity: 1;
}
.popup {
margin: 70px auto;
padding: 20px;
background: #fff;
color: #000;
text-align:left;
border-radius: 5px;
width: 80%;
height: 80%;
position: relative;
transition: all 5s ease-in-out;
}
.popup h2 {
margin-top: 0;
color: #333;
}
.popup .close {
position: absolute;
top: 20px;
right: 30px;
transition: all 200ms;
font-size: 30px;
font-weight: bold;
text-decoration: none;
color: #333;
}
.popup .content {
height:95%;
overflow: scroll;
overflow-x: hidden;
}
#media screen and (max-width: 700px){
.box{
width: 70%;
}
.popup{
width: 70%;
}
}
In the fiddle my problem is not reconstructed.
Even with all the other stuff the fiddle works correct
but the problem still appears at my page though the code is the same in the fiddle and on my page.
I am using a fullPageSlider of Alvarotrigo.
Perhaps the issue has something to deal with it?