.cards-bg-blur {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.comment-bg-blur {
    background: rgba(255, 255, 255, 0);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.little-vps-cards-blur {
    background: rgba(255, 255, 255, 0.4);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    border: 1px solid rgba(255, 255, 255, 0.3);

}

.little-cards:hover .little-cards-glassy {

    background: rgba(255, 255, 255, 0.3);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

}


.scrollbar-color::-webkit-scrollbar {
    width: 7px;
}


.scrollbar-color::-webkit-scrollbar-track {
    background: #fbfbfb;
    border-radius: 5px;
}


.scrollbar-color::-webkit-scrollbar-thumb {
    background: #ede8e8;
    border-radius: 5px;
}


.scrollbar-color::-webkit-scrollbar-thumb:hover {
    background: #398AF3;
}
@media (max-width:1280px) {
    .compare-line::after {
        content: "";
        position: absolute;
        width: 10000px;
        right: 50%;
        top: 50%;
        height: 1px;
        bottom: 50%;
        z-index: -1;
        background-color: #D1D5DB;
    }

    .compare-line::before {
        content: "";
        position: absolute;
        width: 10000px;
        left: 50%;
        bottom: 50%;
        height: 1px;

        z-index: -1;
        background-color: #D1D5DB;
    }

}


@media (min-width:1280px) {
    .compare-line::after {
        content: "";
        position: absolute;
        width: 1px;
        left: 50%;
        top: 50%;
        height: 10000px;
        bottom: 50%;
        z-index: -1;
        background-color: #D1D5DB;
    }

    .compare-line::before {
        content: "";
        position: absolute;
        width: 1px;
        left: 50%;
        bottom: 50%;
        height: 10000px;

        z-index: -1;
        background-color: #D1D5DB;
    }

}




@media (min-width:1024px) {

    .hero-animations {
        transform: perspective(300px) rotatey(-7deg) rotate(0deg);
        transition: all 1000ms  ease 150ms;
        animation: hero-animations-transform 3000ms  ease-in-out 1;
    }


    .hero-animations:hover {
        transform: perspective(300px) rotatey(0deg) rotate(0deg);
    }


    @keyframes hero-animations-transform {
        0% {
            transform: perspective(300px) rotatey(-7deg) rotate(0deg);
        }

        50% {
            transform: perspective(300px) rotatey(0deg) rotate(0deg);
        }

        100% {
            transform: perspective(300px) rotatey(-7deg) rotate(0deg);
        }

    }
}



.hero-cards-moves {
    animation: hero-cards-move 4000ms ease-in-out infinite;
}
.hero-cards-moves:hover {
    animation-play-state: paused;

}

@keyframes hero-cards-move {
    0% {
        transform: translatey(0px);
    }
    50% {
        transform: translatey(15px);
    }
    100% {
        transform: translatey(0px);
    }
}



.hero-cards-moves2 {
    animation: hero-cards-move2 4000ms ease-in-out infinite;
}
.hero-cards-moves2:hover {
    animation-play-state: paused;
}


@keyframes hero-cards-move2 {
    0% {
        transform: translatey(0px);
    }
    50% {
        transform: translatey(-15px);
    }
    100% {
        transform: translatey(0px);
    }
}


.btc-icon {
    animation: btc-icon-move 7000ms ease-in-out infinite;
}
.btc-icon:hover{
    animation-play-state: paused;
}

@keyframes btc-icon-move {
    0% {
        transform: translatey(0px);
    }
    50% {
        transform: translatey(20px);
    }
    100% {
        transform: translatey(0px);
    }
}

.forex-icon {
    animation: forex-icon-move 7000ms ease-in-out infinite ;
}
.forex-icon:hover{
    animation-play-state: paused;
}

@keyframes forex-icon-move {
    0% {
        transform: translatey(0px);
    }
    50% {
        transform: translatey(-20px);
    }
    100% {
        transform: translatey(0px);
    }
}

.usa-icon {
    animation: usa-icon-move 7000ms ease-in-out infinite  ;
}

.usa-icon:hover {
    animation-play-state: paused ;
}

@keyframes usa-icon-move {
    0% {
        transform: translatey(px);
    }
    50% {
        transform: translatey(20px);
    }
    100% {
        transform: translatey(0px);
    }
}