@-webkit-keyframes rotate-ccw {
    0% { -webkit-transform: rotate(360deg); }
    100% { -webkit-transform: rotate(0); }
}
@-moz-keyframes rotate-ccw {
    0% { -moz-transform: rotate(360deg); }
    100% { -moz-transform: rotate(0); }
}
@-ms-keyframes rotate-ccw {
    0% { -ms-transform: rotate(360deg); }
    100% { -ms-transform: rotate(0); }
}
@-o-keyframes rotate-ccw {
    0% { -o-transform: rotate(360deg); }
    100% { -o-transform: rotate(0); }
}
@keyframes rotate-ccw {
    0% { transform: rotate(360deg); }
    100% { transform: rotate(0); }
}

@-webkit-keyframes wiggle {
    0% { -webkit-transform: translate3d(0.25rem, 0, 0); }
    25% { -webkit-transform: translate3d(0, 0.25rem, 0); }
    50% { -webkit-transform: translate3d(-0.25rem, 0, 0); }
    75% { -webkit-transform: translate3d(0, -0.25rem, 0); }
    100% { -webkit-transform: translate3d(0.25rem, 0, 0); }
}
@-moz-keyframes wiggle {
    0% { -moz-transform: translate3d(0.25rem, 0, 0); }
    25% { -moz-transform: translate3d(0, 0.25rem, 0); }
    50% { -moz-transform: translate3d(-0.25rem, 0, 0); }
    75% { -moz-transform: translate3d(0, -0.25rem, 0); }
    100% { -moz-transform: translate3d(0.25rem, 0, 0); }
}
@-ms-keyframes wiggle {
    0% { -ms-transform: translate3d(0.25rem, 0, 0); }
    25% { -ms-transform: translate3d(0, 0.25rem, 0); }
    50% { -ms-transform: translate3d(-0.25rem, 0, 0); }
    75% { -ms-transform: translate3d(0, -0.25rem, 0); }
    100% { -ms-transform: translate3d(0.25rem, 0, 0); }
}
@-o-keyframes wiggle {
    0% { -o-transform: translate3d(0.25rem, 0, 0); }
    25% { -o-transform: translate3d(0, 0.25rem, 0); }
    50% { -o-transform: translate3d(-0.25rem, 0, 0); }
    75% { -o-transform: translate3d(0, -0.25rem, 0); }
    100% { -o-transform: translate3d(0.25rem, 0, 0); }
}
@keyframes wiggle {
    0% { transform: translate3d(0.25rem, 0, 0); }
    25% { transform: translate3d(0, 0.25rem, 0); }
    50% { transform: translate3d(-0.25rem, 0, 0); }
    75% { transform: translate3d(0, -0.25rem, 0); }
    100% { transform: translate3d(0.25rem, 0, 0); }
}

.behind-shapes {
    z-index: -2;
}

.behind-all {
    z-index: -4;
}

.blur-light {
    -webkit-filter: blur(0.375rem);
    filter: blur(0.375rem);
}

.blur {
    -webkit-filter: blur(1rem);
    filter: blur(1rem);
}

.blur-heavy {
    -webkit-filter: blur(1.5625rem);
    filter: blur(1.5625rem);
}

.shape {
    position: absolute;
    left: 50%;
}

.shape--svg {
    fill: none;
    stroke: #6973F5;

    -webkit-animation: rotate-ccw 10s linear 0s infinite;
    -moz-animation: rotate-ccw 10s linear 0s infinite;
    -ms-animation: rotate-ccw 10s linear 0s infinite;
    -o-animation: rotate-ccw 10s linear 0s infinite;
    animation: rotate-ccw 10s linear 0s infinite;
    z-index: -1;
}

.shape--svg:nth-child(even) {
    -webkit-animation-direction: reverse;
    -moz-animation-direction: reverse;
    -ms-animation-direction: reverse;
    -o-animation-direction: reverse;
    animation-direction: reverse;
}

.shape--svg:nth-child(4n+1) {
    animation-delay: -1s;
}

.shape--svg:nth-child(4n+2) {
    animation-delay: -3s;
}

.shape--svg:nth-child(4n+4) {
    animation-delay: -5s;
}

.shape__rectangle {
}

.shape__triangle {
}

.shape__circle {
    -webkit-animation: wiggle 5s linear 0s infinite;
    -moz-animation: wiggle 5s linear 0s infinite;
    -ms-animation: wiggle 5s linear 0s infinite;
    -o-animation: wiggle 5s linear 0s infinite;
    animation: wiggle 5s linear 0s infinite;
}

.yellow-wave {
    width: 100%;
    left: 0;
    position: absolute;
}

.shape__background {
    border-radius: 100%;
    z-index: -3;
}

.shape--gradient {
    background-image: linear-gradient(to right, #e9e7f8, #f8ffc5);
}

.shape--solid {
    box-shadow: 0 0.1875rem 0.1875rem 0 rgba(0, 0, 0, 0.19);
}

.shape--large {
    width: 27.9375rem;
    height: 27.9375rem;
}
.shape--extra-large {
    width: 75rem;
    height: 75rem;
}
@media only screen and (max-width: 48rem) {
    .shape--large {
        width: 14.0625rem;
        height: 14.0625rem;
    }
    .shape--extra-large {
        width: 37.625rem;
        height: 37.625rem;
    }
}
@media only screen and (min-width: 96rem) {
    .shape--large {
        width: 56rem;
        height: 56rem;
    }
    .shape--extra-large {
        width: 151rem;
        height: 151rem;
    }
}
