@media only screen and (min-width: 600px) {
}

.chr-homepage-hero {
    background: linear-gradient(15.69deg, #e8f0fe 10.16%, rgba(255, 255, 255, 0) 89.84%);
    min-height: calc(85vh - 64px);
    overflow: hidden;
    position: relative
}

.chr-homepage-hero__animation {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-name: full-rotate-left;
    animation-name: full-rotate-left;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    display: none;
    position: absolute;
    will-change: transform;
    z-index: 0
}

@media only screen and (min-width: 1024px) {
    .chr-homepage-hero__animation {
        display: block
    }
}

.chr-homepage-hero__animation--top-right {
    -webkit-animation-duration: 10s;
    animation-duration: 10s;
    right: -22%;
    top: -20%
}

@media only screen and (min-width: 1440px) {
    .chr-homepage-hero__animation--top-right {
        /* left: 75vw; */
        right: -130px;
    }
}

.chr-homepage-hero__animation--bottom-left {
    -webkit-animation-duration: 14s;
    animation-duration: 14s;
    bottom: -15%;
    left: -15%
}

@media only screen and (min-width: 1440px) {
    .chr-homepage-hero__animation--bottom-left {
        bottom: 5%;
        left: -96px;
        /* right: 78vw */
    }
}

.chr-homepage-hero__animation--middle-right {
    -webkit-animation-duration: 20s;
    animation-duration: 20s
}

@media only screen and (min-width: 1024px) {
    .chr-homepage-hero__animation--middle-right {
        bottom: calc(50% - 80px);
        right: 19%
    }
}

@media only screen and (min-width: 1440px) {
    .chr-homepage-hero__animation--middle-right {
        bottom: 470px;
        right: calc(50% - 695px)
    }
}

.chr-homepage-hero__animation img {
    height: auto;
    width: auto
}