@import "../../../global.scss";
.video_img_card{
    width: 100%;
    max-width: 460px;
    height: 0;
    padding-bottom: 100%;
    position: relative;
    border-radius: 16px;
    overflow: hidden;

    // transform: perspective(1500px) rotateY(15deg);
    // border-radius: 1rem;
    // box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;
    // transition: transform 1s ease 0s;

    // &:hover {
    //     transform: perspective(3000px) rotateY(5deg);
    // }

    @include mobile_potrait {
        max-width: 70vw;
        width: 70vw;
        height: 70vw;
        padding-bottom: 0;
        margin: auto;
    }
    .image{   
        position: absolute;
        width: 100%;             
        height: 100%;
        object-fit: cover;
        top : 0;
        left : 0;
    }
    .videoEmbed{
        position: absolute;
        width: 100%;             
        height: 100%;
        object-fit: cover;
        top : 0;
        left : 0;
    }
    .img_cover{
        position: absolute;
        width: 100%;             
        height: 100%;
        // background-image: linear-gradient(108deg,rgb(255, 198, 255) 16%,#c1fefe);
        top : 0;
        left : 0;
        animation: loading_ani 1s ease 0s infinite;
        transition: all 0.3s ease;
        @keyframes loading_ani {
            0%{
                filter: brightness(1);
            }
            50%{
                filter: brightness(1.1);
            }
            100%{
                filter: brightness(1);
            }
        }
    }
}