.fadeIn{
    animation-name: fadeIn;
    -webkit-animation-name: fadeIn;

    animation-duration: 1.5s;
    -webkit-animation-duration: 1.5s;

    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;

    visibility: visible !important;
}

@keyframes fadeIn {
    0% {
        transform: scale(0.6);
        opacity: 0.0;
        filter: blur(10px)
    }
    50% {
        transform: scale(1.04);
        filter: blur(1px);
    }
    70% {
        transform: scale(0.97);
        opacity: 1;
        filter: blur(0.4px)
    }
    90% {
        transform: scale(1.01);
        opacity: 1;
        filter: blur(0px)
    }
    100% {
        transform: scale(1);
    }
}

@-webkit-keyframes fadeIn {
    0% {
        -webkit-transform: scale(0.6);
        opacity: 0.0;
        -webkit-filter: blur(10px);
    }
    60% {
        -webkit-transform: scale(1.04);
        -webkit-filter: blur(1px);
    }
    80% {
        -webkit-transform: scale(0.97);
        opacity: 1;
        -webkit-filter: blur(0.4px);
    }
    100% {
        -webkit-transform: scale(1);
        opacity: 1;
        -webkit-filter: blur(0px);
    }
}



@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.circle-element {
    animation: spin 90s linear infinite;
}


/* btn wave */
.wave {
    background: rgba(255, 255, 255, .4);
    border-radius: 50%;
    transform: scale(0);
    animation: wave .5s linear;
    pointer-events: none;
    position: absolute;
}

.wave.orange{
    background: rgba(255, 140, 0, .4);
}
@keyframes wave {
    100% {
        transform: scale(2);
        opacity: 0;
    }
}

/* sticker blick */
.sticker::after {
    content: '';
    position: absolute;
    top: -50%; right: -50%;
    background: rgba(255, 241, 214, 0.8);
    width: 150%; height: 150%;
    transform: rotate(45deg);
    border-radius: 50%;
    opacity: 0;
    box-shadow: 0 0 30px 30px rgba(255, 237, 201, 0.81);
    pointer-events: none;
    transition: opacity 0.5s;
}

.sticker:hover::after {
    opacity: 1;
    animation: blink-animation 1.3s linear forwards;
}

@keyframes blink-animation {
    0% {
        transform: translateX(0) rotate(45deg);
    }
    100% {
        transform: translateX(100%) rotate(45deg);
    }
}