body {
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    background-attachment: fixed;
}

.gradient-border {
    --border-width: 3px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}
.gradient-border::after {
    position: absolute;
    content: '';
    top: calc(-1 * var(--border-width));
    left: calc(-1 * var(--border-width));
    z-index: -1;
    width: calc(100% + var(--border-width) * 2);
    height: calc(100% + var(--border-width) * 2);
    background: linear-gradient(60deg, #ffcc00, #ff9900, #0099ff, #0066cc);
    background-size: 300% 300%;
    background-position: 0 50%;
    border-radius: 50%;
    animation: moveGradient 2s alternate infinite;
}
@keyframes moveGradient {
    50% {
        background-position: 100% 50%;
   }
}

/* BG WHEEL */
.bg-wheel {
    background-image: url(../img/bg-wheel-2.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}