@keyframes uzhnet-holo-card-open {
    0% {
        background: none;
        box-shadow: none;
        border-bottom: none;
        backdrop-filter: none;
        height: 0px;

        padding-left: 46px;
        padding-right: 46px;
        padding-top: 40px
        /* background: linear-gradient(180deg, rgba(13, 14, 21, 0.6) 0%, rgba(38, 43, 69, 0.6) 100%); */
    }
    100% {
        /* background: linear-gradient(180deg, rgba(13, 14, 21, 0.6) 0%, rgba(38, 43, 69, 0.6) 100%); */
        /* box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.5); */
        /* border-bottom: 1px solid rgba(213, 213, 213, 0.2); */
        /* backdrop-filter: blur(10px); */
        background: url('../uzhnet-holo-card/holo-card-background.svg') no-repeat center center;
        width: 450px;
        height: 550px;
        padding-left: 46px;
        padding-right: 46px;
        padding-top: 40px
    }
}

@keyframes uzhnet-holo-card-open-service {
    0% {
        background: none;
        box-shadow: none;
        border-bottom: none;
        backdrop-filter: none;
        height: 0px;

        padding-left: 46px;
        padding-right: 46px;
        padding-top: 40px
        /* background: linear-gradient(180deg, rgba(13, 14, 21, 0.6) 0%, rgba(38, 43, 69, 0.6) 100%); */
    }
    100% {
        /* background: linear-gradient(180deg, rgba(13, 14, 21, 0.6) 0%, rgba(38, 43, 69, 0.6) 100%); */
        /* box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.5); */
        /* border-bottom: 1px solid rgba(213, 213, 213, 0.2); */
        /* backdrop-filter: blur(10px); */
        background: url('../uzhnet-holo-card/services-holo-card-background.svg') no-repeat center center;
        width: 780px;
        height: 550px;
        padding-left: 46px;
        padding-right: 46px;
        padding-top: 40px
    }
}

@keyframes scale-animation-zero-to-one {
    0% {
        transform: scaleX(0);
    }
    100% {
        transform: scaleX(1);
    }
}

@keyframes opacity-animation-zero-to-one {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes width-animation-0-to-102 {
    0% {
        width: 0;
    }
    100% {
        width: 102px;
    }
}

@keyframes width-animation-0-to-50percent {
    0% {
        width: 0;
    }
    100% {
        width: 50%;
    }
}

@keyframes corner-box-text {
    0% {
        opacity: 0;
        /* transform: translateY(10px); */
    }
    100% {
        opacity: 1;
        /* transform: translateY(0); */
    }
}

@keyframes unfold {
    0% {
        transform: scaleX(0);
    }
    100% {
        transform: scaleX(1);
    }
}