/* :root {
    --info-box-card-animation-duration: 4s;
}

.container>.latest-new-container>.animation-container-left>.grid-card-container,
.container>.latest-new-container>.animation-container-right>.grid-card-container,
.container>.latest-new-container>.animation-container-top>.grid-card-container,
.container>.latest-new-container>.animation-container-down>.grid-card-container {
    overflow: hidden;
}

.container>.latest-new-container>.animation-container-rotate-x>.grid-card-container {
    overflow: visible;
}

.container>.latest-new-container>.animation-container-left>.grid-card-container>.infor-box-card {
    transform: translateX(450%) scale(0);
    animation: info_box_card_animation_left var(--info-box-card-animation-duration) forwards;
}

@keyframes info_box_card_animation_left {
    from {
        transform: translateX(450%) scale(0);
    }
    to {
        transform: translateX(0%) scale(1);
    }
}

.container>.latest-new-container>.animation-container-right>.grid-card-container>.infor-box-card {
    transform: translateX(-450%) scale(0);
    animation: info_box_card_animation_right var(--info-box-card-animation-duration) forwards;
}

@keyframes info_box_card_animation_right {
    from {
        transform: translateX(-450%) scale(0);
    }
    to {
        transform: translateX(0%) scale(1);
    }
}

.container>.latest-new-container>.animation-container-top>.grid-card-container>.infor-box-card {
    transform: translateX(450%) scale(0);
    animation: info_box_card_animation_top var(--info-box-card-animation-duration) forwards;
}

@keyframes info_box_card_animation_top {
    from {
        transform: translateY(450%) scale(0);
    }
    to {
        transform: translateY(0%) scale(1);
    }
}

.container>.latest-new-container>.animation-container-down>.grid-card-container>.infor-box-card {
    transform: translateX(-450%) scale(0);
    animation: info_box_card_animation_down var(--info-box-card-animation-duration) forwards;
}

@keyframes info_box_card_animation_down {
    from {
        transform: translateY(-450%) scale(0);
    }
    to {
        transform: translateY(0%) scale(1);
    }
}

.container>.latest-new-container>.animation-container-rotate-x>.grid-card-container>.infor-box-card {
    transform: rotateX(270deg) scale(0);
    animation: info_box_card_animation_rotate_x var(--info-box-card-animation-duration) forwards;
}

@keyframes info_box_card_animation_rotate_x {
    from {
        transform: rotateX(270deg) scale(0);
    }
    to {
        transform: rotateX(0deg) scale(1);
    }
}

.container>.latest-new-container>.animation-container-rotate-y>.grid-card-container>.infor-box-card {
    transform: rotateY(270deg) scale(0);
    animation: info_box_card_animation_rotate_y var(--info-box-card-animation-duration) forwards;
    transform-origin: center;
}

@keyframes info_box_card_animation_rotate_y {
    from {
        transform: rotateY(270deg) scale(0);
    }
    to {
        transform: rotateY(0deg) scale(1);
    }
} */


/**/


/* .container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card-animation {
    transform: rotateY(0deg) translateZ(0);
    transform-origin: center;
    animation: info_box_card_attention_animation_1 1s infinite;
}

@keyframes info_box_card_attention_animation_1 {
    0% {
        transform: rotateY(0deg) translateZ(0);
    }
    33.33% {
        transform: rotateY(-15deg) translateZ(25px);
    }
    66.66% {
        transform: rotateY(15deg) translateZ(25px);
    }
    100% {
        transform: rotateY(0deg) translateZ(0);
    }
}
 */


/**/


/* .container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card {
    transform: rotateY(0deg) translateZ(0);
    transform-origin: center;
}

.container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card:nth-child(1) {
    animation: info_box_card_attention-introduction_animation 1s forwards;
}

.container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card:nth-child(2) {
    animation: info_box_card_attention-introduction_animation 1s forwards 0.8s;
}

.container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card:nth-child(3) {
    animation: info_box_card_attention-introduction_animation 1s forwards 1s;
}

.container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card:nth-child(4) {
    animation: info_box_card_attention-introduction_animation 1s forwards 1.8s;
}

.container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card:nth-child(5) {
    animation: info_box_card_attention-introduction_animation 1s forwards 2s;
}

.container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card:nth-child(6) {
    animation: info_box_card_attention-introduction_animation 1s forwards 2.8s;
}

.container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card:nth-child(7) {
    animation: info_box_card_attention-introduction_animation 1s forwards 3s;
}

.container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card:nth-child(8) {
    animation: info_box_card_attention-introduction_animation 1s forwards 3.8s;
}

.container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card:nth-child(9) {
    animation: info_box_card_attention-introduction_animation 1s forwards 4s;
}

.container>.latest-new-container>.no-animation-container>.grid-card-container>.infor-box-card:nth-child(10) {
    animation: info_box_card_attention-introduction_animation 1s forwards 4.8s;
}

@keyframes info_box_card_attention-introduction_animation {
    0% {
        transform: rotateY(0deg) translateZ(0);
    }
    33.33% {
        transform: rotateY(-15deg) translateZ(25px);
    }
    66.66% {
        transform: rotateY(15deg) translateZ(25px);
    }
    100% {
        transform: rotateY(0deg) translateZ(0);
    }
} */


/*card hover animation*/


/**/

.container>.latest-new-container>.header-content-container>.grid-card-container>.infor-box-card>.infor-box-card-read-more>a>span,
.container>.latest-new-container>.header-content-container>.grid-card-container>.infor-box-card>.infor-box-card-read-more>a>i {
    transition: all 1s;
}

.container>.latest-new-container>.header-content-container>.grid-card-container>.infor-box-card>.infor-box-card-read-more>a>i {
    transition-delay: 0.5s;
}

.container>.latest-new-container>.header-content-container>.grid-card-container>.infor-box-card>.infor-box-card-read-more>a:hover>span,
.container>.latest-new-container>.header-content-container>.grid-card-container>.infor-box-card>.infor-box-card-read-more>a:hover>i {
    color: var(--primary-color);
}