.circle-scroll-down {
    width: 17rem;
    height: 17rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    z-index: 999;
    bottom: 5%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.circle-scroll-down::before {
    content: "";
    display: inline-block;
    width: 100%;
    height: 100%;
    background: url("/local/templates/hidromek/images/scroll-text.svg") no-repeat center/cover;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-animation: rotation 6s infinite linear;
    animation: rotation 6s infinite linear;
}

.circle-scroll-down::after {
    content: "";
    display: inline-block;
    width: 3.4rem;
    height: 5.8rem;
    background: url("/local/templates/hidromek/images/scroll-arr.svg") no-repeat center/cover;
    -webkit-animation: up-down 1.5s infinite linear;
    animation: up-down 1.5s infinite linear;
}
@-webkit-keyframes rotation {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotation {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes up-down {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    25% {
        -webkit-transform: translateY(0.5rem);
        transform: translateY(0.5rem);
    }

    50% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    75% {
        -webkit-transform: translateY(-0.5rem);
        transform: translateY(-0.5rem);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes up-down {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    25% {
        -webkit-transform: translateY(0.5rem);
        transform: translateY(0.5rem);
    }

    50% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    75% {
        -webkit-transform: translateY(-0.5rem);
        transform: translateY(-0.5rem);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}
