.codexse-lightbox__link {
    display: flex;
    align-items:center; 
    justify-content: center; 
}

.codexse-lightbox .codexse-lightbox__wrap {
    position: relative;
    z-index: 1;
}

.codexse-lightbox .codexse-lightbox__icon {
    width: 100px;
    height: 100px;
    background-color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent-color);
    font-size: 20px;
    z-index: 4;
}

.codexse-lightbox:hover .codexse-lightbox__icon {
    background-color: var(--accent-color);
    color: white;
}

.codexse-lightbox .codexse-lightbox__label {
    transition: 0.3s ease;
}

.codexse-lightbox__waves {
    position: absolute;
    width: 280px;
    height: 280px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1; /* behind the icon */
    pointer-events: none;
}

.codexse-lightbox__wave {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.1); /* use your accent color */
    opacity: 0;
    animation: waves 2s linear infinite;
}

.codexse-lightbox__wave--1 { animation-delay: 0s; }
.codexse-lightbox__wave--2 { animation-delay: 1s; }
.codexse-lightbox__wave--3 { animation-delay: 2s; }
.codexse-lightbox__wave--4 { animation-delay: 3s; }

@-webkit-keyframes waves {
    0% {
        transform: scale(0.2);
        opacity: 0;
    }
    90% {
        opacity: 0.9;
    }
    100% {
        transform: scale(0.9);
        opacity: 0;
    }
}

@keyframes waves {
    0% {
        transform: scale(0.2);
        opacity: 0;
    }
    90% {
        opacity: 0.9;
    }
    100% {
        transform: scale(0.9);
        opacity: 0;
    }
}
