#kich-hoat-lac-free {
    cursor: pointer;
}

.qua_lac_lac_animation {
    display: block !important;
    animation: close_gift_animation;
    animation-duration: 2.5s;
}

.qua_lac_lac_hover:hover {
    display: block !important;
    animation: shake_gift_animation infinite;
    animation-duration: 4s;
}

.qua_lac_lac_animation.hidden {
    display: none !important;
}

.open_gift {
    display: block !important;
    animation: open_gift_animation 1s ease-in-out;
}

.qua_tang_lac_free {
    display: none;
}

.qua_tang_lac_free .elementor-gallery__container {
    overflow: hidden;
}

.qua_tang_lac_free .elementor-gallery__container .e-gallery-item {
    display: none;
}

.qua_tang_lac_free .elementor-gallery__container .e-gallery-item:first-child {
    display: block;
    aspect-ratio: 16/9;
}

.qua_tang_lac_free .elementor-gallery__container .e-gallery-item .e-gallery-image {
    background-size: cover;
    background-repeat: no-repeat;
}

@keyframes open_gift_animation {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes close_gift_animation {
    0% {
        transform: scale(0.8);
    }

    100% {
        transform: scale(0);
    }
}

@keyframes shake_gift_animation {
    0% {
        transform: scale(1);
    }

    5% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    10% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    15% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    20% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    25% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    30% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    35% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    40% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    45% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    50% {
        transform: scale(1) translate(0px, 0px) rotate(0deg);
    }

    55% {
        transform: scale(1) translate(0px, 0px) rotate(0deg);
    }

    60% {
        transform: scale(1) translate(0px, 0px) rotate(0deg);
    }

    65% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    70% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    75% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    80% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    85% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    90% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    95% {
        transform: scale(1) translate(0px, 0px) rotate(0deg);
    }

    100% {
        transform: scale(1);
    }


}

@keyframes shake_gift_animation_on_mb {
    0% {
        transform: scale(1);
    }

    5% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    10% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    15% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    20% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    25% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    30% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    35% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    40% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    45% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    50% {
        transform: scale(1) translate(0px, 0px) rotate(0deg);
    }

    55% {
        transform: scale(1) translate(0px, 0px) rotate(0deg);
    }

    60% {
        transform: scale(1) translate(0px, 0px) rotate(0deg);
    }

    65% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    70% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    75% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    80% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    85% {
        transform: scale(1) translate(-10px, 10px) rotate(-10deg);
    }

    90% {
        transform: scale(1) translate(10px, -10px) rotate(10deg);
    }

    95% {
        transform: scale(1) translate(0px, 0px) rotate(0deg);
    }

    100% {
        transform: scale(0);
    }


}

@media screen and (max-width: 768px) {
    .qua_lac_lac_animation {
        display: block !important;
        animation: close_gift_animation;
        animation-duration: 2.5s;
        animation-delay: 1.5s;
    }

    .qua_lac_lac_animation img {
        display: block !important;
        animation: shake_gift_animation_on_mb;
        animation-duration: 2.5s;
    }
}